/* ========================================
   CRITICAL MOBILE SEARCH FIX - NUCLEAR OPTION
   This file MUST be loaded LAST to override everything
   ======================================== */

/* Force search results to appear on top of EVERYTHING on mobile */
@media (max-width: 767px) {

    /* CRITICAL: Mobile search container must be fixed positioned just below header */
    div.mobile-search,
    .mobile-search {
        position: fixed !important;
        top: 60px !important; /* Fixed below the mobile header */
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        z-index: 2147483647 !important;
        background: #ffffff !important;
        padding: 15px 16px !important;
        padding-top: 0 !important;
        overflow: visible !important;
        margin: 0 !important;
    }

    div.mobile-search form,
    .mobile-search form {
        position: relative !important;
        z-index: 2147483647 !important;
    }

    /* Nuclear z-index for search results - MUST be on top */
    div.mobile-search .search_result,
    .mobile-search .search_result,
    div.search_result,
    .search_result {
        position: relative !important;
        z-index: 2147483647 !important; /* Maximum possible z-index */
        overflow: visible !important;
    }

    div.mobile-search .search_product,
    .mobile-search .search_product,
    div.search_product,
    .search_product {
        position: absolute !important;
        z-index: 2147483647 !important; /* Maximum possible z-index */
        background: #ffffff !important;
        border: 1px solid #dddddd !important;
        border-radius: 8px !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15) !important;
        max-height: 400px !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    /* Force mobile header to be fixed and allow overflow */
    .mobile-header {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        z-index: 10000 !important;
        overflow: visible !important;
        background: #fff !important;
    }

    /* Add top margin to content so it's not hidden under fixed header + search */
    body {
        padding-top: 115px !important; /* For fixed mobile header + fixed search bar */
    }

    /* Ensure body doesn't hide search */
    body,
    html {
        overflow-x: hidden !important;
        overflow-y: auto !important;
    }
}