/* Aurora - clean, airy theme. Deep teal accent, generous spacing, soft elevation.
   Item 19: ships BOTH palettes. :root is the light palette; [data-mode="dark"] is the dark one.
   The head script resolves data-mode-pref="auto" before first paint; the @media block is the
   no-JavaScript fallback so "auto" still follows the OS. */
:root {
  color-scheme: light;
  --font: "IBM Plex Sans Arabic", "Segoe UI", "Noto Sans Arabic", Tahoma, system-ui, sans-serif;
  --font-head: "IBM Plex Sans Arabic", "Segoe UI", "Noto Sans Arabic", Tahoma, system-ui, sans-serif;
  --fs: 16px;
  --bg: #f4f6f9; --surface: #ffffff; --field-bg: #ffffff;
  --ink: #101c2e; --ink-2: #5a6b82;
  --line: #e4e9f0; --line-strong: #ccd5e1;
  --accent: #0f766e; --accent-ink: #ffffff; --accent-soft: rgba(15,118,110,.10);
  --danger: #c0271b; --ok: #15803d; --warn: #b45309;
  --head-bg: rgba(255,255,255,.92); --head-ink: #101c2e; --head-line: #e4e9f0; --shadow-head: 0 1px 0 rgba(16,28,46,.03), 0 8px 24px -16px rgba(16,28,46,.18);
  --side-bg: #ffffff; --side-ink: #2a3a52; --side-mute: #8b99ad; --side-hover: #f1f5f9; --side-line: #e4e9f0;
  --side-active-bg: rgba(15,118,110,.10); --side-active-ink: #0b544e;
  --th-bg: #f6f8fb; --th-ink: #4a5a72; --row-hover: #f6f9fc; --row-group: #f3f6fa; --row-total: #e6f3f1;
  --radius: 14px; --radius-sm: 10px;
  --shadow: 0 1px 2px rgba(16,28,46,.05), 0 10px 28px -14px rgba(16,28,46,.16);
  --shadow-pop: 0 20px 48px -12px rgba(16,28,46,.28);
  --btn-shadow: 0 6px 14px -6px rgba(15,118,110,.55);
  --ctl-h: 2.55rem; --cell-pad: .68rem .9rem; --main-pad: 1.8rem; --side-w: 16.5rem; --head-h: 3.7rem;
  --pop-bg: #ffffff; --cal-filter: none;
}
.page-title { font-weight: 800; letter-spacing: -.01em; }
.head { backdrop-filter: saturate(1.4) blur(10px); -webkit-backdrop-filter: saturate(1.4) blur(10px); }
input[type="date"]::-webkit-calendar-picker-indicator { filter: var(--cal-filter); }

/* ---------- dark palette ---------- */
:root[data-mode="dark"] {
  color-scheme: dark;
  --bg: #0d1524; --surface: #131d31; --field-bg: #101a2c;
  --ink: #e6edf7; --ink-2: #93a3bd;
  --line: #22304a; --line-strong: #36496c;
  --accent: #2dd4bf; --accent-ink: #04211d; --accent-soft: rgba(45,212,191,.14);
  --danger: #ff7b72; --ok: #4ade80; --warn: #fbbf24;
  --head-bg: rgba(13,21,36,.9); --head-ink: #e6edf7; --head-line: #22304a; --shadow-head: none;
  --side-bg: #101a2c; --side-ink: #cbd5e5; --side-mute: #7b8ca8; --side-hover: #17233a; --side-line: #22304a;
  --side-active-bg: rgba(45,212,191,.14); --side-active-ink: #7ff0e2;
  --th-bg: #17223a; --th-ink: #a7b6cf; --row-hover: #17233a; --row-group: #162034; --row-total: #123129;
  --shadow: 0 1px 2px rgba(0,0,0,.45), 0 10px 28px -14px rgba(0,0,0,.65);
  --shadow-pop: 0 20px 48px -12px rgba(0,0,0,.75);
  --btn-shadow: 0 6px 14px -6px rgba(45,212,191,.5);
  --pop-bg: #131d31; --cal-filter: invert(1);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-mode="light"]) {
    color-scheme: dark;
    --bg: #0d1524; --surface: #131d31; --field-bg: #101a2c;
    --ink: #e6edf7; --ink-2: #93a3bd;
    --line: #22304a; --line-strong: #36496c;
    --accent: #2dd4bf; --accent-ink: #04211d; --accent-soft: rgba(45,212,191,.14);
    --danger: #ff7b72; --ok: #4ade80; --warn: #fbbf24;
    --head-bg: rgba(13,21,36,.9); --head-ink: #e6edf7; --head-line: #22304a; --shadow-head: none;
    --side-bg: #101a2c; --side-ink: #cbd5e5; --side-mute: #7b8ca8; --side-hover: #17233a; --side-line: #22304a;
    --side-active-bg: rgba(45,212,191,.14); --side-active-ink: #7ff0e2;
    --th-bg: #17223a; --th-ink: #a7b6cf; --row-hover: #17233a; --row-group: #162034; --row-total: #123129;
    --shadow: 0 1px 2px rgba(0,0,0,.45), 0 10px 28px -14px rgba(0,0,0,.65);
    --shadow-pop: 0 20px 48px -12px rgba(0,0,0,.75);
    --btn-shadow: 0 6px 14px -6px rgba(45,212,191,.5);
    --pop-bg: #131d31; --cal-filter: invert(1);
  }
}
.pop-body, .combo-list { background: var(--pop-bg); }

/* ---------- responsive ---------- */
@media (max-width: 900px) { :root { --main-pad: 1rem; --ctl-h: 2.7rem; } }
@media (max-width: 600px) { :root { --side-w: 100%; --cell-pad: .55rem .65rem; } }
