/* ═══════════════════════════════════════════════════════════════════════════
   LA DASHBOARD DI SEO FIX — I COLORI, TUTTI IN UN POSTO SOLO
   ---------------------------------------------------------------------------
   Grafica «Provino», approvata dal proprietario il 16 ottobre 2026
   (docs/GRAFICA-NUOVA.md, anteprima in docs/anteprima-grafica.html): il
   tavolo luminoso, i fogli, la pellicola (il menu), la stampa di bordo.

   I NOMI sono quelli di sempre (gli stessi del sito https://seofixpro.it e di
   RegiaPro): le pagine e gli altri rami li usano già. Ai nomi vecchi si sono
   aggiunti quelli nuovi della grafica (--pellicola, --stampa, --esp-*…).

   ⚠️ IL TEMA DI SERIE È SCURO (decisione del 16/10/2026): il server scrive
   data-theme="dark" su <html>, e "light" solo per chi ha scelto il chiaro
   (la scelta sta nel profilo della persona). Il blocco :root qui sotto è il
   chiaro; il blocco scuro vale con data-theme="dark" (e, solo se una pagina
   non dice niente, con il computer scuro). Il PDF del report non ha il
   data-theme: resta chiaro.

   ⚠️ IL MARCHIO DI SERIE È VERDE (#0d5f5c): il commento in cima al file del
   sito dice che il verde è stato confermato il 27 agosto 2026 e NON SI CAMBIA
   SENZA CHIEDERLO AL PROPRIETARIO. Il colore dell'agenzia arriva da
   /marchio/stile.css (app/marchio/servizio.py).

   Dove il sito scrive color-mix(...), qui c'è il colore già fatto (lo legge
   anche WeasyPrint, che fa i PDF e color-mix non lo conosce).
   ═══════════════════════════════════════════════════════════════════════════ */

:root{
  /* ── colore (tema chiaro): il tavolo luminoso e i fogli ── */
  --accent:#0d5f5c;          --accent-soft:#e2eceb;          /* = color-mix(#0d5f5c 12%, white) */
  --accent-bright:#117e78;   --accent-bright-soft:#dbeceb;   /* = color-mix(#117e78 15%, white) */
  --ground:#ececf0;          /* il tavolo luminoso: fondo della pagina */
  --surface:#ffffff;         /* il foglio: schede, fogli */
  --surface-2:#f5f5f2;       /* zone incassate, passaggio del mouse */
  --surface-3:#ecece8;       /* il binario degli interruttori, i segmenti */
  --sunken:#f5f5f2;
  --ink:#2a2c30;             /* testo principale */
  --ink-strong:#141518;      /* titoli, numeri */
  --ink-2:#50545c;           /* testo secondario */
  --ink-3:#61666e;           /* didascalie, stampa di bordo sul foglio */
  --line:#d6d7d2;            /* fili */
  --line-soft:#e6e6e2;
  --link:#0a5350;            --link-soft:#e2eceb;

  /* ── il semaforo, dal sito: sempre con la parola, mai solo il colore ── */
  --ok:#15803d;   --ok-ink:#126b32;   --ok-bg:#deede4;
  --warn:#b45309; --warn-ink:#9a4708; --warn-bg:#f4e7dd;
  --bad:#c0342d;  --bad-ink:#ab2e28;  --bad-bg:#f7e7e6;
  --ok-su-tinta:#126b32;  --bad-su-tinta:#ab2e28;
  --idle:#5d6169; --idle-bg:#ecece8;
  --info:#0f6aa8; --info-ink:#0c5688; --info-bg:#e2edf5;
  --logo-gradient:linear-gradient(135deg,#0d5f5c,#117e78);
  --su-accento:#ffffff;      /* il testo sopra il verde pieno */

  /* ── la pellicola: il menu, NERA IN TUTTI E DUE I TEMI ── */
  --pellicola:#151514;
  --pellicola-2:#232321;     /* passaggio del mouse sul menu */
  --pellicola-3:#2f2f2c;     /* i fili del menu */
  --pellicola-testo:#e6e6e0;
  --pellicola-testo-2:#a5a69f;
  --stampa:#eba43c;          /* la scritta arancio sul bordo della pellicola (contrasto 8 sul nero) */

  /* ── tipografia e geometria ── */
  --font-sans:'Archivo',-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;
  --font-display:'Archivo',-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;
  --font-mono:ui-monospace,'SF Mono',Menlo,Consolas,monospace;
  --r-s:6px; --r-m:10px; --r-l:12px; --r-x:12px; --r-gg:999px;   /* layout v9 (22/10/2026): angoli morbidi, 6 i comandi, 10 i fogli */
  --shadow-sm:0 0 0 1px rgba(20,21,24,.05),0 1px 2px rgba(20,21,24,.06);
  --shadow:0 0 0 1px rgba(20,21,24,.05),0 1px 2px rgba(20,21,24,.06),0 12px 28px -18px rgba(20,21,24,.24);
  --shadow-lg:0 0 0 1px rgba(20,21,24,.06),0 28px 64px -24px rgba(20,21,24,.42);
  --tr:.18s cubic-bezier(.23,1,.32,1);
  --curva:cubic-bezier(.23,1,.32,1);           /* entra e rallenta alla fine */
  --curva-cassetto:cubic-bezier(.32,.72,0,1);  /* il cassetto del menu, la prova che arriva da destra */
  color-scheme:light;

  /* ═══ LE AGGIUNTE DELLA DASHBOARD ═══ */

  /* Il colore del marchio dell'agenzia. Di serie è il verde di SEO Fix;
     /marchio/stile.css (fatto dal server) lo cambia per l'agenzia. */
  --primary:var(--accent);
  --primary-ink:var(--accent);       /* il colore del marchio come testo sul foglio (contrasto 4,5) */
  --primary-soft:var(--accent-soft);
  --su-primary:var(--su-accento);
  --primary-pellicola:#45c2bd;       /* il marchio sulla pellicola nera (segno, voce attiva, segno a matita) */
  --su-primary-pellicola:#0c0d0e;    /* il testo sopra --primary-pellicola */
  --primary-foglio:#0d5f5c;          /* il marchio sul foglio bianco, anche nel tema scuro (non cambia col tema) */
  --secondary:var(--info);
  --carattere-titoli:var(--font-display);

  /* le ombre: il foglio appoggiato sul tavolo; il «peek» e il foglio A4 dell'anteprima del report */
  --ombra-s:var(--shadow);
  --ombra-m:0 -14px 40px -18px rgba(20,21,24,.38);
  --ombra-foglio:0 1px 2px rgba(24,24,40,.10),0 14px 34px -16px rgba(24,24,40,.32);

  /* I colori dei grafici. Le tre fonti (approvate il 16/10/2026, controllate per
     il daltonismo; cambiate il 21/10/2026 dal proprietario): Search Console blu, nostre
     ricerche su Google viola, verifica dal browser giallo (con un bordo scuro in chiaro). */
  --ai:#6a48c4; --ai-ink:#5f3aa6; --ai-bg:#ece5f8;
  --pochi:#8d8d9c;
  --serie-sc:#2a78d6; --serie-ctrl:#9c27b0; --serie-browser:#e3b505; --serie-browser-bordo:#8a6d00; --fascia:#dbe6f1;
  /* Le cinque AI nel grafico «Nelle AI» (19/10/2026): colori loro, DIVERSI dalle tre
     fonti (almeno 16 di distanza OKLab ×100 in chiaro, 14 in scuro), fra loro
     controllati con lo script della skill dei grafici (luminosità, saturazione,
     daltonismo su tutte le coppie, contrasto ≥ 3 sul foglio) in chiaro e in scuro. */
  --serie-chatgpt:#1f6708; --serie-gemini:#8233c7; --serie-perplexity:#8f7b1d; --serie-claude:#b53157; --serie-ai-mode:#c369cc;
  --paper:#ffffff; --paper-ink:#25252d; --paper-ink-2:#5f5f6b; --paper-line:#e4e4ea; --paper-soft:#f6f6f9;

  /* L'esposizione della griglia dei giorni: più la parola è in alto, più la
     casella è scura (nel tema scuro: il negativo). */
  --esp-1:#17181b; --esp-1-testo:#ffffff;
  --esp-2:#4b4f56; --esp-2-testo:#ffffff;
  --esp-3:#a5a9af; --esp-3-testo:#141518;
  --esp-4:#dcdee1; --esp-4-testo:#2a2c30;
  --esp-0-testo:#61666e;
}

/* Il tema scuro, la camera oscura. Vale con data-theme="dark" (il server lo
   scrive di serie) e, solo per una pagina che non dice niente, con il computer
   scuro. I due blocchi hanno gli stessi valori. */
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --accent:#45c2bd;        --accent-soft:#1f3a3c;
  --accent-bright:#6fd8d2; --accent-bright-soft:#243a3e;
  --ground:#0c0d0e; --surface:#16171a; --surface-2:#1c1d21; --surface-3:#24262a; --sunken:#1c1d21;
  --ink:#dcddd8; --ink-strong:#f3f3ef; --ink-2:#b0b2ac; --ink-3:#979992;
  --line:#2e3035; --line-soft:#232428;
  --link:#5fd0ca; --link-soft:#1f3a3c;
  --ok:#57cc6e;   --ok-ink:#62d391;   --ok-bg:#163024;
  --warn:#f0a244; --warn-ink:#f2b84f; --warn-bg:#372b14;
  --bad:#ff7a72;  --bad-ink:#ff8b80;  --bad-bg:#3b1c1a;
  --ok-su-tinta:#8ee0a0;  --bad-su-tinta:#ff8f88;
  --idle:#a5a79f; --idle-bg:#26272a;
  --info:#74b6f5; --info-ink:#74b6f5; --info-bg:#1d2a3a;
  --pellicola:#070708; --pellicola-2:#18191b; --pellicola-3:#25262a;
  --shadow-sm:0 0 0 1px rgba(255,255,255,.055),0 1px 2px rgba(0,0,0,.5);
  --shadow:0 0 0 1px rgba(255,255,255,.055),0 1px 2px rgba(0,0,0,.5),0 14px 30px -18px rgba(0,0,0,.9);
  --shadow-lg:0 0 0 1px rgba(255,255,255,.07),0 30px 70px -24px rgba(0,0,0,.95);
  color-scheme:dark;
  --su-accento:#0c0d0e;
  --logo-gradient:linear-gradient(135deg,#45c2bd,#6fd8d2);

  --ombra-m:0 -14px 40px -18px rgba(0,0,0,.8);
  --ombra-foglio:0 1px 2px rgba(0,0,0,.5),0 14px 34px -16px rgba(0,0,0,.85);
  --ai:#a68cf2; --ai-ink:#cbb6f6; --ai-bg:#2a2340;
  --pochi:#7d7d90;
  --serie-sc:#3987e5; --serie-ctrl:#b65fdc; --serie-browser:#f2c230; --serie-browser-bordo:#f2c230; --fascia:#22324a;
  --serie-chatgpt:#247508; --serie-gemini:#6349df; --serie-perplexity:#ae8f21; --serie-claude:#ce1464; --serie-ai-mode:#c06ec7;
  --paper:#fbfbfc;
  --esp-1:#f1f1ec; --esp-1-testo:#111214; --esp-2:#aeb1ad; --esp-2-testo:#111214;
  --esp-3:#50535a; --esp-3-testo:#f1f1ec; --esp-4:#2b2d31; --esp-4-testo:#cdcec9; --esp-0-testo:#979992;
}}

/* Il tema scuro scelto (di serie): gli stessi valori, perché valga anche
   quando il computer è chiaro. */
:root[data-theme="dark"]{
  --accent:#45c2bd;        --accent-soft:#1f3a3c;
  --accent-bright:#6fd8d2; --accent-bright-soft:#243a3e;
  --ground:#0c0d0e; --surface:#16171a; --surface-2:#1c1d21; --surface-3:#24262a; --sunken:#1c1d21;
  --ink:#dcddd8; --ink-strong:#f3f3ef; --ink-2:#b0b2ac; --ink-3:#979992;
  --line:#2e3035; --line-soft:#232428;
  --link:#5fd0ca; --link-soft:#1f3a3c;
  --ok:#57cc6e;   --ok-ink:#62d391;   --ok-bg:#163024;
  --warn:#f0a244; --warn-ink:#f2b84f; --warn-bg:#372b14;
  --bad:#ff7a72;  --bad-ink:#ff8b80;  --bad-bg:#3b1c1a;
  --ok-su-tinta:#8ee0a0;  --bad-su-tinta:#ff8f88;
  --idle:#a5a79f; --idle-bg:#26272a;
  --info:#74b6f5; --info-ink:#74b6f5; --info-bg:#1d2a3a;
  --pellicola:#070708; --pellicola-2:#18191b; --pellicola-3:#25262a;
  --shadow-sm:0 0 0 1px rgba(255,255,255,.055),0 1px 2px rgba(0,0,0,.5);
  --shadow:0 0 0 1px rgba(255,255,255,.055),0 1px 2px rgba(0,0,0,.5),0 14px 30px -18px rgba(0,0,0,.9);
  --shadow-lg:0 0 0 1px rgba(255,255,255,.07),0 30px 70px -24px rgba(0,0,0,.95);
  color-scheme:dark;
  --su-accento:#0c0d0e;
  --logo-gradient:linear-gradient(135deg,#45c2bd,#6fd8d2);

  --ombra-m:0 -14px 40px -18px rgba(0,0,0,.8);
  --ombra-foglio:0 1px 2px rgba(0,0,0,.5),0 14px 34px -16px rgba(0,0,0,.85);
  --ai:#a68cf2; --ai-ink:#cbb6f6; --ai-bg:#2a2340;
  --pochi:#7d7d90;
  --serie-sc:#3987e5; --serie-ctrl:#b65fdc; --serie-browser:#f2c230; --serie-browser-bordo:#f2c230; --fascia:#22324a;
  --serie-chatgpt:#247508; --serie-gemini:#6349df; --serie-perplexity:#ae8f21; --serie-claude:#ce1464; --serie-ai-mode:#c06ec7;
  --paper:#fbfbfc;
  --esp-1:#f1f1ec; --esp-1-testo:#111214; --esp-2:#aeb1ad; --esp-2-testo:#111214;
  --esp-3:#50535a; --esp-3-testo:#f1f1ec; --esp-4:#2b2d31; --esp-4-testo:#cdcec9; --esp-0-testo:#979992;
}