/* MHC-huisstijl – design tokens.
   Groen gemeten uit het MHC-logo (static/mhc-logo.png): #00583C.
   Pas huisstijlwijzigingen alleen hier aan. */
:root {
  --mhc-groen: #00583C;
  --mhc-groen-donker: #003F2B;
  --mhc-groen-midden: #40826D;   /* anti-alias tint uit het logo */
  --mhc-groen-licht: #E6F0EC;
  --mhc-groen-zacht: #BFD5CE;

  --font-kop: "Barlow Condensed", "Arial Narrow", system-ui, sans-serif;
  --font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

  --primary: var(--mhc-groen);
  --primary-hover: var(--mhc-groen-donker);
  --primary-tekst: #FFFFFF;
  --bg: #F4F7F5;
  --surface: #FFFFFF;
  --surface-2: var(--mhc-groen-licht);
  --rand: #DCE5E1;
  --text: #17231E;
  --text-zacht: #56645E;
  --focus: #1E7A5A;

  /* gedempte statuskleuren, zodat het groen dominant blijft */
  --st-nieuw: #1C5D99;      --st-nieuw-bg: #E4EEF8;
  --st-bezig: #8A5A00;      --st-bezig-bg: #FBF0DA;
  --st-wacht: #6B4C9A;      --st-wacht-bg: #EFE9F7;
  --st-klaar: #2E6B4F;      --st-klaar-bg: #E3EFE9;
  --st-afgewezen: #5E6470;  --st-afgewezen-bg: #ECEEF1;
  --hoog: #B42318;          --hoog-bg: #FDECEA;

  --radius: 10px;
  --schaduw: 0 1px 2px rgba(0, 40, 25, .06), 0 2px 8px rgba(0, 40, 25, .05);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --primary: #2F9A72;
    --primary-hover: #3DB287;
    --bg: #0F1714;
    --surface: #17221E;
    --surface-2: #1D2B26;
    --rand: #2A3A34;
    --text: #E6EEEA;
    --text-zacht: #A3B3AC;
    --focus: #5FD0A4;
    --st-nieuw: #8BB8E8;      --st-nieuw-bg: #1B2B3B;
    --st-bezig: #E8C27A;      --st-bezig-bg: #3A2F18;
    --st-wacht: #C3A9EA;      --st-wacht-bg: #2C2440;
    --st-klaar: #8FD1B2;      --st-klaar-bg: #1C3329;
    --st-afgewezen: #B4BAC4;  --st-afgewezen-bg: #2A2E34;
    --hoog: #F49B92;          --hoog-bg: #3B1E1B;
    --schaduw: none;
  }
}