/* ===== Dark theme (item 500b4b13) =====
 * Overrides the CSS custom properties app.css declares on :root. Every rule
 * in app.css that reads a var(--...) picks these up automatically; raw hex
 * values hardcoded in a handful of older rules (and a few inline styles in
 * app.js) are NOT covered here — known gap, tracked as a follow-up rather
 * than blocking this toggle.
 *
 * Applied via html[data-theme="dark"] (see frontend/js/theme.js), so the
 * default (no attribute, or data-theme="light") renders byte-identically to
 * before this change.
 */
html[data-theme="dark"] {
  --primary: #7c8ce0;
  --primary-light: #8b9aeb;
  --primary-dark: #4a5798;
  --accent: #5398f6;
  --accent-light: #7bb6ff;
  --accent-soft: rgba(83,152,246,0.16);

  --bg: #12161f;
  --bg-card: #181d29;
  --bg-secondary: #1c212f;
  --bg-page: #12161f;
  --bg-input: #1c212f;
  --bg-hover: rgba(83,152,246,0.08);
  --bg-sidebar: #0e121a;
  --bg-sidebar-hover: rgba(255,255,255,0.06);
  --bg-sidebar-active: rgba(83,152,246,0.18);

  --text: #e6e9f2;
  --text-secondary: #a8adbd;
  --text-sec: #a8adbd;
  --text-muted: #7a8194;
  --text-dim: rgba(230,233,242,0.5);
  --text-sidebar: #e6e9f2;
  --text-sidebar-active: #ffffff;

  --border: #2a3148;
  --border-light: #232a3a;

  --pass: #4ade80;
  --pass-bg: rgba(60,198,154,0.18);
  --fail: #f87171;
  --fail-bg: rgba(193,21,58,0.22);
  --red: #f87171;
  --pending: #a8adbd;
  --pending-bg: rgba(103,104,101,0.25);
  --partial: #fbbf5c;
  --partial-bg: rgba(250,169,56,0.18);
  --warning: #ff8a5c;
  --not-testable: #a8adbd;
  --not-testable-bg: rgba(103,104,101,0.18);
  --blue: #7b93f7;
  --blue-soft: rgba(71,78,203,0.18);
  --orange: #ff8a5c;
  --yellow: #fbbf5c;
  --green: #4ade80;

  --shadow-sm: 0 1px 2px rgba(0,0,0,0.3);
  --shadow: 0 1px 3px rgba(0,0,0,0.4);
  --shadow-md: 0 4px 6px -1px rgba(0,0,0,0.45), 0 2px 4px -2px rgba(0,0,0,0.3);
  --shadow-lg: 0 4px 16px rgba(0,0,0,0.5);
}
