/**
 * CSS Variables - Fabio Trovato Osteopata
 * Palette teal-blu professionale (da logo)
 */

:root {
    /* === COLORI BRAND - PALETTE TEAL-BLU === */
    --ft-primary: #1B6B93;           /* Teal blu principale */
    --ft-primary-dark: #0E4D6E;      /* Navy teal scuro */
    --ft-primary-light: #5BA4C9;     /* Teal chiaro */
    
    --ft-secondary: #2193B0;         /* Cyan teal brillante */
    --ft-secondary-dark: #1A7A94;    /* Cyan scuro */
    --ft-secondary-light: #6DD5ED;   /* Azzurro cielo */
    
    --ft-accent: #E8A838;            /* Oro caldo (CTA) */
    --ft-accent-dark: #D49020;       /* Oro scuro */
    --ft-accent-light: #FFD166;      /* Giallo morbido */
    
    /* === TONI NEUTRI === */
    --ft-text-primary: #1A2332;      /* Testo principale - navy scuro */
    --ft-text-secondary: #4A5568;    /* Testo secondario */
    --ft-text-light: #8899A6;        /* Testo chiaro */
    
    --ft-bg-white: #FAFCFD;          /* Bianco freddo pulito */
    --ft-bg-light: #EFF5F8;          /* Azzurro ghiaccio */
    --ft-bg-gray: #DDE7ED;           /* Grigio azzurro */
    --ft-bg-warm: #F0F7FB;           /* Bianco azzurrato */
    --ft-bg-dark: #0D2E3F;           /* Navy scurissimo */
    
    /* === STATI === */
    --ft-success: #27AE60;           /* Success verde */
    --ft-danger: #E74C3C;            /* Danger rosso */
    --ft-warning: #F39C12;           /* Warning arancio */
    --ft-info: #3498DB;              /* Info azzurro */
    
    /* === TIPOGRAFIA === */
    --ft-font-heading: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --ft-font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    
    --ft-font-weight-light: 300;
    --ft-font-weight-regular: 400;
    --ft-font-weight-medium: 500;
    --ft-font-weight-semibold: 600;
    --ft-font-weight-bold: 700;
    
    /* === SPACING === */
    --ft-space-xs: 0.25rem;   /* 4px */
    --ft-space-sm: 0.5rem;    /* 8px */
    --ft-space-md: 1rem;      /* 16px */
    --ft-space-lg: 1.5rem;    /* 24px */
    --ft-space-xl: 2rem;      /* 32px */
    --ft-space-2xl: 3rem;     /* 48px */
    --ft-space-3xl: 4rem;     /* 64px */
    
    /* === BORDER RADIUS === */
    --ft-radius-sm: 0.25rem;   /* 4px */
    --ft-radius-md: 0.5rem;    /* 8px */
    --ft-radius-lg: 1rem;      /* 16px */
    --ft-radius-xl: 1.5rem;    /* 24px */
    --ft-radius-pill: 50rem;   /* Pill shape */
    --ft-radius-circle: 50%;   /* Circle */
    
    /* === SHADOWS === */
    --ft-shadow-sm: 0 2px 4px rgba(13, 46, 63, 0.06);
    --ft-shadow-md: 0 4px 12px rgba(13, 46, 63, 0.1);
    --ft-shadow-lg: 0 8px 24px rgba(13, 46, 63, 0.12);
    --ft-shadow-xl: 0 16px 48px rgba(13, 46, 63, 0.16);
    
    /* === TRANSITIONS === */
    --ft-transition-fast: 0.15s ease-in-out;
    --ft-transition-base: 0.3s ease-in-out;
    --ft-transition-slow: 0.5s ease-in-out;
    
    /* === GRADIENTS === */
    --ft-gradient-primary: linear-gradient(135deg, #0E4D6E 0%, #2193B0 100%);
    --ft-gradient-secondary: linear-gradient(135deg, #1B6B93 0%, #5BA4C9 100%);
    --ft-gradient-warm: linear-gradient(135deg, #E8A838 0%, #F0C060 100%);
    --ft-gradient-hero: linear-gradient(135deg, #0E4D6E 0%, #2193B0 100%);
    
    /* === Z-INDEX === */
    --ft-z-dropdown: 1000;
    --ft-z-sticky: 1020;
    --ft-z-fixed: 1030;
    --ft-z-modal-backdrop: 1040;
    --ft-z-modal: 1050;
    --ft-z-popover: 1060;
    --ft-z-tooltip: 1070;
}

/* === DARK MODE SUPPORT (futuro) === */
@media (prefers-color-scheme: dark) {
    :root {
        /* Al momento light theme only */
    }
}