/* ============================================================
   暖白主题 · 覆盖培训系统原深色主题
   加载顺序：style.css → workbench.css → theme-warm.css
   仅改视觉，不动任何交互与结构
   ============================================================ */
:root {
  --bg: #f6f2eb;
  --panel: #fffdf9;
  --panel-strong: #ffffff;
  --stroke: #e7dfd2;
  --stroke-strong: #d9cfbf;
  --text: #28303c;
  --text-strong: #161c26;
  --muted: #6f6a60;
  --dim: #8a8378;
  --placeholder: #a89f92;
  --hover: rgba(79, 70, 229, 0.06);
  --hover-strong: rgba(79, 70, 229, 0.1);
  --line: #eee7db;
  --surface: #fbf7f0;
  --surface-soft: #fbf7f0;
  --glass-hi: rgba(255, 255, 255, 0.9);
  --scroll: #ddd3c4;
  --grid-line: rgba(31, 36, 48, 0.05);
  --shadow: 0 16px 40px -28px rgba(31, 36, 48, 0.28), 0 1px 2px rgba(31, 36, 48, 0.04);
  --shadow-lift: 0 30px 70px -36px rgba(31, 36, 48, 0.35), 0 0 0 1px var(--stroke);
  --focus: rgba(79, 70, 229, 0.14);
  --indigo: #4f46e5;
  --cyan: #0891b2;
  --green: #16a34a;
  --amber: #d97706;
  --red: #dc2626;
  --ok-text: #15803d;
  --danger-text: #b91c1c;
  --warn-text: #b45309;
  --accent-text: #4f46e5;
  --money-text: #0e7490;
  --grad: linear-gradient(135deg, #4f46e5 0%, #0891b2 100%);
  --grad-violet: linear-gradient(135deg, #7c3aed 0%, #4f46e5 100%);
  --blend: normal;
  --aurora-opacity: 0;
  --on-accent: #ffffff;
  --r-lg: 16px;
  --r-md: 12px;
  --r-sm: 8px;
  color-scheme: light;
}

body { background: var(--bg); }
::selection { background: rgba(79, 70, 229, 0.18); color: var(--text-strong); }

::-webkit-scrollbar-thumb { background: var(--scroll); }
::-webkit-scrollbar-thumb:hover { background: #cbbfad; }

/* 背景装饰：暖白下不需要极光与网格 */
.aurora, .grid-overlay { display: none !important; }

/* ---------------- 玻璃面板 → 暖白卡片 ---------------- */
.glass {
  background: var(--panel);
  border: 1px solid var(--stroke);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  box-shadow: var(--shadow);
}
.glass::before { display: none; }

/* ---------------- 按钮 ---------------- */
.btn {
  background: #ffffff;
  border-color: var(--stroke-strong);
  color: var(--text);
  box-shadow: 0 1px 2px rgba(31, 36, 48, 0.04);
}
.btn:hover { background: #fbf6ee; border-color: #cbbfae; }
.btn-primary {
  background: var(--indigo);
  border-color: var(--indigo);
  color: #ffffff;
  box-shadow: 0 10px 24px -14px rgba(79, 70, 229, 0.7);
}
.btn-primary:hover {
  background: #4338ca;
  border-color: #4338ca;
  box-shadow: 0 14px 30px -16px rgba(79, 70, 229, 0.75);
}
.btn-danger { color: var(--danger-text); border-color: #f0caca; background: #fdf3f3; }
.btn-danger:hover { background: #fbe9e9; border-color: #e5b4b4; }
.icon-btn { color: var(--muted); }
.icon-btn:hover { background: var(--hover); color: var(--text); border-color: var(--stroke); }
.link-btn:hover { color: var(--cyan); }

/* ---------------- 登录 ---------------- */
.login-card { background: var(--panel); }
.login-left::after {
  background: radial-gradient(circle, rgba(79, 70, 229, 0.1), transparent 68%);
}
.login-right { background: var(--surface); border-left: 1px solid var(--stroke); }
.logo { box-shadow: 0 10px 26px -12px rgba(79, 70, 229, 0.7); }
.hero-sub { color: var(--muted); }
.feat .ic {
  background: rgba(79, 70, 229, 0.08);
  border-color: rgba(79, 70, 229, 0.18);
}
.field input {
  background: #ffffff;
  border-color: var(--stroke-strong);
}
.field input:hover { border-color: #cbbfae; }
.field input:focus {
  background: #ffffff;
  border-color: rgba(79, 70, 229, 0.55);
  box-shadow: 0 0 0 4px var(--focus);
}
.input-wrap .eye { color: var(--dim); }
.input-wrap .eye:hover { color: var(--text); }
.login-err, .form-err {
  background: #fdf3f3;
  border-color: #eec4c4;
  color: var(--danger-text);
}
.btn-login.loading::after { border-color: rgba(255, 255, 255, 0.35); border-top-color: #ffffff; }
.demo-tip {
  background: #f0f8fa;
  border-color: #cfe7ec;
  color: var(--muted);
}
.demo-tip b { color: var(--money-text); }
.auth-foot { color: var(--dim); }

/* ---------------- 框架 ---------------- */
.sidebar {
  background: #fbf7f0;
  border-right: 1px solid var(--stroke);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
.side-brand h1 { color: var(--text-strong); }
.side-brand p { color: var(--dim); }
.nav-item { color: var(--muted); }
.nav-item:hover { background: var(--hover); color: var(--text-strong); }
.nav-item.active {
  color: var(--indigo);
  background: rgba(79, 70, 229, 0.08);
  border-color: rgba(79, 70, 229, 0.2);
}
.nav-item.active::before {
  background: var(--indigo);
  box-shadow: none;
}
.side-foot { border-top-color: var(--line); color: var(--dim); }
.status-dot { box-shadow: 0 0 0 4px rgba(22, 163, 74, 0.12); }

.topbar {
  background: rgba(251, 247, 240, 0.9);
  border-bottom: 1px solid var(--stroke);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}
.topbar-title h1 { color: var(--text-strong); }
.topbar-title p { color: var(--dim); }
.user-chip { background: #ffffff; border-color: var(--stroke); }
.avatar { color: #ffffff; }
.user-meta b { color: var(--text); }
.user-meta small { color: var(--dim); }
.icon-btn.logout:hover { color: var(--danger-text); border-color: #f0caca; background: #fdf3f3; }

.content { background: transparent; }

/* ---------------- 卡片 / 统计 ---------------- */
.card-head p, .card-head h3 { color: inherit; }
.card-head h3 { color: var(--text-strong); }
.card-head p { color: var(--dim); }

.welcome {
  background:
    radial-gradient(ellipse 70% 150% at 0% 0%, rgba(79, 70, 229, 0.07), transparent 60%),
    radial-gradient(ellipse 60% 140% at 100% 100%, rgba(8, 145, 178, 0.06), transparent 60%),
    var(--panel);
}
.welcome-date { background: #ffffff; border-color: var(--stroke); color: var(--muted); }

.practice-banner {
  background:
    radial-gradient(ellipse 60% 160% at 8% 0%, rgba(8, 145, 178, 0.08), transparent 60%),
    radial-gradient(ellipse 50% 150% at 100% 100%, rgba(79, 70, 229, 0.07), transparent 62%),
    var(--panel);
}
.road-practice-banner {
  background:
    radial-gradient(ellipse 60% 160% at 8% 0%, rgba(22, 163, 74, 0.07), transparent 60%),
    radial-gradient(ellipse 50% 150% at 100% 100%, rgba(8, 145, 178, 0.07), transparent 62%),
    var(--panel);
}
.practice-icon { box-shadow: 0 10px 24px -14px rgba(79, 70, 229, 0.55); }
.practice-kind { border-color: var(--stroke); background: #faf6ef; color: var(--muted); }
.practice-kind.road { color: var(--money-text); border-color: #cfe7ec; background: #f0f8fa; }
.nav-item.nav-practice:hover .nav-ext { color: var(--cyan); }

.switch-row { background: #ffffff; border-color: var(--stroke); }
.switch-row input { accent-color: var(--indigo); }

.stat-card { background: var(--panel); }
.stat-card:hover { border-color: #d3c8b8; }
.stat-icon {
  background: rgba(79, 70, 229, 0.08);
  border-color: rgba(79, 70, 229, 0.18);
}
.stat-card.green .stat-icon { background: rgba(22, 163, 74, 0.09); border-color: rgba(22, 163, 74, 0.22); }
.stat-card.cyan .stat-icon { background: rgba(8, 145, 178, 0.09); border-color: rgba(8, 145, 178, 0.22); }
.stat-card.violet .stat-icon { background: rgba(124, 58, 237, 0.08); border-color: rgba(124, 58, 237, 0.2); color: #6d28d9; }

.quick-action { background: #ffffff; border-color: var(--stroke); }
.quick-action:hover { background: #fbf6ee; border-color: rgba(79, 70, 229, 0.3); }
.quick-action .ic { background: rgba(79, 70, 229, 0.08); border-color: rgba(79, 70, 229, 0.18); }

/* ---------------- 表单控件 ---------------- */
.search input, .select, .textarea {
  background: #ffffff;
  border-color: var(--stroke-strong);
  color: var(--text);
}
.search input:focus, .select:focus, .textarea:focus {
  border-color: rgba(79, 70, 229, 0.55);
  box-shadow: 0 0 0 3px var(--focus);
}
.select option { background: #ffffff; color: var(--text); }
.select { background-image: linear-gradient(45deg, transparent 50%, var(--dim) 50%), linear-gradient(135deg, var(--dim) 50%, transparent 50%); }

/* ---------------- 表格 ---------------- */
.table-wrap { border-color: var(--line); background: var(--panel); }
.data-table th { background: #f7f2e9; color: var(--dim); border-bottom-color: var(--line); }
.data-table td { border-bottom-color: var(--line); }
.data-table tbody tr:hover { background: #faf6ef; }
.row-actions .act:hover { background: var(--hover); color: var(--text); border-color: var(--stroke); }
.row-actions .act.danger:hover { color: var(--danger-text); border-color: #f0caca; background: #fdf3f3; }
.cell-user span { color: var(--dim); }

/* ---------------- 标签 ---------------- */
.tag.admin { color: #6d28d9; background: rgba(124, 58, 237, 0.09); border-color: rgba(124, 58, 237, 0.2); }
.tag.reviewer { color: var(--warn-text); background: rgba(217, 119, 6, 0.08); border-color: rgba(217, 119, 6, 0.22); }
.tag.user { color: var(--accent-text); background: rgba(79, 70, 229, 0.08); border-color: rgba(79, 70, 229, 0.2); }
.tag.on { color: var(--ok-text); background: rgba(22, 163, 74, 0.08); border-color: rgba(22, 163, 74, 0.2); }
.tag.off { color: var(--dim); background: #f6f1e8; border-color: var(--stroke); }
.tag.pending { color: var(--warn-text); background: rgba(217, 119, 6, 0.08); border-color: rgba(217, 119, 6, 0.22); }
.tag.pass { color: var(--ok-text); background: rgba(22, 163, 74, 0.08); border-color: rgba(22, 163, 74, 0.2); }
.tag.fail { color: var(--danger-text); background: rgba(220, 38, 38, 0.07); border-color: rgba(220, 38, 38, 0.2); }

/* ---------------- 账号 / 审核 ---------------- */
.info-row b { color: var(--text); }
.form-tip { color: var(--dim); }
.cred-box {
  background: rgba(79, 70, 229, 0.05);
  border-color: rgba(79, 70, 229, 0.28);
}
.review-target {
  background: rgba(79, 70, 229, 0.05);
  border-color: rgba(79, 70, 229, 0.22);
}
.textarea { background: #ffffff; }

/* ---------------- 弹窗 / 提示 ---------------- */
.modal-mask {
  background: rgba(31, 36, 48, 0.35);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
}
.modal {
  background: var(--panel);
  border: 1px solid var(--stroke);
  box-shadow: 0 34px 90px -40px rgba(31, 36, 48, 0.45);
}
.modal-head h3 { color: var(--text-strong); }
.modal-head p { color: var(--dim); }
.modal-note {
  background: #f0f8fa;
  border-color: #cfe7ec;
  color: var(--muted);
}
.pw-gen { background: #ffffff; border-color: var(--stroke-strong); }
.pw-gen:hover { background: var(--hover-strong); }

.toast {
  background: var(--panel);
  border-color: var(--stroke);
  color: var(--text);
}