/* ============================================================
 *  主题系统 - 六种配色方案
 *  设计理念：以 CSS 变量为核心，通过 html[data-theme] 切换主题
 *  变量名与 base.css 完全一致，确保所有页面无缝适配
 * 
 *  主题列表：
 *  - inkgold    玄墨金    （默认，深墨底色 + 金色点缀）
 *  - cloudblue  云雾青    （明亮蓝白 + 天青点缀）
 *  - paper      宣纸      （米黄古卷 + 赭石点缀）
 *  - bamboo     翠竹绿    （青绿底色 + 翠竹点缀）
 *  - cinnabar   赤霞橙    （深红底色 + 橙金点缀）
 *  - purple     紫霞      （深紫底色 + 紫金华光）
 * ============================================================ */

/* ===== 玄墨金（默认主题，与 base.css :root 一致） ===== */
html[data-theme="inkgold"] {
    /* 墨色系列 —— 背景/深色元素 */
    --ink: #1a1410;
    --ink-surface: #1e1812;
    --ink-elevated: #241c14;
    --ink-border: rgba(180, 150, 120, 0.12);

    /* 纸色系列 —— 文字/浅色元素 */
    --paper: #e8dcc8;
    --paper-secondary: #c8b898;
    --paper-muted: #a09078;

    /* 朱砂红 —— 警示/强调 */
    --vermillion: #c04040;
    --vermillion-light: #d46060;
    --vermillion-glow: rgba(192, 64, 64, 0.2);

    /* 泥金 —— 主色调/金色点缀 */
    --gold-foil: #c8a870;
    --gold-foil-light: #dcc090;
    --gold-foil-glow: rgba(200, 168, 112, 0.25);
    --gold-foil-dim: rgba(200, 168, 112, 0.08);

    /* 翠玉绿 —— 成功/正向 */
    --jade: #6a9a80;
    --jade-glow: rgba(106, 154, 128, 0.2);

    /* 数据卡冷色调强调色 —— 天蓝色科技感 */
    --card-combo-accent: #74c0fc;

    /* 雾气层 —— 微光装饰 */
    --mist-warm: rgba(200, 170, 130, 0.04);
    --mist-cool: rgba(160, 180, 170, 0.03);

    /* 阴影 */
    --shadow: 0 4px 20px rgba(0, 0, 0, 0.4);
}

/* ===== 云雾青（明亮蓝白主题） ===== */
html[data-theme="cloudblue"] {
    /* 墨色系列 —— 变为浅色背景（语义反转，适配浅色主题） */
    --ink: #eef3f8;
    --ink-surface: #f5f8fb;
    --ink-elevated: #ffffff;
    --ink-border: rgba(80, 110, 150, 0.12);

    /* 纸色系列 —— 变为深色文字（语义反转） */
    --paper: #2c3e50;
    --paper-secondary: #4a6078;
    --paper-muted: #7a8fa6;

    /* 朱砂红 —— 警示/强调（保持红色调） */
    --vermillion: #d05050;
    --vermillion-light: #e07070;
    --vermillion-glow: rgba(208, 80, 80, 0.15);

    /* 泥金 —— 变为天青色主色调 */
    --gold-foil: #5a8db8;
    --gold-foil-light: #7aa8d0;
    --gold-foil-glow: rgba(90, 141, 184, 0.2);
    --gold-foil-dim: rgba(90, 141, 184, 0.08);

    /* 翠玉绿 —— 保持绿色调 */
    --jade: #5a9a7a;
    --jade-glow: rgba(90, 154, 122, 0.15);

    /* 数据卡冷色调强调色 —— 深邃天青 */
    --card-combo-accent: #4a7ab0;

    /* 雾气层 —— 冷色调微光 */
    --mist-warm: rgba(140, 170, 200, 0.04);
    --mist-cool: rgba(100, 140, 180, 0.05);

    /* 阴影 —— 浅色主题阴影更柔和 */
    --shadow: 0 4px 20px rgba(80, 110, 150, 0.12);
}

/* ===== 宣纸（米黄古卷主题） ===== */
html[data-theme="paper"] {
    /* 墨色系列 —— 变为米黄纸色背景 */
    --ink: #f0e6d2;
    --ink-surface: #f5ecd8;
    --ink-elevated: #faf2e0;
    --ink-border: rgba(120, 90, 50, 0.12);

    /* 纸色系列 —— 变为深褐墨色文字 */
    --paper: #3d2e1e;
    --paper-secondary: #5a4830;
    --paper-muted: #8a7858;

    /* 朱砂红 —— 赭石红色调 */
    --vermillion: #b04030;
    --vermillion-light: #c85a48;
    --vermillion-glow: rgba(176, 64, 48, 0.15);

    /* 泥金 —— 棕金色 */
    --gold-foil: #a07840;
    --gold-foil-light: #b89058;
    --gold-foil-glow: rgba(160, 120, 64, 0.2);
    --gold-foil-dim: rgba(160, 120, 64, 0.08);

    /* 翠玉绿 —— 石绿色调 */
    --jade: #5a8a68;
    --jade-glow: rgba(90, 138, 104, 0.15);

    /* 数据卡冷色调强调色 —— 青金石蓝 */
    --card-combo-accent: #6b8caf;

    /* 雾气层 —— 暖黄微光 */
    --mist-warm: rgba(180, 140, 80, 0.05);
    --mist-cool: rgba(120, 140, 120, 0.03);

    /* 阴影 —— 暖色调柔和阴影 */
    --shadow: 0 4px 20px rgba(120, 90, 50, 0.12);
}

/* ===== 翠竹绿（青绿自然主题） ===== */
html[data-theme="bamboo"] {
    /* 墨色系列 —— 浅绿底色背景（按 demo 配色改为浅色） */
    --ink: #e8f0e8;
    --ink-surface: #f0f8f0;
    --ink-elevated: #f8fcf8;
    --ink-border: rgba(60, 140, 80, 0.15);

    /* 纸色系列 —— 深绿墨色文字 */
    --paper: #2a4a35;
    --paper-secondary: #4a6858;
    --paper-muted: #6a8870;

    /* 朱砂红 —— 偏暖的橙红 */
    --vermillion: #c04040;
    --vermillion-light: #d86050;
    --vermillion-glow: rgba(192, 64, 64, 0.15);

    /* 泥金 —— 翠竹绿作为主色调 */
    --gold-foil: #408050;
    --gold-foil-light: #6ab070;
    --gold-foil-glow: rgba(64, 128, 80, 0.2);
    --gold-foil-dim: rgba(64, 128, 80, 0.08);

    /* 翠玉绿 —— 更鲜亮的翠绿 */
    --jade: #408050;
    --jade-glow: rgba(64, 128, 80, 0.15);

    /* 数据卡冷色调强调色 —— 竹青水蓝 */
    --card-combo-accent: #4a90a0;

    /* 雾气层 —— 竹林雾气 */
    --mist-warm: rgba(150, 190, 140, 0.04);
    --mist-cool: rgba(100, 160, 130, 0.05);

    /* 阴影 —— 浅色主题柔和阴影 */
    --shadow: 0 4px 20px rgba(60, 140, 80, 0.12);
}

/* ===== 赤霞橙（橙红温暖主题） ===== */
html[data-theme="cinnabar"] {
    /* 墨色系列 —— 浅橙底色背景（按 demo 配色改为浅色） */
    --ink: #f8e8d8;
    --ink-surface: #fcf0e0;
    --ink-elevated: #fff8f0;
    --ink-border: rgba(200, 100, 50, 0.15);

    /* 纸色系列 —— 深褐红墨色文字 */
    --paper: #5a3020;
    --paper-secondary: #806050;
    --paper-muted: #b08070;

    /* 朱砂红 —— 更鲜亮的赤霞红 */
    --vermillion: #c03030;
    --vermillion-light: #d85040;
    --vermillion-glow: rgba(192, 48, 48, 0.15);

    /* 泥金 —— 橙金色 */
    --gold-foil: #d06020;
    --gold-foil-light: #f09050;
    --gold-foil-glow: rgba(208, 96, 32, 0.2);
    --gold-foil-dim: rgba(208, 96, 32, 0.08);

    /* 翠玉绿 —— 偏黄的橄榄绿 */
    --jade: #40a070;
    --jade-glow: rgba(64, 160, 112, 0.15);

    /* 数据卡冷色调强调色 —— 冷灰蓝（冷暖对比） */
    --card-combo-accent: #5080a0;

    /* 雾气层 —— 暖橙微光 */
    --mist-warm: rgba(220, 140, 80, 0.05);
    --mist-cool: rgba(160, 150, 140, 0.02);

    /* 阴影 —— 浅色主题柔和阴影 */
    --shadow: 0 4px 20px rgba(200, 100, 50, 0.12);
}

/* ===== 紫霞（紫色神秘主题） ===== */
html[data-theme="purple"] {
    /* 墨色系列 —— 浅紫底色背景（按 demo 配色改为浅色） */
    --ink: #ece4f4;
    --ink-surface: #f4eef8;
    --ink-elevated: #faf8fc;
    --ink-border: rgba(140, 90, 180, 0.15);

    /* 纸色系列 —— 深紫墨色文字 */
    --paper: #4a3055;
    --paper-secondary: #685080;
    --paper-muted: #8a70a0;

    /* 朱砂红 —— 紫红调 */
    --vermillion: #c04060;
    --vermillion-light: #d86080;
    --vermillion-glow: rgba(192, 64, 96, 0.15);

    /* 泥金 —— 紫金作为主色调 */
    --gold-foil: #8050a0;
    --gold-foil-light: #a070c8;
    --gold-foil-glow: rgba(128, 80, 160, 0.2);
    --gold-foil-dim: rgba(128, 80, 160, 0.08);

    /* 翠玉绿 —— 偏蓝的青玉色 */
    --jade: #40a070;
    --jade-glow: rgba(64, 160, 112, 0.15);

    /* 数据卡冷色调强调色 —— 紫霞蓝 */
    --card-combo-accent: #7090d0;

    /* 雾气层 —— 紫霞微光 */
    --mist-warm: rgba(180, 140, 200, 0.04);
    --mist-cool: rgba(140, 120, 190, 0.05);

    /* 阴影 —— 浅色主题柔和阴影 */
    --shadow: 0 4px 20px rgba(140, 90, 180, 0.12);
}