/* ========================================
   FIX SCROLL GLOBAL - LOOBY & VIPLE
   Corrige le problème de scroll avec header sticky
   ======================================== */

/* ===== RESET COMPLET HTML/BODY ===== */
html {
    height: 100% !important;
    width: 100%;
    overflow-x: hidden !important;
    overflow-y: auto !important; /* PERMETTRE SCROLL */
    scroll-behavior: smooth;
    position: relative;
}

body {
    height: auto !important; /* PERMETTRE EXPANSION */
    min-height: 100vh !important;
    width: 100%;
    overflow-x: hidden !important;
    overflow-y: visible !important; /* PERMETTRE SCROLL */
    position: relative !important;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
}

/* ===== FORCER BODY LOOBY À PERMETTRE SCROLL ===== */
body.looby-body {
    display: flex !important;
    flex-direction: column !important;
    min-height: 100vh !important;
    height: auto !important;
    overflow-y: visible !important;
}

/* ===== NAVBAR STICKY - NE PAS BLOQUER SCROLL ===== */
.navbar-looby,
.navbar,
nav.sticky-top,
nav[class*="sticky"] {
    position: sticky !important;
    top: 0 !important;
    z-index: 1030 !important;
    width: 100%;
    background: white !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1) !important;
}

/* ===== MAIN CONTENT - DOIT SCROLLER ===== */
main,
.looby-main,
.main-content,
#main-content {
    flex: 1 0 auto !important;
    width: 100%;
    min-height: calc(100vh - 80px) !important;
    overflow: visible !important;
    position: relative !important;
    height: auto !important;
}

/* ===== FOOTER EN BAS ===== */
footer,
.looby-footer,
.footer {
    flex-shrink: 0 !important;
    width: 100%;
    position: relative !important;
    margin-top: auto !important;
}

/* ===== CONTAINERS - NE PAS LIMITER ===== */
.container,
.container-fluid,
.looby-container {
    position: relative !important;
    overflow: visible !important;
    width: 100%;
    height: auto !important;
}

/* ===== SECTIONS - NE PAS LIMITER HAUTEUR ===== */
section {
    position: relative !important;
    overflow: visible !important;
    width: 100%;
    height: auto !important;
}

/* ===== FIX MODALS ===== */
.modal-open {
    overflow: hidden !important;
}

.modal-open body {
    overflow: hidden !important;
}

/* ===== FIX SPÉCIFIQUE MOBILE ===== */
@media (max-width: 991px) {
    html {
        overflow-x: hidden !important;
        overflow-y: auto !important; /* TOUJOURS permettre scroll */
        height: 100% !important;
    }
    
    body {
        overflow-x: hidden !important;
        overflow-y: auto !important; /* CHANGÉ : toujours auto */
        height: auto !important;
        min-height: 100vh !important;
    }
    
    /* Menu mobile ouvert - NE PLUS bloquer scroll body */
    body.menu-mobile-open {
        overflow: auto !important; /* CHANGÉ : auto au lieu de hidden */
        position: relative !important; /* CHANGÉ : relative au lieu de fixed */
        width: 100% !important;
    }
    
    /* Navbar collapse mobile - permettre scroll INTERNE */
    .navbar-collapse {
        max-height: calc(100vh - 60px) !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        position: relative !important;
    }
}

/* ===== FIX PC - FORCER SCROLL ===== */
@media (min-width: 992px) {
    html {
        overflow-y: scroll !important; /* Force scrollbar visible */
    }
    
    body {
        overflow-y: visible !important;
        height: auto !important;
    }
    
    /* Navbar collapse PC */
    .navbar-collapse {
        overflow: visible !important;
        height: auto !important;
    }
}

/* ===== RESET TOUT CE QUI POURRAIT BLOQUER ===== */
* {
    scroll-margin-top: 80px; /* Offset pour sticky header */
}

/* Enlever tout overflow:hidden qui bloquerait */
body *:not(.modal):not(.modal-open):not(.offcanvas) {
    /* Ne pas toucher overflow des éléments qui en ont vraiment besoin */
}

/* ===== DEBUG MODE (à activer si besoin) ===== */
/* Décommentez pour voir les hauteurs en temps réel
body::after {
    content: 'Body: ' attr(data-height) ' / HTML: ' attr(data-scroll);
    position: fixed;
    bottom: 10px;
    right: 10px;
    background: rgba(255, 0, 0, 0.8);
    color: white;
    padding: 5px 10px;
    z-index: 99999;
    font-size: 11px;
    border-radius: 4px;
}
*/

/* ===== FORCE RENDERING ===== */
html, body {
    -webkit-overflow-scrolling: touch; /* Smooth scroll iOS */
}

/* ===== FIX POUR PAGES COURTES ===== */
body.short-content {
    min-height: 100vh !important;
}

body.short-content main {
    min-height: calc(100vh - 200px) !important;
}