/* css/dark-fix.css — 万圣黑 / 墨琉璃 专用：把各处写死的深色文字统一改成白色系
   说明：本文件由 .workbuddy/_p21_gencss.py 生成，最后加载，只在
   body.theme-dark（万圣黑）/ body.theme-darkglass（墨琉璃）下生效。
   浅色主题完全不受影响。 */

/* ── 1. 设置面板：面板本身是暗底，标题/标签/按钮却写死成 #222/#333/#444，全部转白 ── */
body.theme-dark .settings-panel,
body.theme-darkglass .settings-panel { color: var(--text)!important; }
body.theme-dark .settings-panel h3,
body.theme-darkglass .settings-panel h3 { color: #fff!important; }
body.theme-dark .settings-group,
body.theme-dark .settings-group label,
body.theme-darkglass .settings-group,
body.theme-darkglass .settings-group label { color: var(--text)!important; }
body.theme-dark .settings-group .option-btn:not(.active),
body.theme-darkglass .settings-group .option-btn:not(.active) { color: var(--text)!important; background: var(--hover-bg)!important; }
body.theme-dark .settings-panel .theme-dot,
body.theme-darkglass .settings-panel .theme-dot { box-shadow: 0 0 0 1px rgba(255,255,255,0.35); }

/* ── 2. 词典操作按钮：原来白底 + 深色字，改成暗底白字 ── */
body.theme-dark .wd-action-btn,
body.theme-darkglass .wd-action-btn {
  color: var(--text)!important;
  background: var(--card)!important;
  border-color: var(--border)!important;
}

/* ── 3. 灰色说明文字（#888/#999 系）在暗底上偏暗，提亮一档 ── */
body.theme-dark .nav-item,
body.theme-darkglass .nav-item { color: #b9b9b9!important; }
body.theme-dark .stat-label,
body.theme-dark .fc-hint,
body.theme-dark .lobby-sub-card-desc,
body.theme-darkglass .stat-label,
body.theme-darkglass .fc-hint,
body.theme-darkglass .lobby-sub-card-desc { color: #b9b9b9!important; }
body.theme-dark input::placeholder,
body.theme-dark textarea::placeholder,
body.theme-darkglass input::placeholder,
body.theme-darkglass textarea::placeholder { color: #9c9c9c!important; }

/* ── 4. 表单控件：只提亮占位符，不动输入框底色 ──
   （输入框本身在暗色下已经是暗底浅字；强行统一底色反而会误伤少数本就是白底深字的输入框） */

/* ── 5. 实心主色底 + 白字 → 主色半透明底 + 主色文字 ──
   暗色主题的主色本身很亮（万圣黑是金 #FFB800），白字压上去对比只有 1.2~1.8:1，
   糊成一团。改成「主色 16% 底 + 主色文字」后对比升到 6:1 以上，也更像暗色主题该有的样子。
   color-mix 前面的 background 是给不支持 color-mix 的浏览器兜底。 */
body.theme-dark .sg-chip.on,
body.theme-darkglass .sg-chip.on,
body.theme-dark .study-sub-tab.active,
body.theme-darkglass .study-sub-tab.active,
body.theme-dark .browse-subchip.active,
body.theme-darkglass .browse-subchip.active,
body.theme-dark #browse-unit-bar .browse-subchip.active,
body.theme-darkglass #browse-unit-bar .browse-subchip.active,
body.theme-dark .wrong-sub-btn.active,
body.theme-darkglass .wrong-sub-btn.active,
body.theme-dark #tool-nav .browse-cat.active,
body.theme-darkglass #tool-nav .browse-cat.active,
body.theme-dark .gd-btn,
body.theme-darkglass .gd-btn,
body.theme-dark .quiz-action-btn,
body.theme-darkglass .quiz-action-btn,
body.theme-dark #sec-quiz .quiz-start-btn,
body.theme-darkglass #sec-quiz .quiz-start-btn,
body.theme-dark #lobby-content button,
body.theme-darkglass #lobby-content button,
body.theme-dark .rd-typechip.on,
body.theme-darkglass .rd-typechip.on,
body.theme-dark .filter-chip.active,
body.theme-darkglass .filter-chip.active,
body.theme-dark .quiz-diff-chip.active,
body.theme-darkglass .quiz-diff-chip.active,
body.theme-dark .quiz-count-chip.active,
body.theme-darkglass .quiz-count-chip.active,
body.theme-dark .fc-btn.know,
body.theme-darkglass .fc-btn.know,
body.theme-dark .qn-dc-item.is-today .qn-dc-badge,
body.theme-darkglass .qn-dc-item.is-today .qn-dc-badge {
  color: var(--green)!important;
  background: var(--card)!important;
  background: color-mix(in srgb, var(--green) 16%, transparent)!important;
  border-color: color-mix(in srgb, var(--green) 40%, transparent)!important;
}
/* 用次要主色的那几类 */
body.theme-dark .gd-btn.blue,
body.theme-darkglass .gd-btn.blue,
body.theme-dark .fc-btn.audio-fc,
body.theme-darkglass .fc-btn.audio-fc {
  color: var(--blue)!important;
  background: var(--card)!important;
  background: color-mix(in srgb, var(--blue) 16%, transparent)!important;
  border-color: color-mix(in srgb, var(--blue) 40%, transparent)!important;
}
body.theme-dark .fc-btn.review,
body.theme-darkglass .fc-btn.review,
body.theme-dark #fc-fav-btn,
body.theme-darkglass #fc-fav-btn,
body.theme-dark .immersive-toolbar .fc-btn:not(.audio-fc),
body.theme-darkglass .immersive-toolbar .fc-btn:not(.audio-fc),
body.theme-dark .rd-nextup-tag,
body.theme-darkglass .rd-nextup-tag {
  color: var(--orange)!important;
  background: var(--card)!important;
  background: color-mix(in srgb, var(--orange) 16%, transparent)!important;
  border-color: color-mix(in srgb, var(--orange) 40%, transparent)!important;
}
/* 阅读的等级 chip / 难度徽章 / 专题 chip：色相跟着各自的 --rdc 走 */
body.theme-dark .rd-levelchip.on,
body.theme-darkglass .rd-levelchip.on,
body.theme-dark .rd-typechip.rd-tp-ext.on,
body.theme-darkglass .rd-typechip.rd-tp-ext.on,
body.theme-dark .rd-typechip.rd-rg-ext.on,
body.theme-darkglass .rd-typechip.rd-rg-ext.on,
body.theme-dark .rd-badge,
body.theme-darkglass .rd-badge {
  color: var(--rdc, var(--green))!important;
  background: var(--card)!important;
  background: color-mix(in srgb, var(--rdc, var(--green)) 18%, transparent)!important;
  border-color: color-mix(in srgb, var(--rdc, var(--green)) 42%, transparent)!important;
}

/* 阅读的合订书封面（R35 新增）：浅色主题下是「主色渐变 + 白字」，
   暗色主题的主色变成亮黄/亮绿后，白字对比度掉到 1.4:1（s58 报出来的那两颗）。
   改成 tonal 写法：淡主色底 + 主色字，两个暗色主题都 ≥ 4.5:1。 */
body.theme-dark .rd-book-cover,
body.theme-darkglass .rd-book-cover {
  background: var(--card)!important;
  background: color-mix(in srgb, var(--green) 18%, transparent)!important;
  color: var(--green)!important;
  box-shadow: none!important;
}

/* ── 6. 以下为浅色主题里写死的深色文字，在暗色主题下逐一转白（自动生成） ── */

/* ── 7. R39：万圣黑 / 墨琉璃「错版」修正 ──
   这一组都是「浅色主题里写死的白底 / 亮底，暗色下没跟着翻」
   以及「实心主色底 + 白字」在暗色主色变亮后反差崩掉的情况。 */

/* 7.1 进度条轨道：首页「今日任务」「正在学习」两条进度条的轨道是
   sidebar.js 里写死的 #ECECEC，暗色下留下一条浅灰亮条。
   改用 --qn-track：浅色主题走 JS 里的兜底 #ECECEC（观感不变），暗色跟随 --hover-bg。 */
body.theme-dark, body.theme-darkglass { --qn-track: var(--hover-bg); }

/* 7.2 单词详情页顶栏：#pd-page（我的资料）早就有暗色覆盖，
   #wd-page（单词详情）漏了，白底 + 浅字整条浮在暗色页面上。
   照 #pd-page 的写法补齐，保证两个页头在暗色下长得一模一样。 */
body.theme-dark #wd-page .wd-header,
body.theme-darkglass #wd-page .wd-header {
  background: rgba(30,32,34,0.96)!important;
  border-bottom-color: rgba(255,255,255,0.08)!important;
}
body.theme-dark #wd-page .wd-back,
body.theme-darkglass #wd-page .wd-back {
  background: var(--card)!important;
  border-color: var(--border)!important;
  color: var(--text)!important;
}

/* 7.3 来源标签（柯林斯）/ 词性标签：浅色主题是「实心主色底 + 白字」，
   万圣黑的 --blue 是淡金 #FFD54F，白字压上去只有 1.1:1。改成 tonal（淡底 + 主色字）。 */
body.theme-dark .wd-src-tag,
body.theme-darkglass .wd-src-tag {
  background: var(--card)!important;
  background: color-mix(in srgb, var(--blue) 18%, transparent)!important;
  color: var(--blue)!important;
}
body.theme-dark .wd-src-tag.alt,
body.theme-darkglass .wd-src-tag.alt {
  background: var(--card)!important;
  background: color-mix(in srgb, var(--purple) 20%, transparent)!important;
  color: var(--purple)!important;
}
body.theme-dark .wd-col-pos,
body.theme-darkglass .wd-col-pos {
  background: var(--card)!important;
  background: color-mix(in srgb, var(--purple) 18%, transparent)!important;
  color: var(--purple)!important;
}

/* 7.4 小测「复习提醒」横幅：R45 起已改成（卡片底 + 主色左条 + 令牌字色），暗色靠令牌自动生效，这里不再需要覆盖。 */

/* 7.5 笔记「保存」/ 我的资料「保存」按钮：又是「实心主色底 + 白字」，tonal 化。 */
body.theme-dark .nt-btn.primary,
body.theme-darkglass .nt-btn.primary {
  background: var(--card)!important;
  background: color-mix(in srgb, var(--green) 18%, transparent)!important;
  border-color: color-mix(in srgb, var(--green) 40%, transparent)!important;
  color: var(--green)!important;
}
body.theme-dark .nt-btn.primary:hover,
body.theme-darkglass .nt-btn.primary:hover { filter: brightness(1.15); }
body.theme-dark .profile-save-btn,
body.theme-darkglass .profile-save-btn {
  background: var(--card)!important;
  background: color-mix(in srgb, var(--green) 18%, transparent)!important;
  color: var(--green)!important;
}

/* 7.6 背景橘色光晕（R52 用户要求「万圣黑主题取消光晕」）：
   这里原来把 base.css 的 0.05/0.035/0.02 收到 0.028/0.019/0.011；
   但 dark-fix.css 最后加载、且带 !important —— base.css 里那条
   body.theme-dark::before{background:none!important} 压不过它，页面四周仍有一圈脏黄。
   改为整段不输出，把 ::before 完全交回 base.css（纯黑背景，不留光晕）。 */
body.theme-dark .lobby-mode-title,
body.theme-darkglass .lobby-mode-title { color: var(--text)!important; }
body.theme-dark .so-complete-title,
body.theme-darkglass .so-complete-title { color: var(--text)!important; }
body.theme-dark .lobby-welcome.period-dawn,
body.theme-darkglass .lobby-welcome.period-dawn { color: var(--text)!important; }
body.theme-dark .lobby-welcome.period-am,
body.theme-darkglass .lobby-welcome.period-am { color: var(--text)!important; }
body.theme-dark .lobby-welcome.period-noon,
body.theme-darkglass .lobby-welcome.period-noon { color: var(--text)!important; }
body.theme-dark .lobby-card .lc-title,
body.theme-darkglass .lobby-card .lc-title { color: var(--text)!important; }
body.theme-dark .tn-hero-badge,
body.theme-darkglass .tn-hero-badge { color: var(--text)!important; }
body.theme-dark .tn-phase-tag.finished,
body.theme-darkglass .tn-phase-tag.finished { color: var(--text)!important; }
body.theme-dark .lp-brand-name,
body.theme-darkglass .lp-brand-name { color: var(--text)!important; }
body.theme-dark .lp-title,
body.theme-darkglass .lp-title { color: var(--text)!important; }
body.theme-dark .lp-feature-item,
body.theme-darkglass .lp-feature-item { color: var(--text)!important; }
body.theme-dark .lp-auth-title,
body.theme-darkglass .lp-auth-title { color: var(--text)!important; }
body.theme-dark .lp-auth-sub,
body.theme-darkglass .lp-auth-sub { color: var(--text-light)!important; }
body.theme-dark .lp-tab,
body.theme-darkglass .lp-tab { color: var(--text-light)!important; }
body.theme-dark .lp-tab.active,
body.theme-darkglass .lp-tab.active { color: var(--text)!important; }
body.theme-dark .lp-field label,
body.theme-darkglass .lp-field label { color: var(--text)!important; }
body.theme-dark .lp-skip,
body.theme-darkglass .lp-skip { color: var(--text-light)!important; }
body.theme-dark .so-back,
body.theme-darkglass .so-back { color: var(--text)!important; }
body.theme-dark .so-counter,
body.theme-darkglass .so-counter { color: var(--text)!important; }
body.theme-dark .so-word,
body.theme-darkglass .so-word { color: var(--text)!important; }
body.theme-dark .so-pos-item .so-pos-meaning,
body.theme-darkglass .so-pos-item .so-pos-meaning { color: var(--text)!important; }
body.theme-dark .so-meaning,
body.theme-darkglass .so-meaning { color: var(--text)!important; }
body.theme-dark .so-phrase,
body.theme-darkglass .so-phrase { color: var(--text)!important; }
body.theme-dark .so-phrase-en,
body.theme-darkglass .so-phrase-en { color: var(--text)!important; }
body.theme-dark .so-phrase-cn,
body.theme-darkglass .so-phrase-cn { color: var(--text-light)!important; }
body.theme-dark .so-sentence,
body.theme-darkglass .so-sentence { color: var(--text-light)!important; }
body.theme-dark .so-sentence-cn,
body.theme-darkglass .so-sentence-cn { color: var(--text-light)!important; }
body.theme-dark .so-btn-skip,
body.theme-darkglass .so-btn-skip { color: var(--text-light)!important; }
body.theme-dark .so-complete-sub,
body.theme-darkglass .so-complete-sub { color: var(--text-light)!important; }
body.theme-dark .so-complete-btn.secondary,
body.theme-darkglass .so-complete-btn.secondary { color: var(--text)!important; }
body.theme-dark .dp-q-title,
body.theme-darkglass .dp-q-title { color: var(--text)!important; }
body.theme-dark .dp-q-subtitle,
body.theme-darkglass .dp-q-subtitle { color: var(--text-light)!important; }
body.theme-dark .dp-q-option,
body.theme-darkglass .dp-q-option { color: var(--text)!important; }
body.theme-dark .dp-q-option.selected,
body.theme-darkglass .dp-q-option.selected { color: var(--text)!important; }
body.theme-dark .dp-q-summary-label,
body.theme-darkglass .dp-q-summary-label { color: var(--text-light)!important; }
body.theme-dark .dp-q-summary-value,
body.theme-darkglass .dp-q-summary-value { color: var(--text)!important; }
body.theme-dark .dp-card-title,
body.theme-darkglass .dp-card-title { color: var(--text)!important; }
body.theme-dark .dp-card-btn-cal,
body.theme-darkglass .dp-card-btn-cal { color: var(--text)!important; }
body.theme-dark .tr-counter,
body.theme-darkglass .tr-counter { color: var(--text)!important; }
body.theme-dark .tr-hint,
body.theme-darkglass .tr-hint { color: var(--text)!important; }
body.theme-dark .tr-option,
body.theme-darkglass .tr-option { color: var(--text)!important; }
body.theme-dark .tr-complete-sub,
body.theme-darkglass .tr-complete-sub { color: var(--text-light)!important; }
body.theme-dark .wd-decomp-explain,
body.theme-darkglass .wd-decomp-explain { color: var(--text)!important; }
body.theme-dark .so-quiz-word,
body.theme-darkglass .so-quiz-word { color: var(--text)!important; }
body.theme-dark .so-quiz-meaning,
body.theme-darkglass .so-quiz-meaning { color: var(--text)!important; }
body.theme-dark .so-quiz-opt,
body.theme-darkglass .so-quiz-opt { color: var(--text)!important; }
