/* Token condivisi da gestionale, app genitori e app istruttrici.
   Linguaggio Apple: sfondo raggruppato, superfici piene, materiali traslucidi, testo SF dove c'è.
   Marchio: rosso #D3232F, Gloock solo per i numeri e i titoli "firma", gradiente HorizonX negli hero. */
:root {
  color-scheme: light;
  --canvas: #F2F2F7;             /* systemGroupedBackground */
  --surface: #FFFFFF;            /* secondarySystemGroupedBackground */
  --surface-2: #F7F7FA;
  --sunken: rgb(118 118 128 / .12);   /* tertiarySystemFill */
  --sunken-2: rgb(118 118 128 / .08);
  --ink: #1C1C1E;
  --ink-2: rgb(60 60 67 / .85);
  --muted: rgb(60 60 67 / .62);
  --faint: rgb(60 60 67 / .34);
  --line: rgb(60 60 67 / .14);
  --line-strong: rgb(60 60 67 / .26);
  --material: rgb(249 249 251 / .78);
  --material-thick: rgb(249 249 251 / .9);

  --brand: #D3232F;
  --brand-hover: #BC1C27;
  --brand-ink: #FFFFFF;
  --brand-soft: rgb(211 35 47 / .1);
  --brand-tint: rgb(211 35 47 / .16);

  --g-verde: #3C8D2F;
  --g-rosso: #B8322A;
  --g-nero: #1E2420;

  --ok: #248A3D;     --ok-soft: rgb(52 199 89 / .14);
  --warn: #B25000;   --warn-soft: rgb(255 149 0 / .16);
  --bad: #C4141F;    --bad-soft: rgb(255 59 48 / .12);
  --info: #0063D1;   --info-soft: rgb(0 122 255 / .12);

  --focus: 0 0 0 4px color-mix(in srgb, var(--brand) 28%, transparent);
  --shadow-tap: 0 1px 1px rgb(0 0 0 / .04), 0 2px 8px -2px rgb(0 0 0 / .08);
  --shadow-lift: 0 2px 4px rgb(0 0 0 / .04), 0 12px 28px -10px rgb(0 0 0 / .18);
  --shadow-pop: 0 0 0 .5px rgb(0 0 0 / .06), 0 24px 60px -12px rgb(0 0 0 / .28), 0 4px 12px rgb(0 0 0 / .06);
  --shadow-drawer: -1px 0 0 rgb(0 0 0 / .06), -24px 0 60px -20px rgb(0 0 0 / .28);
  --hairline: 0 0 0 .5px var(--line);

  --font-ui: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Figtree", system-ui, "Segoe UI", sans-serif;
  --font-title: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Figtree", system-ui, "Segoe UI", sans-serif;
  --font-round: ui-rounded, "SF Pro Rounded", -apple-system, "Figtree", system-ui, sans-serif;
  --font-display: "Gloock", "New York", Georgia, "Times New Roman", serif;

  --r-hero: 28px;
  --r-card: 20px;
  --r-panel: 16px;
  --r-control: 11px;
  --r-chip: 999px;

  --s1: 4px; --s2: 8px; --s3: 12px; --s4: 16px; --s5: 20px; --s6: 24px; --s8: 32px; --s10: 40px; --s12: 48px;

  --t-xs: 12px; --t-sm: 13px; --t-md: 14px; --t-base: 15px; --t-lg: 17px; --t-xl: 22px;
  --t-display: clamp(30px, 2.6vw, 38px);
  --t-figure: 30px;

  --sidebar: 248px;
  --topbar: 56px;
  --ease: cubic-bezier(.2, .8, .2, 1);
  --spring: cubic-bezier(.32, .72, 0, 1);    /* curva dei fogli di iOS */
  --bounce: cubic-bezier(.34, 1.4, .64, 1);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --canvas: #000000; --surface: #1C1C1E; --surface-2: #232325; --sunken: rgb(118 118 128 / .24); --sunken-2: rgb(118 118 128 / .16);
    --ink: #F5F5F7; --ink-2: rgb(235 235 245 / .86); --muted: rgb(235 235 245 / .6); --faint: rgb(235 235 245 / .3);
    --line: rgb(84 84 88 / .55); --line-strong: rgb(84 84 88 / .85);
    --material: rgb(28 28 30 / .72); --material-thick: rgb(28 28 30 / .88);
    --brand: #FF5A62; --brand-hover: #FF737A; --brand-ink: #FFFFFF; --brand-soft: rgb(255 90 98 / .16); --brand-tint: rgb(255 90 98 / .24);
    --g-verde: #8AD47C; --g-rosso: #F2806F; --g-nero: #E6E9E4;
    --ok: #30D158; --ok-soft: rgb(48 209 88 / .18); --warn: #FF9F0A; --warn-soft: rgb(255 159 10 / .18);
    --bad: #FF6961; --bad-soft: rgb(255 69 58 / .2); --info: #409CFF; --info-soft: rgb(10 132 255 / .2);
    --shadow-tap: 0 0 0 .5px rgb(255 255 255 / .06); --shadow-lift: 0 0 0 .5px rgb(255 255 255 / .08), 0 16px 32px -12px rgb(0 0 0 / .7);
    --shadow-pop: 0 0 0 .5px rgb(255 255 255 / .1), 0 24px 60px -12px rgb(0 0 0 / .8);
    --shadow-drawer: -1px 0 0 rgb(255 255 255 / .08), -24px 0 60px -20px rgb(0 0 0 / .8);
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --canvas: #000000; --surface: #1C1C1E; --surface-2: #232325; --sunken: rgb(118 118 128 / .24); --sunken-2: rgb(118 118 128 / .16);
  --ink: #F5F5F7; --ink-2: rgb(235 235 245 / .86); --muted: rgb(235 235 245 / .6); --faint: rgb(235 235 245 / .3);
  --line: rgb(84 84 88 / .55); --line-strong: rgb(84 84 88 / .85);
  --material: rgb(28 28 30 / .72); --material-thick: rgb(28 28 30 / .88);
  --brand: #FF5A62; --brand-hover: #FF737A; --brand-ink: #FFFFFF; --brand-soft: rgb(255 90 98 / .16); --brand-tint: rgb(255 90 98 / .24);
  --g-verde: #8AD47C; --g-rosso: #F2806F; --g-nero: #E6E9E4;
  --ok: #30D158; --ok-soft: rgb(48 209 88 / .18); --warn: #FF9F0A; --warn-soft: rgb(255 159 10 / .18);
  --bad: #FF6961; --bad-soft: rgb(255 69 58 / .2); --info: #409CFF; --info-soft: rgb(10 132 255 / .2);
  --shadow-tap: 0 0 0 .5px rgb(255 255 255 / .06); --shadow-lift: 0 0 0 .5px rgb(255 255 255 / .08), 0 16px 32px -12px rgb(0 0 0 / .7);
  --shadow-pop: 0 0 0 .5px rgb(255 255 255 / .1), 0 24px 60px -12px rgb(0 0 0 / .8);
  --shadow-drawer: -1px 0 0 rgb(255 255 255 / .08), -24px 0 60px -20px rgb(0 0 0 / .8);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; -webkit-tap-highlight-color: transparent; }
body {
  margin: 0; background: var(--canvas); color: var(--ink);
  font: 400 var(--t-base)/1.47 var(--font-ui);
  letter-spacing: -.008em;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
h1, h2, h3, h4 { margin: 0; font-weight: 650; line-height: 1.2; letter-spacing: -.02em; font-family: var(--font-title); }
p { margin: 0; }
button, input, select, textarea { font: inherit; color: inherit; letter-spacing: inherit; }
a { color: inherit; }
img, svg { display: block; }
.num { font-variant-numeric: tabular-nums; }
[hidden] { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
:focus-visible { outline: none; box-shadow: var(--focus); }
::selection { background: var(--brand-tint); }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}
