/* ============================================================================
   Design tokens — Gestione Squadra
   Sportivo / federazione, blu istituzionale.
   Allineato al design system Claude Design (handoff 2026-05-23).
   ============================================================================ */

:root {
  /* Navy primary — manifest theme_color = navy-700 */
  --navy-950: #001432;
  --navy-900: #001f4d;
  --navy-800: #002a6a;
  --navy-700: #003882;
  --navy-600: #0a4fb4;
  --navy-500: #1d6cd6;
  --navy-400: #4f93ee;
  --navy-300: #8fb7f4;
  --navy-200: #c5d9f8;
  --navy-100: #e3edfb;
  --navy-50:  #f1f6fd;

  /* Red accent (sportivo, club) */
  --red-700: #b91c1c;
  --red-600: #dc2626;
  --red-500: #ef4444;
  --red-100: #fee2e2;
  --red-50:  #fef2f2;

  /* Neutrals (ink) */
  --ink-950: #0a0f1c;
  --ink-900: #0f172a;
  --ink-800: #1e293b;
  --ink-700: #334155;
  --ink-600: #475569;
  --ink-500: #64748b;
  --ink-400: #94a3b8;
  --ink-300: #cbd5e1;
  --ink-200: #e2e8f0;
  --ink-100: #f1f5f9;

  /* Paper / surfaces */
  --paper:   #f2f4f8;
  --paper-2: #e8ecf2;
  --white:   #ffffff;

  /* Semantic — significati fissi:
     verde = ok/completato · arancio = attenzione/da fare
     rosso = critico/partite · navy = strutturale */
  --success-700: #15803d;
  --success-600: #16a34a;
  --success-100: #dcfce7;
  --warning-700: #b45309;
  --warning-600: #d97706;
  --warning-500: #f59e0b;
  --warning-100: #fef3c7;
  --danger-700:  #b91c1c;
  --danger-600:  #dc2626;
  --danger-100:  #fee2e2;
  --info-600:    #0284c7;
  --info-100:    #e0f2fe;

  /* Presence state colors (10 stati) */
  --pres-present:     #16a34a;  /* presente */
  --pres-absent-just: #f59e0b;  /* assente giustificato */
  --pres-absent-no:   #ef4444;  /* assente non giustificato */
  --pres-differ:      #8b5cf6;  /* differenziato */
  --pres-gym:         #06b6d4;  /* palestra */
  --pres-late:        #f97316;  /* ritardo */
  --pres-injury:      #db2777;  /* infortunato */
  --pres-illness:     #a855f7;  /* malattia */
  --pres-permit:      #0891b2;  /* permesso */
  --pres-elsewhere:   #64748b;  /* convocato altrove */
  --pres-empty:       #e2e8f0;  /* non registrato */

  /* Role family colors (avatar / pedine campo) */
  --role-por-from:    hsl(38,  85%, 42%);  /* ottone */
  --role-por-to:      hsl(32,  78%, 26%);
  --role-dif-from:    hsl(216, 70%, 35%);  /* navy */
  --role-dif-to:      hsl(220, 75%, 18%);
  --role-cen-from:    hsl(248, 55%, 42%);  /* indaco */
  --role-cen-to:      hsl(252, 60%, 24%);
  --role-att-from:    hsl(354, 64%, 42%);  /* rosso scuro */
  --role-att-to:      hsl(358, 70%, 24%);

  /* Pitch (campo tattico, non realistico) */
  --pitch-dark:   #1f6e3e;
  --pitch-mid:    #2a8852;
  --pitch-light:  #34a55f;
  --pitch-stripe: #2d9558;

  /* Type — Barlow Condensed display + Inter body */
  --font-display: 'Barlow Condensed', 'Inter', system-ui, sans-serif;
  --font-body:    'Inter', system-ui, -apple-system, sans-serif;
  --font-mono:    'JetBrains Mono', ui-monospace, monospace;

  /* Spacing scale (4/8/12/16/20/24/32) — usare religiosamente */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 20px;
  --sp-6: 24px;
  --sp-8: 32px;
  --sp-10: 40px;
  --sp-12: 48px;

  /* Radii */
  --r-xs: 6px;
  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 16px;
  --r-xl: 20px;
  --r-2xl: 24px;
  --r-pill: 9999px;

  /* Shadows */
  --sh-xs:   0 1px 2px rgba(15, 23, 42, 0.04);
  --sh-sm:   0 1px 3px rgba(15, 23, 42, 0.06), 0 1px 2px rgba(15, 23, 42, 0.04);
  --sh-md:   0 4px 12px rgba(15, 23, 42, 0.06), 0 1px 3px rgba(15, 23, 42, 0.04);
  --sh-lg:   0 10px 32px rgba(15, 23, 42, 0.10), 0 2px 6px rgba(15, 23, 42, 0.04);
  --sh-navy: 0 6px 24px rgba(0, 56, 130, 0.18);
}

/* No tap highlight on iOS */
* { -webkit-tap-highlight-color: transparent; }

/* Utility classes coerenti col design */
.display       { font-family: var(--font-display); letter-spacing: -0.01em; }
.tnum          { font-variant-numeric: tabular-nums; }
.uppercase-sm  { text-transform: uppercase; letter-spacing: 0.08em; font-size: 11px; font-weight: 600; }

.scroll-hide::-webkit-scrollbar { display: none; }
.scroll-hide                    { scrollbar-width: none; }

/* Press feedback universale sui bottoni (design system) */
button { transition: transform 0.08s ease, background-color 0.12s ease, color 0.12s ease, border-color 0.12s ease, box-shadow 0.12s ease; }
button:not(:disabled):active { transform: scale(0.98); }

/* Focus ring solo via tastiera */
button:focus:not(:focus-visible),
input:focus:not(:focus-visible),
select:focus:not(:focus-visible),
textarea:focus:not(:focus-visible) { outline: none; }
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 2px solid var(--navy-500);
  outline-offset: 2px;
}