/* ============================================================================
 * 外展知识库 · 设计令牌 v1（Design Tokens）
 * ----------------------------------------------------------------------------
 * 三层结构：Primitive（原始值） → Semantic（语义） → Component（组件级）
 * 界面代码只许用 Semantic / Component 层；直接写 Primitive 视为越级。
 *
 * 命名：--wb-<层>-<语义>-<变体>
 * 品牌约束（重要）：本项目已有老板既定的【暖色轻奢】品牌体系
 *   （米白 #FAF7F2 + 香槟金 #C9A96A + 陶土 #B8705A），
 *   该体系优先级高于通用 UI 设计默认规范，已在 UI 设计方案里显式声明为「品牌覆盖」。
 *
 * 主题：默认 light。data-theme="dark" 时只翻转 Semantic 层，Primitive 不动。
 * ========================================================================== */

/* ============================ Tier 1 · Primitive ========================= */
:root {
  /* —— 纸（背景层，按"离脸远近"排列） —— */
  --wb-paper-0:   #FFFFFF;   /* 卡面，最靠前 */
  --wb-paper-1:   #FCFAF6;   /* 表头 / 次级面 */
  --wb-paper-2:   #FAF7F2;   /* 页面底（米白，品牌基色） */
  --wb-paper-3:   #F4F1EB;   /* 凹陷 / 轨道 / 空态 */

  /* —— 墨（文字层，按重要度排） —— */
  --wb-ink-900:   #2B2620;   /* 正文主色（暖黑，非纯黑） */
  --wb-ink-600:   #6B6255;   /* 次要文字 */
  --wb-ink-400:   #9A9186;   /* 辅助说明 / 占位 */
  --wb-ink-200:   #C7C0B6;   /* 失效态 */

  /* —— 香槟金（主品牌色 · 强调） —— */
  --wb-gold-600:  #8A7038;   /* 金底上的字 */
  --wb-gold-500:  #C9A96A;   /* 主色本体 */
  --wb-gold-400:  #DCC08A;   /* 渐变尾 / 悬停提亮 */
  --wb-gold-200:  #E7D9BC;   /* 金色描边 */
  --wb-gold-100:  #F1E7D4;   /* 选中底 / 金色浅底 */
  --wb-gold-050:  #FAF4E8;   /* 极浅底 */

  /* —— 陶土（次品牌色 · 行动 / 风险） —— */
  --wb-clay-600:  #9E5442;
  --wb-clay-500:  #B8705A;
  --wb-clay-100:  #F7E8E4;

  /* —— 玫瑰（第三色 · 需留意） —— */
  --wb-rose-600:  #A85F58;
  --wb-rose-500:  #C98D86;
  --wb-rose-100:  #F8ECEA;

  /* —— 语义色 —— */
  --wb-moss-600:  #5C7A53;  --wb-moss-500: #7C9A73;  --wb-moss-100: #EBF1E8;   /* 成功/已入库 */
  --wb-amber-600: #9A6B22;  --wb-amber-500:#C08A3E;  --wb-amber-100:#FBF0DC;   /* 警告/进行中 */
  --wb-slate-500: #7A8B99;  --wb-slate-100:#EDF1F4;                            /* 中性信息/已跳过 */

  /* —— 密件（受限 / 仅存储） ——
     刻意不挪用任何已有色：密件在语义上既不是「成功」也不是「跳过」，
     它是「受保护、不参与计算」。低饱和墨紫在暖色体系里不抢戏，但一眼能认出来。 */
  --wb-secret-600: #6B5C7D;  --wb-secret-500: #847399;  --wb-secret-100: #F2EEF6;

  /* —— 线 —— */
  --wb-line:        #EAE2D6; /* 常规分隔 */
  --wb-line-soft:   #F5F0E8; /* 表格行分隔（更轻） */
  --wb-line-strong: #DDD3C2; /* 需要强调的边界 */

  /* —— 知识库分区色 P1–P9（低饱和，供图表 / 分区标签；不用于大面积背景） —— */
  --wb-zone-p1: #B8705A;  /* 政策文件 */
  --wb-zone-p2: #C9A96A;  /* 展会目录 */
  --wb-zone-p3: #A8835E;  /* 政策补贴 */
  --wb-zone-p4: #8E9B7C;  /* 行业资讯 */
  --wb-zone-p5: #C98D86;  /* 展会素材 */
  --wb-zone-p6: #9C8AA6;  /* 客户案例 */
  --wb-zone-p7: #7E93A0;  /* 业务问答 */
  --wb-zone-p8: #A79A86;  /* 内部规范 */
  --wb-zone-p9: #B3AA9E;  /* 其他 */

  /* —— 字体族 ——
     ⚠️ 品牌覆盖说明：通用 UI 规范禁用系统字体；本项目面向政务/政策场景，
     标题必须有「公文权威感」，因此显式采用宋体族作展示字，并声明为品牌覆盖。
     全部走本机字体，不外链 webfont —— 客户机可能离线，且中文字库动辄 10MB+。 */
  --wb-font-display: "Source Han Serif SC", "Noto Serif SC", "Songti SC",
                     "SimSun", "STSong", Georgia, serif;
  --wb-font-ui:      "Source Han Sans SC", "Noto Sans SC", "PingFang SC",
                     "Microsoft YaHei", "Hiragino Sans GB", sans-serif;
  --wb-font-mono:    "IBM Plex Mono", "JetBrains Mono", "Cascadia Mono",
                     Consolas, "Courier New", monospace;

  /* —— 字号 / 行高 / 字距（模块化音阶 1.25 上下浮动） —— */
  --wb-fs-display: 32px;  --wb-lh-display: 1.24;  --wb-ls-display: -0.2px;
  --wb-fs-h1:      22px;  --wb-lh-h1:      1.36;  --wb-ls-h1:      0.2px;
  --wb-fs-h2:      17px;  --wb-lh-h2:      1.48;  --wb-ls-h2:      0.2px;
  --wb-fs-h3:      14.5px;--wb-lh-h3:      1.52;  --wb-ls-h3:      0.1px;
  --wb-fs-body:    13.5px;--wb-lh-body:    1.68;
  --wb-fs-sm:      12.5px;--wb-lh-sm:      1.66;
  --wb-fs-xs:      11.5px;--wb-lh-xs:      1.6;
  --wb-fs-micro:   10.5px;--wb-lh-micro:   1.5;  --wb-ls-micro:   0.6px;  /* 小标签，需加字距 */
  --wb-fs-num:     28px;  --wb-fs-num-lg:  34px;                            /* 统计卡数字 */

  /* —— 字重 —— */
  --wb-fw-regular: 400; --wb-fw-medium: 500; --wb-fw-bold: 700;

  /* —— 间距（4px 基准，8px 节奏） —— */
  --wb-sp-1: 4px;   --wb-sp-2: 8px;   --wb-sp-3: 12px;  --wb-sp-4: 16px;
  --wb-sp-5: 20px;  --wb-sp-6: 24px;  --wb-sp-7: 32px;  --wb-sp-8: 40px;
  --wb-sp-9: 56px;  --wb-sp-10: 72px;

  /* —— 圆角（克制：本项目风格偏"纸面/公文"，不用大圆角） —— */
  --wb-r-xs: 2px;  --wb-r-sm: 3px;  --wb-r-md: 4px;  --wb-r-lg: 6px;  --wb-r-full: 999px;

  /* —— 描边 —— */
  --wb-bw-1: 1px;  --wb-bw-2: 2px;  --wb-bw-accent: 2px;  /* 强调线（卡片左沿 / 选中态） */

  /* —— 阴影（暖色投影，不用中性灰影，否则在米白底上发脏） —— */
  --wb-sh-1: 0 1px 2px rgba(43,38,32,.04);
  --wb-sh-2: 0 1px 2px rgba(43,38,32,.04), 0 8px 24px rgba(43,38,32,.06);
  --wb-sh-3: 0 2px 6px rgba(43,38,32,.06), 0 18px 48px rgba(43,38,32,.10);
  --wb-sh-drawer: -12px 0 40px rgba(43,38,32,.14);

  /* —— 动效（克制；数据产品不该"飘"） —— */
  --wb-dur-fast: 120ms;  --wb-dur-base: 180ms;  --wb-dur-slow: 260ms;
  --wb-ease: cubic-bezier(.4,0,.2,1);
  --wb-ease-out: cubic-bezier(.16,1,.3,1);

  /* —— 层级 —— */
  --wb-z-base: 0;    --wb-z-sticky: 10;  --wb-z-dropdown: 30;
  --wb-z-mask: 40;   --wb-z-drawer: 50;  --wb-z-toast: 60;

  /* —— 组件级尺寸 —— */
  --wb-side-w: 216px;          /* 侧栏宽（与现网一致，避免视觉断层） */
  --wb-content-max: 1520px;    /* 内容最大宽，超宽屏不再拉伸 */
  --wb-table-row-h: 44px;      /* 表格行高（比现网 11px padding 略高，改善扫读） */
  --wb-table-head-h: 38px;
  --wb-input-h: 34px;
  --wb-btn-h: 34px;   --wb-btn-h-sm: 28px;
  --wb-drawer-w: min(760px, 92vw);
  --wb-drawer-w-wide: min(1040px, 94vw);   /* 文档预览态用更宽的抽屉 */
  --wb-chart-h: 8px;                       /* 分布条高度 */
  --wb-focus-ring: 0 0 0 3px rgba(201,169,106,.28);
}

/* ============================ Tier 2 · Semantic =========================== */
:root {
  /* 背景 / 面 */
  --wb-bg:            var(--wb-paper-2);
  --wb-surface:       var(--wb-paper-0);
  --wb-surface-sub:   var(--wb-paper-1);
  --wb-surface-sunk:  var(--wb-paper-3);

  /* 文字 */
  --wb-text:        var(--wb-ink-900);
  --wb-text-2:      var(--wb-ink-600);
  --wb-text-3:      var(--wb-ink-400);
  --wb-text-invert: #FFFDF8;
  --wb-text-disabled: var(--wb-ink-200);

  /* 边界 */
  --wb-border:        var(--wb-line);
  --wb-border-soft:   var(--wb-line-soft);
  --wb-border-strong: var(--wb-line-strong);

  /* 主强调 */
  --wb-accent:        var(--wb-gold-500);
  --wb-accent-hover:  var(--wb-gold-400);
  --wb-accent-ink:    var(--wb-gold-600);   /* 金底上的文字色 */
  --wb-accent-soft:   var(--wb-gold-100);
  --wb-accent-faint:  var(--wb-gold-050);

  /* 次强调（行动 / 风险） */
  --wb-action:      var(--wb-clay-500);
  --wb-action-ink:  var(--wb-clay-600);
  --wb-action-soft: var(--wb-clay-100);

  /* 语义状态 */
  --wb-ok:      var(--wb-moss-500);   --wb-ok-ink:  var(--wb-moss-600);   --wb-ok-soft:  var(--wb-moss-100);
  --wb-warn:    var(--wb-amber-500);  --wb-warn-ink: var(--wb-amber-600); --wb-warn-soft: var(--wb-amber-100);
  --wb-danger:  var(--wb-clay-500);   --wb-danger-ink: var(--wb-clay-600);--wb-danger-soft: var(--wb-clay-100);
  --wb-info:    var(--wb-slate-500);  --wb-info-soft: var(--wb-slate-100);
  --wb-link:    var(--wb-clay-600);

  /* 流水线状态 → 颜色（六态 + 密件，语义即颜色，全站统一，不许各页自定义） */
  --wb-st-pending:  var(--wb-ink-400);      /* 待处理 */
  --wb-st-running:  var(--wb-amber-500);    /* 解析中 */
  --wb-st-done:     var(--wb-moss-500);     /* 已入库 */
  --wb-st-confirm:  var(--wb-rose-500);     /* 待确认 */
  --wb-st-skipped:  var(--wb-slate-500);    /* 已跳过 */
  --wb-st-failed:   var(--wb-clay-500);     /* 失败 */
  --wb-st-secret:   var(--wb-secret-500);   /* 密件存档（只存不解析） */

  /* 图表 / 分布 */
  --wb-chart-track: var(--wb-paper-3);
  --wb-chart-fill:  linear-gradient(90deg, var(--wb-gold-500), var(--wb-gold-400));
  --wb-chart-fill-2: linear-gradient(90deg, var(--wb-clay-500), #D89B87);
}

/* ============================ Tier 3 · Component ========================== */
:root {
  --wb-card-radius: var(--wb-r-md);
  --wb-card-pad: var(--wb-sp-4) var(--wb-sp-4) var(--wb-sp-3);
  --wb-card-border: var(--wb-bw-1) solid var(--wb-border);
  --wb-card-shadow: var(--wb-sh-2);
  --wb-card-accent-w: var(--wb-bw-accent);

  --wb-chip-pad: 2px var(--wb-sp-2);
  --wb-chip-radius: var(--wb-r-xs);

  --wb-th-bg: var(--wb-surface-sub);
  --wb-td-border: var(--wb-border-soft);
  --wb-row-hover: var(--wb-surface-sub);
  --wb-row-selected: var(--wb-accent-soft);

  --wb-drawer-shadow: var(--wb-sh-drawer);
  --wb-mask-bg: rgba(43,38,32,.34);

  --wb-drop-border: 2px dashed #E0D5C2;
  --wb-drop-hover-bg: var(--wb-accent-soft);
}

/* ============================== 深色主题（可选） =========================== */
/* 只翻转 Semantic 层。客户是 B2B 白天办公场景，默认不启用；
   夜间值班/大屏展示才用。 */
[data-theme="dark"] {
  --wb-bg:           #201C18;
  --wb-surface:      #2A2521;
  --wb-surface-sub:  #322C27;
  --wb-surface-sunk: #191512;
  --wb-text:         #F2ECE2;
  --wb-text-2:       #C4BAAB;
  --wb-text-3:       #948A7C;
  --wb-border:       #3D3630;
  --wb-border-soft:  #332D28;
  --wb-accent:       #D6B87C;
  --wb-accent-soft:  #3A3226;
  --wb-accent-faint: #2C261D;
  --wb-text-invert:  #201C18;
  --wb-sh-2: 0 1px 2px rgba(0,0,0,.3), 0 8px 24px rgba(0,0,0,.36);
}

/* ============================== 基础基元 ================================== */
/* 提供最常用的四类基元，减少各页重复造轮子；复杂组件仍走组件样式表。 */
.wb-num {
  font-variant-numeric: tabular-nums;   /* 数字必须等宽，否则统计卡跳动 */
  font-feature-settings: "tnum" 1;
}
.wb-code, .wb-id {                       /* 人类编号 KD00042 / KB02772 */
  font-family: var(--wb-font-mono);
  font-size: var(--wb-fs-xs);
  letter-spacing: .2px;
}
.wb-display { font-family: var(--wb-font-display); font-weight: var(--wb-fw-bold); }
.wb-focusable:focus-visible { outline: none; box-shadow: var(--wb-focus-ring); }