/* tokens.css — VaaS-Zorg merkstandaard
   Laad dit als eerste stylesheet op elke pagina, voor nav.css en eigen <style>.
   Definieer GEEN eigen :root kleurtokens in pagina-specifieke CSS. */

:root {
  /* Light-only ontwerp: voorkom dat browser/OS in donkere modus de
     invoervelden omkeert (wit-op-wit tekst tijdens typen). */
  color-scheme: light;

  /* Primaire kleuren */
  --navy:        #1D3D59;
  --navy-80:     rgba(29,61,89,.8);
  --navy-50:     rgba(29,61,89,.5);
  --navy-10:     rgba(29,61,89,.1);
  --navy-05:     rgba(29,61,89,.05);

  /* Accentkleuren */
  --lime:        #73A605;
  --lime-dark:   #628E04;
  --lime-tint:   rgba(115,166,5,.12);
  --lime-600:    #5a8a04;
  --blue:        #2E7DB8;

  /* Neutrale kleuren */
  --silver:      #5A7080;
  --muted:       #5A6B7B;
  --hint:        #8A9DAA;
  --light:       #E8ECF0;
  --bg:          #F5F7FA;
  --white:       #FFFFFF;

  /* Feedback */
  --score-red:   #E24B4A;
  --score-orange:#EF9F27;
  --score-green: #73A605;

  /* Typografie */
  --font:        'Plus Jakarta Sans', system-ui, sans-serif;
  --lh-base:     1.6;

  /* Schaduwen */
  --shadow-sm:   0 1px 3px rgba(29,61,89,.06);
  --shadow-md:   0 4px 12px rgba(29,61,89,.08);
  --shadow-lg:   0 8px 24px rgba(29,61,89,.10);

  /* Border-radii */
  --radius:      12px;
  --radius-sm:   8px;
  --radius-xs:   5px;
}

/* Basis body-reset */
body {
  font-family: var(--font);
  color: var(--navy);
  background: var(--bg);
  line-height: var(--lh-base);
  -webkit-font-smoothing: antialiased;
  margin: 0;
}

/* iOS Safari zet in zijn UA-stylesheet een eigen -webkit-text-fill-color op
   invoervelden, die de CSS `color` overschrijft — daardoor werd getypte tekst
   (o.a. het KvK-zoekveld op vastgoedprofiel) wit-op-wit weergegeven op iPhone,
   terwijl andere browsers de navy `color` correct toonden. Dwing de tekst­kleur
   gelijk aan de eigen `color` van het veld (currentColor), zodat velden met een
   donkere achtergrond en witte `color` óók goed blijven. Ook bij iOS-autofill. */
input, textarea, select { -webkit-text-fill-color: currentColor; }
input:-webkit-autofill,
textarea:-webkit-autofill,
select:-webkit-autofill { -webkit-text-fill-color: currentColor; }
