/* =============================================
   EGONEX — Design Tokens
   Unica fonte di verità per colori, spacing,
   tipografia, ombre, radius e transizioni.
   =============================================
   REGOLA: Zero hex hardcoded nel CSS.
   Ogni colore usa var(--token).
   ============================================= */

:root {
    /* ── Brand ─────────────────────────────── */
    --color-blue:            #4472C4;
    --color-blue-dark:       #345a9e;
    --color-blue-light:      #e8eef8;
    --color-orange:          #f59e0b;
    --color-orange-dark:     #d97706;
    --color-orange-light:    #fef3c7;
    --color-green:           #10b981;
    --color-red:             #ef4444;

    /* ── Testo ─────────────────────────────── */
    --text-primary:          #1a1a1a;
    --text-secondary:        #374151;
    --text-muted:            #6b7280;
    --text-faint:            #9ca3af;
    --text-on-dark:          #ffffff;
    --text-on-dark-muted:    rgba(255, 255, 255, 0.6);
    --text-on-dark-faint:    rgba(255, 255, 255, 0.4);

    /* ── Sfondi ────────────────────────────── */
    --bg-white:              #ffffff;
    --bg-gray:               #f9fafb;
    --bg-gray-medium:        #f3f4f6;
    --bg-dark:               #0c1929;
    --bg-dark-mid:           #132742;
    --bg-dark-deep:          #060d18;
    --bg-code:               #1e1e2e;

    /* ── Bordi ─────────────────────────────── */
    --border-light:          #e5e7eb;
    --border-medium:         #d1d5db;
    --border-on-dark:        rgba(255, 255, 255, 0.08);
    --border-on-dark-light:  rgba(255, 255, 255, 0.15);

    /* ── Ombre ─────────────────────────────── */
    --shadow-sm:             0 1px 2px rgba(0, 0, 0, 0.05);
    --shadow-md:             0 4px 6px -1px rgba(0, 0, 0, 0.1);
    --shadow-lg:             0 10px 15px -3px rgba(0, 0, 0, 0.1);
    --shadow-dark:           0 8px 32px rgba(0, 0, 0, 0.3);

    /* ── Spacing ───────────────────────────── */
    --spacing-xs:            0.25rem;
    --spacing-sm:            0.5rem;
    --spacing-md:            1rem;
    --spacing-lg:            1.5rem;
    --spacing-xl:            2rem;
    --spacing-2xl:           3rem;
    --spacing-3xl:           4rem;

    /* ── Typography ────────────────────────── */
    --font-family:           'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-mono:             'JetBrains Mono', 'Fira Code', 'Cascadia Code', monospace;

    --font-size-xs:          0.75rem;
    --font-size-sm:          0.875rem;
    --font-size-base:        1rem;
    --font-size-lg:          1.125rem;
    --font-size-xl:          1.25rem;
    --font-size-2xl:         1.5rem;
    --font-size-3xl:         1.875rem;
    --font-size-4xl:         2.25rem;
    --font-size-5xl:         3rem;

    /* ── Radius ────────────────────────────── */
    --radius-sm:             6px;
    --radius-md:             10px;
    --radius-lg:             16px;
    --radius-full:           9999px;

    /* ── Transitions ───────────────────────── */
    --transition-fast:       0.15s ease;
    --transition-base:       0.25s ease;
    --transition-slow:       0.35s ease;

    /* ── Breakpoints (ref only, use in @media) */
    /* sm: 640px  md: 768px  lg: 1024px  xl: 1280px */

    /* ── Legacy aliases (per compatibilità durante migrazione) ── */
    --primary-blue:          var(--color-blue);
    --egonex-orange:         var(--color-orange);
    --success-green:         var(--color-green);
    --bg-light:              var(--bg-gray);
    --bg-dark-legacy:        #252525;
    --bg-gray-50:            var(--bg-gray);
    --bg-gray-100:           var(--bg-gray-medium);
}