/* tokens.css — semaia · design system UFFICIALE (restyle 2026-07). Oro come memoria.
   Font SELF-HOSTED (niente CDN runtime): Inter (UI) + Fraunces (wordmark/titoli). Vedi /assets/fonts.
   Light + Dark cittadini di prima classe. Auto (prefers-color-scheme) + override [data-theme]. */
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 400; font-display: swap; src: url(/assets/fonts/inter-400.woff2) format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 500; font-display: swap; src: url(/assets/fonts/inter-500.woff2) format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 600; font-display: swap; src: url(/assets/fonts/inter-600.woff2) format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 700; font-display: swap; src: url(/assets/fonts/inter-700.woff2) format('woff2'); }
@font-face { font-family: 'Fraunces'; font-style: normal; font-weight: 600; font-display: swap; src: url(/assets/fonts/fraunces-600.woff2) format('woff2'); }
:root {
  color-scheme: light;

  /* ── superfici & inchiostro (light) ── */
  --bg: #F3EEE4;            /* carta */
  --surface: #FFFDF8;       /* card */
  --surface-2: #FBF6EC;     /* card annidata / campo */
  --surface-sunk: #F1EBDF;  /* incassato (thumb, track) */
  --card: var(--surface);   /* alias retrocompat (componenti storici) */
  --ink: #16181F;
  --ink-2: #6C675D;
  --ink-3: #9A9488;
  --line: #E7DECD;
  --line-2: #D8CDB7;

  /* superficie "inversa" — bolla utente, toast, bottone ink (resta scura anche in dark) */
  --raised: #16181F;
  --raised-2: #23262F;
  --raised-fg: #FBF7EF;

  /* ── accento: oro = identità/memoria/focus ── */
  --gold: #C0973F;
  --gold-strong: #A87E2C;
  --gold-2: #E4CB8D;        /* alto del gradiente logo */
  --gold-soft: #F4EACF;
  --gold-tint: #FBF4E4;
  --gold-ink: #8A6A1F;
  --gold-line: #E6D3A6;

  /* ── semantici (superficie soft + inchiostro leggibile + bordo per tema) ── */
  --green: #4FA85A; --green-soft: #E4F1E2; --green-ink: #3B8A3B; --green-line: #C7E4C4;
  --terracotta: #C65D3B; --terra-soft: #F7E4DC; --terra-ink: #B04A2C; --terra-line: #EFD0C4; --terra-tint: #FBEEE8;
  --viola: #9B6FB7; --viola-soft: #EFE6F4; --viola-ink: #6B4A86; --viola-line: #E0D0EC;
  --blu: #6E8FC4; --blu-soft: #E7EDF5; --blu-ink: #41608F; --blu-line: #CFDBEC;
  --ink-soft: #F2ECE0;

  --grad-gold: linear-gradient(145deg, var(--gold-2), var(--gold));
  --grad-sheen: linear-gradient(180deg, color-mix(in srgb,var(--surface) 92%,#fff), var(--surface));

  /* ── raggi ── */
  --r-xs: 6px; --r-sm: 8px; --r-md: 12px; --r-lg: 16px; --r-xl: 24px; --r-2xl: 28px; --r-pill: 999px;

  /* ── spaziatura 4pt (stretta) ── */
  --s1: 4px; --s2: 8px; --s3: 12px; --s4: 16px; --s5: 20px; --s6: 24px; --s7: 32px; --s8: 40px; --s9: 48px;

  /* ── tipografia ── */
  --font-display: 'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;   /* UI prominente (nomi cartelle/doc, bottoni) */
  --font-text: 'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;       /* UI/testo */
  --font-title: 'Fraunces', Georgia, 'Times New Roman', serif;   /* SOLO wordmark + titoli di sezione */
  --font-mono: ui-monospace, 'SF Mono', Menlo, monospace;
  /* badge estensione documento (per tipo) — usati nella vista Documenti */
  --badge-pdf: #C0503A; --badge-pdf-bg: #F6E5DF; --badge-jpg: #3E8F4E; --badge-jpg-bg: #E3F1E4;
  --badge-doc: #3D6FB0; --badge-doc-bg: #E4ECF6; --badge-xls: var(--gold-ink); --badge-xls-bg: var(--gold-soft);
  --t-hero: 26px; --t-h1: 22px; --t-h2: 19px; --t-h3: 16px; --t-body: 15px; --t-sm: 13.5px; --t-xs: 11.5px; --t-mono: 11px;
  --lh-tight: 1.15; --lh: 1.5;

  /* ── elevazioni (light: ombre calde e diffuse) ── */
  --shadow-1: 0 1px 2px rgba(30,24,12,.05);
  --shadow-2: 0 1px 2px rgba(30,24,12,.05), 0 6px 20px rgba(30,24,12,.07);
  --shadow-3: 0 12px 40px rgba(30,24,12,.16);
  --ring: 0 0 0 3px color-mix(in srgb, var(--gold) 42%, transparent);
  --glow-gold: 0 2px 14px color-mix(in srgb, var(--gold) 30%, transparent);

  /* ── motion (150–260ms, mai gratuito >300ms) ── */
  --dur-fast: 150ms; --dur: 200ms; --dur-slow: 260ms;
  --ease: cubic-bezier(.32,.72,.32,1);        /* standard, deciso ma morbido */
  --ease-out: cubic-bezier(.22,1,.36,1);       /* comparse */
  --ease-spring: cubic-bezier(.34,1.32,.5,1);  /* sheet/overlay, leggero overshoot */

  --maxw: 640px;
}

/* palette DARK riusata da auto + esplicito */
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) {
  color-scheme: dark;
  --bg: #111209; --surface: #1F2118; --surface-2: #191B13; --surface-sunk: #141509;
  --ink: #EEE9DF; --ink-2: #A6A296; --ink-3: #6F6C62;
  --line: #2B2D22; --line-2: #3A3D2E;
  --raised: #212319; --raised-2: #2A2C20; --raised-fg: #F4EFE6;
  --gold: #E6C07B; --gold-strong: #E0AC5B; --gold-2: #EFC986; --gold-soft: #2A2412; --gold-tint: #1B1810; --gold-ink: #F0D093; --gold-line: #4A3F22;
  --green: #7BD88A; --green-soft: #17251A; --green-ink: #8FD89A; --green-line: #2A4230;
  --terracotta: #E29A52; --terra-soft: #2A1D12; --terra-ink: #E9917F; --terra-line: #4A3320; --terra-tint: #1F1610;
  --viola: #B98FD6; --viola-soft: #2A2233; --viola-ink: #C6A6E0; --viola-line: #3E3350;
  --blu: #8CBAEA; --blu-soft: #16202E; --blu-ink: #8CBAEA; --blu-line: #2C3A52;
  --ink-soft: #23262F;
  --badge-pdf: #E9917F; --badge-pdf-bg: rgba(216,88,62,.16); --badge-jpg: #8FD89A; --badge-jpg-bg: rgba(90,180,110,.15);
  --badge-doc: #8CBAEA; --badge-doc-bg: rgba(110,150,220,.15); --badge-xls: #E6C07B; --badge-xls-bg: rgba(230,192,123,.14);
  --shadow-1: 0 1px 2px rgba(0,0,0,.4);
  --shadow-2: 0 4px 16px rgba(0,0,0,.35), 0 10px 28px rgba(0,0,0,.45);
  --shadow-3: 0 16px 48px rgba(0,0,0,.6);
  --ring: 0 0 0 3px color-mix(in srgb, var(--gold) 55%, transparent);
  --glow-gold: 0 2px 18px color-mix(in srgb, var(--gold) 38%, transparent);
  --grad-gold: linear-gradient(145deg, #EFC986, #E0AC5B);
  --grad-sheen: linear-gradient(160deg, #212319, #191B13);
}}
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #111209; --surface: #1F2118; --surface-2: #191B13; --surface-sunk: #141509;
  --ink: #EEE9DF; --ink-2: #A6A296; --ink-3: #6F6C62;
  --line: #2B2D22; --line-2: #3A3D2E;
  --raised: #212319; --raised-2: #2A2C20; --raised-fg: #F4EFE6;
  --gold: #E6C07B; --gold-strong: #E0AC5B; --gold-2: #EFC986; --gold-soft: #2A2412; --gold-tint: #1B1810; --gold-ink: #F0D093; --gold-line: #4A3F22;
  --green: #7BD88A; --green-soft: #17251A; --green-ink: #8FD89A; --green-line: #2A4230;
  --terracotta: #E29A52; --terra-soft: #2A1D12; --terra-ink: #E9917F; --terra-line: #4A3320; --terra-tint: #1F1610;
  --viola: #B98FD6; --viola-soft: #2A2233; --viola-ink: #C6A6E0; --viola-line: #3E3350;
  --blu: #8CBAEA; --blu-soft: #16202E; --blu-ink: #8CBAEA; --blu-line: #2C3A52;
  --ink-soft: #23262F;
  --badge-pdf: #E9917F; --badge-pdf-bg: rgba(216,88,62,.16); --badge-jpg: #8FD89A; --badge-jpg-bg: rgba(90,180,110,.15);
  --badge-doc: #8CBAEA; --badge-doc-bg: rgba(110,150,220,.15); --badge-xls: #E6C07B; --badge-xls-bg: rgba(230,192,123,.14);
  --shadow-1: 0 1px 2px rgba(0,0,0,.4);
  --shadow-2: 0 4px 16px rgba(0,0,0,.35), 0 10px 28px rgba(0,0,0,.45);
  --shadow-3: 0 16px 48px rgba(0,0,0,.6);
  --ring: 0 0 0 3px color-mix(in srgb, var(--gold) 55%, transparent);
  --glow-gold: 0 2px 18px color-mix(in srgb, var(--gold) 38%, transparent);
  --grad-gold: linear-gradient(145deg, #EFC986, #E0AC5B);
  --grad-sheen: linear-gradient(160deg, #212319, #191B13);
}

/* ── [UX collegamento email] componenti condivisi (accessibilità + branding) ── */
:focus-visible{outline:2px solid var(--gold);outline-offset:2px;border-radius:6px}
/* [logo=home] logo cliccabile in cima alle pagine fuori-app → torna all'app (Assistente). Area tap ≥44px. */
.home-logo{display:inline-flex;align-items:center;gap:9px;min-height:44px;text-decoration:none;color:var(--ink);font-family:'Fraunces',Georgia,serif;font-weight:600;font-size:20px;letter-spacing:-.01em;margin:0 0 14px}
.home-logo img{width:32px;height:32px;border-radius:9px;border:1px solid color-mix(in srgb,var(--gold) 28%,transparent)}
.home-logo .ia{color:var(--gold)}
.home-logo:active{opacity:.7}
/* Bottone Google ufficiale (branding guidelines): fondo bianco, logo G 4 colori, testo, ≥44px */
.gbtn{width:100%;min-height:44px;padding:10px 16px;display:flex;align-items:center;justify-content:center;gap:12px;
  background:#fff;color:#1f1f1f;border:1px solid #dadce0;border-radius:10px;
  font-family:system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;font-weight:600;font-size:15px;cursor:pointer;text-decoration:none;box-sizing:border-box}
.gbtn:hover{background:#f7f8f8;box-shadow:0 1px 2px rgba(60,64,67,.3)}
.gbtn:active{background:#f1f3f4}
.gbtn svg{width:18px;height:18px;flex:none}
/* Etichette sopra i campi + campi grandi (16px → niente zoom iOS) */
.flabel{display:block;font-size:13px;font-weight:600;color:var(--ink);margin:0 0 5px}
.field-lg{width:100%;min-height:46px;font-size:16px;box-sizing:border-box}
.fhint{font-size:12.5px;color:var(--ink-2);margin:4px 0 0}
.fhint a{color:var(--gold)}
.ferr{font-size:13px;color:var(--terracotta);margin:5px 0 0;display:none}
.ferr.show{display:block}
.fgroup{margin-top:14px}
.frow{display:flex;gap:8px}
/* Stato casella: pallino + provider */
.mb-status{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--ink)}
.mb-dot{width:9px;height:9px;border-radius:50%;flex:none}
.mb-dot.on{background:#34a853}
.mb-dot.warn{background:#f9a825}
.mb-prov{width:30px;height:30px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;background:var(--surface-2);flex:none}
.mb-prov svg{width:20px;height:20px}
.mb-connected-head{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.mb-addr{font-weight:600;font-size:15px;color:var(--ink);word-break:break-all;line-height:1.2}
.mb-sub{font-size:12.5px;color:var(--ink-2);margin-top:2px}
/* [multi-casella] riga casella nella lista */
.mb-item{display:flex;align-items:flex-start;gap:10px;padding:12px 0;border-bottom:1px solid var(--line)}
.mb-item:last-child{border-bottom:0}
.mb-def{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--gold);background:color-mix(in srgb,var(--gold) 16%,transparent);border-radius:var(--r-pill);padding:1px 7px;vertical-align:middle;white-space:nowrap}
.mb-acts{display:flex;flex-direction:column;gap:6px;flex:none}
.mb-mini{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:5px 10px;border-radius:9px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font-size:12.5px;font-weight:600;cursor:pointer;white-space:nowrap;text-decoration:none}
.mb-mini.danger{color:var(--terracotta);border-color:color-mix(in srgb,var(--terracotta) 45%,var(--line))}
.mb-mini:active{opacity:.7}
.mb-reconnect{display:inline-block;margin-top:6px;font-size:13px;font-weight:600;color:var(--gold);text-decoration:none}
