/* ══════════════════════════════════════════════════════════════════════════
   Flipping Club — TOKENS (nuovo design, PR 1, 17-set-2026)
   ══════════════════════════════════════════════════════════════════════════
   Un solo elenco di colori per tutta la app. Valori dal prototipo
   OUTPUTS/FC-Mockup-iOS e dalla spec docs/superpowers/specs/2026-09-17-nuovo-design-design.md §4.2.

   Regole:
   - Qui SOLO variabili. I componenti stanno in base.css e nei file di area.
   - Token chiari su :root, scuri su body.theme-dark solo a schermo (@media screen:
     la stampa resta chiara; js/core/theme.js mette classe e data-theme-mode sul <body>).
     Il tema scuro è acceso dalla PR 15 (window.__FC_TEMA_SCURO = true in js/config.js).
     Lo stesso elenco scuro vale col sistema in scuro anche prima del JS e senza JS
     (pagine di accesso): blocco prefers-color-scheme su body:not([data-theme-mode="light"]).
     «Chiaro» scelto a mano nella app lo spegne; a bandiera spenta theme.js scrive
     "light" per tutti. I due elenchi vanno tenuti uguali (tests/design-15-scuro.test.js).
   - tests/tokens-contrasto.test.js verifica il 4,5:1 di ogni coppia
     testo/sfondo, in chiaro e in scuro.
   - --fc-label3 è il grigio terziario Apple (2,2:1): solo placeholder e
     disabilitati, mai per un'informazione.
   - --fc-ink e --fc-accent-on-dark servono alle superfici che restano scure
     anche in chiaro (fra cui popup della mappa, testate di Learning e Calendario,
     foto a tutto schermo, e qualche superficie inline nei moduli JS; testata e piè di pagina ormai no). Mappare
     il loro verde sull'accento
     scuro faceva sparire il logo e il titolo della scheda (1,6:1).
   - --fc-toast-bg/--fc-toast-fg: il toast è una superficie scura anche in tema
     chiaro. Con --fc-ink/--fc-card in scuro coincidono entrambi su #1C1C1E, e il
     toast sparirebbe (review 18-set-2026): serve una coppia sua, che in scuro
     ribalta i ruoli (fondo chiaro, testo scuro).
   - --fc-paper/--fc-on-paper/--fc-paper-link: il foglio su cui sta il corpo di
     un'email (HTML di terzi, scritto per il bianco). Stessi valori nei due temi:
     in scuro il foglio resta bianco, come in Gmail (design-12a).
   - --fc-warn è TESTO (#8A5A00, scelto per il 4,5:1). Per pallini, barre e
     bordi di segnale c'è --fc-warn-fill: non deve essere leggibile, deve
     essere visto (3:1 non-testo su card e su sfondo).
   - --st-*: copia di packages/domain/states.js, pinnata da tests/tokens-stati.test.js.
   ══════════════════════════════════════════════════════════════════════════ */

:root{
  /* Controlli nativi (icona del calendario nei campi data, tendine, barre di scorrimento)
     disegnati nel tema giusto: senza, in scuro l'icona del calendario restava nera. */
  color-scheme:light;
  /* superfici */
  --fc-bg:#F2F2F7;
  --fc-card:#FFFFFF;
  --fc-fill:#E5E5EA;
  --fc-rail:#D1D1D6;
  --fc-sep:rgba(60,60,67,.29);
  --fc-ink:#0d0d0d;
  /* testo */
  --fc-label:#000000;
  --fc-label2:#6C6C70;
  --fc-label3:#AEAEB2;
  /* accento */
  --fc-accent:#1B5E20;
  --fc-accent-fill:#1B5E20;
  --fc-accent-soft:#E8F5E9;
  --fc-on-accent:#FFFFFF;
  --fc-accent-on-dark:#81C784;
  /* semaforo e informazione */
  --fc-ok:#2E7D32;
  --fc-warn:#8A5A00;
  --fc-warn-fill:#E65100;   /* riempimenti e segnali, non testo */
  --fc-warn-soft:#FFF3E0;
  --fc-danger:#C62828;
  --fc-danger-fill:#C62828; /* fondo pieno col testo --fc-on-accent sopra (contatori rossi) */
  --fc-danger-soft:#FFEBEE;
  --fc-info:#1565C0;
  --fc-info-soft:#E3F2FD;
  /* toast: superficie scura anche in tema chiaro, quindi coppia propria */
  --fc-toast-bg:#0d0d0d;
  --fc-toast-fg:#FFFFFF;
  /* carta delle email: uguale nei due temi */
  --fc-paper:#FFFFFF;
  --fc-on-paper:#1C1C1E;
  --fc-paper-link:#1B5E20;
  /* vetro, velo, ombra */
  --fc-glass:rgba(248,248,250,.66);
  --fc-glass-border:rgba(0,0,0,.08);
  --fc-scrim:rgba(0,0,0,.35);
  --fc-shadow:0 8px 24px rgba(0,0,0,.12);
}

/* Solo a schermo: in stampa restano i token chiari e il color-scheme:light di :root,
   la carta è bianca anche col tema scuro (PR 15, D-15.3; tests/design-15-stampa.test.js). */
@media screen{
/* La barra di scorrimento della pagina segue <html>, non <body>. */
:root:has(>body.theme-dark){color-scheme:dark}
body.theme-dark{
  color-scheme:dark;
  --fc-bg:#000000;
  --fc-card:#1C1C1E;
  --fc-fill:#2C2C2E;
  --fc-rail:#3A3A3C;
  --fc-sep:rgba(84,84,88,.60);
  --fc-ink:#1C1C1E;
  --fc-label:#FFFFFF;
  --fc-label2:#98989F;
  --fc-label3:#636366;
  --fc-accent:#81C784;
  --fc-accent-fill:#2E7D32;
  --fc-accent-soft:#1B3A1E;
  --fc-on-accent:#FFFFFF;
  --fc-accent-on-dark:#81C784;
  --fc-ok:#66BB6A;
  --fc-warn:#FFB74D;
  --fc-warn-fill:#FFB74D;   /* riempimenti e segnali, non testo */
  --fc-warn-soft:#3A2E12;
  --fc-danger:#FF6B6B;
  --fc-danger-fill:#D32F2F; /* il bianco su --fc-danger scuro era a 2,8:1 */
  --fc-danger-soft:#3A1B1B;
  --fc-info:#64B5F6;
  --fc-info-soft:#12283A;
  --fc-toast-bg:#E5E5EA;
  --fc-toast-fg:#1C1C1E;
  --fc-paper:#FFFFFF;
  --fc-on-paper:#1C1C1E;
  --fc-paper-link:#1B5E20;
  --fc-glass:rgba(22,22,24,.62);
  --fc-glass-border:rgba(255,255,255,.10);
  --fc-scrim:rgba(0,0,0,.55);
  --fc-shadow:0 8px 24px rgba(0,0,0,.5);
}
}

/* Il sistema in scuro, anche prima che theme.js giri e senza JS (pagine di accesso): stessi
   valori di body.theme-dark, nello stesso ordine. «Chiaro» a mano (data-theme-mode="light") lo spegne. */
@media screen and (prefers-color-scheme: dark){
:root:has(>body:not([data-theme-mode="light"])){color-scheme:dark}
body:not([data-theme-mode="light"]){
  color-scheme:dark;
  --fc-bg:#000000;
  --fc-card:#1C1C1E;
  --fc-fill:#2C2C2E;
  --fc-rail:#3A3A3C;
  --fc-sep:rgba(84,84,88,.60);
  --fc-ink:#1C1C1E;
  --fc-label:#FFFFFF;
  --fc-label2:#98989F;
  --fc-label3:#636366;
  --fc-accent:#81C784;
  --fc-accent-fill:#2E7D32;
  --fc-accent-soft:#1B3A1E;
  --fc-on-accent:#FFFFFF;
  --fc-accent-on-dark:#81C784;
  --fc-ok:#66BB6A;
  --fc-warn:#FFB74D;
  --fc-warn-fill:#FFB74D;   /* riempimenti e segnali, non testo */
  --fc-warn-soft:#3A2E12;
  --fc-danger:#FF6B6B;
  --fc-danger-fill:#D32F2F; /* il bianco su --fc-danger scuro era a 2,8:1 */
  --fc-danger-soft:#3A1B1B;
  --fc-info:#64B5F6;
  --fc-info-soft:#12283A;
  --fc-toast-bg:#E5E5EA;
  --fc-toast-fg:#1C1C1E;
  --fc-paper:#FFFFFF;
  --fc-on-paper:#1C1C1E;
  --fc-paper-link:#1B5E20;
  --fc-glass:rgba(22,22,24,.62);
  --fc-glass-border:rgba(255,255,255,.10);
  --fc-scrim:rgba(0,0,0,.55);
  --fc-shadow:0 8px 24px rgba(0,0,0,.5);
}
}

/* ── Misure ─────────────────────────────────────────────────────────────── */
:root{
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:24px; --sp-6:32px;
  /* raggi 12/8 e sidebar 240 dalla PR 2 (design-02-scheletro); prima 10/6/220 */
  --r:12px; --rs:8px; --r-pill:999px;
  --sidebar-w:240px;
  /* erano in mobile.css dentro @media (max-width:768px): fuori dal media
     valgono 0 su desktop e il valore vero su iPhone, senza salti */
  --fc-safe-top:env(safe-area-inset-top,0px);
  --fc-safe-bottom:env(safe-area-inset-bottom,0px);
}

/* ── Colori di stato (fonte: packages/domain/states.js) ─────────────────── */
:root{
  --st-segnalazione:#64B5F6;
  --st-analisi:#FFB74D;
  --st-proposta:#FF8A65;
  --st-in_attesa_docs:#90A4AE;
  --st-due_diligence:#BA68C8;
  --st-due_diligence_conclusa:#FFB300;
  --st-preliminare:#4DD0E1;
  --st-rogito:#81C784;
  --st-cantiere:#AED581;
  --st-in_vendita:#00C853;
  --st-completata:#1B5E20;
  --st-scartata:#E53935;
}