/* Sparkols 设计令牌 · 唯一真源
 *
 * 目的：把历史上三套互不引用的调色板（--sp-* / --crm-page-* / --brand）
 * 收敛到一组基础令牌上。本文件只定义变量，不写任何选择器规则，
 * 因此加载顺序安全，且不会与既有样式表争夺优先级。
 *
 * 约束：
 * - 所有正文级前景色对各自背景的对比度 >= 4.5:1（WCAG AA）。
 * - 仅 meta/辅助文字允许 >= 3.0:1，且不得用于正文。
 * - 旧令牌名保留为别名，指向新基础色，因此存量样式无需改写即可统一。
 *
 * 改色时只改本文件顶部的「基础层」，别名层会自动跟随。
 */

:root {
  /* ── 基础层：中性色 ───────────────────────────────── */
  --ds-canvas: #f5f7fa;        /* 页面底色 */
  --ds-surface: #ffffff;       /* 卡片/面板 */
  --ds-soft: #f8fafc;          /* 次级填充、表头 */
  --ds-line: #e2e8f0;          /* 常规描边 */
  --ds-line-strong: #cbd5e1;   /* 强调描边、输入框 */

  --ds-text: #172033;          /* 正文主色    16.3:1 on surface */
  --ds-text-secondary: #475569;/* 次级正文     7.5:1 on surface */
  --ds-muted: #5b6577;         /* 辅助说明     5.9:1 on surface */
  --ds-subtle: #78828f;        /* meta/时间戳  3.9:1 —— 仅限非正文 */

  /* ── 基础层：品牌与语义色 ─────────────────────────── */
  /* 历史上 #0f8f83 / #159b8f / #129c91 三个「同一个」品牌绿并存，
     且均不足 4.5:1。统一为 #0b7269（5.79:1）。 */
  --ds-brand: #0b7269;
  --ds-brand-dark: #095c55;
  --ds-brand-soft: #e9f7f5;

  --ds-blue: #1d4ed8;          /* 6.70:1 */
  --ds-blue-soft: #eff6ff;
  --ds-green: #127a45;         /* 5.39:1 */
  --ds-green-soft: #ecfdf3;
  --ds-amber: #96560a;         /* 5.78:1 */
  --ds-amber-soft: #fff7e6;
  --ds-red: #b91c1c;           /* 6.47:1 */
  --ds-red-soft: #fef2f2;

  --ds-shell: #1e2229;         /* 侧栏深底 */
  --ds-shell-hover: #292f37;

  /* ── 基础层：字号阶梯 ─────────────────────────────── */
  /* 原有 56 档（含 8.5px/9.5px/10.5px/13.5px）收敛为 7 档。
     正文下限抬到 13px：CRM 是长时间盯屏的工具。 */
  --ds-text-xs: 12px;
  --ds-text-sm: 13px;
  --ds-text-base: 14px;
  --ds-text-md: 16px;
  --ds-text-lg: 18px;
  --ds-text-xl: 22px;
  --ds-text-2xl: 28px;

  /* ── 基础层：间距（4px 基准）─────────────────────── */
  --ds-space-1: 4px;
  --ds-space-2: 8px;
  --ds-space-3: 12px;
  --ds-space-4: 16px;
  --ds-space-5: 20px;
  --ds-space-6: 24px;
  --ds-space-8: 32px;

  /* ── 基础层：圆角（原 43 种 → 4 种）──────────────── */
  --ds-radius-sm: 6px;
  --ds-radius: 8px;
  --ds-radius-lg: 12px;
  --ds-radius-pill: 999px;

  /* ── 基础层：阴影 ─────────────────────────────────── */
  --ds-shadow-sm: 0 1px 2px rgba(23, 32, 51, 0.04);
  --ds-shadow: 0 4px 6px -1px rgba(23, 32, 51, 0.06), 0 2px 4px -2px rgba(23, 32, 51, 0.04);
  --ds-shadow-lg: 0 10px 15px -3px rgba(23, 32, 51, 0.08), 0 4px 6px -4px rgba(23, 32, 51, 0.04);

  /* ── 基础层：动效 ─────────────────────────────────── */
  /* 视图切换 160ms，微交互 120ms。标准缓动统一。 */
  --ds-ease: cubic-bezier(0.2, 0, 0.2, 1);
  --ds-duration-fast: 120ms;
  --ds-duration: 160ms;

  /* ══ 别名层：旧令牌指向新基础色 ════════════════════
     存量样式表继续使用旧名，无需改写即可获得统一配色。
     后续可分批把消费端改为 --ds-*，再删除对应别名。 */

  /* sparkols-redesign.css */
  --sp-shell: var(--ds-shell);
  --sp-shell-hover: var(--ds-shell-hover);
  --sp-canvas: var(--ds-canvas);
  --sp-surface: var(--ds-surface);
  --sp-soft: var(--ds-soft);
  --sp-line: var(--ds-line);
  --sp-line-strong: var(--ds-line-strong);
  --sp-text: var(--ds-text);
  --sp-muted: var(--ds-muted);
  --sp-muted-2: var(--ds-subtle);
  --sp-teal: var(--ds-brand);
  --sp-teal-dark: var(--ds-brand-dark);
  --sp-teal-soft: var(--ds-brand-soft);
  --sp-blue: var(--ds-blue);
  --sp-blue-soft: var(--ds-blue-soft);
  --sp-amber: var(--ds-amber);
  --sp-amber-soft: var(--ds-amber-soft);
  --sp-red: var(--ds-red);
  --sp-red-soft: var(--ds-red-soft);
  --sp-green: var(--ds-green);
  --sp-green-soft: var(--ds-green-soft);
  --sp-radius: var(--ds-radius);

  /* crm-pages.css */
  --crm-page-line: var(--ds-line);
  --crm-page-line-strong: var(--ds-line-strong);
  --crm-page-surface: var(--ds-surface);
  --crm-page-canvas: var(--ds-canvas);
  --crm-page-text: var(--ds-text);
  --crm-page-muted: var(--ds-muted);
  --crm-page-accent: var(--ds-brand);
  --crm-page-accent-dark: var(--ds-brand-dark);
  --crm-page-accent-soft: var(--ds-brand-soft);

  /* search-ledger.css */
  --ledger-bg: var(--ds-soft);
  --ledger-panel: var(--ds-surface);
  --ledger-surface: var(--ds-surface);
  --ledger-line: var(--ds-line);
  --ledger-line-strong: var(--ds-line-strong);
  --ledger-text: var(--ds-text);
  --ledger-muted: var(--ds-muted);
  --ledger-faint: var(--ds-subtle);
  --ledger-accent: var(--ds-brand);
  --ledger-accent-dark: var(--ds-brand-dark);
  --ledger-accent-soft: var(--ds-brand-soft);
  --ledger-blue: var(--ds-blue);
  --ledger-red: var(--ds-red);
  --ledger-radius: var(--ds-radius);

  /* admin.css */
  --sidebar-bg: var(--ds-shell);
  --sidebar-text: var(--ds-subtle);
  --sidebar-text-active: var(--ds-soft);
  --sidebar-active-border: var(--ds-brand);
  --accent: var(--ds-brand);
  --accent-hover: var(--ds-brand-dark);
  --accent-light: var(--ds-brand-soft);
  --bg-main: var(--ds-canvas);
  --bg-card: var(--ds-surface);
  --text-primary: var(--ds-text);
  --text-secondary: var(--ds-text-secondary);
  --text-muted: var(--ds-muted);
  --border: var(--ds-line);
  --border-focus: var(--ds-brand);
  --danger: var(--ds-red);
  --danger-bg: var(--ds-red-soft);
  --success-bg: var(--ds-green-soft);
  --success-text: var(--ds-green);
  --warning-bg: var(--ds-amber-soft);
  --warning-text: var(--ds-amber);
  --radius: var(--ds-radius-lg);
  --radius-lg: var(--ds-radius-lg);
  --shadow-sm: var(--ds-shadow-sm);
  --shadow: var(--ds-shadow);
  --shadow-lg: var(--ds-shadow-lg);

  /* search-center.css + search-center-crm.css
     这两个文件在同一 :root 上先后定义了同名的 --brand：
     #129c91（teal）随后被 #2ca56f（green）覆盖，是搜索中心与 CRM
     外壳观感割裂的直接原因。此处统一指向品牌色。 */
  --bg: var(--ds-canvas);
  --surface: var(--ds-surface);
  --line: var(--ds-line);
  --line2: var(--ds-line-strong);
  --text: var(--ds-text);
  --muted: var(--ds-muted);
  --brand: var(--ds-brand);
  --brand2: var(--ds-brand-soft);
  --blue: var(--ds-blue);

  /* search-diagnostics.css */
  --audit-ink: var(--ds-text);
  --audit-muted: var(--ds-muted);
  --audit-border: var(--ds-line);
  --audit-bg: var(--ds-canvas);
  --audit-teal: var(--ds-brand);
  --audit-teal-soft: var(--ds-brand-soft);
  --audit-warn: var(--ds-amber);
  --audit-warn-soft: var(--ds-amber-soft);
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --ds-duration-fast: 0ms;
    --ds-duration: 0ms;
  }
}
