/**
 * theme-vars.css - AI剪导师 主题变量（四面 token 体系）
 *
 * 架构（轮3 共识定稿）：
 *   - :root                 = light 面（默认，标准浅紫区）
 *   - [data-theme=warm]     = 暖米面（出师之路：challenges / learn / challenge_detail / graduation）
 *   - [data-theme=dark]     = 深色游戏流面（level / quiz / tutorial）
 *   - [data-theme=study]    = study 专属面（深蓝侧栏 + 浅主区 + 蓝强调）
 *
 * 三正交轴：
 *   data-theme        → 颜色变量源（本文件四作用域）
 *   .has-sidebar      → body 左侧 padding（common-sidebar.css，JS 注入侧栏时加）
 *   data-kb-float-only→ 浮窗注入模式（common-sidebar.js 早退）
 *
 * 共享品牌常量（四面共用，杀游离色）：
 *   --accent          = #8b5cf6（品牌紫，light/warm 主强调）
 *   --accent-warm     = 签名渐变（跨面 CTA）
 *   --accent-study    = #4A90D9（study 蓝，收编为 token）
 */

/* ==================== light 面（默认） ==================== */
:root {
    --bg-primary: #f5f5fa;
    --bg-card: #ffffff;
    --border-card: 1px solid #eee;
    --radius-card: 14px;
    --text-primary: #1a1a2e;
    --text-secondary: #6c7293;
    --text-muted: #999;
    --accent: #8b5cf6;
    --accent-secondary: #4ECDC4;
    --shadow-card: 0 2px 12px rgba(0, 0, 0, 0.06);
    --shadow-card-hover: 0 4px 20px rgba(0, 0, 0, 0.1);
    --sidebar-width: 200px;
    --sidebar-mobile-width: 60px;

    /* 侧栏变量：浅色（与 common-sidebar.css 实际设计一致，消除旧深色打架） */
    --sidebar-bg: #fcfbf8;
    --sidebar-text: #4a453f;
    --sidebar-text-hover: #2a2520;
    --sidebar-active-bg: rgba(108, 92, 231, 0.08);
    --sidebar-active-border: #6c5ce7;

    /* 共享品牌常量 */
    --accent-warm: linear-gradient(135deg, #e8943a, #ffb020 45%, #8b5cf6);
    --accent-study: #4A90D9;

    /* 字体栈（全站统一） */
    --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Microsoft YaHei", sans-serif;
}

/* ==================== warm 面（暖米 · 出师之路） ==================== */
/* 变量定义从 challenges/learn/challenge_detail 内联 :root 平移而来（变量名全程统一） */
[data-theme=warm] {
    /* 暖米底 + 近黑非纯黑 */
    --bg-primary: #faf6f1;
    --c-bg: #faf6f1;
    --c-bg-deep: #f3eee7;
    --c-card: #ffffff;
    --c-line: #e9e0d4;
    --c-line-strong: #ddd2c2;
    --c-text: #2c2740;
    --c-sub: #8b8175;

    /* 单一强调色（品牌紫） */
    --accent: #8b5cf6;
    --c-accent: #8b5cf6;
    --c-accent-soft: rgba(139, 92, 246, 0.10);
    --c-accent-ink: #6d3fce;

    /* 签名渐变（主 CTA + 进度高亮） */
    --c-signature: linear-gradient(135deg, #e8943a, #ffb020 45%, #8b5cf6);

    /* 金（小面积点缀） */
    --c-gold: #ffb020;
    --c-gold-tint: rgba(255, 176, 32, 0.12);
    --c-warm: rgba(255, 176, 32, 0.06);

    /* 铜 / 状态色 */
    --c-bronze: #c8924a;
    --c-green: #15a36b;
    --c-green-tint: rgba(21, 163, 107, 0.10);
    --c-red: #e23b3b;
    --c-gray-tint: rgba(44, 39, 64, 0.06);

    /* 难度 / 段位标签 */
    --c-diff-1-bg: rgba(200, 146, 74, 0.12); --c-diff-1-fg: #7a5220;
    --c-diff-2-bg: rgba(184, 150, 78, 0.12); --c-diff-2-fg: #7e6230;
    --c-diff-3-bg: rgba(139, 92, 246, 0.10); --c-diff-3-fg: #6d3fce;
    --c-tier-bg: rgba(21, 163, 107, 0.10);   --c-tier-fg: #0f7d50;

    /* 间距标尺（8 / 16 / 24 / 48 / 80） */
    --sp-1: 8px; --sp-2: 16px; --sp-3: 24px; --sp-4: 48px; --sp-5: 80px;

    /* 圆角 */
    --radius-sm: 8px; --radius-md: 12px; --radius-lg: 14px;

    /* 多层柔和阴影（带极淡紫调） */
    --shadow-card: 0 1px 2px rgba(44, 39, 64, 0.05), 0 6px 20px rgba(44, 39, 64, 0.06);
    --shadow-soft: 0 1px 2px rgba(44, 39, 64, 0.04), 0 2px 8px rgba(44, 39, 64, 0.05);
    --shadow-lift: 0 2px 4px rgba(44, 39, 64, 0.05), 0 8px 24px rgba(74, 55, 120, 0.08);
    --shadow-modal: 0 4px 8px rgba(44, 39, 64, 0.06), 0 16px 40px rgba(74, 55, 120, 0.12);
    --shadow-focus: 0 0 0 4px var(--c-accent-soft), 0 8px 24px rgba(74, 55, 120, 0.10);

    /* 过渡 */
    --ease: cubic-bezier(0.25, 1, 0.5, 1);
    --dur-fast: 150ms; --dur: 220ms; --dur-slow: 300ms;

    /* 字体栈 */
    --font-sans: "PingFang SC", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans SC", sans-serif;

    /* 字号阶梯 */
    --fs-display: 30px; --fs-h1: 26px; --fs-h2: 18px; --fs-body: 16px; --fs-sub: 13px;
    --lh-body: 1.7; --ls-tight: -0.01em;

    /* 按钮三型 */
    --btn-primary-bg: var(--c-signature);
    --btn-secondary-border: 1.5px solid var(--c-accent);
    --btn-ghost-border: 1px solid var(--c-line);
}

/* ==================== dark 面（深色游戏流） ==================== */
[data-theme=dark] {
    --c-bg: #0f1226;
    --c-card: #1a1f3a;
    --c-line: #2a3158;
    --c-text: #e8ecff;
    --c-sub: #9aa3d0;
    --c-gold: #ffd166;
    --c-bronze: #cd7f32;
    --c-purple: #a78bfa;
    --c-green: #34d399;
    --c-red: #f87171;
}

/* ==================== study 面（深蓝侧栏 + 浅主区 + 蓝强调） ==================== */
[data-theme=study] {
    --accent-study: #4A90D9;
    --study-bg: #f4f5f9;
    --study-sidebar-bg: #1a1c23;
    --study-text: #1a1c20;
    --study-blue-soft: rgba(74, 144, 217, 0.08);
}
