/* MOBILE SCROLL FIX - ENSURE TOUCH SCROLLING WORKS */

/* Enable smooth scrolling on mobile */
* {
    -webkit-overflow-scrolling: touch;
}

/* Explicit touch-action for mobile devices */
@media screen and (max-width: 767px) {
    body, html, main, section, .section {
        touch-action: pan-y !important;
        -webkit-overflow-scrolling: touch !important;
    }
    
    /* Ensure no elements block touch scrolling */
    * {
        touch-action: manipulation !important;
    }
    
    /* Allow vertical scrolling specifically */
    body {
        touch-action: pan-y !important;
        overflow-y: scroll !important;
        height: auto !important;
        min-height: 100vh !important;
    }
}

/* Ensure body allows vertical scrolling */
html, body {
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    height: auto !important;
    min-height: 100vh !important;
}

/* Fix for iOS Safari scroll issues */
@supports (-webkit-overflow-scrolling: touch) {
    body {
        overflow-y: scroll !important;
        -webkit-overflow-scrolling: touch !important;
    }
}

/* Ensure main content areas can scroll */
main, section, .section {
    overflow-y: visible !important;
    -webkit-overflow-scrolling: touch !important;
}

/* Fix modal scroll issues on mobile */
@media screen and (max-width: 767px) {
    .wallet-modal, .auth-modal, .recharge-modal {
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }
    
    .wallet-modal-content, .auth-modal-content {
        max-height: 90vh !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }
}

/* Allow scrolling even when modals are open on mobile */
@media screen and (max-width: 767px) {
    body.modal-open {
        position: relative !important;
        width: 100% !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }
}

/* Desktop can keep fixed positioning for modals */
@media screen and (min-width: 768px) {
    body.modal-open {
        position: fixed !important;
        width: 100% !important;
        overflow: hidden !important;
    }
}

/* Enable momentum scrolling specifically */
.scrollable {
    -webkit-overflow-scrolling: touch !important;
    overflow-y: auto !important;
}

/* Fix for very small screens */
@media screen and (max-height: 600px) {
    body {
        overflow-y: scroll !important;
    }
}