/* ===================================================================
   ANTI-FLASH FIX - Éviter les barres blanches au scroll rapide
   Ce fichier doit être chargé en premier après ios-safari-fix.css
   =================================================================== */

/* Fond de base ultra-prioritaire */
html {
    background: #ffffff !important;
    background-color: #ffffff !important;
}

body {
    background: #ffffff !important;
    background-color: #ffffff !important;
    background-attachment: fixed !important;
}

/* Pseudo-élément fixe pour couvrir tout l'écran */
html::before {
    content: '' !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    height: 100dvh !important;
    background: #ffffff !important;
    z-index: -9999 !important;
    pointer-events: none !important;
    will-change: transform !important;
    transform: translateZ(0) !important;
    -webkit-transform: translateZ(0) !important;
}

/* Toutes les sections principales avec fond blanc explicite */
main,
section,
.container,
.hero-section-new,
.products-premium-layout,
.catalogue-section,
.hero-dual-boxes,
.trending-column,
.top-sales-column,
footer {
    background-color: #ffffff !important;
}

/* GPU Acceleration sur tous les éléments importants pour éviter le flash au scroll */
.products-grid,
.trending-carousel,
.top-sales-list,
.hero-section-new,
.products-premium-layout,
.catalogue-section,
.trending-wrapper,
.top-sales-wrapper,
.hero-dual-boxes,
.hero-leaderboard-box,
.hero-account-box,
.hero-banner-full {
    will-change: transform;
    transform: translateZ(0);
    -webkit-transform: translateZ(0);
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

/* Empêcher les gaps transparents entre sections */
main > *,
body > main,
body > section,
body > header,
body > footer {
    background-color: #ffffff;
}

/* Fix pour les éléments avec position relative/absolute */
[class*="section"],
[class*="container"],
[class*="wrapper"] {
    background-color: inherit;
}

/* Désactiver les effets qui peuvent causer des flash */
@media (prefers-reduced-motion: reduce) {
    * {
        transition: none !important;
        animation: none !important;
    }
}

/* Fix spécifique mobile */
@media (max-width: 768px) {
    html::after {
        content: '' !important;
        position: fixed !important;
        top: -100vh !important;
        left: 0 !important;
        right: 0 !important;
        bottom: -100vh !important;
        background: #ffffff !important;
        z-index: -10000 !important;
        pointer-events: none !important;
    }
    
    /* Empêcher le rubber-banding sur iOS */
    html, body {
        overscroll-behavior: none !important;
        overscroll-behavior-y: none !important;
        -webkit-overscroll-behavior: none !important;
    }
}
