/* ===================================================
   冒险岛监控系统 - 全页面独立日间浅色主题完整合集
   (包含：导航栏、监控屏、日志提醒、手机教程、经验大屏与框选弹窗)
   =================================================== */

[data-theme="light"] {
  --bg: #f6f8fa;
  --card: #ffffff;
  --border: #d0d7de;
  --border-muted: #e8ecf0;
  --text: #1f2328;
  --text-muted: #57606a;
  --text-disabled: #8c959f;

  /* 日间指标彩色体系 */
  --c-cyan: #0284c7;    /* 在线时长 / 经验百分比 / 掉线检测 */
  --c-green: #1a7f37;   /* 净增总量 / 帧率 / 目标达成 / 安卓步骤 */
  --c-blue: #0969da;    /* 预估时速 / 目标状态 / 苹果步骤 */
  --c-gold: #b08800;    /* 近 10 分钟净增 */
  --c-coral: #cf222e;   /* 预估升级时间 / 报警触发次数 */
}

[data-theme="light"] body {
  background: var(--bg) !important;
  color: var(--text) !important;
}

/* ===================================================
   1. 顶部导航与品牌栏
   =================================================== */
[data-theme="light"] .navbar {
  background: rgba(255, 255, 255, 0.98) !important;
  border-bottom-color: var(--border) !important;
  box-shadow: 0 1px 3px rgba(31, 35, 40, 0.08);
}

[data-theme="light"] .nav-brand {
  color: var(--text) !important;
}

[data-theme="light"] .nav-tab-btn {
  color: var(--text-muted) !important;
}

[data-theme="light"] .nav-tab-btn:hover {
  color: var(--text) !important;
  background: rgba(0, 0, 0, 0.05) !important;
}

[data-theme="light"] .nav-tab-btn.active {
  color: var(--c-blue) !important;
  background: rgba(9, 105, 218, 0.08) !important;
  border-color: rgba(9, 105, 218, 0.25) !important;
}

/* ===================================================
   2. 主卡片容器与普通标题
   =================================================== */
[data-theme="light"] .card {
  background: var(--card) !important;
  border-color: var(--border) !important;
  box-shadow: 0 1px 3px rgba(31, 35, 40, 0.05);
}

[data-theme="light"] h2,
[data-theme="light"] h3,
[data-theme="light"] label,
[data-theme="light"] strong {
  color: var(--text) !important;
}

/* 页面卡片普通白字转深黑（排除屏幕占位框内文字与所有按钮） */
[data-theme="light"] .card *[style*="color: #fff"]:not(.screen-placeholder *):not([class*="btn"]):not([class*="step-num"]):not(button *),
[data-theme="light"] .card *[style*="color:#fff"]:not(.screen-placeholder *):not([class*="btn"]):not([class*="step-num"]):not(button *),
[data-theme="light"] .card *[style*="color: #ffffff"]:not(.screen-placeholder *):not([class*="btn"]):not([class*="step-num"]):not(button *),
[data-theme="light"] .card *[style*="color:#ffffff"]:not(.screen-placeholder *):not([class*="btn"]):not([class*="step-num"]):not(button *),
[data-theme="light"] .card *[style*="color: #e6edf3"]:not(.screen-placeholder *):not(button *),
[data-theme="light"] .card *[style*="color:#e6edf3"]:not(.screen-placeholder *):not(button *),
[data-theme="light"] .card *[style*="color: #c9d1d9"]:not(.screen-placeholder *):not(button *),
[data-theme="light"] .card *[style*="color:#c9d1d9"]:not(.screen-placeholder *):not(button *) {
  color: var(--text) !important;
}

/* 普通灰色小字加深 */
[data-theme="light"] .card *[style*="color: #8b949e"]:not(.screen-placeholder *):not(button *),
[data-theme="light"] .card *[style*="color:#8b949e"]:not(.screen-placeholder *):not(button *),
[data-theme="light"] .step-text,
[data-theme="light"] .stat-desc,
[data-theme="light"] .exp-label {
  color: var(--text-muted) !important;
}

/* ===================================================
   3. 【核心保真】第一屏屏幕占位区 (.screen-placeholder)
   =================================================== */
[data-theme="light"] .video-container,
[data-theme="light"] .screen-placeholder {
  background: #090d13 !important;
}

[data-theme="light"] .screen-placeholder .placeholder-title,
[data-theme="light"] .screen-placeholder .placeholder-note {
  color: #8b949e !important;
}

[data-theme="light"] .screen-placeholder .placeholder-footer {
  color: #484f58 !important;
}

[data-theme="light"] .screen-placeholder .placeholder-sub {
  color: #c9d1d9 !important;
}

[data-theme="light"] .screen-placeholder .badge-rec {
  background: rgba(35, 134, 54, 0.15) !important;
  border: 1px solid rgba(63, 185, 80, 0.3) !important;
  color: #3fb950 !important;
}

[data-theme="light"] .screen-placeholder .monitor-icon {
  background: rgba(88, 166, 255, 0.1) !important;
  border-color: rgba(88, 166, 255, 0.25) !important;
}

[data-theme="light"] .screen-placeholder .btn-center-screen,
[data-theme="light"] #screenStartBtn {
  background: #1f6feb !important;
  border-color: #388bfd !important;
  color: #ffffff !important;
  font-weight: 600 !important;
}

[data-theme="light"] .screen-placeholder .btn-center-screen:hover,
[data-theme="light"] #screenStartBtn:hover {
  background: #388bfd !important;
}

[data-theme="light"] #screenStartBtn:disabled {
  background: #21262d !important;
  border-color: #30363d !important;
  color: #484f58 !important;
}

/* ===================================================
   4. 全局彩色数值与状态指标
   =================================================== */

/* 天蓝色：在线时长、经验百分比、测谎/掉线 */
[data-theme="light"] #onlineTimeVal,
[data-theme="light"] #xpPercent,
[data-theme="light"] #lieSimVal,
[data-theme="light"] #dcSimVal,
[data-theme="light"] #experienceScreen h2 span,
[data-theme="light"] *[style*="color: #38bdf8"],
[data-theme="light"] *[style*="color:#38bdf8"] {
  color: var(--c-cyan) !important;
}

/* 鲜绿色：累计净增、扫描帧率、激活提示、安卓步骤标题 */
[data-theme="light"] #xpTotal,
[data-theme="light"] #fpsVal,
[data-theme="light"] #tutorialSection h3[style*="color: #3fb950"],
[data-theme="light"] #tutorialSection h3[style*="color:#3fb950"],
[data-theme="light"] .card > div[style*="color: #3fb950"],
[data-theme="light"] .card > div[style*="color:#3fb950"],
[data-theme="light"] *[style*="color: #3fb950"],
[data-theme="light"] *[style*="color:#3fb950"] {
  color: var(--c-green) !important;
}

/* 亮蓝色：预估时速、目标经验状态、苹果步骤标题 */
[data-theme="light"] #xpHourly,
[data-theme="light"] #experienceGoalStatus,
[data-theme="light"] #tutorialSection h3[style*="color: #58a6ff"],
[data-theme="light"] #tutorialSection h3[style*="color:#58a6ff"],
[data-theme="light"] *[style*="color: #58a6ff"],
[data-theme="light"] *[style*="color:#58a6ff"] {
  color: var(--c-blue) !important;
}

/* 金黄色：近 10 分钟实际净增 */
[data-theme="light"] #xpRecent,
[data-theme="light"] *[style*="color: #d29922"],
[data-theme="light"] *[style*="color:#d29922"] {
  color: var(--c-gold) !important;
}

/* 珊瑚红：预计升级时间、报警触发次数 */
[data-theme="light"] #xpEta,
[data-theme="light"] #alarmCountVal,
[data-theme="light"] *[style*="color: #ff7b72"],
[data-theme="light"] *[style*="color:#ff7b72"] {
  color: var(--c-coral) !important;
}

/* 当前读数与初始基线 */
[data-theme="light"] #xpCurrent {
  color: var(--text) !important;
  font-weight: 700;
  font-family: ui-monospace, SFMono-Regular, monospace;
}

[data-theme="light"] #xpInitial {
  color: var(--text-muted) !important;
  font-family: ui-monospace, SFMono-Regular, monospace;
}

/* ===================================================
   5. 卡片面板与结构框容器
   =================================================== */
[data-theme="light"] .stat-item,
[data-theme="light"] .exp-goal-box,
[data-theme="light"] .tutorial-box,
[data-theme="light"] #experienceScreen > div[style*="background: #090d13"],
[data-theme="light"] .exp-card-panel {
  background: var(--bg) !important;
  border: 1px solid var(--border) !important;
  border-radius: 6px;
}

/* 免截图已激活绿色提示框 */
[data-theme="light"] div[style*="background: rgba(35, 134, 54"] {
  background: rgba(26, 127, 55, 0.08) !important;
  border-color: rgba(26, 127, 55, 0.25) !important;
}

/* ===================================================
   6. 输入框、目标栏与原生进度条
   =================================================== */
[data-theme="light"] input[type="text"],
[data-theme="light"] input[type="number"],
[data-theme="light"] #experienceGoalTarget {
  background: #ffffff !important;
  color: var(--text) !important;
  border: 1px solid var(--border) !important;
  border-radius: 6px;
  outline: none;
}

[data-theme="light"] input[type="text"]:focus,
[data-theme="light"] input[type="number"]:focus,
[data-theme="light"] #experienceGoalTarget:focus {
  border-color: var(--c-blue) !important;
  box-shadow: 0 0 0 3px rgba(9, 105, 218, 0.15) !important;
}

[data-theme="light"] #experienceGoalStatus.goal-reached {
  color: var(--c-green) !important;
  font-weight: 700;
}

[data-theme="light"] #experienceGoalProgress {
  width: 100%;
  height: 6px;
  border: none;
  border-radius: 999px;
  background-color: #eaeef2 !important;
  overflow: hidden;
}

[data-theme="light"] #experienceGoalProgress::-webkit-progress-bar {
  background-color: #eaeef2 !important;
  border-radius: 999px;
}

[data-theme="light"] #experienceGoalProgress::-webkit-progress-value {
  background: var(--c-green) !important;
  border-radius: 999px;
}

[data-theme="light"] #experienceGoalProgress::-moz-progress-bar {
  background: var(--c-green) !important;
  border-radius: 999px;
}

/* ===================================================
   7. 按钮样式 (次级按钮、复制按钮、经验控制组)
   =================================================== */

/* 次级按钮 (画中画等) */
[data-theme="light"] .nav-pip-btn,
[data-theme="light"] .btn-secondary:not([onclick*="copyTopic"]):not(#experienceToggle):not(#experienceReset):not(#experienceAuto):not(#experienceRegion):not(#experiencePreview),
[data-theme="light"] .btn-pip {
  background: var(--bg) !important;
  border-color: var(--border) !important;
  color: #24292f !important;
}

[data-theme="light"] .nav-pip-btn:hover,
[data-theme="light"] .btn-secondary:not([onclick*="copyTopic"]):not(#experienceToggle):not(#experienceReset):not(#experienceAuto):not(#experienceRegion):not(#experiencePreview):hover,
[data-theme="light"] .btn-pip:hover {
  background: #eaeef2 !important;
  color: var(--text) !important;
}

/* 复制主题按钮 */
[data-theme="light"] button[onclick*="copyTopic"],
[data-theme="light"] #copyTopicBtn,
[data-theme="light"] .btn-copy-topic,
[data-theme="light"] #ntfyTopic ~ button,
[data-theme="light"] #ntfyTopic + button {
  background: #238636 !important;
  border: 1px solid #2ea043 !important;
  color: #ffffff !important;
  font-weight: 600 !important;
  box-shadow: 0 1px 3px rgba(35, 134, 54, 0.25) !important;
}

[data-theme="light"] button[onclick*="copyTopic"]:hover,
[data-theme="light"] #copyTopicBtn:hover,
[data-theme="light"] .btn-copy-topic:hover,
[data-theme="light"] #ntfyTopic ~ button:hover,
[data-theme="light"] #ntfyTopic + button:hover {
  background: #2ea043 !important;
}

/* 经验统计控制组与高亮保存按钮 */
[data-theme="light"] #experienceToggle,
[data-theme="light"] #experienceReset,
[data-theme="light"] #experienceAuto,
[data-theme="light"] #experienceGoalSave,
[data-theme="light"] #saveExperienceRegion:not(:disabled),
[data-theme="light"] #experienceRegion:not(:disabled),
[data-theme="light"] #experiencePreview:not(:disabled),
[data-theme="light"] #refreshExperiencePreview:not(:disabled),
[data-theme="light"] #reselectExperiencePreview:not(:disabled),
[data-theme="light"] #experienceScreen button.btn:not(:disabled) {
  background: #238636 !important;
  border: 1px solid #2ea043 !important;
  color: #ffffff !important;
  font-weight: 600 !important;
  box-shadow: 0 1px 3px rgba(35, 134, 54, 0.2) !important;
  cursor: pointer;
}

[data-theme="light"] #experienceToggle:hover,
[data-theme="light"] #experienceReset:hover,
[data-theme="light"] #experienceAuto:hover,
[data-theme="light"] #experienceGoalSave:hover,
[data-theme="light"] #saveExperienceRegion:not(:disabled):hover,
[data-theme="light"] #experienceRegion:not(:disabled):hover,
[data-theme="light"] #experiencePreview:not(:disabled):hover,
[data-theme="light"] #refreshExperiencePreview:not(:disabled):hover,
[data-theme="light"] #reselectExperiencePreview:not(:disabled):hover,
[data-theme="light"] #experienceScreen button.btn:not(:disabled):hover {
  background: #2ea043 !important;
}

/* 禁用态按钮 */
[data-theme="light"] #experienceRegion:disabled,
[data-theme="light"] #experiencePreview:disabled,
[data-theme="light"] #refreshExperiencePreview:disabled,
[data-theme="light"] #reselectExperiencePreview:disabled,
[data-theme="light"] #saveExperienceRegion:disabled,
[data-theme="light"] #experienceScreen button:disabled {
  background: #21262d !important;
  border: 1px solid #30363d !important;
  color: #8b949e !important;
  cursor: not-allowed !important;
  opacity: 0.75 !important;
  box-shadow: none !important;
}

/* ===================================================
   8. 折线图画布与经验状态说明
   =================================================== */
[data-theme="light"] #experienceChart {
  display: block;
  width: 100%;
  height: 220px;
  border-radius: 6px;
  border: 1px solid var(--border);
  box-shadow: 0 1px 3px rgba(31, 35, 40, 0.08);
}

[data-theme="light"] #experienceNote {
  color: var(--text) !important;
  font-size: 13px;
}

[data-theme="light"] #experienceReadStatus,
[data-theme="light"] #experienceRegionStatus {
  color: var(--text-muted) !important;
  font-size: 12px;
  font-family: ui-monospace, SFMono-Regular, monospace;
}

/* ===================================================
   9. 日志与提醒历史
   =================================================== */
[data-theme="light"] #logListContainer {
  color: var(--text) !important;
}

[data-theme="light"] #logListContainer > div {
  border-bottom-color: var(--border-muted) !important;
}

[data-theme="light"] div[style*="background-color: #30363d"] {
  background-color: var(--border) !important;
}

[data-theme="light"] #alertHistoryContainer > div {
  background: var(--bg) !important;
  border-color: var(--border) !important;
}

/* ===================================================
   10. 手机教程代码块与徽标
   =================================================== */
[data-theme="light"] .code-tag {
  background: #eaeef2 !important;
  color: var(--c-blue) !important;
  border: 1px solid var(--border) !important;
}

[data-theme="light"] .step-num.android {
  background: var(--c-green) !important;
  color: #ffffff !important;
}

[data-theme="light"] .step-num.ios {
  background: var(--c-blue) !important;
  color: #ffffff !important;
}

/* ===================================================
   11. 手动框选 ROI 弹窗 (experienceRegionDialog)
   =================================================== */
[data-theme="light"] #experienceRegionDialog {
  background: #ffffff !important;
  border: 1px solid var(--border) !important;
  border-radius: 8px;
  color: var(--text) !important;
  padding: 16px;
  max-width: 90vw;
  box-shadow: 0 8px 24px rgba(140, 149, 159, 0.28) !important;
}

[data-theme="light"] #experienceRegionDialog::backdrop {
  background: rgba(140, 149, 159, 0.35) !important;
  backdrop-filter: blur(4px);
}

[data-theme="light"] #regionCanvas {
  display: block;
  border: 1px solid var(--border) !important;
  border-radius: 4px;
  background: #000000;
  cursor: crosshair;
  touch-action: none;
}

[data-theme="light"] #regionNote {
  color: var(--text-muted) !important;
  font-size: 12px;
  margin-top: 8px;
}

[data-theme="light"] #cancelExperienceRegion {
  background: var(--bg) !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
  border-radius: 6px;
  padding: 5px 14px;
  font-weight: 500;
  cursor: pointer;
  transition: background-color 0.15s ease;
}

[data-theme="light"] #cancelExperienceRegion:hover {
  background: #eaeef2 !important;
  border-color: #bbc0c4 !important;
}



/* ===================================================
   冒险岛监控系统 - 经验大屏 1:1 日间模式强力匹配
   (精准覆盖 experience-ui.js 对应的 DOM 结构与黑底容器)
   =================================================== */

/* 1. 经验大屏整体大卡片外壳：转为纯白底 */
[data-theme="light"] #experienceScreen,
[data-theme="light"] .card:has(#experienceChart),
[data-theme="light"] .card:has(#xpTotal) {
  background: #ffffff !important;
  border-color: #d0d7de !important;
  color: #1f2328 !important;
  box-shadow: 0 1px 3px rgba(31, 35, 40, 0.08) !important;
}

/* 2. 头部说明文案与标题：消除黑底暗字，改用深黑/中灰高对比度 */
[data-theme="light"] #experienceScreen h2,
[data-theme="light"] #experienceScreen strong {
  color: #1f2328 !important;
}

[data-theme="light"] #experienceScreen p,
[data-theme="light"] #experienceScreen div,
[data-theme="light"] #experienceNote,
[data-theme="light"] #experienceRegionStatus,
[data-theme="light"] #experienceReadStatus {
  color: #57606a !important;
}

/* 3. 彻底覆盖 6 个数据小卡片（当前经验、进度、累计净增、近10分净增、预估时速、预计升级） */
[data-theme="light"] #experienceScreen .stat-item,
[data-theme="light"] #experienceScreen .stat-card,
[data-theme="light"] #experienceScreen div[style*="background: #0d1117"],
[data-theme="light"] #experienceScreen div[style*="background:#0d1117"],
[data-theme="light"] #experienceScreen div[style*="background: #161b22"],
[data-theme="light"] #experienceScreen div[style*="background:#161b22"],
[data-theme="light"] #experienceScreen div[style*="background: #090d13"],
[data-theme="light"] #experienceScreen div[style*="background:#090d13"],
[data-theme="light"] #experienceScreen div[style*="background: #080c14"],
[data-theme="light"] #experienceScreen div[style*="background:#080c14"],
[data-theme="light"] #experienceScreen div[style*="background-color: #0d1117"],
[data-theme="light"] #experienceScreen div[style*="background-color: #161b22"],
[data-theme="light"] #experienceScreen div[style*="background-color: #090d13"] {
  background: #f6f8fa !important;
  border: 1px solid #d0d7de !important;
  border-radius: 6px !important;
}

/* 4. 小卡片底部的指标小标题（如“当前经验”、“经验进度”等灰色小字） */
[data-theme="light"] #experienceScreen .stat-desc,
[data-theme="light"] #experienceScreen .stat-item span,
[data-theme="light"] #experienceScreen .stat-card span,
[data-theme="light"] #experienceScreen div[style*="color: #8b949e"],
[data-theme="light"] #experienceScreen div[style*="color:#8b949e"],
[data-theme="light"] #experienceScreen span[style*="color: #8b949e"],
[data-theme="light"] #experienceScreen span[style*="color:#8b949e"] {
  color: #57606a !important;
}

/* 5. 6 项核心数值匹配（完美映射 JS update/snapshot） */
[data-theme="light"] #xpCurrent {
  color: #1f2328 !important;
  font-weight: 700 !important;
}
[data-theme="light"] #xpPercent {
  color: #0284c7 !important;
  font-weight: 700 !important;
}
[data-theme="light"] #xpTotal {
  color: #1a7f37 !important;
  font-weight: 700 !important;
}
[data-theme="light"] #xpRecent {
  color: #b08800 !important;
  font-weight: 700 !important;
}
[data-theme="light"] #xpHourly {
  color: #0969da !important;
  font-weight: 700 !important;
}
[data-theme="light"] #xpEta {
  color: #cf222e !important;
  font-weight: 700 !important;
}

/* 6. 目标经验输入行 (针对白框两端透明/未居中对齐) */
[data-theme="light"] .exp-goal-box,
[data-theme="light"] #experienceScreen div:has(#experienceGoalTarget) {
  background: #f6f8fa !important;
  border: 1px solid #d0d7de !important;
  border-radius: 6px !important;
}

[data-theme="light"] #experienceGoalTarget {
  background: #ffffff !important;
  border: 1px solid #d0d7de !important;
  color: #1f2328 !important;
  border-radius: 6px !important;
}

[data-theme="light"] #experienceGoalStatus {
  color: #0969da !important;
}
[data-theme="light"] #experienceGoalStatus.goal-reached {
  color: #1a7f37 !important;
  font-weight: 700 !important;
}

/* 7. 顶部 5 个控制按钮适配（针对截图右上角的几个黑底按钮） */
[data-theme="light"] #experienceScreen button.btn-secondary:disabled,
[data-theme="light"] #experienceScreen button:disabled,
[data-theme="light"] #experienceRegion:disabled,
[data-theme="light"] #experiencePreview:disabled,
[data-theme="light"] #refreshExperiencePreview:disabled,
[data-theme="light"] #reselectExperiencePreview:disabled {
  background: #eaeef2 !important;
  border: 1px solid #d0d7de !important;
  color: #8c959f !important;
  opacity: 1 !important;
  box-shadow: none !important;
}

/* 8. 折线图 Canvas 黑色反转解决方案（无需改 JS 即可实现日间白底图表） */
[data-theme="light"] #experienceChart {
  /* 使用 CSS 硬件加速反色与色相还原：黑底变白底，同时保持曲线原有的鲜绿色 */
  filter: invert(1) hue-rotate(180deg) brightness(0.95) contrast(1.05) !important;
  border: 1px solid #d0d7de !important;
  border-radius: 6px !important;
  background: transparent !important;
}


/* ===================================================
   日间模式 - 铃声下拉选择框与表单控件补丁
   (击穿 #barkSoundLieSelect / #barkSoundDcSelect 内联黑底)
   =================================================== */

/* 1. 下拉选择框容器与外框 */
[data-theme="light"] select,
[data-theme="light"] #barkSoundSelectWrapper select,
[data-theme="light"] #barkSoundLieSelect,
[data-theme="light"] #barkSoundDcSelect {
  background: #ffffff !important;
  border: 1px solid #d0d7de !important;
  color: #1f2328 !important;
  box-shadow: inset 0 1px 2px rgba(31, 35, 40, 0.05);
}

[data-theme="light"] select:focus,
[data-theme="light"] #barkSoundLieSelect:focus,
[data-theme="light"] #barkSoundDcSelect:focus {
  border-color: #0969da !important;
  box-shadow: 0 0 0 3px rgba(9, 105, 218, 0.15) !important;
}

/* 2. 下拉菜单展开项 (Option) */
[data-theme="light"] select option,
[data-theme="light"] #barkSoundLieSelect option,
[data-theme="light"] #barkSoundDcSelect option {
  background: #ffffff !important;
  color: #1f2328 !important;
}

/* 3. 铃声上方小标题文字颜色适配 (防浅色刺眼，提升清晰度) */
/* 测谎推送铃声 (#ff7b72 -> 珊瑚深红) */
[data-theme="light"] #barkSoundSelectWrapper label[style*="color: #ff7b72"],
[data-theme="light"] #barkSoundSelectWrapper label[style*="color:#ff7b72"] {
  color: #cf222e !important;
}

/* 掉线推送铃声 (#58a6ff -> 亮蓝) */
[data-theme="light"] #barkSoundSelectWrapper label[style*="color: #58a6ff"],
[data-theme="light"] #barkSoundSelectWrapper label[style*="color:#58a6ff"] {
  color: #0969da !important;
}