/* ==========================================================================
   EPIK LEADERS - COMPLETE STYLESHEET
   Master CSS file that imports all component stylesheets
   ========================================================================== */

/* ==========================================================================
   EXTERNAL DEPENDENCIES
   ========================================================================== */

/* Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Open+Sans:wght@400;600;700&display=swap');

/* Font Awesome (for icons) */
/* @import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css'); */

/* ==========================================================================
   CSS VARIABLES
   ========================================================================== */

/* Import CSS variables first */
@import url('./variables.css');

/* ==========================================================================
   COMPONENT STYLESHEETS
   ========================================================================== */

/* Import all component CSS files */
@import url('./main.css');
@import url('./homepage.css');
@import url('./reseaux.css');
@import url('./temoignages.css');
@import url('./rejoindre-nous.css');
@import url('./propos.css');
@import url('./event-details.css');
@import url('./erreur.css');
@import url('./evenements-actualites.css');

/* ==========================================================================
   ADDITIONAL UTILITIES AND VENDOR PREFIXES
   ========================================================================== */

/* Enhanced Flexbox utilities with vendor prefixes */
.flex-center {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

/* Enhanced Transform utilities with vendor prefixes */
.transform-gpu {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-perspective: 1000px;
    perspective: 1000px;
}

/* Enhanced Box Shadow utilities */
.shadow-custom {
    -webkit-box-shadow: 0 20px 40px -12px rgba(0, 0, 0, 0.25);
    box-shadow: 0 20px 40px -12px rgba(0, 0, 0, 0.25);
}

.shadow-custom-hover {
    -webkit-box-shadow: 0 32px 64px -12px rgba(0, 0, 0, 0.25);
    box-shadow: 0 32px 64px -12px rgba(0, 0, 0, 0.25);
}

/* Enhanced Border Radius utilities */
.border-radius-custom {
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
}

/* Enhanced Transition utilities */
.transition-custom {
    -webkit-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    -moz-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    -o-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Enhanced Filter utilities */
.filter-blur {
    -webkit-filter: blur(10px);
    filter: blur(10px);
}

.filter-brightness {
    -webkit-filter: brightness(1.1);
    filter: brightness(1.1);
}

/* Enhanced Backdrop Filter utilities */
.backdrop-blur {
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}

/* ==========================================================================
   GLOBAL OVERRIDES AND FIXES
   ========================================================================== */

/* Ensure smooth scrolling works across browsers */
html {
    scroll-behavior: smooth;
    -webkit-scroll-behavior: smooth;
}

/* Enhanced focus styles for accessibility */
*:focus {
    outline: 2px solid #B5252C;
    outline-offset: 2px;
}

/* Remove focus outline for mouse users */
.js-focus-visible *:focus:not(.focus-visible) {
    outline: none;
}

/* ==========================================================================
   PRINT STYLES
   ========================================================================== */

@media print {
    * {
        background: transparent !important;
        color: black !important;
        box-shadow: none !important;
        text-shadow: none !important;
    }
    
    a,
    a:visited {
        text-decoration: underline;
    }
    
    .no-print {
        display: none !important;
    }
}

/* ==========================================================================
   HIGH DPI / RETINA DISPLAY OPTIMIZATIONS
   ========================================================================== */

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    /* High DPI optimizations */
    .crisp-edges {
        image-rendering: -webkit-optimize-contrast;
        image-rendering: crisp-edges;
    }
}

/* ==========================================================================
   DARK MODE SUPPORT (FUTURE ENHANCEMENT)
   ========================================================================== */

@media (prefers-color-scheme: dark) {
    /* Dark mode variables and styles can be added here in the future */
}

/* ==========================================================================
   REDUCED MOTION SUPPORT
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}