/* ==========================================================================
   Revalior — Design tokens
   Fonte: "Revalior – Naming e Brand Identity", ottobre 2026 (slide 22–23)
   ========================================================================== */

:root {
  /* Palette di marca (slide 22) */
  --rv-profondo: #062E28;   /* Verde Profondo: testi, fondi istituzionali */
  --rv-verde: #087A68;      /* Verde Revalior: occhielli, linee, dati */
  --rv-menta: #3CC9A0;      /* Menta: SOLO su fondi scuri */
  --rv-grafite: #33443F;    /* Grafite: testo corrente */
  --rv-salvia: #E7EFEB;     /* Salvia: fondi secondari */
  --rv-nebbia: #F5F8F6;     /* Nebbia: fondo principale */

  /* Toni di supporto (derivati dalle slide) */
  --rv-bianco: #FCFDFC;     /* superfici delle card */
  --rv-ardesia: #5E6B66;    /* testo secondario, piè di pagina */
  --rv-ambra: #8C5A12;      /* "Da verificare", "Non fare", errori */
  --rv-ambra-bg: #F6EEDF;
  --rv-rosso: #A8321E;      /* solo per "Ferma" ed errori bloccanti */
  --rv-rosso-bg: #F9E7E3;
  --rv-linea: #DCE5E0;
  --rv-linea-forte: #C5D2CC;

  /* Ruoli semantici: usare questi nei componenti */
  --color-bg: var(--rv-nebbia);
  --color-surface: var(--rv-bianco);
  --color-surface-alt: var(--rv-salvia);
  --color-ink: var(--rv-profondo);
  --color-text: var(--rv-grafite);
  --color-muted: var(--rv-ardesia);
  --color-accent: var(--rv-verde);
  --color-accent-on-dark: var(--rv-menta);
  --color-on-dark: #F5F8F6;
  --color-on-dark-muted: rgba(245, 248, 246, .74);
  --color-line: var(--rv-linea);
  --color-line-strong: var(--rv-linea-forte);
  --color-warning: var(--rv-ambra);

  /* Caratteri (slide 23) */
  --font-display: "Montserrat", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-body: "Nunito Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --fw-heading: 600;   /* brand book, slide 23: Montserrat Semibold per titoli e occhielli */
  --fw-semibold: 600;

  --fs-xs: .75rem;
  --fs-sm: .875rem;
  --fs-md: 1rem;
  --fs-lg: 1.125rem;
  --fs-xl: 1.375rem;
  --fs-2xl: 1.75rem;
  --fs-3xl: 2.25rem;

  /* Spazi, raggi, ombre */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 28px;
  --space-7: 40px;
  --space-8: 64px;

  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-pill: 999px;

  --shadow-sm: 0 1px 2px rgba(6, 46, 40, .06);
  --shadow-md: 0 10px 30px -12px rgba(6, 46, 40, .22);

  /* Layout */
  --sidebar-w: 256px;
  --topbar-h: 72px;
  --content-max: 1200px;

  --ease: cubic-bezier(.2, .7, .2, 1);
}