/**
 * Android WebView Scroll Fix - Container Based
 * Version 3.1 (Robust Overlay Handling)
 */

/* 1. Reset & Lock the Shell */
html {
    height: 100%;
    width: 100%;
    overflow: hidden !important;
    overscroll-behavior: none;
    -webkit-text-size-adjust: 100%;
    position: fixed;
    background: #000000 !important;
}

body {
    height: 100%;
    width: 100%;
    overflow: hidden !important;
    overscroll-behavior: none;
    position: fixed !important;
    /* Force fixed to prevent scrolling */
    top: 0;
    left: 0;
    background-color: #000000 !important;
    /* Pure Black Request */
    --bg-body: #000000 !important;
}

/* 2. Layout Structure */
.app-layout,
body.app-body {
    display: flex;
    flex-direction: column;
    height: 100%;
    max-height: 100%;
    overflow: hidden;
    position: fixed !important;
    /* Ensure it stays pinned */
    inset: 0;
    z-index: 1;
    background: #000000 !important;
}

/* 3. The SCROLL Container */
.app-content,
main.app-main-with-sidebar {
    flex: 1 1 auto;
    /* Use auto to prevent collapse */
    width: 100%;
    height: 100%;
    /* Fallback */
    overflow-y: auto !important;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior-y: contain;
    position: relative;
    z-index: 1;
    display: block;
    background: #000000;
    /* Ensure content bg is black */

    /* Padding to clear fixed elements - Adjusted for Safe Areas (+60px extra buffer) */
    padding-top: calc(var(--app-header-height, 60px) + env(safe-area-inset-top, 24px) + 70px);
    padding-bottom: calc(var(--app-bottom-nav-height, 68px) + env(safe-area-inset-bottom, 20px) + 20px);
    padding-left: env(safe-area-inset-left, 0);
    padding-right: env(safe-area-inset-right, 0);
}

/* Global Scrollbar Hide */
*::-webkit-scrollbar {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    background: transparent !important;
    -webkit-appearance: none;
}

/* Hide Scrollbar for Native Feel */
.app-content::-webkit-scrollbar,
body::-webkit-scrollbar,
.mobile-menu::-webkit-scrollbar {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    background: transparent;
}

/* 4. Fixed Elements */
.app-header,
.app-header-2025,
.app-header-premium {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 100;
    touch-action: none;
    pointer-events: none;

    /* Safe Area Support - HANDLED NATIVELY BY WEBVIEW MARGIN */
    padding-top: 0px !important;
    padding-left: env(safe-area-inset-left, 0);
    padding-right: env(safe-area-inset-right, 0);
    box-sizing: border-box;
    /* Ensure padding doesn't overflow width */
    height: 60px !important;
    min-height: 60px !important;
}

.app-header>*,
.app-header-2025>*,
.app-header-premium>* {
    pointer-events: auto;
    /* Re-enable clicks on children */
}

/* Simplify Mobile Header - Reduce Clutter */
@media (max-width: 768px) {

    /* Hide Header Search Icon (redundant with bottom nav & page input) */
    .app-header-premium .app-header-action[href*="search"] {
        display: none !important;
    }

    /* Hide Theme Toggle on Mobile (move to settings) */
    .app-header-premium .app-header-action[onclick*="toggleTheme"] {
        display: none !important;
    }

    /* Adjust Header Padding */
    .app-header-premium {
        padding: 0 16px;
    }
}

/* 7. Strict Responsive Visibility Rules (Fixes layout overlap) */
/* Desktop: Show Sidebar, Hide Bottom Nav */
@media (min-width: 769px) {
    .app-sidebar {
        display: flex !important;
    }

    .app-bottom-nav,
    .bottom-nav-2025,
    .bottom-nav {
        display: none !important;
    }

    .app-main-with-sidebar {
        margin-left: 72px !important;
        padding-bottom: 20px !important;
    }
}

/* Force Header Children Down (Nuclear Option) - REMOVED for v6.12 (Native fix handles layout) */
.app-header-premium .app-header-left,
.app-header-premium .app-header-right {
    margin-top: 0px !important;
}

/* Mobile: Hide Sidebar, Show Bottom Nav */
@media (max-width: 768px) {
    .app-sidebar {
        display: none !important;
    }

    .app-bottom-nav {
        display: flex !important;
    }

    .bottom-nav,
    .bottom-nav-2025 {
        display: none !important;
        /* Use app-bottom-nav only */
    }

    .app-main-with-sidebar {
        margin-left: 0 !important;
        padding-bottom: calc(var(--app-bottom-nav-height, 68px) + env(safe-area-inset-bottom) + 20px) !important;
    }

    /* Ensure header matches width */
    .app-header-premium {
        left: 0 !important;
        width: 100% !important;
    }
}

/* 5. Fix Overlay Blockers (CRITICAL) */
.mobile-menu-overlay,
.modal-overlay {
    z-index: 2000;
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity 0.3s;
    pointer-events: none !important;
    /* Default to non-blocking */
}

.mobile-menu-overlay.active,
.modal-overlay.active,
.mobile-menu-overlay.show,
.modal-overlay.show {
    opacity: 1;
    opacity: 1;
    pointer-events: auto !important;
    /* Block interactions when active */
}

/* Ensure Menu is ABOVE the Overlay */
.mobile-menu {
    z-index: 2002 !important;
    /* Higher than overlay (2000) */
    position: fixed !important;
}

/* Fix any body pseudo-elements that might block */
body::before,
body::after {
    pointer-events: none !important;
    display: none !important;
}

/* Loading bar should never block */
.instant-loading-bar {
    pointer-events: none !important;
}

/* 6. Touch Action & Selection */
* {
    /* Allow default touch actions unless overridden */
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
}

.app-content * {
    /* Allow panning inside content */
    touch-action: pan-y pinch-zoom;
}

/* Horizontal scroll containers */
.quick-actions,
.horizontal-scroll,
.exam-grid-2025 {
    touch-action: pan-x pan-y;
}