/* ============================================================
 * neon.css —— 深色霓虹主题增强层（B 方案）
 * ------------------------------------------------------------
 * 依赖：dark.css（提供 [data-theme="dark"] 的暗色基底）
 * 作用：把暗色基调升级为「深空霓虹」——更深的底、更亮的霓虹边、
 *       玻璃拟态、发光强调色；并修补少量硬编码浅色残留。
 * 加载顺序：必须在 style.css / dark.css / tech.css 之后。
 * 仅在 data-theme="dark" 时生效；用户切回亮色不受影响。
 * ============================================================ */

/* ---------- 1. 调色：深空 + 霓虹 ---------- */
:root[data-theme="dark"] {
  --color-bg: #04120d;
  --color-bg-alt: #08251b;
  --color-card: rgba(9, 30, 23, .82);
  --color-card-hover: rgba(13, 42, 32, .92);
  --color-border: rgba(110, 231, 183, .18);
  --color-border-strong: rgba(110, 231, 183, .36);
  --color-text: #e9efff;
  --color-text-muted: #9fb2da;
  --color-text-subtle: #7186b0;
  --color-primary: #34d399;
  --color-primary-hover: #6ee7b7;
  --color-primary-light: rgba(52, 211, 153, .18);

  /* 兼容旧变量 */
  --bg: #04120d; --bg-2: #08251b; --bg-3: #0c3126;
  --surface: rgba(9, 30, 23, .82); --surface-2: rgba(13, 42, 32, .92);
  --card: rgba(9, 30, 23, .82); --hover: rgba(13, 42, 32, .92);
  --text: #e9efff; --text-2: #9fb2da; --text-3: #7186b0; --muted: #7186b0;
  --line: rgba(110, 231, 183, .18); --line-2: rgba(110, 231, 183, .36);
  --primary: #34d399; --primary-hover: #6ee7b7;
  --primary-soft: rgba(52, 211, 153, .16);
  --primary-border: rgba(52, 211, 153, .4);
  --brand: #6ee7b7; --brand2: #6ee7b7; --brand3: #a7f3d0;
  --border: rgba(110, 231, 183, .18); --border-strong: rgba(110, 231, 183, .36);
  --shadow: 0 12px 34px -18px rgba(0, 0, 0, .85);
  --shadow-lg: 0 26px 60px -30px rgba(52, 211, 153, .55);
  --primary-shadow: 0 6px 22px -10px rgba(52, 211, 153, .8);
}

/* ---------- 2. 背景：深空 + 霓虹网格（覆盖 tech.css 的浅色背景） ---------- */
:root[data-theme="dark"] body:not(.admin-body) {
  background-color: #04120d !important;
  background-image:
    radial-gradient(1100px 560px at 10% -12%, rgba(52, 211, 153, .22), transparent 62%),
    radial-gradient(900px 520px at 102% -4%, rgba(163, 230, 53, .16), transparent 58%),
    radial-gradient(760px 460px at 50% 118%, rgba(16, 185, 129, .16), transparent 60%),
    linear-gradient(rgba(110, 231, 183, .07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(110, 231, 183, .07) 1px, transparent 1px) !important;
  background-size: auto, auto, auto, 34px 34px, 34px 34px !important;
  background-attachment: fixed !important;
}

/* ---------- 3. 顶栏 / 面板：深空玻璃 ---------- */
:root[data-theme="dark"] .topbar {
  background: rgba(6, 24, 18, .78) !important;
  box-shadow: 0 10px 30px -22px rgba(0, 0, 0, .9) !important;
}
:root[data-theme="dark"] .topbar .title {
  background: linear-gradient(120deg, #34d399, #a3e635);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
:root[data-theme="dark"] .workspace .panel {
  background: rgba(9, 30, 23, .72) !important;
  border: 1px solid rgba(110, 231, 183, .20) !important;
  box-shadow: 0 24px 60px -34px rgba(0, 0, 0, .95), 0 0 0 1px rgba(110, 231, 183, .06) !important;
}

/* ---------- 4. 表单控件：深色 + 霓虹聚焦 ---------- */
:root[data-theme="dark"] input,
:root[data-theme="dark"] textarea,
:root[data-theme="dark"] select {
  background: rgba(6, 22, 17, .85) !important;
  color: var(--color-text) !important;
  border-color: rgba(110, 231, 183, .22) !important;
}
:root[data-theme="dark"] input::placeholder,
:root[data-theme="dark"] textarea::placeholder { color: #66799f !important; }

/* ---------- 5. 选项按钮（分辨率等）深色化 ---------- */
:root[data-theme="dark"] .btn-grid .opt {
  background: rgba(8, 26, 20, .9) !important;
  border-color: rgba(110, 231, 183, .22) !important;
  color: var(--color-text-muted) !important;
}
:root[data-theme="dark"] .btn-grid .opt.active {
  background: linear-gradient(120deg, rgba(52, 211, 153, .35), rgba(163, 230, 53, .25)) !important;
  border-color: rgba(52, 211, 153, .7) !important;
  color: #fff !important;
}

/* ---------- 6. 卡片 / 表格 ---------- */
:root[data-theme="dark"] .card,
:root[data-theme="dark"] .admin-card,
:root[data-theme="dark"] .s-card,
:root[data-theme="dark"] .db-card {
  background: rgba(9, 30, 23, .78) !important;
  border-color: rgba(110, 231, 183, .18) !important;
}

/* ---------- 7. 硬编码浅色补丁（内联样式残留；前后台通用） ---------- */
:root[data-theme="dark"] [style*="color:#0f172a"],
:root[data-theme="dark"] [style*="color: #0f172a"],
:root[data-theme="dark"] [style*="color:#1f2937"],
:root[data-theme="dark"] [style*="color:#334155"] {
  color: var(--color-text) !important;
}
:root[data-theme="dark"] [style*="color:#94a3b8"],
:root[data-theme="dark"] [style*="color:#64748b"] {
  color: var(--color-text-subtle) !important;
}
:root[data-theme="dark"] [style*="background:#fff"],
:root[data-theme="dark"] [style*="background: #fff"],
:root[data-theme="dark"] [style*="background:#ffffff"],
:root[data-theme="dark"] [style*="background:white"] {
  background: rgba(9, 30, 23, .82) !important;
}

/* ---------- 7b. 后台：深空背景（覆盖 tech-admin.css 的浅色底） ---------- */
:root[data-theme="dark"] .admin-body {
  background:
    radial-gradient(900px 460px at 8% -10%, rgba(52, 211, 153, .16), transparent 60%),
    radial-gradient(760px 420px at 100% 0%, rgba(163, 230, 53, .12), transparent 55%),
    #04120d !important;
  background-attachment: fixed !important;
}

/* ---------- 8. 手机端顶栏 ---------- */
:root[data-theme="dark"] .m-page .h5-header {
  background: rgba(6, 24, 18, .9) !important;
  border-bottom: 1px solid rgba(110, 231, 183, .18) !important;
}

/* ---------- 9. 链接与强调 ---------- */
:root[data-theme="dark"] a { color: #6ee7b7; }
:root[data-theme="dark"] a:hover { color: #a7f3d0; }

/* ---------- 10. 深色主题下：侧栏 / 手机端框架保持深绿玻璃 ---------- */
:root[data-theme="dark"] .ws-page .top-nav {
  background: linear-gradient(180deg, rgba(6, 26, 20, .94) 0%, rgba(8, 34, 26, .9) 55%, rgba(5, 22, 17, .95) 100%) !important;
  border-color: rgba(52, 211, 153, .24) !important;
  box-shadow: 0 34px 80px -44px rgba(0, 0, 0, .95) !important;
}
:root[data-theme="dark"] .ws-page .top-nav::before { color: #6ee7b7 !important; text-shadow: 0 0 14px rgba(110, 231, 183, .7) !important; }
:root[data-theme="dark"] .ws-page .top-nav a { color: #9db8ae !important; }
:root[data-theme="dark"] .ws-page .top-nav a:hover { color: #eafff6 !important; background: rgba(52, 211, 153, .16) !important; }
:root[data-theme="dark"] .ws-page .top-nav a.active {
  color: #065f46 !important;
  background: linear-gradient(120deg, #34d399, #a3e635) !important;
}
:root[data-theme="dark"] .m-page .h5-header { background: rgba(6, 24, 18, .88) !important; }
:root[data-theme="dark"] .m-page .h5-header h1,
:root[data-theme="dark"] .m-page .h5-header h1 span { color: #eafff6 !important; }
:root[data-theme="dark"] .m-page .h5-header .credits { color: #eafff6 !important; }
:root[data-theme="dark"] .m-page .h5-header .m-pc-switch { background: rgba(52, 211, 153, .14) !important; color: #6ee7b7 !important; }
:root[data-theme="dark"] .m-page .h5-tabbar {
  background: linear-gradient(180deg, rgba(6, 26, 20, .94), rgba(8, 34, 26, .92)) !important;
  border-color: rgba(52, 211, 153, .28) !important;
}
:root[data-theme="dark"] .m-page .h5-tabbar .tab-item { color: #9db8ae !important; }
:root[data-theme="dark"] .m-page .h5-tabbar .tab-item.active {
  color: #065f46 !important;
  background: linear-gradient(120deg, #34d399, #a3e635) !important;
}