/* ==========================================
   GESTIONALE SMART 2.0 - DESIGN TOKENS
   Migrated from website/css/style.css
   ========================================== */

:root {
    /* ===== PRIMARY COLORS (10% - Accent/CTA) ===== */
    --primary-color: #2E099C;
    --primary-color-hover: #1F0670;
    --primary-color-rgb: 46, 9, 156;
    --primary-light: #6B3FA0;
    --primary-lighter: #EEE8FF;
    
    /* Accent (Energy color - breaks monotony) */
    --accent-color: #E040FB;
    --accent-hover: #CE35E8;
    --accent-light: #F3E5F5;
    --accent-rgb: 224, 64, 251;
    
    /* Brand Gradient (signature) */
    --gradient-brand: linear-gradient(135deg, #2E099C 0%, #6366F1 50%, #E040FB 100%);
    --gradient-brand-subtle: linear-gradient(135deg, rgba(46,9,156,0.08) 0%, rgba(99,102,241,0.06) 50%, rgba(224,64,251,0.04) 100%);
    --gradient-cta: linear-gradient(135deg, #2E099C 0%, #4F46E5 100%);
    --gradient-hero: linear-gradient(180deg, #FFFFFF 0%, #F8F9FB 100%);
    --gradient-text: linear-gradient(135deg, var(--primary-color), #6366F1, #E040FB);
    
    /* Primary Opacity Variants */
    --primary-100: rgba(46, 9, 156, 1);
    --primary-70: rgba(46, 9, 156, 0.7);
    --primary-40: rgba(46, 9, 156, 0.4);
    --primary-15: rgba(46, 9, 156, 0.15);
    --primary-08: rgba(46, 9, 156, 0.08);
    
    /* ===== NEUTRALS (60% - Background/Text) ===== */
    --white: #ffffff;
    --black: #000000;
    
    /* Backgrounds */
    --bg-primary: #FFFFFF;
    --bg-secondary: #F8F9FB;
    --bg-tertiary: #F1F3F6;
    
    /* Text Colors */
    --text-primary: #1A1D26;
    --text-secondary: #4A5568;
    --text-tertiary: #718096;
    --text-muted: #A0AEC0;
    
    /* Gray Scale */
    --gray-100: #f8f9fa;
    --gray-200: #e9ecef;
    --gray-300: #dee2e6;
    --gray-400: #ced4da;
    --gray-500: #adb5bd;
    --gray-600: #718096;
    --gray-700: #4A5568;
    --gray-800: #1A1D26;
    --gray-900: #1A1D26;
    
    /* Borders */
    --border-color: #E2E8F0;
    --border-hover: #CBD5E0;
    
    /* ===== SURFACES ===== */
    --surface: #FFFFFF;
    --surface-raised: #FFFFFF;
    --surface-overlay: rgba(26, 29, 38, 0.8);
    
    /* ===== STATUS COLORS ===== */
    --danger: #EF4444;
    --success: #10B981;
    --warning: #F59E0B;
    --info: #3B82F6;
    
    /* ===== TYPOGRAPHY SCALE (Major Third 1.25) ===== */
    --font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    
    --text-xs: 0.75rem;
    --text-sm: 0.875rem;
    --text-base: 1rem;
    --text-lg: 1.125rem;
    --text-xl: 1.25rem;
    --text-2xl: 1.563rem;
    --text-3xl: 1.953rem;
    --text-4xl: 2.441rem;
    --text-5xl: 3.052rem;
    --text-6xl: 3.815rem;
    
    --leading-tight: 1.1;
    --leading-snug: 1.25;
    --leading-normal: 1.5;
    --leading-relaxed: 1.625;
    
    --tracking-tight: -0.025em;
    --tracking-normal: 0;
    --tracking-wide: 0.025em;
    
    --prose-width: 65ch;
    
    /* ===== SPACING (8pt Grid) ===== */
    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-5: 1.5rem;
    --space-6: 2rem;
    --space-8: 3rem;
    --space-10: 4rem;
    --space-12: 5rem;
    --space-16: 6rem;
    --space-20: 8rem;
    --space-24: 10rem;
    
    --section-py: var(--space-12);
    
    /* ===== SHADOWS ===== */
    --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
    --shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
    --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
    --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
    --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
    --shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / 0.25);
    --shadow-3d: 0 20px 60px rgba(0, 0, 0, 0.15), 0 10px 30px rgba(0, 0, 0, 0.1);
    --shadow-glow: 0 0 40px rgba(107, 63, 160, 0.3);
    --shadow-glow-accent: 0 0 40px rgba(224, 64, 251, 0.25);
    --shadow-brand: 0 4px 24px rgba(46, 9, 156, 0.18);
    --shadow-card-hover: 0 20px 40px rgba(46, 9, 156, 0.12), 0 0 0 1px rgba(46, 9, 156, 0.06);
    --primary-glow: rgba(107, 63, 160, 0.4);
    
    /* ===== BORDER RADIUS ===== */
    --radius-sm: 0.375rem;
    --radius: 0.5rem;
    --radius-md: 0.75rem;
    --radius-lg: 1rem;
    --radius-xl: 1.5rem;
    --radius-2xl: 2rem;
    --radius-full: 9999px;
    
    /* ===== TRANSITIONS ===== */
    --transition: all 0.3s ease;
    --transition-fast: all 0.15s ease;
    --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
    --ease-out-back: cubic-bezier(0.34, 1.56, 0.64, 1);
    --duration-normal: 0.6s;
    --duration-slow: 1s;
    
    /* ===== LAYOUT ===== */
    --container-max: 1280px;
    --container-px: 1.5rem;
    --navbar-height: 72px;
    
    /* ===== GLASSMORPHISM ===== */
    --glass-bg: rgba(255, 255, 255, 0.7);
    --glass-border: rgba(255, 255, 255, 0.3);
    --glass-blur: 16px;
    --glass-dark-bg: rgba(15, 5, 41, 0.6);
    --glass-dark-border: rgba(255, 255, 255, 0.08);
}