/**
 * ADIGO Theme - CSS Custom Properties (Variables)
 * Variables centralisées pour cohérence et maintenance facile
 * 
 * @package ADIGO
 * @version 3.2.0
 */

:root {
    /* ===========================================
       COULEURS PRINCIPALES
       =========================================== */
    --adigo-primary: #C3110D;
    --adigo-primary-light: #ff4444;
    --adigo-primary-dark: #a00d0a;
    --adigo-primary-rgb: 195, 17, 13;
    
    /* Couleurs secondaires */
    --adigo-secondary: #667eea;
    --adigo-secondary-light: #764ba2;
    --adigo-accent-green: #43e97b;
    --adigo-accent-teal: #38f9d7;
    --adigo-accent-pink: #fa709a;
    --adigo-accent-blue: #4facfe;
    --adigo-accent-yellow: #ffd93d;
    
    /* Neutres */
    --adigo-white: #ffffff;
    --adigo-black: #0a0a0a;
    --adigo-gray-50: #f8f9fa;
    --adigo-gray-100: #f0f0f0;
    --adigo-gray-200: #e9ecef;
    --adigo-gray-300: #dee2e6;
    --adigo-gray-400: #ced4da;
    --adigo-gray-500: #adb5bd;
    --adigo-gray-600: #666666;
    --adigo-gray-700: #495057;
    --adigo-gray-800: #343a40;
    --adigo-gray-900: #212529;
    
    /* Textes */
    --adigo-text-primary: #0a0a0a;
    --adigo-text-secondary: #666666;
    --adigo-text-muted: #999999;
    --adigo-text-light: rgba(255, 255, 255, 0.9);
    --adigo-text-light-muted: rgba(255, 255, 255, 0.7);
    
    /* États */
    --adigo-success: #28a745;
    --adigo-warning: #ffc107;
    --adigo-error: #dc3545;
    --adigo-info: #17a2b8;
    
    /* ===========================================
       TYPOGRAPHIE
       =========================================== */
    --adigo-font-primary: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --adigo-font-heading: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --adigo-font-mono: 'Fira Code', 'Monaco', 'Consolas', monospace;
    
    /* Tailles de police */
    --adigo-text-xs: 0.75rem;    /* 12px */
    --adigo-text-sm: 0.875rem;   /* 14px */
    --adigo-text-base: 1rem;     /* 16px */
    --adigo-text-lg: 1.125rem;   /* 18px */
    --adigo-text-xl: 1.25rem;    /* 20px */
    --adigo-text-2xl: 1.5rem;    /* 24px */
    --adigo-text-3xl: 1.875rem;  /* 30px */
    --adigo-text-4xl: 2.25rem;   /* 36px */
    --adigo-text-5xl: 3rem;      /* 48px */
    --adigo-text-6xl: 3.5rem;    /* 56px */
    
    /* Poids de police */
    --adigo-font-normal: 400;
    --adigo-font-medium: 500;
    --adigo-font-semibold: 600;
    --adigo-font-bold: 700;
    --adigo-font-extrabold: 800;
    --adigo-font-black: 900;
    
    /* Hauteur de ligne */
    --adigo-leading-tight: 1.1;
    --adigo-leading-snug: 1.2;
    --adigo-leading-normal: 1.5;
    --adigo-leading-relaxed: 1.7;
    --adigo-leading-loose: 1.8;
    
    /* ===========================================
       ESPACEMENTS
       =========================================== */
    --adigo-space-1: 0.25rem;   /* 4px */
    --adigo-space-2: 0.5rem;    /* 8px */
    --adigo-space-3: 0.75rem;   /* 12px */
    --adigo-space-4: 1rem;      /* 16px */
    --adigo-space-5: 1.25rem;   /* 20px */
    --adigo-space-6: 1.5rem;    /* 24px */
    --adigo-space-8: 2rem;      /* 32px */
    --adigo-space-10: 2.5rem;   /* 40px */
    --adigo-space-12: 3rem;     /* 48px */
    --adigo-space-16: 4rem;     /* 64px */
    --adigo-space-20: 5rem;     /* 80px */
    --adigo-space-24: 6rem;     /* 96px */
    --adigo-space-32: 8rem;     /* 128px */
    
    /* ===========================================
       BORDURES & RADIUS
       =========================================== */
    --adigo-radius-sm: 4px;
    --adigo-radius-md: 8px;
    --adigo-radius-lg: 12px;
    --adigo-radius-xl: 16px;
    --adigo-radius-2xl: 20px;
    --adigo-radius-3xl: 24px;
    --adigo-radius-full: 9999px;
    
    --adigo-border-width: 1px;
    --adigo-border-color: rgba(0, 0, 0, 0.1);
    --adigo-border-color-light: rgba(255, 255, 255, 0.1);
    
    /* ===========================================
       OMBRES
       =========================================== */
    --adigo-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
    --adigo-shadow-md: 0 4px 6px rgba(0, 0, 0, 0.07);
    --adigo-shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.1);
    --adigo-shadow-xl: 0 20px 25px rgba(0, 0, 0, 0.1);
    --adigo-shadow-2xl: 0 25px 50px rgba(0, 0, 0, 0.15);
    --adigo-shadow-card: 0 10px 40px rgba(0, 0, 0, 0.08);
    --adigo-shadow-card-hover: 0 20px 60px rgba(0, 0, 0, 0.15);
    --adigo-shadow-primary: 0 10px 30px rgba(195, 17, 13, 0.3);
    
    /* ===========================================
       TRANSITIONS
       =========================================== */
    --adigo-transition-fast: 150ms ease;
    --adigo-transition-normal: 300ms ease;
    --adigo-transition-slow: 500ms ease;
    --adigo-transition-bounce: 300ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
    
    /* ===========================================
       LAYOUT
       =========================================== */
    --adigo-container-sm: 640px;
    --adigo-container-md: 768px;
    --adigo-container-lg: 1024px;
    --adigo-container-xl: 1200px;
    --adigo-container-2xl: 1400px;
    
    --adigo-header-height: 80px;
    --adigo-header-height-mobile: 70px;
    
    /* ===========================================
       Z-INDEX
       =========================================== */
    --adigo-z-dropdown: 100;
    --adigo-z-sticky: 500;
    --adigo-z-fixed: 900;
    --adigo-z-modal-backdrop: 1000;
    --adigo-z-modal: 1010;
    --adigo-z-popover: 1020;
    --adigo-z-tooltip: 1030;
    --adigo-z-skip-link: 100000;
}

/* ===========================================
   DARK MODE OVERRIDES
   =========================================== */
[data-theme="dark"],
.dark-mode {
    --adigo-white: #0a0a0a;
    --adigo-black: #ffffff;
    --adigo-gray-50: #1a1a2e;
    --adigo-gray-100: #252538;
    --adigo-gray-200: #2d2d44;
    --adigo-gray-600: #a0a0a0;
    
    --adigo-text-primary: #ffffff;
    --adigo-text-secondary: #a0a0a0;
    --adigo-text-muted: #777777;
    
    --adigo-border-color: rgba(255, 255, 255, 0.1);
    --adigo-shadow-card: 0 10px 40px rgba(0, 0, 0, 0.3);
}

/* ===========================================
   UTILITY CLASSES
   =========================================== */

/* Couleurs */
.text-primary { color: var(--adigo-primary) !important; }
.text-secondary { color: var(--adigo-text-secondary) !important; }
.text-muted { color: var(--adigo-text-muted) !important; }
.text-white { color: var(--adigo-white) !important; }

.bg-primary { background-color: var(--adigo-primary) !important; }
.bg-gray-50 { background-color: var(--adigo-gray-50) !important; }
.bg-white { background-color: var(--adigo-white) !important; }
.bg-dark { background-color: var(--adigo-black) !important; }

/* Gradients */
.gradient-primary {
    background: linear-gradient(135deg, var(--adigo-primary) 0%, var(--adigo-primary-light) 100%);
}

.gradient-dark {
    background: linear-gradient(135deg, #0a0a0a 0%, #1a1a2e 100%);
}

.gradient-purple {
    background: linear-gradient(135deg, var(--adigo-secondary) 0%, var(--adigo-secondary-light) 100%);
}

.gradient-green {
    background: linear-gradient(135deg, var(--adigo-accent-green) 0%, var(--adigo-accent-teal) 100%);
}

/* Shadows */
.shadow-sm { box-shadow: var(--adigo-shadow-sm) !important; }
.shadow-md { box-shadow: var(--adigo-shadow-md) !important; }
.shadow-lg { box-shadow: var(--adigo-shadow-lg) !important; }
.shadow-xl { box-shadow: var(--adigo-shadow-xl) !important; }
.shadow-card { box-shadow: var(--adigo-shadow-card) !important; }

/* Border Radius */
.rounded-sm { border-radius: var(--adigo-radius-sm) !important; }
.rounded-md { border-radius: var(--adigo-radius-md) !important; }
.rounded-lg { border-radius: var(--adigo-radius-lg) !important; }
.rounded-xl { border-radius: var(--adigo-radius-xl) !important; }
.rounded-2xl { border-radius: var(--adigo-radius-2xl) !important; }
.rounded-full { border-radius: var(--adigo-radius-full) !important; }

/* Transitions */
.transition-fast { transition: all var(--adigo-transition-fast) !important; }
.transition-normal { transition: all var(--adigo-transition-normal) !important; }
.transition-slow { transition: all var(--adigo-transition-slow) !important; }

/* ===========================================
   BUTTON STYLES (utilisant les variables)
   =========================================== */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--adigo-space-2);
    padding: var(--adigo-space-3) var(--adigo-space-6);
    font-family: var(--adigo-font-primary);
    font-size: var(--adigo-text-base);
    font-weight: var(--adigo-font-semibold);
    line-height: var(--adigo-leading-normal);
    text-decoration: none;
    border: none;
    border-radius: var(--adigo-radius-lg);
    cursor: pointer;
    transition: all var(--adigo-transition-normal);
    min-height: 44px; /* Accessibilité */
}

.btn-primary {
    background: linear-gradient(135deg, var(--adigo-primary) 0%, var(--adigo-primary-light) 100%);
    color: white;
    box-shadow: var(--adigo-shadow-primary);
}

.btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 15px 40px rgba(var(--adigo-primary-rgb), 0.4);
}

.btn-outline {
    background: transparent;
    color: var(--adigo-primary);
    border: 2px solid var(--adigo-primary);
}

.btn-outline:hover {
    background: var(--adigo-primary);
    color: white;
}

.btn-white {
    background: white;
    color: var(--adigo-primary);
    box-shadow: var(--adigo-shadow-lg);
}

.btn-white:hover {
    transform: translateY(-2px);
    box-shadow: var(--adigo-shadow-xl);
}

.btn-hero-primary {
    padding: var(--adigo-space-4) var(--adigo-space-8);
    background: white;
    color: var(--adigo-primary);
    font-weight: var(--adigo-font-bold);
    border-radius: var(--adigo-radius-full);
    box-shadow: var(--adigo-shadow-xl);
}

.btn-hero-outline {
    padding: var(--adigo-space-4) var(--adigo-space-8);
    background: transparent;
    color: white;
    border: 2px solid rgba(255, 255, 255, 0.5);
    border-radius: var(--adigo-radius-full);
}

.btn-hero-outline:hover {
    background: rgba(255, 255, 255, 0.1);
    border-color: white;
}

/* Full width button */
.btn-full {
    width: 100%;
}

/* ===========================================
   CARD BASE STYLES
   =========================================== */
.card-base {
    background: var(--adigo-white);
    border-radius: var(--adigo-radius-2xl);
    box-shadow: var(--adigo-shadow-card);
    transition: all var(--adigo-transition-normal);
}

.card-base:hover {
    transform: translateY(-8px);
    box-shadow: var(--adigo-shadow-card-hover);
}

/* ===========================================
   SECTION PADDING DEFAULTS
   =========================================== */
.section-padding {
    padding: var(--adigo-space-24) 0;
}

.section-padding-sm {
    padding: var(--adigo-space-16) 0;
}

.section-padding-lg {
    padding: var(--adigo-space-32) 0;
}

@media (max-width: 768px) {
    .section-padding {
        padding: var(--adigo-space-16) 0;
    }
    
    .section-padding-sm {
        padding: var(--adigo-space-12) 0;
    }
    
    .section-padding-lg {
        padding: var(--adigo-space-20) 0;
    }
}