/* ========================================
   CSS Variables - 阅读支架平台主题系统
   ======================================== */

:root {
  /* === 暗色框架（导航栏、侧边栏） === */
  --frame-bg: #1a1a2e;
  --frame-bg-secondary: #16213e;
  --frame-border: #2a2a4a;
  --frame-border-hover: #3a3a5a;
  --frame-text: #e2e8f0;
  --frame-text-secondary: #94a3b8;

  /* === 浅色阅读区（默认主题） === */
  --reader-bg: #ffffff;
  --reader-text: #1e293b;
  --reader-text-secondary: #64748b;
  --reader-border: #e2e8f0;
  --reader-highlight: #fef3c7;
  --reader-selection: #bfdbfe;
  --reader-card-muted: #f1f5f9; /* 阅读区内嵌卡中性底（反思三级卡等） */
  --user-highlight-bg: #E9EEF7; /* 用户划词高亮（中性雾蓝，总纲 v2 §4.1） */

  /* === 强调色 === */
  --accent-primary: #6366f1;
  --accent-primary-hover: #4f46e5;
  --accent-primary-light: rgba(99, 102, 241, 0.1);

  /* === 强调色派生色（随主题切换：外环/底色/描边/线条） === */
  --accent-ring: rgba(99, 102, 241, 0.3);
  --accent-tint: rgba(99, 102, 241, 0.06);
  --accent-border: rgba(99, 102, 241, 0.22);
  --accent-line: rgba(99, 102, 241, 0.35);
  --accent-cyan: #06b6d4;
  --accent-green: #22c55e;
  --accent-orange: #f59e0b;
  --accent-red: #ef4444;
  --accent-purple: #a855f7;
  --accent-pink: #ec4899;

  /* === 版本标识色 === */
  --version-basic: #64748b;
  --version-cognitive: #6366f1;
  --version-metacognitive: #a855f7;
  --version-cognitive-tint: rgba(99, 102, 241, 0.15);
  --version-cognitive-border: rgba(99, 102, 241, 0.3);
  --version-metacognitive-tint: rgba(168, 85, 247, 0.15);
  --version-metacognitive-border: rgba(168, 85, 247, 0.3);

  /* === 输入控件底色（随主题：暗底半透白 / 浅底纯白） === */
  --field-bg: rgba(255, 255, 255, 0.05);

  /* === 字体 === */
  --font-serif: 'Noto Serif SC', 'Georgia', serif;
  --font-sans: 'Noto Sans SC', 'Helvetica Neue', sans-serif;
  --font-mono: 'JetBrains Mono', 'Menlo', monospace;

  /* === 阅读区字体大小（5级） === */
  --reader-font-size: 17px;
  --reader-line-height: 1.8;

  /* === 间距 === */
  --spacing-xs: 0.25rem;
  --spacing-sm: 0.5rem;
  --spacing-md: 1rem;
  --spacing-lg: 1.5rem;
  --spacing-xl: 2rem;
  --spacing-2xl: 3rem;

  /* === 圆角 === */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;

  /* === 阴影 === */
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.1);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.15);
  --shadow-lg: 0 10px 30px rgba(0, 0, 0, 0.2);

  /* === 动画 === */
  --transition-fast: 150ms ease;
  --transition-normal: 250ms ease;
  --transition-slow: 400ms ease;

  /* === 布局 === */
  --navbar-height: 56px;
  --sidebar-width: 320px;
  --toc-width: 200px;
}

/* === 暗色阅读主题覆盖 === */
[data-reader-theme="dark"] {
  --reader-bg: #1e1e2e;
  --reader-text: #cdd6f4;
  --reader-text-secondary: #a6adc8;
  --reader-border: #313244;
  --reader-highlight: #45475a;
  --reader-selection: #585b70;
  --reader-card-muted: #313244;
  --user-highlight-bg: rgba(137, 160, 204, 0.28);
}

/* === 护眼阅读主题覆盖 === */
[data-reader-theme="sepia"] {
  --reader-bg: #f5f0e8;
  --reader-text: #433422;
  --reader-text-secondary: #6b5b4a;
  --reader-border: #d4c9b8;
  --reader-highlight: #e8d5a3;
  --reader-selection: #c9b896;
  --reader-card-muted: #ece3d2;
  --user-highlight-bg: #E4E2D2;
}

/* === 林绿主题覆盖（对齐《界面风格设计规范》v1.0：深绿顶栏 + 绿灰白侧栏 + 白卡阅读区） === */
[data-reader-theme="forest"] {
  /* 框架层：顶栏深绿；侧栏为规范页底绿灰白（文字随之取深色） */
  --frame-bg: #2E5A4F;
  --frame-bg-secondary: #F4F6F5;
  --frame-border: #E3E8E5;
  --frame-border-hover: #CFE0D8;
  --frame-text: #2B2B2B;
  --frame-text-secondary: #5F6B66;

  /* 阅读层：白卡底、正文 #2B2B2B（对比度 ≥12:1） */
  --reader-bg: #FFFFFF;
  --reader-text: #2B2B2B;
  --reader-text-secondary: #5F6B66;
  --reader-border: #E3E8E5;
  --reader-highlight: rgba(46, 90, 79, 0.16);
  --reader-selection: rgba(63, 160, 90, 0.22);
  --reader-card-muted: #F4F6F5;

  /* 强调色：亮绿仅用于选中态/进度/线条；标题强调走深绿（组件覆盖） */
  --accent-primary: #3FA05A;
  --accent-primary-hover: #368F4E;
  --accent-primary-light: #EAF3EE;
  --accent-ring: rgba(63, 160, 90, 0.35);
  --accent-tint: #F1F7F4;
  --accent-border: #E3E8E5;
  --accent-line: #3FA05A;

  /* 全文无衬线（规范 2.1） */
  --font-serif: "PingFang SC", "Source Han Sans SC", "Noto Sans SC", "Microsoft YaHei", sans-serif;
  --font-sans: "PingFang SC", "Source Han Sans SC", "Noto Sans SC", "Microsoft YaHei", sans-serif;

  /* 圆角：卡片 12 / 小卡 9 / 按钮 8（规范 3） */
  --radius-sm: 8px;
  --radius-md: 9px;
  --radius-lg: 12px;
  --radius-xl: 12px;

  /* 阴影只允许一种极淡阴影（规范 3） */
  --shadow-sm: 0 1px 2px rgba(16, 40, 32, 0.04), 0 6px 20px rgba(16, 40, 32, 0.05);
  --shadow-md: 0 1px 2px rgba(16, 40, 32, 0.04), 0 6px 20px rgba(16, 40, 32, 0.05);
  --shadow-lg: 0 1px 2px rgba(16, 40, 32, 0.04), 0 6px 20px rgba(16, 40, 32, 0.05);

  /* 交互过渡统一 .16s（规范 10） */
  --transition-fast: 160ms ease;
  --transition-normal: 160ms ease;
  --transition-slow: 160ms ease;

  /* 组别标识色映射到规范色板（理论蓝/方法紫），保持三组可区分 */
  --version-cognitive: #3A6EA5;
  --version-cognitive-tint: rgba(58, 110, 165, 0.15);
  --version-cognitive-border: rgba(58, 110, 165, 0.3);
  --version-metacognitive: #7B5EA7;
  --version-metacognitive-tint: rgba(123, 94, 167, 0.15);
  --version-metacognitive-border: rgba(123, 94, 167, 0.3);

  /* 输入控件白底 */
  --field-bg: #FFFFFF;
}