/* ============================================================
   variables.css — Tokens globali, reset, custom properties
   ============================================================ */

/* ── Google Font import ── */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@300;400;500;600&family=DM+Mono:wght@400;500&display=swap');

/* ── Root tokens ── */
:root {
  /* Palette base */
  --color-navy:          #1a2f4e;
  --color-navy-dark:     #12243d;
  --color-navy-light:    #243858;
  --color-navy:          #1a2f4e;
  --color-navy-dark:     #12243d;
  --color-navy-light:    #243858;
  --color-accent:        #2563eb;
  --color-accent-hover:  #1d4ed8;
  --color-accent-bg:     #eff4ff;
  --color-accent-border: #bfdbfe;

  /* Superfici */
  --bg-page:             #eef0f3;
  --bg-surface:          #ffffff;
  --bg-surface-2:        #f4f5f7;
  --bg-surface-3:        #e8eaed;

  /* Bordi */
  --border-color:        #e2e4e8;
  --border-soft:         #eceef1;
  --border-focus:        #93c5fd;

  /* Testo */
  --text-primary:        #1a1d23;
  --text-secondary:      #6b7280;
  --text-muted:          #9ca3af;
  --text-inverse:        #ffffff;

  /* Semantici */
  --color-success:       #16a34a;
  --color-success-bg:    #f0fdf4;
  --color-success-border:#86efac;
  --color-success-text:  #14532d;

  --color-warning:       #d97706;
  --color-warning-bg:    #fffbeb;
  --color-warning-border:#fcd34d;
  --color-warning-text:  #78350f;

  --color-danger:        #dc2626;
  --color-danger-bg:     #fff1f2;
  --color-danger-border: #fca5a5;
  --color-danger-text:   #7f1d1d;

  --color-info:          #0284c7;
  --color-info-bg:       #f0f9ff;
  --color-info-border:   #bae6fd;
  --color-info-text:     #0c4a6e;

  /* Ticket status */
  --color-status-open:   #15803d;
  --color-status-open-bg:#f0fdf4;
  --color-status-pend:   #b45309;
  --color-status-pend-bg:#fffbeb;
  --color-status-close:  #64748b;
  --color-status-close-bg:#f1f5f9;
  --color-status-urgent: #be123c;
  --color-status-urgent-bg:#fff1f2;

  /* Tipografia */
  --font-sans:   'DM Sans', system-ui, sans-serif;
  --font-mono:   'DM Mono', ui-monospace, monospace;

  --fs-xs:   12px;
  --fs-sm:   13px;
  --fs-base: 13px;
  --fs-md:   15px;
  --fs-lg:   17px;
  --fs-xl:   19px;
  --fs-2xl:  23px;

  --fw-light:   300;
  --fw-normal:  400;
  --fw-medium:  500;
  --fw-semibold:600;

  --lh-tight:   1.3;
  --lh-base:    1.6;
  --lh-loose:   1.8;

  /* Spaziatura */
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  20px;
  --space-6:  24px;
  --space-8:  32px;
  --space-10: 40px;

  /* Raggi */
  --radius-sm:  5px;
  --radius-md:  7px;
  --radius-lg:  10px;
  --radius-xl:  14px;
  --radius-pill:99px;

  /* Ombre */
  --shadow-sm:   0 1px 3px rgba(0,0,0,.06), 0 1px 2px rgba(0,0,0,.04);
  --shadow-md:   0 4px 12px rgba(0,0,0,.08), 0 2px 4px rgba(0,0,0,.04);
  --shadow-lg:   0 10px 30px rgba(0,0,0,.10), 0 4px 8px rgba(0,0,0,.05);
  --shadow-focus:0 0 0 3px rgba(37,99,235,.25);

  /* Layout */
  --topbar-height:  50px;
  --footer-height:  40px;
  --content-max:    1400px;

  /* Transizioni */
  --transition-fast: 100ms ease;
  --transition-base: 150ms ease;
  --transition-slow: 250ms ease;
}