/**
 * dark-mode.css —— 本站暗色模式覆盖（全部作用在 html.dark 下）
 *
 * element-plus 组件的暗色由官方变量文件(element-plus@2.4.3_dark_css-vars.css)接管；
 * 这里处理站点自己的部分：背景图、顶栏、以及模板里写死的浅色内联样式。
 *
 * ★ 关键：页面由 Vue 渲染，动态节点的内联样式会被浏览器重新序列化，
 *   hex 会变成 rgb() 形态（如 color:#333 => color: rgb(51, 51, 51)）；
 *   只有被 Vue 静态提升的整块内容保留 hex 原文。
 *   因此下面所有 [style*=...] 清扫规则都同时写 hex 和 rgb 两种形态，缺一不可。
 */

/* ---------- 页面背景 ---------- */
html.dark { background-color: #101014; }
html.dark body {
    background: url(../img/mole_bg_night.jpg) scroll no-repeat center 41px #101014;
    color: #c8c8d0;
}

/* ---------- 全屏按钮（暗色下也是实心紫底白字，略调色）---------- */
html.dark .fs-btn { color: #fff; background: #6f52ad; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.4); }
html.dark .fs-btn:hover { background: #7e60c4; box-shadow: 0 3px 10px rgba(0, 0, 0, 0.5); }

/* ---------- 顶栏 ---------- */
html.dark .topbar_outer { background: #1a1a20 !important; border-bottom: 1px solid #2c2c34; }
html.dark .topbar_wrap a,
html.dark .topbar_reg span { color: #b0b0bc !important; }

/* ---------- 主选项卡容器 ---------- */
html.dark .el-tabs--border-card { background: #1a1a20; border-color: #2c2c34; }
html.dark .el-tabs--border-card > .el-tabs__header {
    background-color: #16161c;
    border-bottom-color: #2c2c34;
}

/* ---------- 游戏信息面板折叠头 ---------- */
html.dark .info-collapse .el-collapse-item { border-color: #2c2c34; }
html.dark .info-collapse .el-collapse-item__header {
    background: linear-gradient(135deg, #202028 0%, #1a1a20 100%);
    color: #c8c8d0;
    border-bottom-color: #2c2c34;
}
html.dark .info-collapse .el-collapse-item__content { background: #1a1a20; }

/* ---------- 信息区块 / 统计卡片 / 无数据状态 ---------- */
html.dark .info-section { border-bottom-color: #2c2c34; }
html.dark .info-section h4 { color: #c8c8d0; }
html.dark .stat-card {
    background: linear-gradient(135deg, #202028 0%, #1a1a20 100%);
    border-color: #2c2c34;
    color: #c8c8d0;
}
html.dark .data-table-container { background: #1a1a20; border-color: #2c2c34; }
html.dark .no-data-state { background: #202028; color: #8a8a94; }

/* ---------- 表格（行/表头是 Vue 绑定的内联样式，用标签选择器 + !important 压制） ---------- */
html.dark table { color: #c8c8d0; }
html.dark thead tr,
html.dark th { background: #202028 !important; color: #c8c8d0 !important; border-color: #2c2c34 !important; }
html.dark tbody tr { background: #1a1a20 !important; }
html.dark tbody tr:nth-child(even) { background: #1e1e26 !important; }
html.dark td { border-color: #2c2c34 !important; color: #b8b8c2; }

/* ---------- “没有Flash？”指引区 ---------- */
html.dark .flash-guide { background-color: #16161c; }
html.dark .flash-guide strong { color: #d0d0d8; }
html.dark .flash-guide a:not(.download-btn) { color: #6cb2ff; }
html.dark .flash-step, html.dark .flash-step-mac { background-color: #1e1e26; color: #b8b8c2; }

/* ================================================================
 * 内联浅色背景清扫（hex + rgb 双形态）
 * ================================================================ */
/* #f8f9fa 浅灰块（公开广场搜索区/留言板主人信息等） */
html.dark [style*="background: #f8f9fa"],
html.dark [style*="background:#f8f9fa"],
html.dark [style*="background: rgb(248, 249, 250)"],
html.dark [style*="background-color: rgb(248, 249, 250)"] { background: #202028 !important; }
/* 白色块 */
html.dark [style*="background: #ffffff"],
html.dark [style*="background: #fff;"],
html.dark [style*="background-color: #fff"],
html.dark [style*="background: rgb(255, 255, 255)"],
html.dark [style*="background-color: rgb(255, 255, 255)"] { background: #1a1a20 !important; }
/* #f0f9ff 浅蓝提示块 */
html.dark [style*="background: #f0f9ff"],
html.dark [style*="background-color: #f0f9ff"],
html.dark [style*="background: rgb(240, 249, 255)"],
html.dark [style*="background-color: rgb(240, 249, 255)"] { background: #16222e !important; border-color: #23384a !important; }
/* #e8f5e8 浅绿统计条（公开广场） */
html.dark [style*="background: #e8f5e8"],
html.dark [style*="background: rgb(232, 245, 232)"] { background: #16281a !important; }
/* #ffe8e8 浅红统计条（靓靓屋广场） */
html.dark [style*="background: #ffe8e8"],
html.dark [style*="background: rgb(255, 232, 232)"] { background: #2e1a1a !important; }
/* #fff5f5 起头的浅红渐变（靓靓屋评分块） */
html.dark [style*="#fff5f5"],
html.dark [style*="rgb(255, 245, 245)"] { background: linear-gradient(135deg, #261a1c, #2e1a1a) !important; }
/* #fff3cd 黄色提示条 */
html.dark [style*="background-color: #fff3cd"],
html.dark [style*="background-color: rgb(255, 243, 205)"] { background-color: #2e2a1a !important; border-color: #4a4426 !important; }
/* #f0f0f0 Flash 未加载占位框 */
html.dark [style*="background-color:#f0f0f0"],
html.dark [style*="background-color: rgb(240, 240, 240)"] { background-color: #16161c !important; border-color: #2c2c34 !important; }
/* #f5f5f5 */
html.dark [style*="background-color: #f5f5f5"],
html.dark [style*="background-color: rgb(245, 245, 245)"] { background-color: #202028 !important; }

/* ================================================================
 * 内联深色文字清扫（hex + rgb 双形态）——暗底上深灰=不可见
 * 页面没有用这些深色值做内联背景/边框，不会误伤
 * ================================================================ */
/* 纯黑（“关于”页警示文字） */
html.dark [style*="color: #000"],
html.dark [style*="color: rgb(0, 0, 0)"] { color: #e0e0e6 !important; }
/* #333 系（公开广场卡片标题、各处标题） */
html.dark [style*="color: #333"],
html.dark [style*="color: rgb(51, 51, 51)"],
html.dark [style*="color: #343a40"],
html.dark [style*="color: rgb(52, 58, 64)"],
html.dark [style*="color: #495057"],
html.dark [style*="color: rgb(73, 80, 87)"] { color: #d0d0d8 !important; }
/* #555（导演模式开关标签等） */
html.dark [style*="color: #555"],
html.dark [style*="color: rgb(85, 85, 85)"] { color: #b8b8c2 !important; }
/* #666（公开广场几乎全部说明文字/日期/统计） */
html.dark [style*="color: #666"],
html.dark [style*="color:#666"],
html.dark [style*="color: rgb(102, 102, 102)"] { color: #a8a8b4 !important; }
/* #888（卡片头标题、“建设中”） */
html.dark [style*="color: #888"],
html.dark [style*="color: rgb(136, 136, 136)"] { color: #9898a4 !important; }
/* #999（次级小字） */
html.dark [style*="color: #999"],
html.dark [style*="color:#999"],
html.dark [style*="color: rgb(153, 153, 153)"] { color: #8a8a96 !important; }
/* #6c757d */
html.dark [style*="color: #6c757d"],
html.dark [style*="color: rgb(108, 117, 125)"] { color: #9098a2 !important; }
/* 提示块深色字 */
html.dark [style*="color: #856404"],
html.dark [style*="color: rgb(133, 100, 4)"] { color: #d8c87a !important; }
html.dark [style*="color: #1890ff"],
html.dark [style*="color: rgb(24, 144, 255)"] { color: #6cb2ff !important; }

/* ================================================================
 * JS 动态弹窗（游戏计分板/游戏结果/背包一览表等，flash-utils.js 用 cssText 创建）
 * 文字色经序列化已被上方 rgb 清扫覆盖；这里补齐弹窗特有的背景与边框
 * ================================================================ */
/* 弹窗主面板：'background: white' 关键字写法（×22，浏览器保留关键字则中此条，转 rgb 则中上面的白色规则） */
html.dark [style*="background: white"] { background: #1e1e26 !important; }
/* 表格偶数行 #fafafa */
html.dark [style*="background: #fafafa"],
html.dark [style*="background: rgb(250, 250, 250)"] { background: #22222a !important; }
/* 表头 #f5f7fa */
html.dark [style*="background: #f5f7fa"],
html.dark [style*="background: rgb(245, 247, 250)"] { background: #202028 !important; }
/* 浅蓝服装ID小标签 #e3f2fd */
html.dark [style*="background: #e3f2fd"],
html.dark [style*="background: rgb(227, 242, 253)"] { background: #1c2a38 !important; color: #9cc4e8 !important; }
/* 浅灰渐变按钮区 linear-gradient(#f8f9fa, #e9ecef)：渐变里的值匹配不到带前缀的规则，用纯值兜底 */
html.dark [style*="rgb(248, 249, 250)"] { background: #202028 !important; }
/* 浅色边框（#ddd/#e4e7ed/#e9ecef/#eee/#f3f3f3，hex=静态原文、rgb=序列化后） */
html.dark [style*="solid #ddd"],
html.dark [style*="rgb(221, 221, 221)"] { border-color: #34343c !important; }
html.dark [style*="solid #e4e7ed"],
html.dark [style*="rgb(228, 231, 237)"] { border-color: #2c2c34 !important; }
html.dark [style*="solid #e9ecef"],
html.dark [style*="rgb(233, 236, 239)"] { border-color: #2c2c34 !important; }
html.dark [style*="solid #eee"],
html.dark [style*="rgb(238, 238, 238)"] { border-color: #2c2c34 !important; }
html.dark [style*="solid #f3f3f3"],
html.dark [style*="rgb(243, 243, 243)"] { border-color: #2c2c34 !important; }
