/*
  Design token di Forge360.
  Tema scuro moderno con marca verde marino/ciano (gradazione #2E8B57 /
  #008B8B, su richiesta esplicita). Font (Inter/Manrope), raggi e alcuni
  pattern (badge utente, pulsante icona, header con pillole di contesto)
  sono adattati da HR360 (frontend/shared/HR360.css e ugi360.css, resi
  disponibili in questa sessione) — vedi docs/hr360-reuse-analysis.md per
  cosa è riusato: qui non riprendiamo bordeaux/carta da HR360, ma il
  pattern strutturale (header, badge card colorate) sì.
*/
:root {
  /* Colore di marca: verde marino (azione primaria) + ciano scuro (accento) */
  --f360-color-brand-600: #2e8b57;
  --f360-color-brand-700: #1f6f44;
  --f360-color-brand-800: #164f31;
  --f360-color-brand-300: #6fd9a8;
  --f360-color-brand-100: rgba(46, 139, 87, 0.16);
  --f360-color-accent: #008b8b;
  --f360-color-accent-600: #00696d;

  /* Superfici (tema scuro) */
  --f360-color-bg: #0e1513;
  --f360-color-surface: #161f1d;
  --f360-color-surface-alt: #1d2926;
  --f360-color-border: rgba(255, 255, 255, 0.09);

  /* Testo */
  --f360-color-text: #eef5f2;
  --f360-color-text-muted: #97a8a3;
  --f360-color-text-inverse: #ffffff;

  /* Stato / priorità (mai solo colore: sempre abbinati a etichetta/icona testuale) */
  --f360-color-critical: #ff8a75;
  --f360-color-critical-bg: rgba(255, 90, 60, 0.16);
  --f360-color-high: #ffb15c;
  --f360-color-high-bg: rgba(255, 150, 60, 0.16);
  --f360-color-medium: #ffd75e;
  --f360-color-medium-bg: rgba(255, 210, 80, 0.14);
  --f360-color-low: #63d992;
  --f360-color-low-bg: rgba(60, 200, 120, 0.16);
  --f360-color-info: #5fd4d4;
  --f360-color-info-bg: rgba(0, 139, 139, 0.2);
  --f360-color-neutral: #a9b8b4;
  --f360-color-neutral-bg: rgba(255, 255, 255, 0.08);

  --f360-color-success: #4ade80;
  --f360-color-danger: #ff6b5e;
  --f360-color-warning: #ffb15c;

  --f360-color-focus-ring: #3ddcc0;

  /* Tipografia (Inter/Manrope, come HR360) */
  --f360-font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --f360-font-family-heading: "Manrope", var(--f360-font-family);
  --f360-font-size-sm: 0.8125rem;
  --f360-font-size-base: 0.9375rem;
  --f360-font-size-md: 1.0625rem;
  --f360-font-size-lg: 1.25rem;
  --f360-font-size-xl: 1.625rem;
  --f360-line-height-base: 1.5;

  /* Spaziature (scala 4px) */
  --f360-space-1: 0.25rem;
  --f360-space-2: 0.5rem;
  --f360-space-3: 0.75rem;
  --f360-space-4: 1rem;
  --f360-space-5: 1.5rem;
  --f360-space-6: 2rem;
  --f360-space-7: 3rem;

  /* Raggio e ombre */
  --f360-radius-sm: 4px;
  --f360-radius-md: 8px;
  --f360-radius-lg: 12px;
  --f360-shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.35);
  --f360-shadow-md: 0 14px 34px rgba(0, 0, 0, 0.5);

  /* Layout */
  --f360-topbar-height: 64px;
  --f360-nav-width: 240px;
  --f360-touch-target-min: 44px;
  --f360-avatar-size: 34px;

  /* Breakpoint (solo riferimento, usati nelle media query) */
  --f360-breakpoint-sm: 480px;
  --f360-breakpoint-md: 768px;
  --f360-breakpoint-lg: 1024px;
}