/*
 * 浅色主题（10-18 起，方案 A）：所有页面在 Tailwind 之后加载本文件，把原深色配色统一换成浅色。
 * 原则：暖白底 + 白卡片 + 深色字；橙粉渐变（品牌色）不变；代码块、终端示例保持深色。
 * Tailwind Play CDN 的样式是运行时插入的，会排在本文件后面，所以这里需要 !important。
 * 改配色只改这里的变量。
 */
:root {
  --bg: #FBFAF8;
  --bg-alt: #F5F3EF;
  --surface: #FFFFFF;
  --border: #E9E6EF;
  --border-strong: #DAD6E3;
  --ink: #14142B;
  --ink-2: #2E2E48;
  --ink-3: #4A4A66;
  --ink-4: #6B6B85;
  --ink-5: #8A8AA0;
  --shadow: 0 1px 2px rgba(20,20,43,.04), 0 6px 20px rgba(20,20,43,.05);
  color-scheme: light;
}

/* ---------- 底色与文字 ---------- */
html, body, body.bg-brand-dark, .bg-brand-dark { background-color: var(--bg) !important; color: var(--ink-2) !important; }
header, header.bg-brand-dark\/80, nav.bg-brand-dark\/80 { background-color: rgba(251,250,248,.86) !important; }
.text-white, h1, h2, h3, h4, h5, .sec-h, .vendor, .vendor-h + *, .text-gray-100, .text-gray-200 { color: var(--ink) !important; }
.text-gray-300 { color: var(--ink-2) !important; }
.text-gray-400 { color: var(--ink-3) !important; }
.text-gray-500 { color: var(--ink-4) !important; }
.text-gray-600, .text-gray-700, .text-brand-muted { color: var(--ink-5) !important; }
.vendor-h { color: #E35D00 !important; }
.gradient-text { -webkit-text-fill-color: transparent !important; }
a.hover\:text-white:hover, .hover\:text-white:hover { color: #E35D00 !important; }

/* ---------- 卡片、边框、浮层 ---------- */
.bg-brand-card, .stat-glow, .guide-card, .tip, .calc, .tier-desc, .tier-tab, .model-chip, .mail-float, .lang-menu {
  background: var(--surface) !important; border-color: var(--border) !important;
}
.bg-brand-card, .stat-glow, .guide-card, .calc, .tier-desc, .mail-float, .lang-menu { box-shadow: var(--shadow) !important; }
.border-brand-border, .border-b, .border-t, .border { border-color: var(--border) !important; }
.bg-brand-dark\/50, .bg-brand-dark\/60, .bg-brand-dark\/80, [class*="bg-white\/"] { background-color: var(--bg-alt) !important; }
.guide-card:hover, .bg-brand-card:hover { border-color: #FFB27A !important; }
.tip { border-left-color: #FF9500 !important; color: var(--ink-3) !important; }
.model-chip, .tier-tab { color: var(--ink-2) !important; }
.model-chip:hover { border-color: #FFB27A !important; color: #E35D00 !important; }
.tier-tab:hover { color: var(--ink) !important; border-color: var(--border-strong) !important; }
.lang-menu button { color: var(--ink-3) !important; }
.lang-menu button:hover, .lang-menu button.active { background: rgba(255,106,0,.08) !important; color: var(--ink) !important; }
.mail-float, .mail-float * { color: var(--ink) !important; }
.badge, .note { background: var(--bg-alt) !important; border-color: var(--border) !important; color: var(--ink-3) !important; }
.default-badge { background: rgba(255,255,255,.25) !important; }

/* 次要按钮（描边圆角） */
a.border.rounded-full, button.border.rounded-full, a.rounded-full.border, .border.rounded-full:not(.fire-btn) { border-color: var(--border-strong) !important; color: var(--ink) !important; background: var(--surface) !important; }

/* ---------- 表格 ---------- */
.table-wrap { border-color: var(--border) !important; background: var(--surface) !important; }
table.t th, .price-table th { background: var(--bg-alt) !important; color: var(--ink-4) !important; border-color: var(--border) !important; }
table.t td, .price-table td, .step { border-color: #F0EEF4 !important; color: var(--ink-2) !important; }
table.t .num, .price-table .num, .num, table.t a, .kv td code, .name code, .price-table .name code { color: var(--ink) !important; }
table.t a:hover { color: #E35D00 !important; }
table.t .muted, .price-table .muted, .muted, .notes, .price-table .notes { color: var(--ink-4) !important; }
table.kv th, .kv th { color: var(--ink-3) !important; background: transparent !important; }
.price-table tbody tr:hover td { background: #FCFBFA !important; }
.calc select, .calc input { background: var(--bg) !important; border-color: var(--border-strong) !important; color: var(--ink) !important; }
.calc .result { color: var(--ink) !important; }

/* 场景页结果标签：浅底上加深 */
.res.ok { background: rgba(16,185,129,.12) !important; color: #047857 !important; }
.res.warn { background: rgba(245,158,11,.14) !important; color: #B45309 !important; }
.res.bad { background: rgba(239,68,68,.12) !important; color: #B91C1C !important; }

/* 彩色字：原来按深底调的 400 色号在浅底上太淡，换成深一档（代码块里的语法高亮在后面恢复） */
.text-green-400, .text-emerald-400 { color: #047857 !important; }
.text-yellow-300, .text-yellow-400, .text-amber-400 { color: #B45309 !important; }
.text-purple-400 { color: #7C3AED !important; }
.text-blue-400 { color: #2563EB !important; }
.text-cyan-300, .text-cyan-400 { color: #0E7490 !important; }
.text-red-400 { color: #B91C1C !important; }
.text-orange-400 { color: #C2410C !important; }

/* 顶部光晕：浅底上淡一些 */
[class*="bg-gradient-to"] { background-image: radial-gradient(900px 420px at 50% 0%, rgba(255,106,0,.10), transparent 70%), radial-gradient(700px 400px at 82% 12%, rgba(255,60,172,.08), transparent 70%) !important; }

/* ---------- 保持原样的部分（放最后，覆盖上面的通用规则） ---------- */
.fire-btn, .fire-btn *, .step-n, .tier-tab.active, .tier-tab.active * { color: #fff !important; }
.tier-tab.active { border-color: transparent !important; background: linear-gradient(135deg, #FF6A00, #FF3CAC) !important; }
.code-block, .code, pre.code, .terminal, .code-window { background: #0F1222 !important; border-color: #23263D !important; color: #E5E5E5 !important; box-shadow: var(--shadow); }
.code-block .text-white, .code .text-white, .code-window .text-white, .code-block h1, .code-block h2, .code-block h3 { color: #fff !important; }
.code-block .text-gray-300, .code .text-gray-300 { color: #D1D5DB !important; }
.code-block .text-gray-400, .code .text-gray-400 { color: #9CA3AF !important; }
.code-block .text-gray-500, .code .text-gray-500, .code-window .text-gray-500 { color: #8B8FA8 !important; }
.code-block .border-brand-border, .code-window .border-brand-border, .code-block .border-b { border-color: #23263D !important; }
.code-block .bg-brand-card, .code-window .bg-brand-card { background: #171A2E !important; box-shadow: none !important; }
:is(.code-block, .code, pre) .text-green-400 { color: #4ADE80 !important; }
:is(.code-block, .code, pre) .text-yellow-300 { color: #FDE047 !important; }
:is(.code-block, .code, pre) :is(.text-yellow-400, .text-amber-400) { color: #FACC15 !important; }
:is(.code-block, .code, pre) .text-purple-400 { color: #C084FC !important; }
:is(.code-block, .code, pre) .text-blue-400 { color: #60A5FA !important; }
:is(.code-block, .code, pre) :is(.text-cyan-300, .text-cyan-400) { color: #67E8F9 !important; }
:is(.code-block, .code, pre) .text-red-400 { color: #F87171 !important; }
:is(.code-block, .code, pre) .text-orange-400 { color: #FB923C !important; }