/* ============================================================================
 * theme-fix.css -- 浅色主题适配修复
 * ----------------------------------------------------------------------------
 * 问题：切换浅色主题后，有场景背景图+深色渐变遮罩的页面（九秘境、答题、
 *       结算、PK、商店、排行、弟子档等）文字变成深色，与深色遮罩叠加后不可读。
 *
 * 方案：这些页面始终有深色场景背景（fixed bg image + dark gradient overlay），
 *       文字必须始终为浅色。通过在 body.view-level / body.view-subpage 上
 *       覆盖 CSS 变量为暗模式值，让所有 var(--text-1) 等引用自动获得浅色值。
 *       无需逐个修改各页面的 CSS 规则。
 * ========================================================================== */

/* ---- 场景背景页面变量覆盖（显式浅色主题） ---- */
[data-theme="light"] body.view-level,
[data-theme="light"] body.view-subpage {
  --text-1:      #E6EDEB;
  --text-2:      #9DAAA9;
  --text-3:      #6A7877;
  --border:      rgba(255, 255, 255, .10);
  --hairline:    rgba(255, 255, 255, .16);
  --surface:     rgba(18, 27, 29, 0.72);
  --surface-1:   rgba(18, 27, 29, 0.5);
  --surface-2:   rgba(27, 40, 43, 0.6);
  --bg-card:     rgba(20, 32, 42, 0.6);
  --accent-text: #D8F24E;
  --ok-text:     #4FB39B;
  --ok-tint:     rgba(79, 179, 155, .14);
  --ornament:    #E0B75C;
  --ornament-plain: #E0B75C;
}

/* ---- 场景背景页面变量覆盖（系统浅色，未设 data-theme） ---- */
@media (prefers-color-scheme: light) {
  html:not([data-theme]) body.view-level,
  html:not([data-theme]) body.view-subpage {
    --text-1:      #E6EDEB;
    --text-2:      #9DAAA9;
    --text-3:      #6A7877;
    --border:      rgba(255, 255, 255, .10);
    --hairline:    rgba(255, 255, 255, .16);
    --surface:     rgba(18, 27, 29, 0.72);
    --surface-1:   rgba(18, 27, 29, 0.5);
    --surface-2:   rgba(27, 40, 43, 0.6);
    --bg-card:     rgba(20, 32, 42, 0.6);
    --accent-text: #D8F24E;
    --ok-text:     #4FB39B;
    --ok-tint:     rgba(79, 179, 155, .14);
    --ornament:    #E0B75C;
    --ornament-plain: #E0B75C;
  }
}

/* ---- 机缘弹窗：始终深色底，文字始终浅色 ---- */
[data-theme="light"] .fortune-overlay {
  --text-1: #E6EDEB;
  --text-2: #9DAAA9;
  --text-3: #6A7877;
}
@media (prefers-color-scheme: light) {
  html:not([data-theme]) .fortune-overlay {
    --text-1: #E6EDEB;
    --text-2: #9DAAA9;
    --text-3: #6A7877;
  }
}

/* ---- v4-upgrade.css 玻璃态修复：浅色主题下场景页的半透明白底改为半透明深底 ---- */
[data-theme="light"] body.view-level .settle-nums,
[data-theme="light"] body.view-level .settle-spirit,
[data-theme="light"] body.view-level .loot,
[data-theme="light"] body.view-level .ascend {
  background: rgba(18, 27, 29, 0.5);
  border-color: rgba(255, 255, 255, 0.1);
}
@media (prefers-color-scheme: light) {
  html:not([data-theme]) body.view-level .settle-nums,
  html:not([data-theme]) body.view-level .settle-spirit,
  html:not([data-theme]) body.view-level .loot,
  html:not([data-theme]) body.view-level .ascend {
    background: rgba(18, 27, 29, 0.5);
    border-color: rgba(255, 255, 255, 0.1);
  }
}

/* ---- 导航栏浅色修复：底部导航和侧边栏在浅色主题下使用正确变量（已由 tokens 处理） ---- */

/* ---- onboarding 遮罩修复：浅色主题下半透明黑色遮罩仍然合适，弹窗用 var(--surface) 已自适应 ---- */
