/* ============================================================ Dark Theme Overrides – dp-dark-mode Applied when is set ============================================================ */ html.dark { color-scheme: dark; } /* ── Base ─────────────────────────────────────────────────── */ html.dark body { background-color: #0d1421 !important; color: #c9d1e0 !important; } /* ── Scrollbar ────────────────────────────────────────────── */ html.dark ::-webkit-scrollbar-track { background: transparent !important; } html.dark ::-webkit-scrollbar-thumb { background: rgba(99,102,241,0.35) !important; } /* ══════════════════════════════════════════════════════════ MEMBER.HTML – 主壳 ══════════════════════════════════════════════════════════ */ /* 侧边栏 */ html.dark .new-sidebar { background: #151c2d !important; border-right-color: #1e2a45 !important; box-shadow: 2px 0 12px rgba(0,0,0,0.3) !important; } html.dark .sidebar-brand { border-bottom-color: #1e2a45 !important; } html.dark .sidebar-brand-name { color: #e2e8f0 !important; } html.dark .sidebar-brand-version { color: #818cf8 !important; background: #1e2638 !important; } html.dark .sidebar-scroll::-webkit-scrollbar-thumb { background: rgba(99,102,241,0.25) !important; } html.dark .menu-group-title { color: #4a5778 !important; } html.dark .menu-item { color: #7c8db5 !important; text-decoration: none !important; } html.dark .menu-item:hover { background: #1e2535 !important; color: #c9d1e0 !important; } html.dark .menu-item.active { color: #818cf8 !important; } html.dark .menu-icon-wrap { background: #1e2535 !important; } html.dark .menu-item:hover .menu-icon-wrap { background: #252f4a !important; } /* 侧边栏系统切换 */ html.dark .sidebar-sys-switch { background: #151c2d !important; border-top-color: #1e2a45 !important; } html.dark .sidebar-sys-tabs { background: #1e2535 !important; } html.dark .sidebar-sys-tab { color: #7c8db5 !important; } html.dark .sidebar-sys-tab:not(.active):hover { color: #c9d1e0 !important; } html.dark .sidebar-sys-tab.active { background: #252f4a !important; color: #818cf8 !important; box-shadow: 0 1px 6px rgba(0,0,0,0.35) !important; } /* 顶部导航栏 */ html.dark .new-header { background: #151c2d !important; border-bottom-color: #1e2a45 !important; box-shadow: 0 1px 6px rgba(0,0,0,0.25) !important; } html.dark .header-breadcrumb-root { color: #4a5778 !important; } html.dark .header-breadcrumb-sep { color: #2d3554 !important; } html.dark .header-breadcrumb-cur { color: #e2e8f0 !important; } html.dark .header-breadcrumb-refresh { color: #7c8db5 !important; } html.dark .header-breadcrumb-refresh:hover { background: #1e2535 !important; color: #818cf8 !important; } html.dark .header-btn { color: #7c8db5 !important; } html.dark .header-btn:hover { background: #1e2535 !important; color: #818cf8 !important; } html.dark .header-btn.fullscreen-active { background: #1e2638 !important; color: #818cf8 !important; border-color: #3a4270 !important; } /* 系统切换标签 */ html.dark .sys-tabs { background: #1e2535 !important; } html.dark .sys-tab { color: #7c8db5 !important; } html.dark .sys-tab.active { background: #252f4a !important; color: #818cf8 !important; box-shadow: 0 1px 6px rgba(0,0,0,0.3) !important; } /* 用户区 */ html.dark .header-user:hover { background: #1e2535 !important; } html.dark .header-user-name { color: #e2e8f0 !important; } html.dark .header-user-role { color: #818cf8 !important; background: #1e2638 !important; } html.dark .header-user-chevron { color: #7c8db5 !important; } /* 用户下拉菜单 */ html.dark .user-dropdown { background: #1a2236 !important; border-color: #1e2a45 !important; box-shadow: 0 8px 30px rgba(0,0,0,0.45) !important; } html.dark .user-dropdown-header { border-bottom-color: #1e2a45 !important; } html.dark .user-dropdown-name { color: #e2e8f0 !important; } html.dark .user-dropdown-role { color: #7c8db5 !important; } html.dark .user-dropdown-item { color: #9ca3af !important; } html.dark .user-dropdown-item:hover { background: #252f4a !important; color: #e2e8f0 !important; } html.dark .user-dropdown-item.danger:hover { background: rgba(239,68,68,0.12) !important; } html.dark .user-dropdown-divider { background: #1e2a45 !important; } /* 内容区 */ html.dark .content-area { background: #0d1421 !important; } html.dark .content-iframe { background: #111c30 !important; } html.dark #page-loader, html.dark #iframe-loader { background: #0d1421 !important; } html.dark .loader-bar { background: #1e2535 !important; } html.dark .loader-text, html.dark .iframe-loader-text { color: #4a5778 !important; } /* 底部栏 */ html.dark .footer-bar { background: #0d1421 !important; } html.dark .footer-copy { color: #4a5778 !important; } html.dark .footer-divider { background: #1e2a45 !important; } /* 弹窗 */ html.dark .modal-box { background: #1a2236 !important; box-shadow: 0 20px 60px rgba(0,0,0,0.5) !important; } html.dark .modal-header { border-bottom-color: #1e2a45 !important; } html.dark .modal-header h3 { color: #e2e8f0 !important; } html.dark .modal-close { color: #7c8db5 !important; } html.dark .modal-close:hover { color: #e2e8f0 !important; } html.dark .modal-body p { color: #9ca3af !important; } html.dark .btn-cancel { background: #1e2535 !important; border-color: #1e2a45 !important; color: #9ca3af !important; } html.dark .btn-cancel:hover { background: #252f4a !important; } /* Toast */ html.dark .order-notify-content { background: #1a2236 !important; color: #e2e8f0 !important; box-shadow: 0 8px 30px rgba(0,0,0,0.45) !important; } /* ══════════════════════════════════════════════════════════ 子页通用组件（Glass 主题页面） ══════════════════════════════════════════════════════════ */ /* 卡片 */ html.dark .card, html.dark .stat-card, html.dark .chart-card { background: #1a2236 !important; border-color: #1e2a45 !important; box-shadow: 0 2px 16px rgba(0,0,0,0.25) !important; } /* 统计数值 */ html.dark .stat-value { color: #e2e8f0 !important; } html.dark .stat-label { color: #7c8db5 !important; } html.dark .stat-sub { color: #7c8db5 !important; } /* 输入框 */ html.dark .form-input { background: #1e2535 !important; border-color: #2d3554 !important; color: #e2e8f0 !important; } html.dark .form-input:focus { background: #252f4a !important; border-color: #6366f1 !important; box-shadow: 0 0 0 3px rgba(99,102,241,0.15) !important; } html.dark .form-input::placeholder { color: #4a5778 !important; } html.dark select.form-input option { background: #1a2236 !important; color: #e2e8f0 !important; } /* 幽灵按钮 */ html.dark .btn-ghost { background: #1e2535 !important; color: #9ca3af !important; border-color: #2d3554 !important; } html.dark .btn-ghost:hover { background: #252f4a !important; color: #818cf8 !important; border-color: #6366f1 !important; } /* 危险按钮（danger）已是红色，保持不变 */ /* 数据表格 */ html.dark .data-table th { background: #151c2d !important; border-bottom-color: #1e2a45 !important; color: #7c8db5 !important; } html.dark .data-table td { color: #c9d1e0 !important; border-bottom-color: #1e2a45 !important; } html.dark .data-table tr:hover td { background: #1e2535 !important; } /* 分页 */ html.dark .page-link { background: #1e2535 !important; border-color: #2d3554 !important; color: #7c8db5 !important; } html.dark .page-link:hover:not(.active):not(.disabled) { background: #252f4a !important; color: #818cf8 !important; border-color: #6366f1 !important; } /* 徽章 */ html.dark .badge-gray { background: #1e2535 !important; color: #9ca3af !important; border-color: #2d3554 !important; } html.dark .badge-blue { background: rgba(59,130,246,0.12) !important; border-color: rgba(59,130,246,0.25) !important; } html.dark .badge-green { background: rgba(16,185,129,0.12) !important; border-color: rgba(16,185,129,0.25) !important; } html.dark .badge-red { background: rgba(239,68,68,0.12) !important; border-color: rgba(239,68,68,0.25) !important; } html.dark .badge-orange { background: rgba(245,158,11,0.12) !important; border-color: rgba(245,158,11,0.25) !important; } /* 操作按钮 */ html.dark .action-btn-blue { background: rgba(59,130,246,0.12) !important; } html.dark .action-btn-emerald { background: rgba(16,185,129,0.12) !important; } html.dark .action-btn-red { background: rgba(239,68,68,0.12) !important; } html.dark .action-btn-orange { background: rgba(245,158,11,0.12) !important; } /* ── 通用文字颜色 ─────────────────────────────────────────── */ html.dark .text-slate-700, html.dark .text-gray-700 { color: #c9d1e0 !important; } html.dark .text-slate-500, html.dark .text-gray-500 { color: #7c8db5 !important; } html.dark .text-slate-400, html.dark .text-gray-400 { color: #4a5778 !important; } /* ── 通用背景 ─────────────────────────────────────────────── */ html.dark .bg-white { background-color: #1a2236 !important; } html.dark .bg-gray-50, html.dark .bg-slate-50 { background-color: #151c2d !important; } html.dark .bg-gray-100, html.dark .bg-slate-100 { background-color: #1e2535 !important; } /* ── 通用边框 ─────────────────────────────────────────────── */ html.dark .border-gray-200, html.dark .border-slate-200 { border-color: #1e2a45 !important; } /* ══════════════════════════════════════════════════════════ 游戏通道表单（game_view/*.html）Glass 输入组件 ══════════════════════════════════════════════════════════ */ html.dark .glass-input { background: rgba(255,255,255,0.05) !important; border-color: rgba(255,255,255,0.12) !important; color: #e2e8f0 !important; } html.dark .glass-input:focus { background: rgba(255,255,255,0.08) !important; border-color: rgba(99,102,241,0.6) !important; box-shadow: 0 0 0 3px rgba(99,102,241,0.15) !important; } html.dark .glass-input::placeholder { color: #4a5778 !important; } html.dark .glass-section { background: rgba(255,255,255,0.03) !important; border-color: rgba(255,255,255,0.08) !important; } html.dark .glass-label { color: #9ca3af !important; } html.dark .glass-hint { color: #4a5778 !important; } /* ══════════════════════════════════════════════════════════ Layui 组件暗色覆盖（用于旧页面兼容） ══════════════════════════════════════════════════════════ */ html.dark .layui-fluid { background: transparent !important; } html.dark .layui-card { background-color: #1a2236 !important; border-color: #1e2a45 !important; box-shadow: none !important; } html.dark .layui-card-header { background: #151c2d !important; border-bottom-color: #1e2a45 !important; color: #e2e8f0 !important; } html.dark .layui-card-body { color: #c9d1e0 !important; } html.dark .layui-form-label, html.dark label.layui-form-label { color: #9ca3af !important; } html.dark .layui-word-aux { color: #4a5778 !important; } html.dark .layui-input, html.dark .layui-textarea { background: #1e2535 !important; border-color: #2d3554 !important; color: #e2e8f0 !important; } html.dark .layui-input::placeholder, html.dark .layui-textarea::placeholder { color: #4a5778 !important; } html.dark .layui-form-select .layui-input { background: #1e2535 !important; } html.dark .layui-form-select dl { background: #1a2236 !important; border-color: #1e2a45 !important; box-shadow: 0 4px 16px rgba(0,0,0,0.4) !important; } html.dark .layui-form-select dl dt { color: #7c8db5 !important; } html.dark .layui-form-select dl dd { color: #c9d1e0 !important; } html.dark .layui-form-select dl dd:hover, html.dark .layui-form-select dl dd.layui-this { background: #252f4a !important; color: #e2e8f0 !important; } html.dark .form-group-bottom { background-color: #1a2236 !important; box-shadow: 0 -1px 4px rgba(0,0,0,0.4) !important; } /* Layui 表格 */ html.dark .layui-table-box { background: #1a2236 !important; } html.dark .layui-table th, html.dark .layui-table-view .layui-table th { background-color: #151c2d !important; color: #7c8db5 !important; border-color: #1e2a45 !important; } html.dark .layui-table td, html.dark .layui-table-view .layui-table td { background-color: #1a2236 !important; color: #c9d1e0 !important; border-color: #1e2a45 !important; } html.dark .layui-table-view .layui-table tr:hover td { background-color: #1e2535 !important; } html.dark .layui-table-view .layui-table-header, html.dark .layui-table-view .layui-table-footer { background: #151c2d !important; border-color: #1e2a45 !important; } html.dark .layui-table-view { border-color: #1e2a45 !important; } html.dark .layui-table-cell { background: inherit !important; } /* Layui 分页 */ html.dark .layui-laypage a, html.dark .layui-laypage span { background: #1e2535 !important; border-color: #2d3554 !important; color: #7c8db5 !important; } html.dark .layui-laypage .layui-laypage-curr em:last-child { background: #6366f1 !important; border-color: #6366f1 !important; color: #fff !important; } html.dark .layui-laypage a:hover { background: #252f4a !important; color: #818cf8 !important; } /* Layui 按钮保持原色，仅调整禁用态 */ html.dark .layui-btn-primary { background: #1e2535 !important; border-color: #2d3554 !important; color: #9ca3af !important; } /* Glass 确认弹窗（Layui 页面中混用的） */ html.dark .glass-confirm-content { background: #1a2236 !important; border-color: #1e2a45 !important; } html.dark .glass-confirm-title { color: #e2e8f0 !important; } html.dark .glass-confirm-message { color: #9ca3af !important; } html.dark .glass-confirm-btn-cancel { background: #1e2535 !important; color: #9ca3af !important; } html.dark .glass-confirm-btn-cancel:hover { background: #252f4a !important; } /* ══════════════════════════════════════════════════════════ Tailwind 工具类覆盖（直接用在 HTML 标签中的类名） ══════════════════════════════════════════════════════════ */ /* ── 文字颜色 ─────────────────────────────────────────────── */ html.dark .text-gray-900 { color: #f1f5f9 !important; } html.dark .text-gray-800 { color: #e2e8f0 !important; } html.dark .text-gray-700 { color: #d4dae8 !important; } html.dark .text-gray-600 { color: #b0bac9 !important; } html.dark .text-gray-500 { color: #7c8db5 !important; } html.dark .text-gray-400 { color: #4a5778 !important; } html.dark .text-gray-300 { color: #3a4a6b !important; } html.dark .text-slate-900 { color: #f1f5f9 !important; } html.dark .text-slate-800 { color: #e2e8f0 !important; } html.dark .text-slate-700 { color: #d4dae8 !important; } html.dark .text-slate-600 { color: #b0bac9 !important; } html.dark .text-slate-500 { color: #7c8db5 !important; } html.dark .text-slate-400 { color: #4a5778 !important; } /* ── 背景颜色 ─────────────────────────────────────────────── */ html.dark .bg-white { background-color: #1a2236 !important; } html.dark .bg-gray-50 { background-color: #151c2d !important; } html.dark .bg-gray-100 { background-color: #1e2535 !important; } html.dark .bg-gray-200 { background-color: #252f4a !important; } html.dark .bg-slate-50 { background-color: #151c2d !important; } html.dark .bg-slate-100 { background-color: #1e2535 !important; } html.dark .bg-slate-200 { background-color: #252f4a !important; } html.dark .bg-zinc-100 { background-color: #1e2535 !important; } /* 浅色品牌背景（图标容器用）→ 保留色相，降低亮度 */ html.dark .bg-blue-50 { background-color: rgba(59,130,246,0.12) !important; } html.dark .bg-blue-100 { background-color: rgba(59,130,246,0.18) !important; } html.dark .bg-indigo-50 { background-color: rgba(99,102,241,0.12) !important; } html.dark .bg-indigo-100 { background-color: rgba(99,102,241,0.18) !important; } html.dark .bg-purple-50 { background-color: rgba(139,92,246,0.12) !important; } html.dark .bg-violet-50 { background-color: rgba(139,92,246,0.12) !important; } html.dark .bg-rose-50 { background-color: rgba(244,63,94,0.12) !important; } html.dark .bg-red-50 { background-color: rgba(239,68,68,0.12) !important; } html.dark .bg-red-100 { background-color: rgba(239,68,68,0.18) !important; } html.dark .bg-green-50 { background-color: rgba(16,185,129,0.12) !important; } html.dark .bg-green-100 { background-color: rgba(16,185,129,0.18) !important; } html.dark .bg-emerald-50 { background-color: rgba(16,185,129,0.12) !important; } html.dark .bg-teal-50 { background-color: rgba(20,184,166,0.12) !important; } html.dark .bg-amber-50 { background-color: rgba(245,158,11,0.12) !important; } html.dark .bg-yellow-50 { background-color: rgba(234,179,8,0.12) !important; } html.dark .bg-sky-50 { background-color: rgba(14,165,233,0.12) !important; } html.dark .bg-orange-50 { background-color: rgba(249,115,22,0.12) !important; } html.dark .bg-cyan-50 { background-color: rgba(6,182,212,0.12) !important; } html.dark .bg-fuchsia-50 { background-color: rgba(217,70,239,0.12) !important; } html.dark .bg-pink-50 { background-color: rgba(236,72,153,0.12) !important; } /* ── 边框颜色 ─────────────────────────────────────────────── */ html.dark .border-gray-100 { border-color: #1e2a45 !important; } html.dark .border-gray-200 { border-color: #2d3554 !important; } html.dark .border-gray-300 { border-color: #3a4a6b !important; } html.dark .border-slate-100 { border-color: #1e2a45 !important; } html.dark .border-slate-200 { border-color: #2d3554 !important; } /* ── Tailwind 带透明度变体（如 bg-emerald-50/30）─────────── */ html.dark [class*="bg-emerald-50/"] { background-color: rgba(16,185,129,0.05) !important; } html.dark [class*="bg-rose-50/"] { background-color: rgba(239,68,68,0.05) !important; } html.dark [class*="bg-blue-50/"] { background-color: rgba(59,130,246,0.05) !important; } html.dark [class*="bg-gray-50/"] { background-color: rgba(30,37,53,0.3) !important; } html.dark [class*="bg-indigo-50/"] { background-color: rgba(99,102,241,0.05) !important; } html.dark [class*="bg-purple-50/"] { background-color: rgba(139,92,246,0.05) !important; } html.dark [class*="bg-amber-50/"] { background-color: rgba(245,158,11,0.05) !important; } html.dark [class*="bg-red-50/"] { background-color: rgba(239,68,68,0.05) !important; } html.dark [class*="bg-teal-50/"] { background-color: rgba(20,184,166,0.05) !important; } html.dark [class*="bg-orange-50/"] { background-color: rgba(249,115,22,0.05) !important; } html.dark [class*="bg-green-50/"] { background-color: rgba(16,185,129,0.05) !important; } html.dark [class*="bg-sky-50/"] { background-color: rgba(14,165,233,0.05) !important; } html.dark [class*="bg-yellow-50/"] { background-color: rgba(234,179,8,0.05) !important; } /* ── Tailwind hover 透明度变体 ───────────────────────────── */ html.dark [class*="hover:bg-gray-50"]:hover { background-color: rgba(30,37,53,0.5) !important; } html.dark [class*="hover:bg-gray-100"]:hover { background-color: #252f4a !important; } html.dark [class*="hover:bg-gray-200"]:hover { background-color: #2d3554 !important; } /* ── Ring / focus 颜色已由 Tailwind 处理，无需覆盖 ─────────── */ /* ══════════════════════════════════════════════════════════ 子页面专用组件（各页