/* ============================================================
   Unico by Digital Unicorn — Design tokens
   FONTE DI VERITÀ: /docs/riferimento-visivo-unico.html e
   /docs/riferimento-cliente-unico.html (BRIEF_Agente_RiferimentiVisivi.md).
   I VALORI qui sotto sono COPIATI da quei due file, non reinterpretati.
   I nomi storici (--inchiostro, --carta, --grigio, --rosso, --rail…) restano
   come ALIAS sui token di riferimento, così nessuna vista si rompe e nessun
   colore è hardcoded fuori dai token.
   Struttura: LIGHT è il tema base (:root + [data-theme="light"]); DARK via
   [data-theme="dark"] e via media query per l'ospite (default scuro in head).
   ============================================================ */

:root, :root[data-theme="light"] {
  color-scheme: light;

  /* ── Token di riferimento — LIGHT (da riferimento-*-unico.html) ── */
  --bg:#F1F2F3; --surface:#FFFFFF; --surface-2:#F7F8F9;
  --ink:#1A2230; --ink-soft:#5B6472; --ink-faint:#8A93A1;
  --line:#E3E6EA; --line-soft:#EDEFF2;
  --blu:#1E5DA0; --blu-strong:#19508C; --blu-soft:#EAF1F9;
  --ottone:#9A7B3F; --ottone-soft:#FBF6EC;
  --salvia:#4A7A5E; --ocra:#C08A2E; --oxblood:#A64B43;
  --rail-bg:#FFFFFF; --rail-text:#5B6472; --rail-strong:#1A2230; --rail-active:#EAF1F9; --rail-line:#E3E6EA; --rail-label:#8A93A1;
  --shadow:0 1px 2px rgba(16,24,40,.04), 0 10px 28px -20px rgba(16,24,40,.25);
  --danger-bg:#FCF4F3; --danger-line:#EBCFCB; --danger-ink:#A64B43;
  /* fondi pill di stato (desaturati) */
  --buono-bg:#EAF1EC; --attenzione-bg:#F7EFDF; --critico-bg:#F6E9E7;
  --select-arrow:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%238A93A1' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");

  /* Altezze fisse controlli (bottoni, input, select) → allineamento garantito */
  --ch:44px; --ch-sm:36px;
  /* Raggi */
  --radius:14px; --radius-sm:10px;

  /* ── Alias nomi storici → token di riferimento (compatibilità totale) ── */
  --inchiostro:var(--ink);
  --ink-2:var(--ink-soft);   --grigio:var(--ink-soft);
  --ink-3:var(--ink-faint);  --grigio-cq:var(--ink-faint);
  --linea:var(--line);
  --carta:var(--bg); --porcellana:var(--bg);
  --superficie:var(--surface); --superficie-2:var(--surface-2);
  --blu-scuro:var(--blu-strong); --blu-tenue:var(--blu-soft);
  --su-blu:#FFFFFF; --su-primario:#FFFFFF;
  --buono:var(--salvia); --verde:var(--salvia);
  --attenzione:var(--ocra);
  --critico:var(--oxblood); --rosso:var(--oxblood);
  --oro:var(--ottone); --oro-tenue:var(--ottone-soft); --oro-velo:var(--ottone-soft);
  /* Rail: ora SEGUE il tema (brief §6) → punta ai token rail di riferimento. */
  --rail:var(--rail-bg); --rail-ink:var(--rail-text); --rail-ink-strong:var(--rail-strong);
  --ombra:var(--shadow); --shadow-sm:var(--shadow); --shadow-md:var(--shadow); --shadow-lg:var(--shadow);
  --r:var(--radius); --radius-md:var(--radius); --radius-lg:var(--radius);
  --ok-bg:var(--buono-bg);   --ok-fg:var(--salvia);
  --bad-bg:var(--critico-bg);--bad-fg:var(--oxblood);
  /* Nastro "operando come": sempre scuro, testo chiaro (AA in entrambi i temi) */
  --ribbon-bg:#111A27; --ribbon-fg:#FFFFFF;

  /* ── Alias semantici (i moduli usano questi) ── */
  --color-bg:            var(--bg);
  --color-surface:       var(--surface);
  --color-surface-alt:   var(--surface-2);
  --color-border:        var(--line);
  --color-hairline:      var(--line-soft);
  --color-text:          var(--ink);
  --color-text-muted:    var(--ink-soft);
  --color-text-subtle:   var(--ink-faint);
  --color-primary:       var(--blu);
  --color-primary-hover: var(--blu-strong);
  --color-on-primary:    #FFFFFF;
  --color-link:          var(--blu);
  --color-focus:         var(--blu);
  --color-accent:        var(--ottone);
  --color-profit:         var(--salvia);
  --color-profit-surface: var(--buono-bg);
  --color-profit-ink:     var(--salvia);
  --color-profit-dot:     var(--salvia);
  --color-warning:        var(--ocra);
  --color-warning-surface:var(--attenzione-bg);
  --color-warning-ink:    var(--ocra);
  --color-warning-dot:    var(--ocra);
  --color-loss:           var(--oxblood);
  --color-loss-surface:   var(--critico-bg);
  --color-loss-ink:       var(--oxblood);
  --color-loss-dot:       var(--oxblood);
  --color-info-surface:   var(--blu-soft);
  --color-info-ink:       var(--blu-strong);
  --advisor-from: var(--surface);
  --advisor-to:   var(--surface);

  /* Fonts — unica famiglia Hanken Grotesk; display e numeri stesso font */
  --sans:   "Hanken Grotesk", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --display: var(--sans);
  --font-sans:    var(--sans);
  --font-display: var(--sans);
  --serif: var(--sans); /* alias di compatibilità: nessun serif */
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  /* Scala tipografica / spaziatura / pesi */
  --text-xs: 0.78rem;  --text-sm: 0.9rem;  --text-base: 1rem;
  --text-lg: 1.2rem;   --text-xl: 1.55rem; --text-2xl: 2.1rem;
  --text-3xl: 2.6rem;  --text-4xl: 3.2rem;
  --leading-tight: 1.08; --leading-snug: 1.16; --leading-normal: 1.55;
  --weight-normal: 400; --weight-medium: 500; --weight-semibold: 600; --weight-bold: 700;
  --space-1: 0.25rem; --space-2: 0.5rem; --space-3: 0.75rem; --space-4: 1rem;
  --space-5: 1.5rem;  --space-6: 2rem;   --space-7: 2.75rem; --space-8: 3.5rem; --space-10: 5rem;
  --container-max: 1200px;
  --content-narrow: 460px;
}

/* ── TEMA SCURO — valori COPIATI dal riferimento (:root dei due HTML) ── */
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg:#0B1118; --surface:#121B25; --surface-2:#0F1721;
  --ink:#EAEFF5; --ink-soft:#93A0B0; --ink-faint:#67737F;
  --line:#1E2A38; --line-soft:#182431;
  --blu:#4D8FD6; --blu-strong:#3E7FC6; --blu-soft:#13263B;
  --ottone:#C3A262; --ottone-soft:#211D12;
  --salvia:#6FA986; --ocra:#D6A24E; --oxblood:#C87A70;
  --rail-bg:#0A1017; --rail-text:#AEB9C7; --rail-strong:#FFFFFF; --rail-active:#15212E; --rail-line:#1A2534; --rail-label:#6C7A8C;
  --shadow:0 1px 0 rgba(255,255,255,.02), 0 8px 24px -16px rgba(0,0,0,.6);
  --danger-bg:#1B1012; --danger-line:#4A2420; --danger-ink:#E08B80;
  --buono-bg:#18261E; --attenzione-bg:#2A2113; --critico-bg:#2C1917;
  --select-arrow:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2393A0B0' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --bg:#0B1118; --surface:#121B25; --surface-2:#0F1721;
    --ink:#EAEFF5; --ink-soft:#93A0B0; --ink-faint:#67737F;
    --line:#1E2A38; --line-soft:#182431;
    --blu:#4D8FD6; --blu-strong:#3E7FC6; --blu-soft:#13263B;
    --ottone:#C3A262; --ottone-soft:#211D12;
    --salvia:#6FA986; --ocra:#D6A24E; --oxblood:#C87A70;
    --rail-bg:#0A1017; --rail-text:#AEB9C7; --rail-strong:#FFFFFF; --rail-active:#15212E; --rail-line:#1A2534; --rail-label:#6C7A8C;
    --shadow:0 1px 0 rgba(255,255,255,.02), 0 8px 24px -16px rgba(0,0,0,.6);
    --danger-bg:#1B1012; --danger-line:#4A2420; --danger-ink:#E08B80;
    --buono-bg:#18261E; --attenzione-bg:#2A2113; --critico-bg:#2C1917;
    --select-arrow:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2393A0B0' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  }
}