/*
 * HRCC — theme.css
 * Fondamenta del restyling grafico (Fase 2a, 23/09/2026).
 *
 * Un solo set di variabili semantiche condiviso da HR, Monitoring, IT.Full e Front Office.
 * Non ancora incluso in nessuna pagina: la sua sola presenza non cambia nulla nell'app.
 *
 * Palette di default (":root", nessun attributo data-palette) = colori HR attuali
 * (identici a static/style.css) così che, quando verrà collegato, il primo effetto
 * sia zero cambiamento visivo per chi non ha ancora scelto una preferenza.
 *
 * Raggio angoli/spaziature: NON ancora convergenti verso lo stile compatto di
 * Monitoring/IT — resta il valore HR attuale (24px/16px) finché Daniele non conferma
 * esplicitamente il cambiamento (vedi PIANO_RESTYLING.md, unico punto in sospeso).
 */

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/static/fonts/inter-400.woff2') format('woff2');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/static/fonts/inter-500.woff2') format('woff2');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/static/fonts/inter-600.woff2') format('woff2');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/static/fonts/inter-700.woff2') format('woff2');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url('/static/fonts/inter-800.woff2') format('woff2');
}

:root {
  /* Palette 1 — Scuro Blu (default, = colori HR attuali) */
  --hrcc-color-bg:         #0b1020;
  --hrcc-color-bg-2:       #11182d;
  --hrcc-color-surface:    rgba(19,27,48,.72);
  --hrcc-color-surface-2:  rgba(17,24,39,.9);
  --hrcc-color-text:       #edf3ff;
  --hrcc-color-muted:      #a7b4d1;
  --hrcc-color-border:     rgba(148,163,184,.18);
  --hrcc-color-primary:    #35c2ff;
  --hrcc-color-primary-2:  #177dff;
  --hrcc-color-success:    #35d6a1;
  --hrcc-color-danger:     #ff6b7a;
  --hrcc-color-warning:    #ffb648;

  /* Token non legati alla palette — un solo valore per tutta l'app */
  --hrcc-shadow:      0 20px 80px rgba(0,0,0,.35);
  --hrcc-radius-lg:   10px;
  --hrcc-radius-sm:   8px;
  --hrcc-space-1:     4px;
  --hrcc-space-2:     8px;
  --hrcc-space-3:     12px;
  --hrcc-space-4:     16px;
  --hrcc-space-5:     24px;
  --hrcc-space-6:     32px;
  --hrcc-transition:  220ms cubic-bezier(.2,.8,.2,1);

  /* Font: "Predefinito" = Inter auto-ospitato, con fallback ai font di sistema
     se il file non si carica (mai un riferimento morto come oggi in style.css) */
  --hrcc-font-body: 'Inter', -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
}

/* ---- Palette selezionabili dall'utente (menu "🎨 Aspetto", cookie hrcc_palette) ---- */
/* Solo i colori cambiano: radius, spaziature, transition restano quelli sopra. */

:root[data-palette="scuro-slate"] {
  --hrcc-color-bg: #0d1117;
  --hrcc-color-bg-2: #10151c;
  --hrcc-color-surface: #161b22;
  --hrcc-color-surface-2: #1c2128;
  --hrcc-color-text: #e6edf3;
  --hrcc-color-muted: #8b949e;
  --hrcc-color-border: #30363d;
  --hrcc-color-primary: #7c6cf6;
  --hrcc-color-primary-2: #5b4bd6;
  --hrcc-color-success: #3fb950;
  --hrcc-color-danger: #f85149;
  --hrcc-color-warning: #d29922;
}

:root[data-palette="chiaro-neutro"] {
  --hrcc-color-bg: #f7f8fb;
  --hrcc-color-bg-2: #eef0f5;
  --hrcc-color-surface: #ffffff;
  --hrcc-color-surface-2: #f4f5f8;
  --hrcc-color-text: #1c2333;
  --hrcc-color-muted: #6b7383;
  --hrcc-color-border: #e2e5ec;
  --hrcc-color-primary: #3562e3;
  --hrcc-color-primary-2: #2347b8;
  --hrcc-color-success: #1a9d6c;
  --hrcc-color-danger: #d64553;
  --hrcc-color-warning: #b8790a;
}

:root[data-palette="chiaro-alto-contrasto"] {
  --hrcc-color-bg: #ffffff;
  --hrcc-color-bg-2: #f7f8fa;
  --hrcc-color-surface: #f3f5fa;
  --hrcc-color-surface-2: #e9ecf3;
  --hrcc-color-text: #10131a;
  --hrcc-color-muted: #404652;
  --hrcc-color-border: #b9c0d1;
  --hrcc-color-primary: #1d4ed8;
  --hrcc-color-primary-2: #1739a6;
  --hrcc-color-success: #146c43;
  --hrcc-color-danger: #b3261e;
  --hrcc-color-warning: #92600a;
}

:root[data-palette="scuro-petrolio"] {
  --hrcc-color-bg: #071e1c;
  --hrcc-color-bg-2: #0a2321;
  --hrcc-color-surface: #0d2b28;
  --hrcc-color-surface-2: #113531;
  --hrcc-color-text: #e8fbf7;
  --hrcc-color-muted: #8fb8b2;
  --hrcc-color-border: rgba(94,234,212,.16);
  --hrcc-color-primary: #2dd4bf;
  --hrcc-color-primary-2: #14b8a6;
  --hrcc-color-success: #34d399;
  --hrcc-color-danger: #f87171;
  --hrcc-color-warning: #fbbf24;
}

:root[data-palette="chiaro-caldo"] {
  --hrcc-color-bg: #faf6f0;
  --hrcc-color-bg-2: #f3ecdf;
  --hrcc-color-surface: #ffffff;
  --hrcc-color-surface-2: #f6f1e8;
  --hrcc-color-text: #2b2420;
  --hrcc-color-muted: #7c6f63;
  --hrcc-color-border: #e8ddd0;
  --hrcc-color-primary: #b45309;
  --hrcc-color-primary-2: #92400e;
  --hrcc-color-success: #15803d;
  --hrcc-color-danger: #b91c1c;
  --hrcc-color-warning: #a16207;
}

/* ---- Stile carattere (menu "🎨 Aspetto", cookie hrcc_font_family) ---- */

html[data-font="sistema"] {
  --hrcc-font-body: -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
}

/* ---- Dimensione testo, 4 passi (menu "🎨 Aspetto", cookie hrcc_font_scale) ----
   Agisce sulla dimensione radice: tutto ciò che nei template userà unità "rem"
   (spaziature, icone, altezza delle card, non solo il testo) scala di conseguenza. */

html[data-font-scale="piccolo"]       { font-size: 14px; }
html:not([data-font-scale]),
html[data-font-scale="normale"]       { font-size: 16px; }
html[data-font-scale="grande"]        { font-size: 18px; }
html[data-font-scale="molto-grande"]  { font-size: 20px; }


/* ---- Scrollbar (23/09/2026) ----
   Sottili e colorate come il resto dell'app, al posto di quelle di sistema
   (grigie, spesse). Regola unica e globale: vale per tutte le scrollbar,
   verticali e orizzontali, di ogni pagina che include questo file (HR,
   IT.Full, Monitoring Admin/TL). Pista leggermente visibile (variante scelta
   da Daniele) cosi' si capisce subito che c'e' altro sopra/sotto anche da
   fermi, non solo quando si passa sopra con il mouse. */
* {
  scrollbar-width: thin;
  scrollbar-color: color-mix(in srgb, var(--hrcc-color-primary) 45%, transparent)
                   color-mix(in srgb, var(--hrcc-color-text) 6%, transparent);
}
*::-webkit-scrollbar { width: 10px; height: 10px; }
*::-webkit-scrollbar-track {
  background: color-mix(in srgb, var(--hrcc-color-text) 6%, transparent);
  border-radius: 999px;
}
*::-webkit-scrollbar-thumb {
  background: color-mix(in srgb, var(--hrcc-color-primary) 40%, transparent);
  border-radius: 999px;
  border: 2px solid transparent;
  background-clip: padding-box;
}
*::-webkit-scrollbar-thumb:hover {
  background: color-mix(in srgb, var(--hrcc-color-primary) 65%, transparent);
}
*::-webkit-scrollbar-corner { background: transparent; }