/* ============================================================
   换肤扩展层（themes.css · 20260924a）
   原则：不动 style.css 一行；通过 html[data-theme] 覆盖 CSS 变量
   + 定向覆盖 style.css 中的浅色硬编码（背景/软底/条纹）。
   主题：dark-purple 暗夜紫 | nike-mono 黑白大写 | terminal 终端单色
   图表：深色主题下 ECharts 画布仍按浅色渲染，故给 .chart 容器
        白色衬底，作为深色界面中的"浅色图卡"，观感刻意保留。
   ============================================================ */

/* ---------- 变量覆盖 ---------- */
html[data-theme="dark-purple"]{
  --bg:#08090a; --panel:#141516; --line:#23252a; --line-soft:#1c1e22;
  --text:#f7f8f8; --muted:#8a8f98;
  --primary:#5e6ad2; --primary-hover:#6f7ade; --primary-soft:#1d2033;
  --up:#ff6b61; --down:#4cc38a;
  --shadow:0 1px 2px rgba(0,0,0,.4), 0 4px 16px rgba(0,0,0,.35);
  --radius:10px; --radius-sm:8px;
  --t-soft:#1c1e24; --t-stripe:#101114;
  --t-redsoft:rgba(255,107,97,.14); --t-greensoft:rgba(76,195,138,.14);
  --t-redborder:rgba(255,107,97,.45); --t-greenborder:rgba(76,195,138,.45);
  color-scheme:dark;
}
html[data-theme="nike-mono"]{
  --bg:#ffffff; --panel:#ffffff; --line:#e5e5e5; --line-soft:#efefef;
  --text:#111111; --muted:#757575;
  --primary:#111111; --primary-hover:#000000; --primary-soft:#f0f0f0;
  --shadow:none;
  --radius:2px; --radius-sm:2px;
  --t-soft:#f0f0f0; --t-stripe:#fafafa;
  --t-redsoft:#fdecec; --t-greensoft:#e6f6ee;
  --t-redborder:#f3c4c1; --t-greenborder:#bfe3cf;
}
html[data-theme="terminal"]{
  --bg:#0b0b0b; --panel:#141414; --line:#262626; --line-soft:#1e1e1e;
  --text:#e6e6e6; --muted:#8f8f8f;
  --primary:#e6e6e6; --primary-hover:#ffffff; --primary-soft:#1f1f1f;
  --up:#ff7264; --down:#57c99b;
  --shadow:none;
  --radius:2px; --radius-sm:2px;
  --t-soft:#1d1d1d; --t-stripe:#101010;
  --t-redsoft:rgba(255,114,100,.12); --t-greensoft:rgba(87,201,155,.12);
  --t-redborder:rgba(255,114,100,.4); --t-greenborder:rgba(87,201,155,.4);
  color-scheme:dark;
}

/* ---------- 深色主题：结构面覆盖（背景白→面板色） ---------- */
html[data-theme="dark-purple"] .sidebar,
html[data-theme="terminal"] .sidebar{ background:var(--panel); border-right-color:var(--line); }
html[data-theme="dark-purple"] .nav-item:hover,
html[data-theme="terminal"] .nav-item:hover{ background:var(--t-soft); }
html[data-theme="dark-purple"] .nav-item.active,
html[data-theme="terminal"] .nav-item.active{ background:#26262c; }

html[data-theme="dark-purple"] .card,
html[data-theme="dark-purple"] .panel,
html[data-theme="terminal"] .card,
html[data-theme="terminal"] .panel{ background:var(--panel); }

html[data-theme="dark-purple"] .form select,
html[data-theme="dark-purple"] .form input,
html[data-theme="dark-purple"] .form textarea,
html[data-theme="terminal"] .form select,
html[data-theme="terminal"] .form input,
html[data-theme="terminal"] .form textarea{ background:var(--panel); border-color:var(--line); color:var(--text); }

html[data-theme="dark-purple"] .tbl th,
html[data-theme="terminal"] .tbl th{ background:var(--panel); }
html[data-theme="dark-purple"] .tbl tr:hover td,
html[data-theme="dark-purple"] .cat-tbl tr:hover td,
html[data-theme="terminal"] .tbl tr:hover td,
html[data-theme="terminal"] .cat-tbl tr:hover td{ background:var(--t-soft); }
html[data-theme="dark-purple"] .cat-tbl tbody tr:nth-child(even) td,
html[data-theme="dark-purple"] #cf-tbl tbody tr:nth-child(even) td:first-child,
html[data-theme="terminal"] .cat-tbl tbody tr:nth-child(even) td,
html[data-theme="terminal"] #cf-tbl tbody tr:nth-child(even) td:first-child{ background:var(--t-stripe); }
html[data-theme="dark-purple"] .cat-tbl tbody td:first-child,
html[data-theme="terminal"] .cat-tbl tbody td:first-child{ background:var(--panel); }

html[data-theme="dark-purple"] .ac-menu,
html[data-theme="dark-purple"] .pc-sugg,
html[data-theme="dark-purple"] .pd-box,
html[data-theme="dark-purple"] .bank-chip,
html[data-theme="dark-purple"] .mode-btn,
html[data-theme="dark-purple"] #view-fund .fd-sum,
html[data-theme="dark-purple"] #pd-overview .cell,
html[data-theme="dark-purple"] #toast,
html[data-theme="dark-purple"] .pick .p-ic,
html[data-theme="terminal"] .ac-menu,
html[data-theme="terminal"] .pc-sugg,
html[data-theme="terminal"] .pd-box,
html[data-theme="terminal"] .bank-chip,
html[data-theme="terminal"] .mode-btn,
html[data-theme="terminal"] #view-fund .fd-sum,
html[data-theme="terminal"] #pd-overview .cell,
html[data-theme="terminal"] #toast,
html[data-theme="terminal"] .pick .p-ic{ background:var(--panel); }

html[data-theme="dark-purple"] .cat-filter .input,
html[data-theme="dark-purple"] .cat-filter input,
html[data-theme="dark-purple"] .cat-filter select,
html[data-theme="dark-purple"] .pc-add input,
html[data-theme="dark-purple"] .ps-filter select,
html[data-theme="dark-purple"] .pd-range-custom input[type="date"],
html[data-theme="dark-purple"] .pd-range .rbtn,
html[data-theme="terminal"] .cat-filter .input,
html[data-theme="terminal"] .cat-filter input,
html[data-theme="terminal"] .cat-filter select,
html[data-theme="terminal"] .pc-add input,
html[data-theme="terminal"] .ps-filter select,
html[data-theme="terminal"] .pd-range-custom input[type="date"],
html[data-theme="terminal"] .pd-range .rbtn{ background:var(--panel); border-color:var(--line); color:var(--text); }

/* 弹层与移动端白卡 */
html[data-theme="dark-purple"] [style*="min(380px"],
html[data-theme="terminal"] [style*="min(380px"]{ background:var(--panel) !important; }
html[data-theme="dark-purple"] .mb-sheet,
html[data-theme="dark-purple"] .mb-card,
html[data-theme="terminal"] .mb-sheet,
html[data-theme="terminal"] .mb-card{ background:var(--panel); }

/* 软底徽章/图标/提示 → 半透明同色系 */
html[data-theme="dark-purple"] .badge.buy,
html[data-theme="dark-purple"] .tx-ic.buy,
html[data-theme="dark-purple"] .jsbd-ok,
html[data-theme="dark-purple"] .gn-pos-3,
html[data-theme="dark-purple"] .gn-pos-4,
html[data-theme="terminal"] .badge.buy,
html[data-theme="terminal"] .tx-ic.buy,
html[data-theme="terminal"] .jsbd-ok,
html[data-theme="terminal"] .gn-pos-3,
html[data-theme="terminal"] .gn-pos-4{ background:var(--t-greensoft); }
html[data-theme="dark-purple"] .badge.sell,
html[data-theme="dark-purple"] .tx-ic.sell,
html[data-theme="dark-purple"] .jsbd-bad,
html[data-theme="dark-purple"] .gn-neg-3,
html[data-theme="dark-purple"] .gn-neg-4,
html[data-theme="terminal"] .badge.sell,
html[data-theme="terminal"] .tx-ic.sell,
html[data-theme="terminal"] .jsbd-bad,
html[data-theme="terminal"] .gn-neg-3,
html[data-theme="terminal"] .gn-neg-4{ background:var(--t-redsoft); }
html[data-theme="dark-purple"] .badge.pending,
html[data-theme="dark-purple"] .badge.risk,
html[data-theme="dark-purple"] .seg-btn.active,
html[data-theme="dark-purple"] #view-fund .fp-badge.on,
html[data-theme="dark-purple"] #view-fund .fp-btn,
html[data-theme="dark-purple"] .jsbd-run,
html[data-theme="dark-purple"] .jschip-on,
html[data-theme="dark-purple"] .notice-badge,
html[data-theme="dark-purple"] .notice-support-tag,
html[data-theme="dark-purple"] .mb-plan .tag,
html[data-theme="dark-purple"] .notice-feat-ic,
html[data-theme="dark-purple"] .notice-sup-ic,
html[data-theme="dark-purple"] .bank-chip .bci,
html[data-theme="dark-purple"] .fe-thumb-del,
html[data-theme="terminal"] .badge.pending,
html[data-theme="terminal"] .badge.risk,
html[data-theme="terminal"] .seg-btn.active,
html[data-theme="terminal"] #view-fund .fp-badge.on,
html[data-theme="terminal"] #view-fund .fp-btn,
html[data-theme="terminal"] .jsbd-run,
html[data-theme="terminal"] .jschip-on,
html[data-theme="terminal"] .notice-badge,
html[data-theme="terminal"] .notice-support-tag,
html[data-theme="terminal"] .mb-plan .tag,
html[data-theme="terminal"] .notice-feat-ic,
html[data-theme="terminal"] .notice-sup-ic,
html[data-theme="terminal"] .bank-chip .bci,
html[data-theme="terminal"] .fe-thumb-del{ background:var(--t-soft); }
html[data-theme="dark-purple"] .jserr,
html[data-theme="dark-purple"] .jsbd-ner,
html[data-theme="terminal"] .jserr,
html[data-theme="terminal"] .jsbd-ner{ background:var(--t-redsoft); }

/* 滚动条 */
html[data-theme="dark-purple"] ::-webkit-scrollbar-thumb,
html[data-theme="terminal"] ::-webkit-scrollbar-thumb{ background:#3a3d44; }

/* ---------- 深色主题：图表浅色衬底 ---------- */
html[data-theme="dark-purple"] .chart,
html[data-theme="dark-purple"] .cat-chart,
html[data-theme="terminal"] .chart,
html[data-theme="terminal"] .cat-chart{ background:#ffffff; border-radius:var(--radius-sm); padding:8px; }

/* ---------- terminal 终端单色：等宽 + 描边按钮 ---------- */
html[data-theme="terminal"] .card-value,
html[data-theme="terminal"] .tbl td,
html[data-theme="terminal"] .tbl th,
html[data-theme="terminal"] .card-label,
html[data-theme="terminal"] .page-head h2{ font-family:ui-monospace,Menlo,"Cascadia Mono","Courier New",monospace; }
html[data-theme="terminal"] .page-head h2{ text-transform:uppercase; letter-spacing:2px; font-size:20px; }
html[data-theme="terminal"] .btn.primary{ background:var(--primary); color:#0b0b0b; }
html[data-theme="terminal"] .btn.primary:hover{ background:var(--primary-hover); }
html[data-theme="terminal"] .btn:not(.primary){ background:transparent; border:1px solid var(--line); color:var(--text); }
html[data-theme="terminal"] .card{ border:1px solid var(--line); }
html[data-theme="terminal"] .pill,
html[data-theme="terminal"] .badge{ font-family:ui-monospace,Menlo,monospace; }

/* ---------- nike-mono 黑白大写：字重与几何感 ---------- */
html[data-theme="nike-mono"] .page-head h2,
html[data-theme="nike-mono"] .panel h3{ text-transform:uppercase; letter-spacing:2px; }
html[data-theme="nike-mono"] .card-value{ font-family:"Arial Black","AvenirNext-Heavy","PingFang SC",sans-serif; letter-spacing:0; }
html[data-theme="nike-mono"] .btn{ border-radius:2px; font-weight:600; }
html[data-theme="nike-mono"] .nav-item.active{ background:#efefef; }
html[data-theme="nike-mono"] .seg-btn.active{ background:#efefef; }
html[data-theme="nike-mono"] .tbl th{ background:#fafafa; }
html[data-theme="nike-mono"] .card{ box-shadow:none; }
html[data-theme="nike-mono"] .btn.primary:hover{ background:#333333; }

/* ---------- 换肤按钮（theme.js 注入，样式随主题走） ---------- */
#theme-switch-btn{ position:fixed; right:18px; bottom:18px; z-index:9990;
  width:44px; height:44px; border-radius:50%; border:1px solid var(--line,#e5e5ea);
  background:var(--panel,#fff); color:var(--text,#1c1c1e); cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 2px 10px rgba(0,0,0,.15); }
#theme-switch-btn:hover{ border-color:var(--primary,#0066cc); }
#theme-switch-menu{ position:fixed; right:18px; bottom:70px; z-index:9991;
  background:var(--panel,#fff); border:1px solid var(--line,#e5e5ea); border-radius:12px;
  padding:6px; min-width:150px; box-shadow:0 8px 30px rgba(0,0,0,.2); display:none; }
#theme-switch-menu.open{ display:block; }
#theme-switch-menu button{ display:flex; width:100%; align-items:center; gap:8px;
  border:0; background:none; text-align:left; padding:9px 12px; border-radius:8px;
  font-size:13px; color:var(--text,#1c1c1e); cursor:pointer; font-family:inherit; }
#theme-switch-menu button:hover{ background:var(--primary-soft,#eaf2ff); }
#theme-switch-menu button.on::before{ content:"●"; font-size:9px; color:var(--primary,#0066cc); }
#theme-switch-menu button:not(.on)::before{ content:"○"; font-size:9px; color:var(--muted,#8e8e93); }
