/* =========================================================
 * theme.css —— 全站多主题（2026-09-30）
 *
 * 机制：style.css 的 :root 定义了 12 个核心变量（背景 / 面板 / 文字 / 六个品牌色），
 *       本文件按 <html data-theme="..."> 覆盖这批变量 —— 走变量的样式立即换肤；
 *       canvas 图表由 theme.js 的 ECharts 补丁按「基色族」映射换色，不在此文件职责内。
 *
 * 主题：
 *   （默认 / 无属性）科技暗色 —— 现状，零改动
 *   light —— 清爽亮色：白底浅灰面板、深蓝灰文字、品牌色加深保对比度
 *   soft  —— 暖沙柔和：暖棕暗底、米色文字、低饱和暖色系（护眼向）
 *
 * 注意：本文件只覆盖「变量 + 全局装饰 + 少量高频深底类」；
 *       各业务页 css 里未变量化的硬编码色会保留原暗色（Phase 2 逐页变量化）。
 * ========================================================= */

/* ---------- 0) 增量基础变量（style.css 没有的补充语义，dark 默认值在此定义） ---------- */
:root {
  --text-mid: #9db8d6;            /* 中间层文字（介于 text 与 text-dim） */
  --deep: rgba(6, 16, 34, .88);   /* 深底（弹窗 / tooltip / 卡片头） */
}

/* ---------- 1) 清爽亮色 ---------- */
html[data-theme="light"] {
  --bg-0: #e6edf6;
  --bg-1: #f5f8fc;
  --panel: rgba(255, 255, 255, .88);
  --panel-border: rgba(70, 110, 170, .28);
  --text: #22374f;
  --text-mid: #46648c;
  --text-dim: #5d7395;
  --deep: rgba(255, 255, 255, .94);
  --cyan: #0e7fb8;
  --green: #0f9d6e;
  --orange: #d97e12;
  --red: #d64545;
  --purple: #7357d8;
  --gold: #b8860b;

  /* RGB 三元组覆盖（2026-10-07 全量变量化配套） */
  --text-rgb: 34,55,79;
  --text-mid-rgb: 70,100,140;
  --text-dim-rgb: 93,115,149;
  --cyan-rgb: 14,127,184;
  --green-rgb: 15,157,110;
  --orange-rgb: 217,126,18;
  --red-rgb: 214,69,69;
  --purple-rgb: 115,87,216;
  --gold-rgb: 184,134,11;
  --link-rgb: 30,100,180;
  --border-rgb: 70,110,170;
  --cyan-bright-rgb: 14,111,168;
  --green-soft-rgb: 74,122,98;
  --gold-soft-rgb: 169,120,7;
  --red-soft-rgb: 192,64,64;
  --purple-soft-rgb: 106,90,184;
  --orange-dim-rgb: 156,95,46;
  --warm-gray-rgb: 125,106,88;
  --ink-1-rgb: 223,232,242;
  --ink-2-rgb: 255,255,255;
  --ink-3-rgb: 242,247,252;
  --red-deep-rgb: 250,232,232;
  --green-deep-rgb: 226,244,235;
  --purple-deep-rgb: 236,233,246;
  --shadow-rgb: 30,60,100;

  /* 经营例会局部变量（decision-meeting.css --mt-*，2026-10-07 亮版补齐） */
  --mt-line: #c8d6e8;
  --mt-line-2: #b4c6dc;
  --mt-card: #ffffff;
  --mt-card-2: #f2f6fb;
  --mt-txt: #22374f;
  --mt-txt-strong: #1a2b40;
  --mt-dim: #5d7395;
  --mt-cyan: #0e7fb8;
  --mt-green: #0f9d6e;
  --mt-amber: #b8860b;
  --mt-red: #d64545;
  --mt-purple: #7357d8;
  /* 应收/资质 KPI 卡标签（receivable-analysis.css .ra-kpi .k） */
  --ra-label-rgb: 70,100,140;
}

/* ---------- 2) 暖沙柔和（低饱和护眼暗色） ---------- */
html[data-theme="soft"] {
  --bg-0: #211c15;
  --bg-1: #2b241a;
  --panel: rgba(62, 52, 40, .82);
  --panel-border: rgba(196, 156, 102, .30);
  --text: #ead9c2;
  --text-mid: #c2b096;
  --text-dim: #a89880;
  --deep: rgba(52, 44, 33, .90);
  --cyan: #7fc4b8;
  --green: #a8c686;
  --orange: #e0a370;
  --red: #e08a7a;
  --purple: #b39ddb;
  --gold: #d9c08a;

  /* RGB 三元组覆盖（2026-10-07 全量变量化配套） */
  --text-rgb: 234,217,194;
  --text-mid-rgb: 194,176,150;
  --text-dim-rgb: 168,152,128;
  --cyan-rgb: 127,196,184;
  --green-rgb: 168,198,134;
  --orange-rgb: 224,163,112;
  --red-rgb: 224,138,122;
  --purple-rgb: 179,157,219;
  --gold-rgb: 217,192,138;
  --link-rgb: 138,176,216;
  --border-rgb: 196,156,102;
  --cyan-bright-rgb: 159,212,200;
  --green-soft-rgb: 168,189,154;
  --gold-soft-rgb: 219,190,142;
  --red-soft-rgb: 224,160,148;
  --purple-soft-rgb: 169,156,203;
  --orange-dim-rgb: 200,146,104;
  --warm-gray-rgb: 176,154,132;
  --ink-1-rgb: 36,30,22;
  --ink-2-rgb: 62,52,40;
  --ink-3-rgb: 74,62,46;
  --red-deep-rgb: 74,42,38;
  --green-deep-rgb: 42,52,34;
  --purple-deep-rgb: 66,58,84;
  --shadow-rgb: 0,0,0;

  /* 经营例会局部变量（soft 暖棕对齐） */
  --mt-line: #4a3f30;
  --mt-line-2: #5c4e3a;
  --mt-card: #3a3226;
  --mt-card-2: #332b20;
  --mt-txt: #ead9c2;
  --mt-txt-strong: #f5ead8;
  --mt-dim: #a89880;
  --mt-cyan: #7fc4b8;
  --mt-green: #a8c686;
  --mt-amber: #d9c08a;
  --mt-red: #e08a7a;
  --mt-purple: #b39ddb;
  --ra-label-rgb: 196,176,150;
}

/* ---------- 3) 背景装饰层主题化 ----------
   style.css 的网格 / 呼吸光斑是暗色科技专属（深蓝网格 + 蓝色光斑），
   亮色 / 柔和主题下换成对应色调，或弱化。 */

/* 亮色：淡蓝细网格 + 极淡冷光 */
html[data-theme="light"] .bg-grid {
  background-image:
    linear-gradient(rgba(70, 110, 170, .08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(70, 110, 170, .08) 1px, transparent 1px);
}
html[data-theme="light"] .bg-glow-a {
  background: radial-gradient(circle, rgba(14, 127, 184, .16), transparent 65%);
}
html[data-theme="light"] .bg-glow-b {
  background: radial-gradient(circle, rgba(115, 87, 216, .12), transparent 65%);
}

/* 柔和：暖棕网格 + 暖色光斑 */
html[data-theme="soft"] .bg-grid {
  background-image:
    linear-gradient(rgba(196, 156, 102, .07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(196, 156, 102, .07) 1px, transparent 1px);
}
html[data-theme="soft"] .bg-glow-a {
  background: radial-gradient(circle, rgba(224, 163, 112, .22), transparent 65%);
}
html[data-theme="soft"] .bg-glow-b {
  background: radial-gradient(circle, rgba(127, 196, 184, .16), transparent 65%);
}

/* ---------- 4) style.css 高频深底类覆盖 ----------
   这些类在 style.css 里写死了深蓝底（亮色主题下会变成突兀的深色岛）。 */

/* 亮色 */
html[data-theme="light"] .task-bar,
html[data-theme="light"] .pw-track {
  background: rgba(224, 234, 246, .9);
  border-color: rgba(70, 110, 170, .30);
  box-shadow: inset 0 1px 3px rgba(34, 55, 79, .12);
}
html[data-theme="light"] .map-hint {
  background: rgba(233, 241, 250, .85);
  border-color: rgba(70, 110, 170, .35);
}
html[data-theme="light"] .nav-group-head:hover {
  background: rgba(70, 110, 170, .08);
  color: #22374f;
}
html[data-theme="light"] .nav-group.open > .nav-group-head {
  background: rgba(70, 110, 170, .10);
  color: #22374f;
}
/* 科技角标（corner 用的边线）在亮色下降低亮度 */
html[data-theme="light"] .corner { opacity: .45; }

/* 柔和 */
html[data-theme="soft"] .task-bar,
html[data-theme="soft"] .pw-track {
  background: rgba(43, 36, 26, .9);
  border-color: rgba(196, 156, 102, .32);
  box-shadow: inset 0 2px 5px rgba(0, 0, 0, .35);
}
html[data-theme="soft"] .map-hint {
  background: rgba(52, 44, 32, .85);
  border-color: rgba(196, 156, 102, .35);
}
html[data-theme="soft"] .nav-group-head:hover {
  background: rgba(196, 156, 102, .10);
  color: #ead9c2;
}
html[data-theme="soft"] .nav-group.open > .nav-group-head {
  background: rgba(196, 156, 102, .12);
  color: #ead9c2;
}

/* ---------- 5) 主题切换悬浮球（theme.js 创建，此处只放样式） ---------- */
.thm-fab {
  position: fixed; right: 14px; bottom: 14px; z-index: 99990;
  width: 34px; height: 34px; border-radius: 50%;
  border: 1px solid var(--panel-border, rgba(72, 128, 190, .3));
  background: var(--panel, rgba(13, 29, 55, .78));
  color: var(--text, #dbe8f7);
  font-size: 15px; line-height: 32px; text-align: center;
  cursor: pointer; user-select: none;
  backdrop-filter: blur(6px);
  box-shadow: 0 4px 14px rgba(0, 0, 0, .28);
  opacity: .55; transition: opacity .18s, transform .18s;
}
.thm-fab:hover { opacity: 1; transform: scale(1.06); }

.thm-pop {
  position: fixed; right: 56px; bottom: 14px; z-index: 99990;
  display: none; align-items: center; gap: 8px;
  padding: 8px 12px; border-radius: 10px;
  border: 1px solid var(--panel-border, rgba(72, 128, 190, .3));
  background: var(--panel, rgba(13, 29, 55, .78));
  backdrop-filter: blur(6px);
  box-shadow: 0 6px 20px rgba(0, 0, 0, .3);
}
.thm-pop.open { display: flex; }
.thm-opt {
  width: 30px; height: 30px; border-radius: 8px; cursor: pointer;
  border: 2px solid transparent; position: relative;
  font-size: 10px; line-height: 26px; text-align: center;
  color: #fff; text-shadow: 0 1px 2px rgba(0, 0, 0, .5);
}
.thm-opt.active { border-color: currentColor; }
.thm-opt[data-t="dark"] { background: linear-gradient(135deg, #0a1526, #123055); }
.thm-opt[data-t="light"] { background: linear-gradient(135deg, #f5f8fc, #c9d9ec); color: #22374f; text-shadow: none; }
.thm-opt[data-t="soft"] { background: linear-gradient(135deg, #2b241a, #7a6547); }