/* ===== 星宿食堂 V0.1.9G 统一设计令牌 (Design Tokens) ===== */
/* 此文件为全局 CSS 变量唯一来源，所有样式表应引用此处变量 */
/* 参考 TRAE IDE 设计语言 */

:root {
    /* ---------- 水墨古韵主题色 ---------- */
    --river: #4A7C59;        /* 江水绿 - 主色 */
    --deep: #2d5a3d;         /* 深林绿 - 强调色 */
    --gold: #C4A35A;         /* 鎏金色 - 点缀色 */
    --paper: #F5F0E8;        /* 宣纸色 - 浅背景 */
    --ink: #1a1a2e;          /* 墨色 - 主文本 */
    --mist: #E8E0D5;         /* 雾色 - 分隔/边框 */

    /* ---------- TRAE IDE 风格深色主题色 ---------- */
    --bg-dark: #1e1e1e;          /* TRAE 深色背景 */
    --surface-dark: #252526;     /* TRAE 深色表面 */
    --border-dark: #2d2d30;      /* TRAE 深色边框 */
    --text-dark: #cccccc;        /* 深色文本 */

    /* ---------- 语义化派生色 ---------- */
    --bg: var(--paper, #F5F0E8);              /* 默认页面背景 */
    --surface: var(--paper, #F5F0E8);             /* 卡片表面（宣纸色，护眼） */
    --surface-soft: #EDE8DC;               /* 柔和表面 */
    --surface-hover: #E8E0D5;              /* 悬停表面 */
    --surface-active: #E0D5C8;             /* 激活表面 */
    --border: #C8BDAB;                      /* 默认边框 (V0.2.0F 加深) */
    --border-soft: #DDD6C8;                /* 柔和边框 (V0.2.0F 加深) */
    --text: #1a1a2e;                     /* 主文本 */
    --text-secondary: #666666;           /* 次要文本 */
    --text-muted: #888888;               /* 弱化文本 */
    --text-faint: #aaaaaa;               /* 最弱文本 */

    /* ---------- TRAE IDE 布局令牌 ---------- */
    --sidebar-w: 260px;                  /* 侧边栏宽度 */
    --sidebar-w-collapsed: 48px;         /* 侧边栏折叠宽度 */
    --chat-max-w: 768px;                 /* 聊天区最大宽度 */
    --chat-padding: 24px;                /* 聊天区内边距 */
    --panel-h: 200px;                    /* 底部面板高度 */
    --panel-h-collapsed: 48px;           /* 底部面板折叠高度 */
    --topbar-h: 48px;                    /* 顶栏高度 */

    /* ---------- TRAE IDE 图标令牌 ---------- */
    --icon-size: 20px;                   /* 图标默认尺寸 */
    --icon-color: #fff;                  /* 图标默认颜色 */

    /* ---------- 间距变量 ---------- */
    --gap-xs: 4px;
    --gap-sm: 8px;
    --gap-md: 16px;
    --gap-lg: 24px;
    --gap-xl: 32px;
    --gap-2xl: 48px;

    /* ---------- 过渡变量 ---------- */
    --transition: 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    --transition-fast: 0.15s cubic-bezier(0.4, 0, 0.2, 1);
    --transition-slow: 0.4s cubic-bezier(0.4, 0, 0.2, 1);

    /* ---------- 响应式断点 ---------- */
    --bp-mobile: 768px;
    --bp-tablet: 1024px;
    --bp-desktop: 1440px;

    /* ---------- 字体变量 ---------- */
    --font-main: 'LXGW WenKai', 'Source Han Serif SC', 'Noto Serif CJK SC', 'KaiTi', 'STKaiti', serif, sans-serif;
    --font-size-base: 14px;
    --font-size-sm: 12px;
    --font-size-xs: 11px;
    --font-size-lg: 16px;
    --font-size-xl: 20px;
    --font-size-2xl: 24px;
    --line-height-base: 1.6;
    --line-height-tight: 1.3;

    /* ---------- 阴影变量 ---------- */
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.08);
    --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.12);
    --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.16);
    --shadow-top: 0 -4px 12px rgba(0, 0, 0, 0.08);

    /* ---------- 圆角变量 ---------- */
    --radius-sm: 6px;
    --radius-md: 12px;
    --radius-lg: 20px;
    --radius-full: 9999px;

    /* ---------- 布局变量 ---------- */
    --sidebar-width: 240px;
    --header-height: 56px;
    --z-drawer: 100;
    --z-overlay: 200;
    --z-modal: 1000;
    --z-toast: 2000;

    /* ---------- 暖白古风扩展变量 ---------- */
    --gufeng-font-title: 'KaiTi', 'STKaiti', 'FangSong', serif;
    --gufeng-font-body: 'Microsoft YaHei', 'PingFang SC', sans-serif;
    --gufeng-pattern-url: none; /* 宣纸纹理占位，由gufeng-warm-white.css填充 */
    --gufeng-seal-color: #C0392B; /* 印章红 */
    --gufeng-cloud-color: rgba(196,163,90,0.2); /* 祥云纹颜色 */

    /* ---------- V9 新增语义派生变量 ---------- */
    --card-bg: #F5F0E8;
    --card-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    --card-border: 1px solid var(--mist, #E8E0D5);
    --section-gap: var(--gap-lg, 24px);
    --accent: var(--river, #4A7C59);
    --accent-hover: var(--deep, #2d5a3d);
    --accent-soft: rgba(74, 124, 89, 0.1);
    --danger: #D94F4F;
    --danger-soft: rgba(217, 79, 79, 0.1);
    --success: #4A7C59;
    --success-soft: rgba(74, 124, 89, 0.1);
    --warning: #C4A35A;
    --warning-soft: rgba(196, 163, 90, 0.1);
    --info: #5B8DBE;
    --info-soft: rgba(91, 141, 190, 0.1);

    /* ---------- V0.2.5 新增布局语义变量 ---------- */
    --bg-secondary: #F7F8FA;
    --bg-tertiary: #EEF0F0;
    --msg-user-bg: var(--river, #4A7C59);
    --msg-user-text: #ffffff;
    --msg-ai-bg: var(--surface, #FAFAF7);
    --msg-ai-text: var(--text, #1a1a2e);
    --topbar-bg: var(--paper, #F5F0E8);
    --topbar-border: var(--mist, #E8E0D5);
    --sidebar-bg: var(--surface, #FAFAF7);
    --sidebar-hover: var(--surface-hover, #E8E0D5);
    --bottombar-bg: var(--paper, #F5F0E8);
    --scrollbar-thumb: #dcdfe3;
}

/* ---------- 浅色主题（TRAE Work 白色风格） ---------- */
[data-theme="light"] {
    --bg: #FFFFFF;
    --bg-secondary: #F7F8FA;
    --bg-tertiary: #EEF0F0;
    --surface: #FFFFFF;
    --surface-soft: #F5F6F8;
    --surface-hover: #F0F2F5;
    --surface-active: #E8EAF0;
    --border: #E8E8E8;
    --border-soft: #EEEEEE;
    --text: #1A1A1A;
    --text-secondary: #4A4A4A;
    --text-muted: #999999;
    --text-faint: #BBBBBB;
    --paper: #FFFFFF;
    --ink: #1A1A1A;
    --mist: #E8E8E8;
    --card-bg: #FFFFFF;
    --card-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    --accent-soft: rgba(79, 110, 247, 0.08);
    --danger-soft: rgba(255, 77, 79, 0.08);
    --success-soft: rgba(82, 196, 26, 0.08);
    --warning-soft: rgba(250, 173, 20, 0.08);
    --info-soft: rgba(91, 141, 190, 0.08);
    --msg-user-bg: #4f6ef7;
    --msg-user-text: #ffffff;
    --msg-ai-bg: #F7F8FA;
    --msg-ai-text: #1A1A1A;
    --topbar-bg: #FFFFFF;
    --topbar-border: #EEF0F0;
    --sidebar-bg: #F7F8FA;
    --sidebar-hover: #F0F2F5;
    --bottombar-bg: #FFFFFF;
    --scrollbar-thumb: #DCDFE3;
}

/* ---------- 深色主题覆盖（参考 TRAE IDE 深色主题） ---------- */
[data-theme="dark"] {
    --bg: var(--bg-dark);
    --bg-secondary: #16213e;
    --bg-tertiary: #0f3460;
    --surface: var(--surface-dark);
    --surface-soft: #2a2a2b;
    --surface-hover: #2d2d2e;
    --surface-active: #333334;
    --border: var(--border-dark);
    --border-soft: #2a2a2b;
    --text: var(--text-dark);
    --text-secondary: #969696;
    --text-muted: #6a6a6a;
    --text-faint: #4a4a4a;
    --mist: #2d2d30;
    --paper: #1e1e1e;
    --icon-color: #fff;
    --msg-user-bg: #6c8cff;
    --msg-user-text: #1a1a2e;
    --msg-ai-bg: #16213e;
    --msg-ai-text: #e0e0e0;
    --topbar-bg: #1e1e1e;
    --topbar-border: #2d2d30;
    --sidebar-bg: #252526;
    --sidebar-hover: #2d2d2e;
    --bottombar-bg: #1e1e1e;
    --scrollbar-thumb: #3a3a5a;

    /* ---------- V9 新增语义派生变量（深色覆盖） ---------- */
    --card-bg: var(--surface-dark);
    --card-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
    --accent-soft: rgba(74, 124, 89, 0.2);
    --danger-soft: rgba(217, 79, 79, 0.2);
    --success-soft: rgba(74, 124, 89, 0.2);
    --warning-soft: rgba(196, 163, 90, 0.2);
    --info-soft: rgba(91, 141, 190, 0.2);
}

/* ---------- 古风暗色主题覆盖 — V0.2.6 新增 ---------- */
[data-theme="gufengdark"] {
    --bg: #1a1714;
    --bg-secondary: #252019;
    --surface: #2a2520;
    --surface-soft: #332e27;
    --surface-hover: #3a352e;
    --surface-active: #4a4339;
    --border: #3a352e;
    --border-soft: #332e27;
    --text: #f0e8d8;
    --text-secondary: #c0b898;
    --text-muted: #887860;
    --text-faint: #686048;
    --paper: #1a1714;
    --ink: #f0e8d8;
    --mist: #3a352e;
    --card-bg: #2a2520;
    --accent: #8b7355;
    --accent-hover: #9d8565;
    --danger: #c47060;
    --success: #7a9a5a;
    --warning: #c4a050;
    --card-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
    --accent-soft: rgba(139, 115, 85, 0.15);
    --danger-soft: rgba(196, 112, 96, 0.15);
    --success-soft: rgba(122, 154, 90, 0.15);
    --warning-soft: rgba(196, 160, 80, 0.15);
    --info-soft: rgba(100, 140, 170, 0.15);
    --msg-user-bg: #8b7355;
    --msg-user-text: #faf5ef;
    --msg-ai-bg: #252019;
    --msg-ai-text: #f0e8d8;
    --topbar-bg: #1a1714;
    --topbar-border: #332e27;
    --sidebar-bg: #252019;
    --sidebar-hover: #332e27;
    --bottombar-bg: #1a1714;
    --scrollbar-thumb: #4a4339
}

/* ===== 紫色暗黑主题（保留旧对话中心风格） ===== */
html[data-theme="purple"] {
    --river: #e0c3fc;
    --deep: #1a1a2e;
    --gold: #ffd700;
    --paper: #1a1a2e;
    --ink: #e0e0e0;
    --mist: rgba(255,255,255,0.08);
    --bg: #1a1a2e;
    --surface: #2d2d44;
    --surface-soft: #252540;
    --surface-hover: #35355a;
    --surface-active: #404070;
    --border: rgba(255,255,255,0.10);
    --border-soft: rgba(255,255,255,0.06);
    --text: #e0e0e0;
    --text-secondary: #a0a0b0;
    --text-muted: #707080;
    --text-faint: #505060;
    --bg-secondary: #16213e;
    --bg-tertiary: #0f3460;
    --card-bg: #232944;
    --accent-soft: rgba(224,195,252,0.15);
}

/* ===== 五行主题：金（秋/西/白） ===== */
html[data-theme="wuxing-metal"] {
    --river: #8D8D8D;
    --deep: #6B6B6B;
    --gold: #C0C0C0;
    --paper: #FAFAFA;
    --ink: #2C2C2C;
    --mist: #E8E8E8;
    --bg: #FAFAFA;
    --surface: #FFFFFF;
    --surface-soft: #F5F5F5;
    --surface-hover: #EEEEEE;
    --surface-active: #E0E0E0;
    --border: #E0E0E0;
    --border-soft: #EEEEEE;
    --text: #2C2C2C;
    --text-secondary: #666666;
    --text-muted: #999999;
    --text-faint: #BBBBBB;
    --card-bg: #FFFFFF;
    --accent-soft: rgba(192,192,192,0.15);
}

/* ===== 五行主题：木（春/东/青） ===== */
html[data-theme="wuxing-wood"] {
    --river: #2E7D32;
    --deep: #1B5E20;
    --gold: #66BB6A;
    --paper: #F1F8E9;
    --ink: #1a2e1a;
    --mist: #DCEDC8;
    --bg: #F1F8E9;
    --surface: #FFFFFF;
    --surface-soft: #F5F9F0;
    --surface-hover: #E8F5E9;
    --surface-active: #C8E6C9;
    --border: #C8E6C9;
    --border-soft: #E8F5E9;
    --text: #1B5E20;
    --text-secondary: #558B2F;
    --text-muted: #7CB342;
    --text-faint: #AED581;
    --card-bg: #FFFFFF;
    --accent-soft: rgba(102,187,106,0.15);
}

/* ===== 五行主题：水（冬/北/黑） ===== */
html[data-theme="wuxing-water"] {
    --river: #1565C0;
    --deep: #0D47A1;
    --gold: #42A5F5;
    --paper: #E3F2FD;
    --ink: #0a1628;
    --mist: #BBDEFB;
    --bg: #E3F2FD;
    --surface: #FFFFFF;
    --surface-soft: #F0F7FF;
    --surface-hover: #E1F0FF;
    --surface-active: #BBDEFB;
    --border: #90CAF9;
    --border-soft: #E3F2FD;
    --text: #0D47A1;
    --text-secondary: #1976D2;
    --text-muted: #42A5F5;
    --text-faint: #90CAF9;
    --card-bg: #FFFFFF;
    --accent-soft: rgba(66,165,245,0.15);
}

/* ===== 五行主题：火（夏/南/赤） ===== */
html[data-theme="wuxing-fire"] {
    --river: #C62828;
    --deep: #B71C1C;
    --gold: #FF7043;
    --paper: #FFF3E0;
    --ink: #2e1a1a;
    --mist: #FFCCBC;
    --bg: #FFF3E0;
    --surface: #FFFFFF;
    --surface-soft: #FFF8F0;
    --surface-hover: #FFE0B2;
    --surface-active: #FFCC80;
    --border: #FFAB91;
    --border-soft: #FFF3E0;
    --text: #BF360C;
    --text-secondary: #E64A19;
    --text-muted: #FF7043;
    --text-faint: #FFAB91;
    --card-bg: #FFFFFF;
    --accent-soft: rgba(255,112,67,0.15);
}

/* ===== 五行主题：土（长夏/中/黄） ===== */
html[data-theme="wuxing-earth"] {
    --river: #F9A825;
    --deep: #F57F17;
    --gold: #FFD54F;
    --paper: #FFFDE7;
    --ink: #2e2a1a;
    --mist: #FFF9C4;
    --bg: #FFFDE7;
    --surface: #FFFFFF;
    --surface-soft: #FFFFF0;
    --surface-hover: #FFF9C4;
    --surface-active: #FFF176;
    --border: #FFE082;
    --border-soft: #FFFDE7;
    --text: #E65100;
    --text-secondary: #F57F17;
    --text-muted: #FFB300;
    --text-faint: #FFD54F;
    --card-bg: #FFFFFF;
    --accent-soft: rgba(255,213,79,0.15);
}

/* ===== 蓝紫科技主题（V0.2.0E 新增） ===== */
html[data-theme="purple-blue"] {
    --river: #4F6EF7;
    --deep: #3d5bd9;
    --gold: #8B5CF6;
    --paper: #FAFAFE;
    --ink: #1e1b3a;
    --mist: #E8E5F0;
    --bg: #FAFAFE;
    --surface: #FFFFFF;
    --surface-soft: #F3F0FF;
    --surface-hover: #EDE8FF;
    --surface-active: #E0D8F5;
    --border: #DDD8F0;
    --border-soft: #EAE5F5;
    --text: #1e1b3a;
    --text-secondary: #5a5478;
    --text-muted: #8a84a0;
    --text-faint: #b0aac0;
    --bg-secondary: #F5F3FF;
    --bg-tertiary: #EDE8F5;
    --card-bg: #FFFFFF;
    --accent: #4F6EF7;
    --accent-hover: #3d5bd9;
    --accent-soft: rgba(79,110,247,0.1);
    --danger: #EF4444;
    --danger-soft: rgba(239,68,68,0.1);
    --success: #10B981;
    --success-soft: rgba(16,185,129,0.1);
    --warning: #F59E0B;
    --warning-soft: rgba(245,158,11,0.1);
    --info: #3B82F6;
    --info-soft: rgba(59,130,246,0.1);
    --msg-user-bg: #4F6EF7;
    --msg-user-text: #ffffff;
    --msg-ai-bg: #F3F0FF;
    --msg-ai-text: #1e1b3a;
    --topbar-bg: #FFFFFF;
    --topbar-border: #E8E5F0;
    --sidebar-bg: #FAFAFE;
    --sidebar-hover: #F3F0FF;
    --bottombar-bg: #FFFFFF;
    --scrollbar-thumb: #D0CBE5;
    --card-shadow: 0 2px 8px rgba(79,110,247,0.08);
}