/* Structural palette is fixed across every trip — never themed.
   Only --accent / --accent-soft / --accent-deep vary per trip (and may
   vary further between light/dark — see js/ui/applyAccent.js). */

:root {
  color-scheme: dark;

  --deep: #0D2942;
  --deep2: #123556;
  --surface: #173F63;
  --raise: #1E4C77;
  --line: #2C5C89;
  --tx: #EDF4FA;
  --tx2: #AEC8DE;
  --tx3: #7799B8;
  --border: var(--line);
  /* Section dividers that sit directly on the page wash (not inside a
     white card) — white in light mode for real contrast against the blue
     wash; same as --border in dark mode, where --border already contrasts
     fine against the dark navy page. */
  --wash-divider: var(--line);

  --priority-high: #6BD49A;
  --priority-medium: #F0BE5C;
  --priority-low: #EF807C;

  /* Text set on top of accent/priority/tag-colored surfaces (badges, primary
     buttons, the active day chip). Deliberately a single fixed dark value in
     both themes rather than following --deep (which flips to near-white in
     light mode) — every one of those surface colors is medium-to-bright by
     design, so a constant dark tone reads cleanly against all of them in
     both themes without needing per-surface-per-theme tuning. */
  --on-accent: #10243B;

  /* Placeholder dev gray-blue — overridden per trip by applyAccent.js once a
     real trip loads. Only relevant before that JS runs. */
  --accent: #6E8FA8;
  --accent-soft: #A8BCCB;
  --accent-deep: #4D6476;
}

/* Light mode: system preference, only when no manual override is set */
@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) {
    color-scheme: light;
    --deep: #FBFAF6;
    --deep2: #FBFAF6;
    --surface: #FFFFFF;
    --raise: #F1EFE8;
    --line: #E4E2DA;
    --border: var(--line);
    --wash-divider: #FFFFFF;
    --tx: #10243B;
    --tx2: #3E5872;
    --tx3: #6B8299;

    --priority-high: #3F9A6C;
    --priority-medium: #B8863A;
    --priority-low: #C24B47;
  }
}

/* Manual toggle: force light even on a dark system */
:root[data-theme="light"] {
  color-scheme: light;
  --deep: #FBFAF6;
  --deep2: #FBFAF6;
  --surface: #FFFFFF;
  --raise: #F1EFE8;
  --line: #E4E2DA;
  --border: var(--line);
  --wash-divider: #FFFFFF;
  --tx: #10243B;
  --tx2: #3E5872;
  --tx3: #6B8299;

  --priority-high: #3F9A6C;
  --priority-medium: #B8863A;
  --priority-low: #C24B47;
}

/* Manual toggle: force dark even on a light system */
:root[data-theme="dark"] {
  color-scheme: dark;
  --deep: #0D2942;
  --deep2: #123556;
  --surface: #173F63;
  --raise: #1E4C77;
  --line: #2C5C89;
  --border: var(--line);
  --wash-divider: var(--line);
  --tx: #EDF4FA;
  --tx2: #AEC8DE;
  --tx3: #7799B8;

  --priority-high: #6BD49A;
  --priority-medium: #F0BE5C;
  --priority-low: #EF807C;
}
