/**
 * T1 · Theme globals — skin agenzia (unica sorgente per ciano / ambra / rosso / nero profondo)
 * Includere per primo nei layout che devono ereditare i token.
 */
html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

:root {
  /* Tipografia: UI morbida vs mono tecnico (codici / numeri) */
  --t1-font-ui:
    'Inter',
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    'Segoe UI',
    Roboto,
    sans-serif;
  --t1-font-mono:
    'JetBrains Mono',
    ui-monospace,
    SFMono-Regular,
    Consolas,
    monospace;
  /* Scala HUD: incremento minimo per nitidezza su subpixel */
  --t1-font-scale: 1.05;

  /* Drawer cockpit (allineamento verso margine papiro) */
  --t1-sidebar-width: 360px;

  /* Tag chip / pill — catalogo IT, label lunghe */
  --t1-tag-chip-font-size: 0.6rem;
  --t1-tag-chip-letter-spacing: 0.03em;
  --t1-hub-tag-pill-font-size: 0.58rem;
  --t1-hub-tag-pill-font-size-compact: 0.54rem;

  /* Rail cockpit (drawer / allineamenti) */
  /* Rail: icone 32px in cella 48px + label aeronautiche */
  --t1-rail-width: 92px;
  /* Safe-area: chrome cockpit (header link, titoli) inizia dopo la rail (Fase 3.1.5) */
  --t1-cockpit-safe-left: calc(var(--t1-rail-width) + 14px);

  /* Sottotitoli / note HUD — base (papiro: sovrascritto per più contrasto) */
  --t1-text-holo-muted: rgba(186, 200, 220, 0.9);

  --t1-deep-black: #030305;
  --t1-deep-black-elevated: #08080a;
  --t1-cyan: #00e5ff;
  --t1-cyan-gateway: #00f2ff;
  --t1-amber: #f59e0b;
  --t1-red: #ef4444;
  --t1-cyan-glow: rgba(0, 229, 255, 0.22);
  --t1-cyan-glow-faint: rgba(0, 229, 255, 0.07);
  --t1-amber-glow: rgba(245, 158, 11, 0.45);
  --t1-red-glow: rgba(239, 68, 68, 0.35);

  /* ── Clinical layer: sorgente unica per vene cassetti (cockpit) e stati profilo (gateway) ── */
  --t1-clinical-dossier: #3dcc9a;   /* smeraldo · cassetto Dossier */
  --t1-clinical-mirini: #5c9cf0;    /* cobalto  · cassetto Punti di mira */
  --t1-clinical-evol: #9c8270;      /* bronzo   · cassetto Evoluzione */
  --t1-amethyst: #7c3aed;           /* Agent Mode / sessione clinica viva */

  /* CTA (Portal, Gateway login, azioni primarie): ciano + glass deck-key — non fill ametista.
     Ametista = glow, stati workflow, accenti holo; vedi gateway-deck-key / gateway-login-btn. */

  /* ── Workflow states: ready ← dossier · pending = ambra dedicata · active = ametista ── */
  --t1-state-ready: var(--t1-clinical-dossier);
  --t1-state-pending: #f0a21a;
  --t1-state-active: var(--t1-amethyst);
  --t1-state-ready-glow: color-mix(in srgb, var(--t1-state-ready) 42%, transparent);
  --t1-state-pending-glow: color-mix(in srgb, var(--t1-state-pending) 45%, transparent);
  --t1-state-active-glow: color-mix(in srgb, var(--t1-state-active) 30%, transparent);

  /* ── Vault & Projects glass tokens (3.1.0) — condivisi Gateway ↔ Cockpit ── */
  /* Blur neutro su OLED-Black: stesso valore di --gw-glass-blur in gateway_styles.css  */
  --t1-glass-blur: 18px;
  --t1-vault-glass-bg: rgba(6, 10, 18, 0.55);
  --t1-vault-glass-bg-elevated: rgba(8, 12, 22, 0.72);
  --t1-vault-glass-border: color-mix(in srgb, var(--t1-cyan-gateway) 28%, rgba(255, 255, 255, 0.05));
  --t1-vault-glass-border-hover: color-mix(in srgb, var(--t1-cyan-gateway) 48%, rgba(255, 255, 255, 0.1));
  --t1-vault-glass-glow: color-mix(in srgb, var(--t1-cyan-gateway) 22%, transparent);
  --t1-vault-glass-glow-strong: color-mix(in srgb, var(--t1-cyan-gateway) 38%, transparent);

  /* Hub surface — ADR 005.1 / 005.2 (Gateway deck, chip, Project Space) */
  --gw-glass-surface-bg: rgba(10, 15, 24, 0.65);
  --gw-glass-surface-blur: blur(12px) saturate(1.12);
  --gw-glass-border: color-mix(in srgb, var(--t1-cyan-gateway) 12%, rgba(255, 255, 255, 0.07));
  --gw-glass-border-top: rgba(255, 255, 255, 0.11);
  --gw-glass-recessed:
    inset 0 1px 0 rgba(255, 255, 255, 0.06),
    inset 0 -10px 28px rgba(0, 0, 0, 0.42),
    inset 0 0 0 1px rgba(255, 255, 255, 0.03);
  --gw-text-glow-primary: 0 0 10px color-mix(in srgb, var(--t1-cyan-gateway) 55%, transparent);
  --gw-text-hint-cold: color-mix(in srgb, #8a95a8 80%, #6080a8 20%);

  /* Palco v2 §8.1 — grammatica programmi (Gateway_Palco_v2 · PALCO-CINE-P1) */
  --t1-sala-base: #0a0b0d;
  --t1-sala-base-alt: #0f1114;
  --t1-sala-tunnel: radial-gradient(
    ellipse 85% 72% at 50% 42%,
    color-mix(in srgb, var(--t1-cyan-gateway) 4%, #12141a) 0%,
    var(--t1-sala-base) 68%
  );
  --t1-glass-frost: rgba(255, 255, 255, 0.03);
  --t1-glass-frost-border: color-mix(in srgb, var(--t1-cyan-gateway) 18%, transparent);
  --t1-edge-idle: color-mix(in srgb, var(--t1-cyan-gateway) 18%, transparent);
  --t1-edge-active: color-mix(in srgb, var(--t1-cyan-gateway) 42%, rgba(255, 255, 255, 0.12));
  --t1-holo-active: 0 0 24px color-mix(in srgb, var(--t1-cyan-gateway) 22%, transparent);
  --t1-program-world-accent: var(--t1-clinical-dossier);
  --t1-program-profiles-accent: var(--t1-palco-gallery-warm, #e0d8cc);
  --t1-program-sessions-accent: var(--t1-state-pending);
  --t1-program-vault-accent: color-mix(in srgb, var(--t1-cyan-gateway) 58%, #7a9ec8);
  --t1-plancia-edge-world: color-mix(in srgb, var(--t1-program-world-accent) 8%, transparent);
  --t1-plancia-edge-profiles: color-mix(in srgb, var(--t1-program-profiles-accent) 8%, transparent);
  --t1-plancia-edge-sessions: color-mix(in srgb, var(--t1-program-sessions-accent) 8%, transparent);
  --t1-plancia-edge-vault: color-mix(in srgb, var(--t1-program-vault-accent) 8%, transparent);

  /* ── Theme-Scale · Denotazione per densità (Cockpit 100% · Palco 50% · Viewer 25%) ──
     Stessa famiglia componenti; intensità materiale (blur, opacità, bordo) per stanza. */
  --t1-room-density: 1;
  --t1-room-blur: calc(12px * var(--t1-room-density));
  --t1-room-backdrop: blur(var(--t1-room-blur)) saturate(calc(1 + 0.05 * var(--t1-room-density)));
  --t1-room-surface-bg: rgba(10, 10, 12, calc(0.06 + 0.16 * var(--t1-room-density)));
  --t1-room-film-veil: calc(0.28 + 0.34 * var(--t1-room-density));
  --t1-room-plate-veil: calc(0.38 + 0.46 * var(--t1-room-density));
  --t1-room-card-border-width: 1px;
  --t1-room-card-border-color: color-mix(in srgb, var(--t1-pearl, #d6dff1) 28%, transparent);
  --t1-room-card-border: var(--t1-room-card-border-width) solid var(--t1-room-card-border-color);
  --t1-room-card-shadow:
    inset 0 0 calc(18px * var(--t1-room-density)) rgba(255, 255, 255, calc(0.02 * var(--t1-room-density))),
    0 calc(6px + 4px * var(--t1-room-density)) calc(18px + 8px * var(--t1-room-density))
      rgba(0, 0, 0, calc(0.12 + 0.18 * var(--t1-room-density)));
}

/* Cockpit workstation — densità piena */
body.app-shell {
  --t1-room-density: 1;
}

/* Palco Gateway — navigazione: metà intensità, card proiettate senza bordo pearl */
.gateway-shell--palco {
  --t1-room-density: 0.5;
  --t1-room-card-border-width: 0;
  --t1-room-card-border: none;
  --t1-room-card-shadow: 0 8px 22px rgba(0, 0, 0, 0.22);
}

/* Viewer / Portal pubblico — minima presenza vetro */
body.share-app,
body.portal-app[data-t1-public="1"] {
  --t1-room-density: 0.25;
  --t1-room-card-border-width: 0;
  --t1-room-card-border: none;
  --t1-room-card-shadow: 0 6px 18px rgba(0, 0, 0, 0.16);
}

/* Screen-reader only — etichette contesto rail */
.t1-visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* ── T1 · Scrollbar + liste native — mai chrome bianco (regola globale) ──
   Token per superficie: sovrascrivi --t1-scrollbar-thumb / --t1-select-bg sul root della pagina. */
:root {
  --t1-scrollbar-size: 6px;
  --t1-scrollbar-track: transparent;
  --t1-scrollbar-thumb: color-mix(in srgb, var(--t1-cyan-gateway) 18%, rgba(255, 255, 255, 0.06));
  --t1-scrollbar-thumb-hover: color-mix(in srgb, var(--t1-cyan-gateway) 32%, rgba(255, 255, 255, 0.1));
  --t1-select-bg: color-mix(in srgb, var(--gw-glass-surface-bg) 92%, #000);
  --t1-select-fg: rgba(248, 252, 255, 0.92);
  --t1-select-option-bg: var(--t1-deep-black-elevated);
  --t1-select-option-fg: rgba(248, 252, 255, 0.92);
}

html {
  color-scheme: dark;
}

html,
body {
  scrollbar-width: thin;
  scrollbar-color: var(--t1-scrollbar-thumb) var(--t1-scrollbar-track);
}

* {
  scrollbar-width: thin;
  scrollbar-color: var(--t1-scrollbar-thumb) var(--t1-scrollbar-track);
}

*::-webkit-scrollbar {
  width: var(--t1-scrollbar-size);
  height: var(--t1-scrollbar-size);
}

*::-webkit-scrollbar-track {
  background: var(--t1-scrollbar-track);
}

*::-webkit-scrollbar-thumb {
  background: var(--t1-scrollbar-thumb);
  border-radius: 999px;
}

*::-webkit-scrollbar-thumb:hover {
  background: var(--t1-scrollbar-thumb-hover);
}

*::-webkit-scrollbar-corner {
  background: transparent;
}

select,
option,
optgroup {
  color-scheme: dark;
}

select {
  background-color: var(--t1-select-bg);
  color: var(--t1-select-fg);
}

select option,
select optgroup {
  background-color: var(--t1-select-option-bg);
  color: var(--t1-select-option-fg);
}