/* 
   MOBILE-SPECIFIC OVERRIDES
   Designed for Android and iPhone handsets.
   Loaded after style.css to ensure precedence.
*/

/* 1. CRITICAL HAMBURGER MENU VISIBILITY */
.dropdown-content {
    display: none !important;
    position: absolute;
    background-color: var(--primary);
    min-width: 220px;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    z-index: 10000 !important;
    border-radius: 12px;
    margin-top: 10px;
    left: 0;
}

.dropdown-content.show {
    display: block !important;
}

/* 2. GENERAL HANDSET SCALING (Phones < 600px) */
@media screen and (max-width: 600px) {
    h1 {
        font-size: 1.6em !important;
        margin: 5px 0 !important;
    }

    .nav-bar h1 {
        font-size: 1.15em !important;
        max-width: 200px;
    }

    #staff-name {
        display: none !important;
    }

    #total {
        font-size: 1.5em !important;
        margin: 5px 0 !important;
    }

    .big-btn {
        font-size: 1.3em !important;
        padding: 10px !important;
        margin: 5px 0 !important;
        border-radius: 10px !important;
    }

    .receipt-actions {
        padding: 8px !important;
        gap: 6px !important;
        margin-top: auto;
    }

    .receipt-actions .big-btn {
        padding: 15px 10px !important;
        margin: 0 !important;
    }

    /* Ensure cart items are readable but compact */
    .cart-item {
        padding: 12px 10px !important;
        font-size: 0.8em !important;
    }

    .cart-item-qty-badge {
        width: 35px !important;
        height: 35px !important;
        font-size: 1.1em !important;
    }

    /* Hide search icon on all handsets to save space */
    .search-btn {
        display: none !important;
    }

    /* Fix for "dead" clicks on mobile search results */
    .search-result-item * {
        pointer-events: none;
    }

    /* Reduce Qty font size to prevent overlapping on phones */
    #current-qty {
        font-size: 1.4em !important;
    }
    #quantity-product-info {
        font-size: 1.1em !important;
    }
}

/* 3. ULTRA SMALL SCREEN / IPHONE SPECIFIC */
@media only screen and (max-device-width: 400px) {
    h1 {
        font-size: 1.4em !important;
    }

    .nav-bar h1 {
        font-size: 1.05em !important;
        max-width: 160px;
    }

    #total {
        font-size: 1.3em !important;
    }

    .cart-btn::after {
        top: -6px;
        right: -8px;
    }

    .big-btn {
        font-size: 1.2em !important;
    }

    .nav-bar {
        padding: 5px 10px !important;
    }

    /* More aggressive Qty font size for very narrow screens like iPhone 7 */
    #current-qty {
        font-size: 1.2em !important;
    }
    #quantity-product-info {
        font-size: 0.95em !important;
    }
}

/* 4. KEYPAD SCREEN OPTIMIZATION (Move Up) */
#screen-quantity {
    padding-top: 5px !important;
}

#screen-quantity .nav-bar {
    padding-bottom: 2px !important;
    margin-bottom: 5px !important;
}

#quantity-header-row {
    margin-bottom: 8px !important;
    display: flex !important;
}

@media screen and (max-height: 700px) {
    .keypad {
        gap: 8px !important;
        margin: 5px 0 !important;
    }
    .keypad button {
        padding: 15px 10px !important;
        font-size: 2.2rem !important;
    }
    #quantity-header-row {
        margin-bottom: 2px !important;
    }
}