/* Truck Talk — brand tokens. Single source of truth for colour, radius and
 * type, linked by both the course site and the admin dashboard.
 *
 * BRAND / COMPANY COLOUR:  Truck Talk Navy  #1A3D63
 *
 * Palette (from the brand board):
 *   Navy 900  #0A1931   deepest — text on light, page background in dark mode
 *   Navy 700  #1A3D63   MAIN BRAND COLOUR — headers, primary buttons, logo
 *   Navy 500  #4A7FA7   steel blue — progress, highlights, secondary accents
 *   Navy 200  #B3CFE5   light blue — soft fills, primary button in dark mode
 *   Navy 50   #F6FAFD   near-white — page background in light mode
 */
:root{
  --navy-900:#0A1931;
  --navy-700:#1A3D63;
  --navy-500:#4A7FA7;
  --navy-200:#B3CFE5;
  --navy-50:#F6FAFD;

  color-scheme: light;
  --paper:#F6FAFD;
  --surface:#FFFFFF;
  --surface-2:#EAF2F9;
  --ink:#0A1931;
  --muted:#4D6684;
  --line:#D3E2EF;
  --accent:#1A3D63;          /* primary: buttons, active states, links */
  --accent-ink:#FFFFFF;
  --accent-soft:#DDEAF5;     /* tinted fill behind accent-coloured things */
  --accent-mid:#4A7FA7;
  --accent-2:#1B7F57;        /* success / completed */
  --danger:#C0392B;
  --locked:#A9BBCC;
  --progress:#4A7FA7;
  --header-bg:#1A3D63;
  --header-ink:#F6FAFD;
  --shadow: 0 1px 2px rgba(10,25,49,0.06), 0 6px 20px rgba(10,25,49,0.07);
  --radius-s: 10px;
  --radius-m: 16px;
  --radius-l: 22px;
  --font-display: 'Oswald', 'Arial Narrow', sans-serif;
  --font-body: 'Inter', -apple-system, 'Segoe UI', sans-serif;
  --font-mono: 'IBM Plex Mono', 'Consolas', monospace;
}

@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    color-scheme: dark;
    --paper:#0A1931;
    --surface:#11294A;
    --surface-2:#173559;
    --ink:#F6FAFD;
    --muted:#9FB9D2;
    --line:#25486F;
    --accent:#B3CFE5;
    --accent-ink:#0A1931;
    --accent-soft:#1C3F68;
    --accent-mid:#4A7FA7;
    --accent-2:#4CC38A;
    --danger:#FF8F7E;
    --locked:#3B587A;
    --progress:#4A7FA7;
    --header-bg:#0D2140;
    --header-ink:#F6FAFD;
    --shadow: 0 1px 2px rgba(0,0,0,0.3), 0 6px 20px rgba(0,0,0,0.35);
  }
}
:root[data-theme="dark"]{
  color-scheme: dark;
  --paper:#0A1931;
  --surface:#11294A;
  --surface-2:#173559;
  --ink:#F6FAFD;
  --muted:#9FB9D2;
  --line:#25486F;
  --accent:#B3CFE5;
  --accent-ink:#0A1931;
  --accent-soft:#1C3F68;
  --accent-mid:#4A7FA7;
  --accent-2:#4CC38A;
  --danger:#FF8F7E;
  --locked:#3B587A;
  --progress:#4A7FA7;
  --header-bg:#0D2140;
  --header-ink:#F6FAFD;
  --shadow: 0 1px 2px rgba(0,0,0,0.3), 0 6px 20px rgba(0,0,0,0.35);
}