/* ===============================================
   FIX SCROLL MOBILE - LOOBY & VIPLE
   Correction des problèmes de scroll sur mobile
   =============================================== */

/* ========== RESET GLOBAL ========== */
html {
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    height: 100%;
}

body {
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    min-height: 100%;
    position: relative;
    touch-action: pan-y pinch-zoom;
}

/* ========== FIX NAVBAR LOOBY ========== */
.navbar-looby {
    position: sticky;
    top: 0;
    z-index: 1030;
    background: white;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    will-change: transform;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}

/* Fix collapse navbar mobile */
.navbar-looby .navbar-collapse {
    max-height: none !important;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.navbar-looby .navbar-collapse.show,
.navbar-looby .navbar-collapse.collapsing {
    overflow-y: auto;
    max-height: calc(100vh - 60px);
}

/* Fix dropdown dans navbar */
.navbar-looby .dropdown-menu {
    position: absolute;
    z-index: 1031;
    max-height: 80vh;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

/* ========== FIX MAIN CONTENT LOOBY ========== */
.looby-main {
    min-height: calc(100vh - 70px);
    position: relative;
    z-index: 1;
    overflow-x: hidden;
    padding-top: 20px;
    padding-bottom: 20px;
}

.looby-body {
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    position: relative;
}

/* ========== FIX NAVBAR VIPLE ========== */
.viple-navbar,
.navbar-viple {
    position: sticky;
    top: 0;
    z-index: 1030;
    will-change: transform;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}

/* Fix collapse navbar Viple mobile */
.navbar-viple .navbar-collapse {
    max-height: none !important;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.navbar-viple .navbar-collapse.show,
.navbar-viple .navbar-collapse.collapsing {
    overflow-y: auto;
    max-height: calc(100vh - 70px);
}

/* ========== FIX MODALS ========== */
.modal {
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.modal-open {
    overflow-y: auto !important;
    padding-right: 0 !important;
}

.modal-dialog {
    transform: translateZ(0);
    -webkit-transform: translateZ(0);
}

/* ========== FIX OFFCANVAS ========== */
.offcanvas {
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.offcanvas-body {
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

/* ========== OPTIMISATIONS MOBILE ========== */
@media (max-width: 991.98px) {
    /* Désactiver fixed sur certains éléments problématiques */
    .navbar-looby,
    .navbar-viple {
        position: sticky !important;
    }
    
    /* Améliorer performance scroll */
    html, body {
        scroll-behavior: smooth;
        -webkit-overflow-scrolling: touch;
    }
    
    /* Fix height 100vh iOS */
    .looby-main,
    main {
        min-height: -webkit-fill-available;
        min-height: fill-available;
    }
    
    /* Optimiser les transitions */
    .navbar-collapse.collapsing {
        transition: height 0.25s ease;
    }
    
    /* Empêcher horizontal scroll */
    * {
        max-width: 100%;
    }
    
    img, video, iframe {
        max-width: 100%;
        height: auto;
    }
    
    /* Fix pour les cartes qui débordent */
    .container, .container-fluid {
        overflow-x: hidden;
    }
    
    /* Améliorer touch performance */
    a, button, .btn, .nav-link {
        touch-action: manipulation;
    }
}

/* ========== FIX SAFARI iOS ========== */
@supports (-webkit-touch-callout: none) {
    body {
        min-height: -webkit-fill-available;
    }
    
    .looby-main,
    main {
        min-height: -webkit-fill-available;
    }
}

/* ========== FIX SCROLL BOUNCE iOS ========== */
html {
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
}

body {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* Réactiver sélection texte sur éléments nécessaires */
input, textarea, [contenteditable] {
    -webkit-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
    user-select: text;
}

/* ========== SMOOTH SCROLL GLOBAL ========== */
* {
    -webkit-overflow-scrolling: touch;
    scroll-behavior: smooth;
}

/* ========== FIX POSITION FIXED MOBILE ========== */
@media (max-width: 767.98px) {
    /* Éviter les fixed qui cassent le scroll */
    [style*="position: fixed"],
    .fixed-top,
    .fixed-bottom {
        position: sticky !important;
    }
    
    /* Exception pour les modals et toasts */
    .modal,
    .toast,
    .alert.position-fixed {
        position: fixed !important;
    }
}

/* ========== PERFORMANCE OPTIMIZATIONS ========== */
.navbar-looby,
.navbar-viple,
.looby-main,
main {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-perspective: 1000;
    perspective: 1000;
}

/* Accélération hardware */
.navbar-collapse,
.dropdown-menu,
.offcanvas {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

/* ========== DISABLE PULL TO REFRESH SI NÉCESSAIRE ========== */
body {
    overscroll-behavior-y: none;
}

/* ========== FIX POUR LES DROPDOWNS QUI SORTENT ========== */
.dropdown-menu {
    position: absolute;
    transform: translate3d(0, 0, 0) !important;
    will-change: transform;
}

/* ========== FIX NAVBAR TOGGLER ========== */
.navbar-toggler {
    z-index: 1031;
    position: relative;
    touch-action: manipulation;
}

.navbar-toggler:focus {
    box-shadow: none;
    outline: none;
}

/* ========== PREVENT ZOOM ON INPUT FOCUS iOS ========== */
@media (max-width: 767.98px) {
    input[type="text"],
    input[type="email"],
    input[type="password"],
    input[type="search"],
    input[type="tel"],
    input[type="number"],
    textarea,
    select {
        font-size: 16px !important;
    }
}

/* ========== FIX CONTAINER OVERFLOW ========== */
.container,
.container-fluid,
.container-sm,
.container-md,
.container-lg,
.container-xl {
    overflow-x: hidden;
}

/* ========== AMÉLIORATION TOUCH TARGETS ========== */
@media (max-width: 991.98px) {
    .nav-link,
    .btn,
    a,
    button {
        min-height: 44px;
        min-width: 44px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }
    
    /* Exception pour texte dans boutons */
    .btn span,
    .nav-link span {
        display: inline;
    }
}

/* ========== DEBUG MODE (à retirer en prod) ========== */
/*
@media (max-width: 991.98px) {
    body::before {
        content: 'Mobile Mode - Scroll Fix Active';
        position: fixed;
        bottom: 10px;
        right: 10px;
        background: rgba(220, 53, 69, 0.9);
        color: white;
        padding: 5px 10px;
        border-radius: 5px;
        font-size: 12px;
        z-index: 9999;
    }
}
*/

/* ========== FIX SPÉCIFIQUE LOOBY HEADER ========== */
.looby-brand {
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
}

.looby-nav-search {
    touch-action: manipulation;
}

/* Fix avatar dropdown */
.looby-user-avatar {
    touch-action: manipulation;
    cursor: pointer;
}

/* ========== FIX SPÉCIFIQUE VIPLE HEADER ========== */
.viple-brand,
.navbar-viple .navbar-brand {
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
}

/* ========== FIX FOOTER ========== */
.looby-footer,
footer {
    position: relative;
    z-index: 1;
    overflow: hidden;
}

/* ========== MEDIA QUERIES ADDITIONNELLES ========== */
@media (max-width: 575.98px) {
    /* Extra small devices */
    .navbar-looby .navbar-nav,
    .navbar-viple .navbar-nav {
        max-height: 60vh;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }
}

@media (min-width: 576px) and (max-width: 767.98px) {
    /* Small devices */
    .navbar-collapse {
        max-height: 70vh;
    }
}

@media (min-width: 768px) and (max-width: 991.98px) {
    /* Medium devices */
    .navbar-collapse {
        max-height: 80vh;
    }
}

/* ========== LANDSCAPE MODE ========== */
@media (max-height: 500px) and (orientation: landscape) {
    .navbar-collapse {
        max-height: 60vh !important;
    }
    
    .dropdown-menu {
        max-height: 50vh !important;
    }
}

/* ========== DISABLE ANIMATIONS IF NEEDED ========== */
@media (prefers-reduced-motion: reduce) {
    * {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}