/* 1) 主题变量：light 与 dark 两套 */
html[data-theme="light"] {
  --bg: #ffffff;
  --bg-elevated: #ffffff;
  --text: #111827;
  --muted: #6b7280;
  --primary: #3b82f6;
  --danger: #ef4444;
  --border: #e5e7eb;

  --bs-body-bg: var(--bg);
  --bs-body-color: var(--text);
}

html[data-theme="dark"] {
  --bg: #0f1115;
  --bg-elevated: #161a22;
  --text: #e5e7eb;
  --muted: #9aa1aa;
  --primary: #3b82f6;
  --danger: #ef4444;
  --border: #262a33;

  --bs-body-bg: var(--bg);
  --bs-body-color: var(--text);
}

/* 2) 基础 */
body.bg-body {
  background-color: var(--bs-body-bg) !important;
  color: var(--bs-body-color) !important;
}
.text-body { color: var(--bs-body-color) !important; }

a { color: var(--primary); }
hr, .border, .border-top, .border-bottom, .border-start, .border-end {
  border-color: var(--border) !important;
}

/* 3) 容器与卡片 */
.card {
  background-color: var(--bg-elevated) !important;
  color: var(--bs-body-color) !important;
  border-color: var(--border) !important;
}

/* 4) 表格 */
.table {
  color: var(--bs-body-color) !important;
  background-color: var(--bg-elevated) !important;
}
.table td, .table th {
  background-color: var(--bg-elevated) !important;
  color: var(--bs-body-color) !important;
  border-color: var(--border) !important;
}
.table-striped > tbody > tr:nth-of-type(odd) > * {
  background-color: rgba(255, 255, 255, 0.03) !important;
}

/* 5) 表单 */
.form-label { color: var(--bs-body-color) !important; }
.form-control, .form-select, .form-check-input, textarea.form-control {
  background-color: color-mix(in srgb, var(--bg-elevated) 92%, #000 8%) !important;
  color: var(--bs-body-color) !important;
  border-color: var(--border) !important;
}
.form-control::placeholder { color: var(--muted) !important; }
.form-control:focus, .form-select:focus {
  border-color: color-mix(in srgb, var(--primary) 70%, var(--border) 30%) !important;
  box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--primary) 25%, transparent) !important;
}

/* 6) 警示 */
.alert {
  background-color: var(--bg-elevated) !important;
  color: var(--bs-body-color) !important;
  border-color: var(--border) !important;
}

/* 7) 按钮 */
.btn-primary {
  background-color: var(--primary) !important;
  border-color: var(--primary) !important;
  color: #fff !important;
}
.btn-danger {
  background-color: var(--danger) !important;
  border-color: var(--danger) !important;
  color: #fff !important;
}

/* 清空购物车按钮 */
.clear-cart-btn {
  background-color: #000;
  color: #fff;
  border: none;
  box-shadow: 0 2px 6px rgba(0,0,0,0.2);
  transition: box-shadow .2s ease, transform .05s ease;
}
.clear-cart-btn:hover { box-shadow: 0 4px 12px rgba(0,0,0,0.3); }
.clear-cart-btn:active { transform: translateY(1px); }

html[data-theme="dark"] .clear-cart-btn {
  background-color: #fff !important;
  color: #000 !important;
  box-shadow: 0 2px 8px rgba(255,255,255,0.25) !important;
}
html[data-theme="dark"] .clear-cart-btn:hover {
  box-shadow: 0 4px 12px rgba(255,255,255,0.35) !important;
}

/* 8) 诊断 */
html[data-theme="dark"] body { outline: 1px solid rgba(255,255,255,0.06); }

/* 顶部导航 */
html[data-theme="dark"] .navbar,
html[data-theme="dark"] .navbar * {
  background-color: var(--bg-elevated) !important;
  color: var(--bs-body-color) !important;
}

/* 标题与强调文字 */
html[data-theme="dark"] h1,
html[data-theme="dark"] h2,
html[data-theme="dark"] h3,
html[data-theme="dark"] .fw-semibold,
html[data-theme="dark"] .lead,
html[data-theme="dark"] .text-heading {
  color: var(--bs-body-color) !important;
}

/* 夜间模式下，收货信息标题显示为白色 */
html[data-theme="dark"] h5.section-title {
  color: #ffffff !important;
  font-weight: bold;
}

/* 说明文字 */
html[data-theme="dark"] .text-muted,
html[data-theme="dark"] .form-text,
html[data-theme="dark"] small {
  color: var(--muted) !important;
}

/* 切换按钮 */
html[data-theme="dark"] .toggle-theme-btn {
  color: #fff !important;
  border-color: #fff !important;
}
html[data-theme="dark"] .toggle-theme-btn:hover {
  background-color: #fff !important;
  color: #000 !important;
}

/* 继续购物按钮 */
html[data-theme="dark"] .continue-shopping-btn {
  background-color: #fff !important;
  color: #000 !important;
  border-color: #fff !important;
}
html[data-theme="dark"] .continue-shopping-btn:hover {
  background-color: #000 !important;
  color: #fff !important;
  border-color: #fff !important;
}

/* ✅ 表单区域暗黑模式优化 */
html[data-theme="dark"] .form-label {
  color: #ffffff !important;
}
html[data-theme="dark"] .form-control,
html[data-theme="dark"] .form-select,
html[data-theme="dark"] .form-check-input {
  background-color: #1b1f2a !important;
  color: #e5e7eb !important;
  border-color: #2a2f3a !important;
}
html[data-theme="dark"] .form-control::placeholder {
  color: #9aa1aa !important;
}
html[data-theme="dark"] .form-control:focus,
html[data-theme="dark"] .form-select:focus {
  border-color: #3b82f6 !important;
  box-shadow: 0 0 0 0.2rem rgba(59,130,246,0.25) !important;
}
html[data-theme="dark"] #userInfoTip,
html[data-theme="dark"] .form-text,
html[data-theme="dark"] small {
  color: #9aa1aa !important;
}