/* ============================================================
   xoyo168.com 语义色 Token 体系 · v1.0
   用途：根治暗色模式（黑灯模式）浅底浅字问题
   原理：所有界面颜色统一引用 token，主题切换时整体翻转，
        不再依赖 html[data-theme="dark"] 逐条打补丁
   ============================================================ */

:root {
  /* ── 表面层级：1 最亮（卡片）→ 4 强调底 ── */
  --s-1: #ffffff;
  --s-2: #f8fafc;
  --s-3: #f1f5f9;
  --s-4: #eef2ff;
  /* ── 文本层级：1 主文本（最深）→ 4 辅助（最浅） ── */
  --t-1: #0f172a;
  --t-2: #334155;
  --t-3: #64748b;
  --t-4: #94a3b8;
  /* ── 边框 ── */
  --b-1: #e2e8f0;
  --b-2: #cbd5e1;
  /* ── 品牌强调色（文本场景需暗色提亮） ── */
  --brand: #4f46e5;
  --brand-alt: #7c3aed;
  /* ── 兼容旧变量名（style.css 遗留） ── */
  --bg: var(--s-2);
  --bg-alt: var(--s-3);
  --body-bg: var(--s-2);
  --card-bg: var(--s-1);
  --text: var(--t-1);
  --text-secondary: var(--t-2);
  --text-muted: var(--t-3);
  --border: var(--b-1);
  --border-light: var(--b-1);
}

[data-theme="dark"] {
  /* ── 表面：浅→深整体翻转 ── */
  --s-1: #1e293b;
  --s-2: #0f172a;
  --s-3: #273449;
  --s-4: #312e81;
  /* ── 文本：深→浅整体翻转 ── */
  --t-1: #e2e8f0;
  --t-2: #cbd5e1;
  --t-3: #a3b0c2;
  --t-4: #8b98ab;
  /* ── 边框 ── */
  --b-1: #334155;
  --b-2: #475569;
  /* ── 品牌色提亮，保证暗底可读（对比度 ≥ 4.5:1） ── */
  --brand: #a5b4fc;
  --brand-alt: #c4b5fd;
}

/* 主题切换时页面基础色兜底 */
html[data-theme="dark"] body {
  background-color: var(--s-2);
  color: var(--t-1);
}

/* ── 彩色语义层 v1.1 ──────────────────────────────────────
   统一收口原先散落在各模板的硬编码彩色（橙/黄标签、状态徽章）
   关键：soft=浅底, ink=浅底上的文字, on=实色底上的文字
   ──────────────────────────────────────────────────────── */
:root {
  --accent:        #f59e0b;
  --accent-light:  #fbbf24;
  --accent-soft:   rgba(245,158,11,.13);
  --accent-line:   rgba(245,158,11,.32);
  --accent-ink:    #b45309;   /* 浅底上：深琥珀，对比 5.2:1 */
  --accent-on:     #ffffff;   /* 实橙底上：白字，对比 3.1:1 */
  --ok-soft:       rgba(16,185,129,.12);
  --ok-ink:        #047857;
  --warn-soft:     rgba(249,115,22,.12);
  --warn-ink:      #c2410c;
}
[data-theme="dark"] {
  --accent:        #fbbf24;
  --accent-light:  #fcd34d;
  --accent-soft:   rgba(251,191,36,.16);
  --accent-line:   rgba(251,191,36,.42);
  --accent-ink:    #fcd34d;   /* 深底上：亮黄，对比 9.8:1 */
  --accent-on:     #241a00;   /* 亮黄底上：近黑，对比 11:1 ★核心修复 */
  --ok-soft:       rgba(52,211,153,.16);
  --ok-ink:        #6ee7b7;
  --warn-soft:     rgba(251,146,60,.16);
  --warn-ink:      #fdba74;
}
