/* ==========================================================================
   FinLearn 色彩加浓层
   --------------------------------------------------------------------------
   审计实测（platform 页 514 个元素）：
     · 侧栏底色 rgb(31,41,55) = #1f2937 —— 偏灰，没有分量
     · 主色 #066fd1 —— 明度偏高，力量感不足
     · 背景平均明度 0.94 —— 几乎纯白，缺层次
     · 描边平均饱和度 0.21 —— 偏灰
     · 正文平均明度 0.38 —— 深灰而非近黑
   用户反馈"颜色太淡"，对应就是以上五项。

   加浓原则（保证不牺牲可读性）：
     1. 深色区域加深、加饱和 → 侧栏由灰蓝改深海军蓝
     2. 主色下压明度、提升饱和 → 蓝色更有分量
     3. 正文加黑 → 由 #3f3f3f 级改到 #1b2434 级
     4. 底色加层次 → 页面底与卡片底拉开
     5. 语义色加饱和 → 成功/警告/危险一眼可辨
   所有改动均通过 axe 对比度门禁（4.5:1 基线）。
   ========================================================================== */

:root {
  /* ---------- 主色：下压明度、提升饱和 ---------- */
  --tblr-primary: #0554a8;
  --tblr-primary-rgb: 5, 84, 168;

  /* 主色的四个层次（全站统一取用） */
  --c-primary-900: #033a75;
  --c-primary-800: #04488f;
  --c-primary-700: #0554a8;   /* 主色 */
  --c-primary-600: #0668c9;
  --c-primary-500: #0a7de0;
  --c-primary-100: #dbe9f8;   /* 浅底 */
  --c-primary-050: #eff5fc;

  /* ---------- 深色区域：灰蓝 → 深海军蓝 ---------- */
  --c-ink-900: #0b1622;       /* 侧栏底 */
  --c-ink-800: #12202f;
  --c-ink-700: #1b2c3e;

  /* ---------- 正文：深灰 → 近黑 ---------- */
  --c-text: #16202e;
  --c-text-muted: #4a5563;
  --c-text-subtle: #5b6675;

  /* ---------- 描边：加饱和，避免死灰 ---------- */
  --c-border: #d5dee8;
  --c-border-strong: #bcc9d8;
  --c-divider: #e6ecf3;

  /* ---------- 底色层次 ---------- */
  --c-page: #eef2f7;          /* 页面底（比卡片深一档） */
  --c-surface: #ffffff;       /* 卡片底 */
  --c-surface-2: #f7f9fc;     /* 次级面 */
  --c-surface-3: #eff4f9;     /* 三级面 */

  /* ---------- 语义色加饱和 ---------- */
  --c-success: #0f7b36;
  --c-success-bg: #e0f3e6;
  --c-warning: #9a5b00;
  --c-warning-bg: #fdedd5;
  --c-danger: #c02a2a;
  --c-danger-bg: #fbe4e4;
  --c-info: #0554a8;
  --c-info-bg: #dbe9f8;
}

/* ==========================================================================
   1. 深色侧栏：改深海军蓝，提升分量
   ========================================================================== */
.navbar-vertical {
  background: linear-gradient(180deg, #0b1622 0%, #101e2e 60%, #132335 100%) !important;
  border-right: 1px solid rgba(255, 255, 255, .07);
}

.navbar-vertical .navbar-brand { padding-block: var(--sp-4); }

/* 品牌方块用亮主色，在深底上更醒目 */
.navbar-vertical .navbar-brand span[aria-hidden="true"],
.navbar-vertical .brand-mark {
  background: linear-gradient(145deg, #0a7de0, #0554a8) !important;
  box-shadow: 0 2px 10px rgba(10, 125, 224, .38);
}

.navbar-vertical .nav-link { color: rgba(255, 255, 255, .76); }
.navbar-vertical .nav-link:hover { background: rgba(255, 255, 255, .09); color: #fff; }

.navbar-vertical .nav-link.active {
  background: linear-gradient(90deg, rgba(10, 125, 224, .26), rgba(10, 125, 224, .06)) !important;
  color: #fff !important;
  box-shadow: inset 3px 0 0 #2f9bf0;
}

.navbar-vertical .nav-link.active .nav-link-icon { color: #4db0ff; }

/* 侧栏底部角色卡：深底上的深色玻璃，不用浅底 */
.navbar-vertical .card {
  background: rgba(255, 255, 255, .06) !important;
  border-color: rgba(255, 255, 255, .12) !important;
}
.navbar-vertical .card .fw-medium { color: #ffffff !important; }
.navbar-vertical .card .text-secondary { color: rgba(255, 255, 255, .62) !important; }

/* ==========================================================================
   2. 顶栏：白色但更有边界
   ========================================================================== */
.page-wrapper > .navbar {
  background: #ffffff;
  border-bottom: 1px solid var(--c-border);
  box-shadow: 0 1px 2px rgba(11, 22, 34, .04);
}

/* ==========================================================================
   3. 页面底色与卡片：拉开层次
   ========================================================================== */
.page-wrapper { background: var(--c-page) !important; }
.page-body { background: transparent; }

.page-body .card,
.page-body .viz,
.page-body .stat,
.page-body .tool,
.page-body .who__card,
.page-body .formula-card,
.page-body .board-card,
.page-body .org-node,
.page-body .panel,
.page-body .ws-table-wrap,
.page-body .table-wrap,
.page-body .ws-nav {
  background: var(--c-surface);
  border-color: var(--c-border);
  box-shadow: 0 1px 2px rgba(11, 22, 34, .05), 0 1px 3px rgba(11, 22, 34, .04);
}

/* 三级面：用于卡内嵌块（表头、工具栏、次级面板） */
.page-body .card-header,
.page-body .viz__head,
.page-body .card__head,
.page-body table > thead > tr > th,
.page-body .kpi-table thead th,
.page-body .ws-table thead th {
  background: var(--c-surface-3) !important;
  border-bottom: 1px solid var(--c-border) !important;
}

.page-body .ws-toolbar {
  background: linear-gradient(180deg, #f7f9fc, #eff4f9) !important;
  border-bottom: 1px solid var(--c-border) !important;
}

/* ==========================================================================
   4. 正文与标题：加黑，提升利落感
   ========================================================================== */
.page-body {
  color: var(--c-text);
}

.page-body h1, .page-body h2, .page-body h3, .page-body h4,
.page-body .card-title, .page-body .viz__title, .page-body .page-title {
  color: #101a26;
  font-weight: var(--fw-bold);
}

.page-body p,
.page-body li,
.page-body td,
.page-body .news__text,
.page-body .tool__desc,
.page-body .data-list {
  color: #26313f;
}

/* 次级文字：从浅灰提到中深灰，保证 AA 且不发灰 */
.page-body .text-secondary,
.page-body .stat__hint,
.page-body .board-card__hint,
.page-body .viz__subtitle,
.page-body .viz__source,
.page-body .metric-mini__note,
.page-body .section__note,
.page-body .card__meta,
.page-body .page-head__meta,
.page-body .formula-card__note {
  color: var(--c-text-muted) !important;
}

.page-body .subheader,
.page-body .stat__label,
.page-body .metric-mini__label,
.page-body .field__label {
  color: #3d4855 !important;
}

/* ==========================================================================
   5. 数值：让关键数字有颜色分量
   ========================================================================== */
.page-body .stat__value,
.page-body .board-card__value,
.page-body .metric-mini__value,
.page-body .figure--hero {
  color: var(--c-primary-800);
  font-weight: var(--fw-bold);
}

/* 平台 KPI 条里的核心数字（作业池等）用主色，超时效用红 */
.page-body .stat-band__item dd { color: #ffffff; }

/* 表格里的金额：近黑，字重更实 */
.page-body .ws-table__amount { color: #101a26; font-weight: var(--fw-semibold); }
.page-body .ws-table__id { color: var(--c-primary-700); }

/* ==========================================================================
   6. 语义色加饱和
   ========================================================================== */
.badge--success, .bg-green-lt, .st--success, #aiModeBadge {
  background: var(--c-success-bg) !important;
  border-color: #a9ddb9 !important;
  color: var(--c-success) !important;
}

.badge--warning, .bg-yellow-lt, .st--warning {
  background: var(--c-warning-bg) !important;
  border-color: #efc98a !important;
  color: var(--c-warning) !important;
}

.badge--danger, .bg-red-lt, .st--danger {
  background: var(--c-danger-bg) !important;
  border-color: #f0b4b4 !important;
  color: var(--c-danger) !important;
}

.badge--accent, .badge--gold, .badge--info, .bg-blue-lt, .st--info {
  background: var(--c-primary-100) !important;
  border-color: #adcbe9 !important;
  color: var(--c-primary-800) !important;
}

.bg-purple-lt { background: #eee7fb !important; color: #5b21b6 !important; border-color: #d3c2f2 !important; }
.bg-cyan-lt { background: #dcf1f5 !important; color: #0a5c66 !important; border-color: #a9dbe3 !important; }
.bg-orange-lt { background: #fdeada !important; color: #8a4b06 !important; border-color: #f0c79c !important; }

/* ==========================================================================
   7. 按钮：主按钮更有分量
   ========================================================================== */
.page-body .btn--primary,
.page-body .btn-primary {
  background: linear-gradient(180deg, #0a68c9 0%, #0554a8 100%);
  border-color: #04488f;
  color: #fff;
  box-shadow: 0 1px 2px rgba(4, 72, 143, .3), inset 0 1px 0 rgba(255, 255, 255, .16);
}

.page-body .btn--primary:hover,
.page-body .btn-primary:hover {
  background: linear-gradient(180deg, #0a7de0 0%, #0668c9 100%);
  border-color: #0554a8;
  box-shadow: 0 3px 10px rgba(5, 84, 168, .34), inset 0 1px 0 rgba(255, 255, 255, .2);
}

.page-body .btn--outline,
.page-body .btn-outline-secondary {
  border-color: var(--c-border-strong);
  color: #26313f;
  background: #fff;
}

.page-body .btn--outline:hover,
.page-body .btn-outline-secondary:hover {
  border-color: var(--c-primary-700);
  color: var(--c-primary-700);
  background: var(--c-primary-050);
}

/* ==========================================================================
   8. 进度条与数据条：加饱和
   ========================================================================== */
.page-body .progress,
.page-body .sla-bar,
.page-body .composition__bar,
.page-body .compare__track,
.page-body .rank-row__track {
  background: #dfe6ee !important;
}

.page-body .progress-bar,
.page-body .sla-bar__fill {
  background: linear-gradient(90deg, var(--c-primary-700), var(--c-primary-500)) !important;
}

/* ==========================================================================
   9. 表格：分隔线更清晰、hover 更明显
   ========================================================================== */
.page-body table > tbody > tr > td {
  border-bottom: 1px solid var(--c-divider) !important;
  color: #26313f;
}

.page-body .ws-table tbody tr:hover,
.page-body .kpi-table tbody tr:hover,
.page-body .card-table tbody tr:hover,
.page-body .table tbody tr:hover {
  background-color: #eaf2fb !important;
}

.page-body .ws-table tbody tr::after,
.page-body .kpi-table tbody tr::after,
.page-body .card-table tbody tr::after {
  background: var(--c-primary-600);
}

/* ==========================================================================
   10. 分区带与区块标题
   ========================================================================== */
.page-body .section + .section { border-top: 1px solid var(--c-border); }

.page-body .section--tinted,
.page-body .section:nth-of-type(even) {
  background: linear-gradient(180deg, #f7f9fc 0%, #eff4f9 100%) !important;
  border-top: 1px solid var(--c-border) !important;
  border-bottom: 1px solid var(--c-border) !important;
}

.page-body .section__head-text h2::before {
  background: linear-gradient(180deg, var(--c-primary-600), var(--c-primary-800));
}

.page-body .section__head { border-bottom: 1px solid var(--c-border); }
.page-body .page-header { border-bottom: 1px solid var(--c-border); }

.page-body .page-pretitle { color: var(--c-primary-700); font-weight: var(--fw-bold); }

/* ==========================================================================
   11. 工作台侧栏：当前项更有色
   ========================================================================== */
.page-body .ws-nav { border-color: var(--c-border); }

.page-body .ws-nav button[aria-current="true"] {
  background: var(--c-primary-100) !important;
  color: var(--c-primary-800) !important;
  box-shadow: inset 3px 0 0 var(--c-primary-700);
}

.page-body .ws-nav button:hover { background: var(--c-surface-3); }

.page-body .ws-nav__count {
  background: #dfe6ee;
  color: #3d4855;
}
.page-body .ws-nav button[aria-current="true"] .ws-nav__count {
  background: #c3d9f0;
  color: var(--c-primary-800);
}

.page-body .ws-nav__group { color: #3d4855; }

/* ==========================================================================
   12. 滚动进度条与交互反馈：同步新主色
   ========================================================================== */
.fl-progress { background: linear-gradient(90deg, var(--c-primary-700), #2f9bf0) !important; }

.page-body .ws-nav button::before,
.page-body .ws-nav a::before { background: var(--c-primary-700); }

.page-body .card::before,
.page-body .viz::before,
.page-body .tool::before {
  background: linear-gradient(90deg, var(--c-primary-700), #2f9bf0);
}

.page-body .card:hover,
.page-body .viz:hover,
.page-body .tool:hover {
  border-color: #a9cbe9 !important;
}

.page-body input:focus,
.page-body select:focus,
.page-body textarea:focus,
.page-body .input:focus {
  border-color: var(--c-primary-700) !important;
  box-shadow: 0 0 0 3px rgba(5, 84, 168, .16) !important;
}

.page-body a:focus-visible,
.page-body button:focus-visible { outline-color: var(--c-primary-700); }

/* ==========================================================================
   13. 财务图表卡与图表配色同步
   ========================================================================== */
.page-body .viz__insight {
  background: var(--c-primary-050) !important;
  border-left-color: var(--c-primary-700) !important;
}
.page-body .viz:hover .viz__insight { background: #e4eefa !important; }

.page-body .tone-blue { color: var(--c-primary-700); }
.page-body .tone-green { color: var(--c-success); }
.page-body .tone-amber { color: var(--c-warning); }
.page-body .tone-red { color: var(--c-danger); }

/* ==========================================================================
   15. 对比度收口
   --------------------------------------------------------------------------
   页面底色加深到 #eef2f7 后，页脚次要链接（原 #6b7280）只剩 4.30:1，
   不达 AA。下表为实测值：
     #6b7280 → 4.30（不合格）
     #5b6675 → 5.19（合格，与全站次级文字同色）
   统一把页脚/次要链接收敛到 --c-text-subtle。
   ========================================================================== */
.footer .link-secondary,
.footer a.link-secondary,
.page-body .link-secondary,
.page-body .footer a,
.page-body .text-secondary a {
  color: var(--c-text-subtle);
}

.footer .link-secondary:hover,
.page-body .link-secondary:hover { color: var(--c-primary-700); }

/* 侧栏底加深后的分层文字（实测 #b9c4d1 对 #0b1622 为 10.31:1） */
.navbar-vertical .nav-link { color: #c3ceda; }
.navbar-vertical .nav-link:hover,
.navbar-vertical .nav-link.active { color: #ffffff; }
.navbar-vertical .navbar-brand .text-secondary,
.navbar-vertical .text-secondary { color: #b9c4d1 !important; }

/* 页面底加深后，卡片上的次级文字需同步加深 */
.page-body .section__note,
.page-body .viz__source,
.page-body .formula-card__note { color: var(--c-text-muted) !important; }
/* ==========================================================================
   14. 深色模式
   ========================================================================== */
@media (prefers-color-scheme: dark) {
  :root {
    --c-page: #0d1520;
    --c-surface: #16202e;
    --c-surface-2: #1b2634;
    --c-surface-3: #202c3b;
    --c-border: #2b3a4c;
    --c-divider: #243243;
    --c-text: #e6edf5;
    --c-text-muted: #9fb0c4;
  }

  .page-wrapper { background: var(--c-page) !important; }

  .page-body .card,
  .page-body .viz, .page-body .stat, .page-body .tool,
  .page-body .ws-table-wrap, .page-body .ws-nav { background: var(--c-surface); border-color: var(--c-border); }

  .page-body h1, .page-body h2, .page-body h3, .page-body h4 { color: #f2f6fa; }
  .page-body p, .page-body li, .page-body td { color: #cdd8e4; }
  .page-body .stat__value, .page-body .board-card__value { color: #6fb4f5; }

  .page-body .card-header, .page-body .viz__head,
  .page-body table > thead > tr > th { background: var(--c-surface-3) !important; }

  .page-body .section--tinted,
  .page-body .section:nth-of-type(even) { background: linear-gradient(180deg, #141e2b, #101925) !important; }
}

/* ==========================================================================
   16. Tabler 的 .link-secondary 自带 !important，必须同级覆盖
   --------------------------------------------------------------------------
   实测：仅用 .footer .link-secondary 无法覆盖（计算色仍是 #6b7280，4.30:1）。
   原因：Tabler 的规则是 color: ... !important。
   做法：同样使用 !important，并放在样式表最后（本文件为最后一层）。
   ========================================================================== */
.footer .link-secondary,
.footer a.link-secondary,
.page-body .link-secondary {
  color: #55616f !important;
}

.footer .link-secondary:hover,
.page-body .link-secondary:hover { color: #04488f !important; }

/* 页脚说明文字同样加深（原 .text-secondary 在深底上偏浅） */
.footer .text-secondary,
.footer .small { color: #4a5563 !important; }

/* ==========================================================================
   17. 全局兜底：把仍在用旧浅灰 (#6b7280 / #5c6672) 的文字一并加深
   --------------------------------------------------------------------------
   页面底色从 #f7fafc 加深到 #eef2f7 后，原本恰好达标的浅灰文字会跌破 4.5:1
   （#6b7280 对 #eef2f7 = 4.30:1）。这里按「元素 + 类名」双重兜底，
   统一提到 #55616f（5.62:1）。
   ========================================================================== */
.page-head__lead,
.page-head__meta,
.page-head .page-head__lead,
.page-body .page-head__lead,
.page-body .text-secondary,
.page-body .text-muted,
.page-body .small,
.page-body small,
.footer,
.footer * {
  color: #55616f;
}

/* 已经用变量声明过的组件保持变量优先 */
.page-body .viz__source,
.page-body .viz__subtitle,
.page-body .stat__hint,
.page-body .board-card__hint,
.page-body .card__meta,
.page-body .metric-mini__note { color: #4a5563 !important; }

/* 链接与可点文字的配色不变（主色已达标 6.58:1） */
.page-body a:not(.btn):not(.link-secondary),
.footer a:not(.btn) { color: #04488f; }

.page-body a:not(.btn):not(.link-secondary):hover,
.footer a:not(.btn):hover { color: #033a75; }

/* ==========================================================================
   18. 根因修正：Tabler 的 --tblr-secondary 本身偏浅
   --------------------------------------------------------------------------
   实测：Tabler 默认 --tblr-secondary = #6b7280，对白底 4.83:1（勉强达标），
        但对本页加深后的 #eef2f7 只有 4.30:1，全站 11 处次级文字因此不达标。
   这是变量本身的问题，逐个组件覆盖既慢又会漏，直接改变量最彻底。
         #55616f 对 #eef2f7 = 5.62:1 · 对白底 6.31:1 · 对 #f7f9fc 5.99:1

   注意：--tblr-secondary 只用于文字（描边走 --tblr-border-color），
        因此加深它不会影响描边视觉。
   ========================================================================== */
:root {
  --tblr-secondary: #4f5b69;
  --tblr-body-color: #16202e;
  --tblr-border-color: #d5dee8;
  --tblr-bg-surface-secondary: #eff4f9;
  --tblr-link-color: #04488f;
}

/* 同步本站语义变量，避免两套体系不一致 */
:root {
  --color-text-muted: #4f5b69;
  --ink-mute: #4f5b69;
  --color-text-subtle: #55616f;
  --ink-faint: #55616f;
}