/* ============================================================================
   NIZHARA Real Estate - Mobile Navigation Fixes
   Specific fixes for mobile menu navigation and scrolling issues
   ============================================================================ */

/* ========================================================================
   MOBILE NAVIGATION FIXES
   ======================================================================== */

@media (max-width: 768px) {
    /* Ensure mobile menu navigation links are properly clickable */
    .mobile-menu .header-menu a {
        position: relative;
        z-index: 1003;
        -webkit-tap-highlight-color: rgba(217, 198, 163, 0.3);
        tap-highlight-color: rgba(217, 198, 163, 0.3);
        touch-action: manipulation;
        user-select: none;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
    }
    
    /* Enhanced touch feedback for mobile menu links */
    .mobile-menu .header-menu a:active {
        background: rgba(217, 198, 163, 0.1);
        transform: scale(0.98);
    }
    
    /* Ensure smooth scrolling works on mobile */
    html {
        scroll-behavior: smooth;
        -webkit-overflow-scrolling: touch;
    }
    
    /* Fix for iOS Safari smooth scrolling */
    @supports (-webkit-overflow-scrolling: touch) {
        html {
            scroll-behavior: auto;
        }
    }
    
    /* Prevent scroll issues when mobile menu is open */
    body.no-scroll {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        overflow: hidden;
        -webkit-overflow-scrolling: touch;
    }
    
    /* Ensure menu window is properly positioned */
    .mobile-menu .menu-window {
        position: fixed;
        top: 0;
        left: 0;
        width: 100vw;
        height: 100vh;
        z-index: 1002;
    }
    
    /* Fix for potential z-index issues */
    .mobile-menu.active {
        z-index: 99999 !important;
    }
    
    .mobile-menu.active .menu-window {
        z-index: 1002 !important;
    }
    
    .mobile-menu.active .menu-blur {
        z-index: 1001 !important;
    }
}

/* Small mobile devices specific fixes */
@media (max-width: 480px) {
    .mobile-menu .header-menu a {
        padding: 18px 0;
        font-size: 18px;
        min-height: 54px;
        display: flex;
        align-items: center;
    }
    
    /* Larger touch targets for small screens */
    .mobile-menu .header-menu li {
        min-height: 54px;
    }
}

/* ========================================================================
   SCROLL BEHAVIOR FIXES FOR MOBILE
   ======================================================================== */

@media (max-width: 768px) {
    /* Ensure sections are properly spaced for mobile navigation */
    section {
        scroll-margin-top: 80px;
    }
    
    /* Specific scroll margins for main sections */
    #hero {
        scroll-margin-top: 0;
    }
    
    #featured,
    #categories,
    #about,
    #contact {
        scroll-margin-top: 90px;
    }
}

/* ========================================================================
   WEBKIT SPECIFIC FIXES
   ======================================================================== */

@media (max-width: 768px) {
    /* Fix for WebKit browsers */
    .mobile-menu .header-menu a {
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }
    
    /* Prevent text selection on mobile menu */
    .mobile-menu .menu-content {
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }
    
    /* Fix for iOS Safari bounce effect */
    .mobile-menu.active {
        position: fixed;
        -webkit-overflow-scrolling: touch;
    }
}

/* ========================================================================
   ADDITIONAL MOBILE NAVIGATION IMPROVEMENTS
   ======================================================================== */

@media (max-width: 768px) {
    /* Ensure navigation links have proper cursor */
    .mobile-menu .header-menu a {
        cursor: pointer;
    }
    
    /* Fix for potential click event issues */
    .mobile-menu .header-menu li {
        pointer-events: auto;
    }
    
    .mobile-menu .header-menu a {
        pointer-events: auto;
    }
    
    /* Ensure menu items are visible and clickable */
    .mobile-menu .header-menu {
        pointer-events: auto;
    }
    
    /* Fix for menu overlay blocking clicks */
    .mobile-menu .menu-blur {
        pointer-events: auto;
    }
    
    .mobile-menu .menu-window {
        pointer-events: auto;
    }
}

/* ========================================================================
   DEBUGGING STYLES (Remove in production if not needed)
   ======================================================================== */

@media (max-width: 768px) {
    /* Uncomment these for debugging mobile menu issues */
    /*
    .mobile-menu .header-menu a {
        border: 1px solid red !important;
    }
    
    .mobile-menu .header-menu li {
        border: 1px solid blue !important;
    }
    
    .mobile-menu.active {
        border: 2px solid green !important;
    }
    */
}

/* ========================================================================
   END OF MOBILE NAVIGATION FIXES
   ======================================================================== */