/* =====================================================
   iOS PWA SAFE AREA FIX
   Fixes for iPhone notch and home indicator
   ===================================================== */

/* Support for iOS standalone mode (PWA) */
@supports (-webkit-touch-callout: none) {
    /* TOP NAVBAR - Fix for iPhone notch/Dynamic Island */
    .mobile-app-header {
        padding-top: max(env(safe-area-inset-top, 0px), 20px) !important;
        height: calc(90px + max(env(safe-area-inset-top, 0px), 20px)) !important;
        z-index: 1055 !important; /* Above everything */
    }
    
    /* BOTTOM NAVIGATION - Fix for home indicator AND scroll behavior */
    .mobile-bottom-nav {
        /* CRITICAL: Position fixed per iOS */
        position: fixed !important;
        bottom: 0 !important;
        left: 0 !important;
        right: 0 !important;
        
        z-index: 1050 !important;
        padding-bottom: max(env(safe-area-inset-bottom, 20px), 20px) !important;
        height: auto !important;
        min-height: calc(65px + env(safe-area-inset-bottom, 0px)) !important;
        
        /* Force hardware acceleration - FIX per iOS scroll */
        -webkit-transform: translateZ(0) !important;
        transform: translateZ(0) !important;
        will-change: transform !important;
        -webkit-backface-visibility: hidden !important;
        backface-visibility: hidden !important;
        
        /* Ensure clickability */
        pointer-events: auto !important;
        -webkit-user-select: none !important;
        user-select: none !important;
        
        /* iOS-specific fixes for fixed positioning */
        -webkit-overflow-scrolling: touch !important;
    }
    
    /* BOTTOM NAV ITEMS - Increase touch targets */
    .mobile-nav-item {
        /* Larger touch area for iOS */
        min-height: 48px !important;
        min-width: 48px !important;
        padding: 8px 12px !important;
        
        /* Force clickability */
        pointer-events: auto !important;
        touch-action: manipulation !important;
        -webkit-tap-highlight-color: rgba(0, 0, 0, 0.1) !important;
        -webkit-touch-callout: none !important;
        
        /* Prevent text selection */
        -webkit-user-select: none !important;
        user-select: none !important;
        
        /* Ensure visibility */
        z-index: 1051 !important;
        position: relative !important;
    }
    
    /* Icons and text - ensure they don't block clicks */
    .mobile-nav-item i,
    .mobile-nav-item span {
        pointer-events: none !important;
        -webkit-user-select: none !important;
        user-select: none !important;
    }
    
    /* Content padding adjustments for safe areas */
    .ios-content,
    .mobile-app-content,
    main.col-md-9.ms-sm-auto {
        padding-top: calc(90px + max(env(safe-area-inset-top, 0px), 20px)) !important;
        padding-bottom: calc(100px + max(env(safe-area-inset-bottom, 0px), 20px)) !important;
    }
    
    /* Remove any overlays that might block clicks */
    body::before,
    body::after,
    .mobile-bottom-nav::before,
    .mobile-bottom-nav::after {
        display: none !important;
    }
    
    /* Prevent any backdrop from blocking clicks */
    .modal-backdrop,
    .offcanvas-backdrop {
        pointer-events: none !important;
    }
}

/* Mobile-specific fixes (all devices) */
@media (max-width: 1199.98px) {
    /* FORCE fixed position on all mobile devices */
    .mobile-bottom-nav {
        position: fixed !important;
        bottom: 0 !important;
        left: 0 !important;
        right: 0 !important;
        isolation: isolate !important;
        
        /* Prevent any parent transforms from affecting position */
        -webkit-transform: translateZ(0) !important;
        transform: translateZ(0) !important;
    }
    
    /* Remove any transform that might affect clickability */
    .mobile-nav-item a {
        transform: none !important;
    }
    
    /* Hamburger button - fix for notch overlap */
    .mobile-hamburger {
        pointer-events: auto !important;
        touch-action: manipulation !important;
        z-index: 1056 !important;
    }
    
    /* Fix body/html to prevent scroll issues with fixed positioning */
    body, html {
        -webkit-overflow-scrolling: touch !important;
        overflow-x: hidden !important;
    }
}

/* iOS PWA Detection */
@media all and (display-mode: standalone) {
    /* Additional safety for PWA mode */
    .mobile-app-header {
        background: rgba(227, 242, 253, 0.95) !important;
        backdrop-filter: blur(20px) saturate(180%) !important;
        position: fixed !important;
        top: 0 !important;
    }
    
    .mobile-bottom-nav {
        background: rgba(255, 255, 255, 0.95) !important;
        backdrop-filter: blur(20px) saturate(180%) !important;
        position: fixed !important;
        bottom: 0 !important;
        left: 0 !important;
        right: 0 !important;
        
        /* Extra iOS PWA fix - prevent scroll interference */
        -webkit-transform: translate3d(0, 0, 0) !important;
        transform: translate3d(0, 0, 0) !important;
    }
    
    /* Prevent content from going under bottom nav during scroll */
    body {
        padding-bottom: calc(80px + env(safe-area-inset-bottom, 0px)) !important;
    }
}