/* ============================================================
   Nexus Design System — Layer 2: tokens
   Load AFTER the DevExpress Fluent theme bundle.
   Source of truth for all Nexus values. No component rules here.
   ============================================================ */

:root {
  /* ---- brand ramps ---------------------------------------- */
  --nexus-navy-900: #050E1A;
  --nexus-navy-800: #08172B;
  --nexus-navy-700: #0B1F3A;
  --nexus-blue-500: #2F6BFF;   /* Electric Blue support */
  --nexus-blue-400: #6E9BFF;
  --nexus-blue-200: #B9CDF5;

  --nexus-teal-500: #1CCFC9;   /* Teal Accent  */
  --nexus-teal-600: #15B8B2;   /* Teal Hover   */
  --nexus-teal-700: #0E8F8B;   /* text-safe teal (AA on white) */
  --nexus-teal-800: #0B7B77;
  --nexus-teal-100: #E6F8F7;

  --nexus-slate-0:   #FFFFFF;
  --nexus-slate-25:  #F7F9FC;
  --nexus-slate-50:  #EEF3F8;
  --nexus-slate-100: #E4EBF2;
  --nexus-slate-200: #D6E0EA;
  --nexus-slate-300: #B9C6D4;
  --nexus-slate-400: #94A3B4;
  --nexus-slate-500: #64748B;
  --nexus-slate-600: #475569;
  --nexus-slate-800: #1E293B;
  --nexus-slate-900: #0F172A;

  /* ---- semantic colors (light = primary theme) ------------ */
  --nexus-primary:          var(--nexus-navy-700);
  --nexus-primary-hover:    var(--nexus-navy-800);
  --nexus-primary-active:   var(--nexus-navy-900);
  --nexus-primary-subtle:   var(--nexus-slate-50);
  --nexus-secondary:        var(--nexus-slate-800);
  --nexus-accent:           var(--nexus-teal-500);
  --nexus-accent-hover:     var(--nexus-teal-600);
  --nexus-accent-text:      var(--nexus-teal-700);
  --nexus-accent-subtle:    var(--nexus-teal-100);
  /* Il teal "text-safe" e' calibrato sul BIANCO: sulla propria pastiglia
     velata (accent-subtle) il fondo e' piu' scuro e il rapporto scende a
     3.6:1 (ri-misura del 2026-08-13). Un gradino piu' giu' della scala lo
     riporta sopra AA senza toccare la tavolozza. Token semantico e non
     colore scritto nella regola, o il tema scuro non se lo ri-deriverebbe. */
  --nexus-accent-text-on-subtle: var(--nexus-teal-800);
  --nexus-interactive:      var(--nexus-blue-500);   /* focus / links */

  --nexus-background:       var(--nexus-slate-25);
  --nexus-surface:          var(--nexus-slate-0);
  --nexus-surface-alt:      var(--nexus-slate-50);
  --nexus-surface-elevated: var(--nexus-slate-0);
  --nexus-border:           var(--nexus-slate-200);
  --nexus-border-subtle:    var(--nexus-slate-100);

  --nexus-text-primary:     var(--nexus-slate-900);
  --nexus-text-secondary:   var(--nexus-slate-600);
  --nexus-text-muted:       var(--nexus-slate-500);
  --nexus-text-on-primary:  #FFFFFF;

  --nexus-success:          #22C55E;
  --nexus-success-text:     #15803D;
  --nexus-success-subtle:   #ECFDF3;
  --nexus-warning:          #F59E0B;
  --nexus-warning-text:     #92400E;
  --nexus-warning-subtle:   #FEF6E7;
  --nexus-error:            #EF4444;
  /* Il rosso dei pulsanti PIENI in tema chiaro. #EF4444 con l'etichetta
     bianca misura 3.68:1 — sotto AA, ed era il secondo dei tre punti
     dichiarati del tema chiaro (doc 13 par. 35): il pulsante *Scarta* degli
     esiti. #DC2626 e' il gradino successivo della stessa famiglia e porta
     la coppia a 4.83:1 restando un rosso acceso; l'alternativa —
     inchiostro scuro sul rosso, come si fa in dark — su fondo chiaro si
     legge come un errore di stile. Il rosso "quieto" (bordi, testo
     d'errore) NON si tocca: quello e' --nexus-error-text. */
  --nexus-error-strong:     #DC2626;
  --nexus-error-text:       #B91C1C;
  --nexus-error-subtle:     #FEF0F0;
  --nexus-info:             #38BDF8;
  --nexus-info-text:        #0369A1;
  --nexus-info-subtle:      #F0F9FF;

  /* ---- typography ----------------------------------------- */
  --nexus-font-family: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --nexus-font-heading: "Plus Jakarta Sans", "Inter", sans-serif;
  --nexus-font-mono: "IBM Plex Mono", ui-monospace, Consolas, monospace;

  --nexus-fs-display: 40px;   --nexus-lh-display: 44px;
  --nexus-fs-h1: 26px;        --nexus-lh-h1: 32px;
  --nexus-fs-h2: 20px;        --nexus-lh-h2: 28px;
  --nexus-fs-h3: 16px;        --nexus-lh-h3: 24px;
  --nexus-fs-section: 11px;   --nexus-lh-section: 16px;   /* uppercase, 0.08em */
  --nexus-fs-body: 14px;      --nexus-lh-body: 21px;
  --nexus-fs-body-sm: 13px;   --nexus-lh-body-sm: 20px;
  --nexus-fs-label: 12.5px;   --nexus-lh-label: 16px;
  --nexus-fs-caption: 11.5px; --nexus-lh-caption: 16px;
  --nexus-fs-table-head: 11.5px;
  --nexus-fs-kpi: 30px;       --nexus-lh-kpi: 34px;

  --nexus-fw-regular: 400;
  --nexus-fw-medium: 500;
  --nexus-fw-semibold: 600;
  --nexus-fw-bold: 700;

  /* ---- spacing (4px base) --------------------------------- */
  --nexus-space-1: 4px;   --nexus-space-2: 8px;   --nexus-space-3: 12px;
  --nexus-space-4: 16px;  --nexus-space-5: 20px;  --nexus-space-6: 24px;
  --nexus-space-8: 32px;  --nexus-space-10: 40px; --nexus-space-12: 48px;
  --nexus-space-16: 64px;

  /* ---- radius / borders ----------------------------------- */
  --nexus-radius-xs: 2px;
  --nexus-radius-sm: 3px;
  --nexus-radius-md: 5px;
  --nexus-radius-lg: 8px;
  --nexus-radius-pill: 999px;
  --nexus-border-width: 1px;
  --nexus-rail-width: 2px;              /* signature active marker */

  /* ---- elevation ------------------------------------------ */
  --nexus-shadow-none: none;
  --nexus-shadow-sm: 0 1px 2px rgba(11, 31, 58, 0.06);
  --nexus-shadow-md: 0 4px 10px -2px rgba(11, 31, 58, 0.10);
  --nexus-shadow-lg: 0 16px 36px -8px rgba(11, 31, 58, 0.16);

  /* ---- states --------------------------------------------- */
  --nexus-focus-ring: 0 0 0 3px rgba(47, 107, 255, 0.20);
  --nexus-focus-border: var(--nexus-interactive);
  --nexus-hover-surface: var(--nexus-slate-50);
  --nexus-active-surface: var(--nexus-slate-100);
  --nexus-selected-surface: var(--nexus-slate-50);
  --nexus-disabled-fg: var(--nexus-slate-400);
  --nexus-disabled-bg: var(--nexus-slate-50);
  --nexus-opacity-disabled: 0.55;

  /* ---- transitions ---------------------------------------- */
  --nexus-transition-fast: 120ms cubic-bezier(0.2, 0, 0.2, 1);
  --nexus-transition-base: 180ms cubic-bezier(0.2, 0, 0.2, 1);

  /* ---- density: Comfortable (default) --------------------- */
  --nexus-row-height: 40px;
  --nexus-control-height: 34px;
  --nexus-form-row-gap: 16px;
  --nexus-card-padding: 20px;
  --nexus-toolbar-height: 52px;
  --nexus-icon-size: 20px;
}

/* ---- density: Compact ------------------------------------- */
[data-nexus-density="compact"] {
  --nexus-row-height: 32px;
  --nexus-control-height: 28px;
  --nexus-form-row-gap: 10px;
  --nexus-card-padding: 14px;
  --nexus-toolbar-height: 44px;
  --nexus-icon-size: 16px;
}

/* ============================================================
   DARK MODE — re-derived, not inverted.
   Three deliberate departures:
   1. primary becomes the brand TEAL (see below)
   2. selected state = deep desaturated navy, not a tinted white
   3. shadow is halved; surface-elevated does the lifting
   ============================================================ */
[data-nexus-theme="dark"] {
  /* Il primario in dark e' il TEAL, non un navy schiarito (2026-08-02).
     Fino a oggi qui c'era #5B8CFF: navy-700 sul fondo scuro sparisce, e
     la derivazione di serie lo schiariva a blu 400. Ma in questa suite il
     blu ha gia' due incarichi propri — --nexus-interactive/--nx-blue e' il
     contenuto proposto dagli agenti, ed e' il colore di focus/link — e il
     primario blu si presentava come una terza tinta estranea alla
     tavolozza teal + navy del marchio: pulsante Salva, checkbox spuntate,
     accenti dei controlli, tutti blu su un tema che teal non lo e'.
     In dark il navy E' il fondo, quindi il ruolo di colore primario passa
     al secondo colore di brand. Ricade tutto da qui: la ramp accent di
     DevExpress (--dxbl-accent-color-*) e le semantiche "primary" del
     bridge leggono questi token.
     Vale SOLO in dark: in light il primario resta navy-700.
     Doc 13 par. 27. */
  --nexus-primary:          #1CCFC9;   /* = accent (teal-500 dark) */
  --nexus-primary-hover:    #7FE0DC;
  --nexus-primary-active:   #12B3AD;
  --nexus-primary-subtle:   #0C2E2D;
  --nexus-secondary:        #C2D0E0;
  --nexus-accent:           #1CCFC9;
  --nexus-accent-hover:     #7FE0DC;
  --nexus-accent-text:      #1CCFC9;
  --nexus-accent-subtle:    #0C2E2D;
  /* In dark la pastiglia velata e' SCURA: qui il testo giusto e' il teal
     acceso, lo stesso dell'inchiostro d'accento. Scendere di un gradino,
     come in light, lo renderebbe illeggibile. */
  --nexus-accent-text-on-subtle: #1CCFC9;
  --nexus-interactive:      #5B8CFF;

  --nexus-background:       #061426;
  --nexus-surface:          #0B1F3A;
  --nexus-surface-alt:      #122A47;
  --nexus-surface-elevated: #122A47;
  --nexus-border:           #24425F;
  --nexus-border-subtle:    #16304C;

  --nexus-text-primary:     #E8EEF6;
  --nexus-text-secondary:   #9FB2C8;
  /* Il grigio del testo secondario era #6B7F97: sul foglio scuro (#08172B)
     si fermava a 4.37:1 e sui fondi velati degli editor (#122A47) a 3.53,
     sotto la soglia AA — numeri di task, code, scadenze e pastiglie di
     stato del Review Center risultavano sbiaditi (verifica su TEST del
     2026-08-13). #8FA3BA sta sopra 4.5:1 su TUTTE le superfici scure del
     tema, riga selezionata compresa, e resta un gradino sotto il testo
     secondario. Il grigio dei disabilitati NON si tocca: quelli devono
     restare spenti. */
  --nexus-text-muted:       #8FA3BA;
  --nexus-text-on-primary:  #061426;

  --nexus-success:          #22C55E;  --nexus-success-text: #86EFAC;  --nexus-success-subtle: #0F2E1D;
  --nexus-warning:          #F59E0B;  --nexus-warning-text: #F59E0B;  --nexus-warning-subtle: #3A2A08;
  --nexus-error:            #F87171;  --nexus-error-text:   #F87171;  --nexus-error-subtle:   #3A1D1D;
  /* In dark il fondo resta la tinta chiara e il contrasto lo fa
     l'inchiostro navy (nexus-v2-dx.css): niente da scurire. */
  --nexus-error-strong:     #F87171;
  --nexus-info:             #38BDF8;  --nexus-info-text:    #38BDF8;  --nexus-info-subtle:    #0B2A3F;

  --nexus-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.30);
  --nexus-shadow-md: 0 4px 10px -2px rgba(0, 0, 0, 0.40);
  --nexus-shadow-lg: 0 16px 36px -8px rgba(0, 0, 0, 0.55);
  /* Anche il fuoco segue il teal: l'anello degli editor del tema v2 e'
     gia' teal (nexus-v2-dx.css), un outline blu accanto sarebbe un
     secondo segnale di fuoco di un altro colore. --nexus-interactive
     resta blu: e' la tinta dei contenuti proposti dagli agenti. */
  --nexus-focus-ring: 0 0 0 3px rgba(28, 207, 201, 0.25);
  --nexus-focus-border: var(--nexus-accent);

  --nexus-hover-surface: #122A47;
  --nexus-active-surface: #1B3455;
  --nexus-selected-surface: #12274A;
  --nexus-disabled-fg: #6B7F97;
  --nexus-disabled-bg: #16304C;
}