/* ==========================================================================
   ovO 元器件库存助手 · 主题层（深色令牌 + 品牌点缀 + 主题细节）
   布局结构与组件样式全部在 assets/styles.css（基础层）。
   本层只做令牌覆盖与主题相关细节，不改变任何布局与功能锚点。
   ========================================================================== */

/* ---------- 深色主题令牌 ---------- */
html[data-theme="dark"] {
  color-scheme: dark;
  --primary: #8d7fff;
  --primary-strong: #a79cff;
  --primary-soft: #292450;
  --primary-softer: #1e1b3a;
  --cyan: #4fc0cb;
  --cyan-soft: #123238;
  --green: #5cc78c;
  --green-soft: #123526;
  --amber: #e6b356;
  --amber-soft: #3a2d14;
  --red: #ff8276;
  --red-soft: #462320;
  --ink: #e9edf6;
  --muted: #a2adc0;
  --faint: #7b8598;
  --line: #283042;
  --line-strong: #39445c;
  --bg: #0c0f17;
  --bg-soft: #131826;
  --panel: #141927;
  --panel-soft: #181e2e;
  --hover: #1b2133;
  --side-bg: #0f0b1a;
  --side-bg-2: #090714;
  --side-text: #9aa3ba;
  --shadow: 0 1px 2px rgba(0, 0, 0, .35), 0 10px 26px rgba(0, 0, 0, .3);
  --shadow-lg: 0 26px 68px rgba(0, 0, 0, .55);
  --focus: 0 0 0 3px rgba(141, 127, 255, .3);
}

/* 未显式选择主题时跟随系统（theme.js 会先解析并写入 data-theme） */
@media (prefers-color-scheme: dark) {
  html:not([data-theme]) {
    color-scheme: dark;
    --primary: #8d7fff;
    --primary-strong: #a79cff;
    --primary-soft: #292450;
    --primary-softer: #1e1b3a;
    --cyan: #4fc0cb;
    --cyan-soft: #123238;
    --green: #5cc78c;
    --green-soft: #123526;
    --amber: #e6b356;
    --amber-soft: #3a2d14;
    --red: #ff8276;
    --red-soft: #462320;
    --ink: #e9edf6;
    --muted: #a2adc0;
    --faint: #7b8598;
    --line: #283042;
    --line-strong: #39445c;
    --bg: #0c0f17;
    --bg-soft: #131826;
    --panel: #141927;
    --panel-soft: #181e2e;
    --hover: #1b2133;
    --side-bg: #0f0b1a;
    --side-bg-2: #090714;
    --side-text: #9aa3ba;
    --shadow: 0 1px 2px rgba(0, 0, 0, .35), 0 10px 26px rgba(0, 0, 0, .3);
    --shadow-lg: 0 26px 68px rgba(0, 0, 0, .55);
    --focus: 0 0 0 3px rgba(141, 127, 255, .3);
  }
}

/* ---------- 统一侧栏：和 Portal / Files / QQBot 使用完全相同的令牌 ---------- */
html[data-theme="dark"] .sidebar {
  --sb-bg: #141725;
  --sb-surface: #1f2333;
  --sb-inset: #11141f;
  --sb-text: #eceef7;
  --sb-muted: #a4aabe;
  --sb-faint: #767d93;
  --sb-line: #272c3f;
  --sb-line-strong: #3b4159;
  --sb-primary: #8f83f8;
  --sb-primary-soft: #262049;
  --sb-success: #57c28b;
  background: var(--sb-bg);
}

/* 深色下品牌文字微调 */
html[data-theme="dark"] .brand-wordmark i { color: #4fc0cb; }

/* 主行动点在深色下的可读性 */
html[data-theme="dark"] .button.primary { color: #16121f; background: var(--primary); }
html[data-theme="dark"] .button.primary:hover { background: var(--primary-strong); }
html[data-theme="dark"] .button.ai { color: #fff; background: #6b4de0; }
html[data-theme="dark"] .button.ai:hover { background: #7c5ff0; }
html[data-theme="dark"] .nav-item.active { color: var(--sb-primary); }
html[data-theme="dark"] .nav-item.active .nav-icon { opacity: 1; }
html[data-theme="dark"] .assistant-message.user { background: var(--primary); color: #16121f; }
html[data-theme="dark"] .bom-rules article > span { color: #16121f; }

/* ---------- 表格与滚动条（与主题一致，桌面生效） ---------- */
.table-wrap::-webkit-scrollbar, .assistant-messages::-webkit-scrollbar, .modal-body::-webkit-scrollbar { width: 10px; height: 10px; }
nav#main-nav::-webkit-scrollbar { width: 6px; }
.table-wrap::-webkit-scrollbar-thumb, .assistant-messages::-webkit-scrollbar-thumb, .modal-body::-webkit-scrollbar-thumb { background: var(--line-strong); border-radius: 8px; border: 2px solid var(--panel); }
.table-wrap::-webkit-scrollbar-thumb:hover, .assistant-messages::-webkit-scrollbar-thumb:hover, .modal-body::-webkit-scrollbar-thumb:hover { background: var(--faint); }
nav#main-nav::-webkit-scrollbar-thumb { background: var(--sb-line-strong); border: 2px solid var(--sb-bg); border-radius: 999px; }
.table-wrap::-webkit-scrollbar-corner { background: transparent; }

/* ---------- 深色主题微调（令牌之外的少量覆盖） ---------- */
html[data-theme="dark"] .modal-backdrop,
html[data-theme="dark"] .startup-sync-overlay,
html[data-theme="dark"] .auth-login-overlay { background: rgba(2, 4, 10, .66); }
html[data-theme="dark"] body.lcsc-preview-open::before { background: rgba(2, 4, 10, .66); }
html[data-theme="dark"] .drawer-scrim { background: rgba(2, 4, 10, .62); }
html[data-theme="dark"] .toast { box-shadow: var(--shadow-lg); }
html[data-theme="dark"] .selector-requirement.soft { color: #b39df0; border-color: #4a3f7a; }