/* ============================================================
   星晟大数据管理系统 v5.0 - 设计令牌（design tokens）

   ⛔ 这是什么
   全站**唯一**的颜色 / 圆角 / 间距 / 字号 / 阴影 定义处。
   以后想换主题色、调圆角，**只改这一个文件**，全站生效。

   ⛔ 铁律（2026-09-14 系统统一化·第 2 批「立尺子」确立）
   1. 其它任何 css 文件里**不许再写 `#` 开头的颜色值**，只能引用这里的 `var(--xxx)`。
      （唯一例外：本文件内部定义变量时当然要写颜色值）
   2. 新增颜色先来这里加一行，再去用；不要图省事直接写死。
   3. **本文件必须第一个加载** —— 在 main.css / knowledge.css 之前。
      引用了 main.css 的模板（base.html / login.html / register.html）都要同时引本文件。

   ⛔ 变量命名怎么读
   - `--primary*`  品牌主色（水蓝）
   - `--xxx`       单个颜色（如 --red / --green）
   - `--xxx-bg`    某个语义色的**浅底色**
   - `--xxx-text`  某个语义色对应的**文字色**
   - `--border-*`  各种边框灰
   - `--gray-*`    中性灰阶（数字越大越深）
   - `--r-*` 圆角 / `--s-*` 间距 / `--f-*` 字号 / `--sh-*` 阴影

   ⛔ 给后来 AI 的接手须知
   - 本批（09-14）只做了「把 main.css 里散落的颜色收敛成变量」，
     `--r-*` / `--s-*` / `--f-*` / `--sh-*` 这四组**暂时还没人用** —— 它们是给
     后续批次（旧壳换芯 / 收卡片Tab）准备的尺子，**不要因为"没用到"就删掉**。
   - 暗色模式只覆盖颜色，不覆盖尺寸；本批暗色覆盖范围**与原来完全一致**（未新增），
     所以暗色下的观感一个字都没变。要完善暗色请另开一批。
   ============================================================ */

:root {
    /* ---------- 品牌色（水蓝） ---------- */
    --primary: #0891B2;
    --primary-light: #7DD3FC;
    --primary-dark: #0E7490;
    --primary-bg: #F0F9FF;

    /* ---------- 辅助色 ---------- */
    --cyan: #06B6D4;
    --cyan-light: #22D3EE;
    --cyan-bg: #CFFAFE;
    --green: #10B981;
    --purple: #8B5CF6;
    --amber: #F59E0B;
    --red: #EF4444;
    --pink: #EC4899;          /* 2026-09-14 A 档：曾被判为"无人用"，实为统计页「总油耗」KPI 在使用（原写死 #ec4899，已接回本变量）—— 别删 */
    --info: #3B82F6;

    /* ---------- 语义色：成功 / 警告 / 危险 / 信息 ---------- */
    --success-bg: #DCFCE7;
    --success-bg-soft: #D1FAE5;
    --success-text: #166534;
    --success-text-soft: #059669;
    --warning-bg: #FEF3C7;
    --warning-text: #D97706;
    --amber-text-deep: #92400E;
    --danger-bg: #FEE2E2;
    --danger-text: #DC2626;
    --danger-text-deep: #991B1B;
    --info-bg: #DBEAFE;
    --info-text: #2563EB;
    --info-text-deep: #1E40AF;

    /* ---------- 中性色 ---------- */
    --bg: #FFFBF5;
    --bg-warm: #F0F9FF;
    --bg-page: #f5f7fa;
    --bg-muted: #f8fafc;
    --card: #FFFFFF;
    --gray-100: #F3F4F6;
    --gray-400: #888888;
    --gray-500: #6B7280;
    --gray-600: #495057;
    --border: #BAE6FD;
    --border-light: #E0F2FE;
    --border-strong: #D0D0D0;
    --border-soft: #E8E8E8;
    --border-input: #dee2e6;
    --border-subtle: #e2e8f0;
    --text-primary: #1E293B;
    --text-secondary: #64748B;
    --text-muted: #94A3B8;

    /* ---------- 装饰渐变 ---------- */
    --login-bg-grad: linear-gradient(135deg, #F0F9FF 0%, #FFEDD5 30%, #E0F2FE 60%, #D1FAE5 100%);
    --slogan-grad: linear-gradient(135deg, #DC2626, #EF4444, #F97316);

    /* ---------- 圆角：只留三档（后续批次启用） ---------- */
    --r-sm: 6px;
    --r-md: 10px;
    --r-lg: 16px;

    /* ---------- 间距：8 的倍数，只留四档（后续批次启用） ---------- */
    --s-1: 4px;
    --s-2: 8px;
    --s-3: 16px;
    --s-4: 24px;

    /* ---------- 字号：只留四档（后续批次启用） ---------- */
    --f-xs: 12px;
    --f-sm: 13px;
    --f-md: 14px;
    --f-lg: 18px;

    /* ---------- 阴影：只留两档（后续批次启用） ---------- */
    --sh-1: 0 1px 3px rgba(0, 0, 0, .06);
    --sh-2: 0 4px 16px rgba(0, 0, 0, .08);

    /* ---------- 侧边栏 ---------- */
    --sidebar-width: 240px;
    --sidebar-bg: linear-gradient(180deg, #0891B2 0%, #0E7490 40%, #155E75 100%);
}

/* ==================== 暗色模式：只覆盖颜色（范围与原 main.css 完全一致） ==================== */
[data-theme="dark"] {
    /* 品牌色 */
    --primary: #0891B2;
    --primary-light: #22D3EE;
    --primary-dark: #0891B2;
    --primary-bg: #1E293B;

    /* 中性色 */
    --bg: #0F172A;
    --bg-warm: #1E293B;
    --card: #1E293B;
    --border: #334155;
    --border-light: #334155;
    --text-primary: #E2E8F0;
    --text-secondary: #94A3B8;
    --text-muted: #64748B;

    /* 侧边栏：保持渐变但稍暗 */
    --sidebar-bg: linear-gradient(180deg, #0E4A5F 0%, #0C3D4F 40%, #082F45 100%);
}
