/* Sorgente unica dei token di KilowattZero.
   Questo file è servito come asset alla PWA (index.html, admin.html, osm.html)
   ED è importato come testo da src/lib/html.ts, dove finisce nel CSS critico
   inline delle pagine del Worker (vedi la regola [[rules]] type="Text" in
   wrangler.toml). Il valore va cambiato qui e solo qui. */
:root {
  /* Colore — il verde del brand e le tre tinte di stato della mappa */
  --c-green: #0d5c3f;
  --c-green-bright: #15803d;
  --c-yellow: #d97706;
  --c-red: #dc2626;

  /* Testo, dal più marcato al più tenue. Otto tinte per una gerarchia che ne
     userebbe tre: è l'eredità dei quattro fogli scritti a mano.
     Le tre più tenui erano sotto il rapporto di contrasto 4.5:1 su --c-page
     (4,10 · 3,21 · 2,43) e Lighthouse le segnalava su ogni pagina. Sono state
     scurite fino a superare la soglia: il minimo scurimento necessario le
     faceva convergere sullo stesso colore, quindi le due più chiare ora
     coincidono davvero invece di fingere una gerarchia che l'occhio non
     distingueva già prima. */
  --c-ink: #1a2b23;
  --c-ink-soft: #3d5449;
  --c-ink-soft-2: #47584f;
  --c-ink-muted: #4b5f55;
  --c-muted: #5b6f64;
  --c-muted-2: #5f7168;
  --c-faint: #617569;
  --c-faint-2: #617569;

  /* Superfici */
  --c-surface: #ffffff;
  --c-page: #f6f8f7;
  --c-subtle: #f2f6f3;
  --c-subtle-2: #eef2ef;
  --c-subtle-3: #eaf3ed;
  --c-map-bg: #dce8e1;

  /* Bordi, dal più marcato al più tenue */
  --c-border: #cdd8d1;
  --c-border-soft: #d5ded8;
  --c-border-softer: #dde5e0;

  /* Badge di stato: coppia fondo/testo, contrasto già verificato */
  --c-badge-green-bg: #d8f3e3;
  --c-badge-green-fg: #0d5c3f;
  --c-badge-yellow-bg: #fdf3d0;
  --c-badge-yellow-fg: #7a5b00;
  --c-badge-red-bg: #fbdfdc;
  --c-badge-red-fg: #a02318;

  /* Avviso (diff OSM che richiede attenzione) */
  --c-warn: #e6c200;
  --c-warn-bg: #fff7d6;
  --c-warn-fg: #6b5200;

  --c-on-green: #ffffff;
  --c-link-soft: #557262;
  --c-overlay: rgba(10, 30, 20, 0.5);
  /* Alone dei cluster sulla mappa: è --c-green al 22%, va tenuto allineato */
  --c-cluster-halo: rgba(13, 92, 63, 0.22);
  --c-glass: rgba(255, 255, 255, 0.94);
  --c-glass-soft: rgba(255, 255, 255, 0.75);

  /* Scala tipografica */
  --fs-3xs: 10px;
  --fs-2xs: 11px;
  --fs-xs: 12px;
  --fs-sm: 13px;
  --fs-md: 14px;
  --fs-base: 15px;
  /* 16px è la soglia sotto la quale Safari iOS zooma al focus di un campo:
     è un vincolo funzionale, non una scelta tipografica. Non abbassare. */
  --fs-input: 16px;
  --fs-lg: 17px;
  --fs-xl: 18px;
  --fs-2xl: 19px;
  --fs-3xl: 26px;

  /* Spaziatura, passo di 2px */
  --sp-1: 2px;
  --sp-2: 4px;
  --sp-3: 6px;
  --sp-4: 8px;
  --sp-5: 10px;
  --sp-6: 12px;
  --sp-7: 14px;
  --sp-8: 16px;
  --sp-9: 18px;
  --sp-10: 20px;
  --sp-12: 24px;
  --sp-16: 32px;
  --sp-20: 40px;

  /* Raggi */
  --radius-sm: 6px;
  --radius: 8px;
  --radius-md: 10px;
  --radius-lg: 12px;
  --radius-xl: 14px;
  --radius-pill: 99px;
  --radius-round: 50%;

  /* Ombre */
  --shadow: 0 4px 20px rgba(10, 40, 25, 0.18);
  --shadow-sheet: 0 -6px 30px rgba(10, 40, 25, 0.25);

  /* Tipografia di base: nessun webfont, il budget KB resta a zero */
  --font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --lh-body: 1.55;
  --lh-tight: 1.25;
  --lh-heading: 1.3;

  /* Tap target minimo iOS/Android */
  --tap: 44px;

  /* Le fasce fisse in cima alla mappa: marchio e azioni, campo di ricerca,
     riga di stato. Scendono una sotto l'altra da questi valori, così quando
     la testata cambia altezza si tocca un punto solo. */
  --h-search: 48px;
  --map-row-1: calc(var(--sp-5) + env(safe-area-inset-top));
  --map-row-2: calc(var(--map-row-1) + var(--tap) + var(--sp-4));
  --map-row-3: calc(var(--map-row-2) + var(--h-search) + var(--sp-4));

  /* In fondo la riga dei crediti occupa tutta la larghezza: legenda e controlli
     zoom partono da sopra di lei, altrimenti la coprono (e coprire una riga di
     attribuzione ODbL non è un dettaglio estetico). */
  --h-credits: 28px;
  --map-bottom: calc(var(--h-credits) + var(--sp-4) + env(safe-area-inset-bottom));
}
