/* Final responsive safety layer. Desktop layout is intentionally unchanged. */
html { max-width: 100%; overflow-x: hidden; }
body { max-width: 100%; overflow-x: clip; }
img, svg, video, canvas, iframe { max-width: 100%; }
input, select, textarea, button { max-width: 100%; }
.row > *, [class*="grid"] > *, [class*="layout"] > * { min-width: 0; }
.table-responsive { -webkit-overflow-scrolling: touch; }
.mobile-header-shell { display: none; }
.home-photo-hero-gallery-mobile { display: none; }

@media (max-width: 991.98px) {
    .container, .container-fluid { width: 100%; }

    /* Shared header */
    .header-main .container { max-width: 100%; padding-right: 16px; padding-left: 16px; }
    .foodie-navbar-row { display: flex; flex-wrap: nowrap; justify-content: space-between; }
    .navbar-brand-col { flex: 0 0 92px !important; width: 92px !important; max-width: 92px !important; }
    .navbar-brand-col .brand-wrap img { width: 78px !important; max-height: 54px; object-fit: contain; }
    .navbar-location-col { flex: 1 1 auto; width: auto; min-width: 0; padding: 0 7px; }
    .navbar-actions-col { flex: 0 0 auto !important; width: auto; max-width: none; padding: 0; }
    .foodie-navbar-actions { gap: 5px; white-space: nowrap; }
    .foodie-navbar-actions .nav-action { min-width: 38px; min-height: 38px; padding: 0 9px !important; justify-content: center; }
    .foodie-navbar-actions .nav-action .icon > span:not(.badge),
    .foodie-navbar-actions .header-cart-total,
    .foodie-navbar-actions .navbar-delivery-toggle .takeaway-btn > span:first-of-type,
    .foodie-navbar-actions .navbar-language .language-options { display: none !important; }
    .foodie-navbar-actions .navbar-delivery-toggle { min-width: 40px; padding: 7px !important; }
    .foodie-navbar-actions .navbar-language { width: 40px; min-width: 40px; justify-content: center; padding: 0 !important; }
    .foodie-navbar-actions .desktop-menu-toggle { flex: 0 0 38px; }
    .navbar-location-picker, .navbar-location-picker .dropdown-toggle { width: 100%; }
    .header-main .navbar-location-picker #user_locationnew { width: 100% !important; max-width: none !important; min-width: 0; }
    .dropdown-menu { max-width: calc(100vw - 24px); }

    /* Bootstrap cards and legacy account/content screens */
    .account-page .col-md-4, .account-page .col-md-8,
    .contact-us-page .col-md-4, .contact-us-page .col-md-8,
    .about-page .col-md-4, .about-page .col-md-8 { flex: 0 0 100%; max-width: 100%; }
    .transactions-list-left, .address-card, .card-body { overflow-wrap: anywhere; }
    table { width: 100%; }

    /* Home cards: two columns on tablet */
    .home-redesign .product-list,
    .home-redesign #most_popular_item > .row > [class*="col-"],
    .home-redesign #most_popular_store > .row > [class*="col-"],
    .home-redesign #home_favourite_restaurants > .row > [class*="col-"],
    .home-redesign #home_favourite_foods > .row > [class*="col-"],
    .home-redesign #new_arrival > .row > [class*="col-"],
    .home-redesign #offers_coupons > .row > [class*="col-"],
    .home-redesign #all_stores > .row > [class*="col-"] { flex: 0 0 50%; max-width: 50%; }
    .home-redesign .home-photo-hero-inner { grid-template-columns: 1fr; }
    .home-redesign .home-photo-hero-copy { max-width: 680px; }
    .home-redesign .home-photo-hero-gallery { min-height: 390px; }

    /* Menus, checkout and restaurant detail pages */
    .order-menu-shell { width: 100%; max-width: 100%; padding-right: 22px; padding-left: 22px; }
    .order-product-list { grid-template-columns: 1fr !important; }
    .delivery-flow-grid, .delivery-checkout-grid, .pickup-checkout-grid,
    .dine-restaurant-layout, .dine-cart-layout, .dine-payment-layout { grid-template-columns: 1fr !important; }
    .delivery-summary-card, .delivery-checkout-side, .pickup-checkout-side,
    .dine-booking-panel-inner { position: static !important; }
    .delivery-restaurant-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .dine-directory-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .dine-restaurant-identity { gap: 20px; }
    .dine-preview-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

    /* Dialogs */
    .modal-dialog { width: auto; max-width: calc(100vw - 30px); margin: 15px auto; }
    .frush-address-modal { max-height: calc(100vh - 24px); overflow-y: auto; }
}

@media (max-width: 767.98px) {
    /* Undo a legacy rule that made every utility-hidden element visible. */
    .d-none { display: none !important; }
    body { font-size: 13px; }
    .container, .container-sm { max-width: 100%; padding-right: 14px; padding-left: 14px; }
    h1 { overflow-wrap: anywhere; }

    /* Compact, usable header */
    .header-main .container { padding-right: 10px; padding-left: 10px; }
    .foodie-navbar-row { min-height: 62px !important; }
    .navbar-brand-col { flex-basis: 56px !important; width: 56px !important; max-width: 56px !important; padding: 0 5px !important; }
    .navbar-brand-col .brand-wrap img { width: 48px !important; height: 48px; }
    .navbar-location-col { padding: 0 4px; }
    .navbar-location-picker .head-loc { display: none; }
    .navbar-location-picker .dropdown-toggle { min-height: 40px !important; padding: 0 25px 0 9px !important; }
    .header-main .navbar-location-picker #user_locationnew { font-size: 9px !important; text-overflow: ellipsis; }
    .foodie-navbar-actions { gap: 2px; }
    .foodie-navbar-actions .nav-action { min-width: 34px; min-height: 36px; padding: 0 7px !important; }
    .foodie-navbar-actions .nav-offers-action,
    .foodie-navbar-actions .navbar-activity-dropdown,
    .foodie-navbar-actions .navbar-quick-dropdown,
    .foodie-navbar-actions .navbar-delivery-toggle,
    .foodie-navbar-actions .navbar-language { display: none !important; }
    .foodie-navbar-actions .desktop-menu-toggle { margin-left: 1px !important; }
    .navbar-empty-cart { top: 68px; }

    /* Home */
    .home-redesign .multi-vendore-content > section { padding: 28px 0; }
    .home-redesign section > .container > .title,
    .home-redesign .category-content > .title { min-height: 40px; gap: 10px; margin-bottom: 18px; }
    .home-redesign section .title h5,
    .home-redesign .category-content .title h5 { font-size: 20px; }
    .home-redesign .see-all a,
    .home-redesign .home-favourite-group-heading > a { min-height: 38px; padding: 8px 11px !important; font-size: 9px !important; }
    .home-redesign .product-list,
    .home-redesign #most_popular_item > .row > [class*="col-"],
    .home-redesign #most_popular_store > .row > [class*="col-"],
    .home-redesign #home_favourite_restaurants > .row > [class*="col-"],
    .home-redesign #home_favourite_foods > .row > [class*="col-"],
    .home-redesign #new_arrival > .row > [class*="col-"],
    .home-redesign #offers_coupons > .row > [class*="col-"],
    .home-redesign #all_stores > .row > [class*="col-"] { flex: 0 0 100%; max-width: 100%; }
    .home-redesign .list-card-image .item-img { width: 100%; height: 210px !important; object-fit: cover; }
    .home-redesign .home-photo-hero { padding: 34px 0; }
    .home-redesign .home-photo-hero-copy h1 { font-size: clamp(30px, 9vw, 42px); }
    .home-redesign .home-photo-hero-copy > div { align-items: stretch; flex-direction: column; }
    .home-redesign .home-photo-hero-gallery-desktop { display: none; }
    .home-redesign .home-photo-hero-gallery-mobile {
        display: block;
        width: 100%;
        min-height: 285px;
        margin: 22px 0;
    }
    .home-redesign .hero-photo-main { width: 72%; }
    .home-redesign .hero-photo-top, .home-redesign .hero-photo-bottom { width: 42%; }
    .home-redesign .home-discovery-panel { padding: 14px; }
    .home-redesign .home-discovery-search { grid-template-columns: 1fr auto; }

    /* Directory heroes and grids */
    .restaurant-directory-page { padding-top: 18px; }
    .restaurant-directory-hero { min-height: 0; padding: 26px 20px; align-items: flex-start; flex-direction: column; }
    .restaurant-directory-hero h1 { font-size: 28px; }
    .delivery-directory-hero, .dine-directory-hero, .delivery-orders-hero { padding: 32px 0; }
    .delivery-directory-hero>.container, .dine-directory-hero-inner,
    .delivery-orders-hero>.container { align-items: flex-start; flex-direction: column; }
    .delivery-directory-hero h1, .dine-directory-hero h1, .delivery-orders-hero h1 { font-size: 28px; }
    .delivery-directory-hero a, .dine-directory-hero-inner>a { width: 100%; min-width: 0; }
    .delivery-restaurant-grid, .dine-directory-grid { grid-template-columns: 1fr; }
    .delivery-directory-heading, .dine-directory-heading { align-items: flex-start; gap: 10px; flex-direction: column; }
    .delivery-directory-filters, .dine-directory-filters { padding-bottom: 4px; scrollbar-width: thin; }

    /* Food menu */
    .order-menu-shell { padding: 14px 12px 100px; }
    .order-restaurant-hero { border-radius: 16px; }
    .order-product-list article { grid-template-columns: 118px minmax(0, 1fr) !important; min-height: 190px; }
    .order-food-photo { width: 118px !important; min-height: 190px !important; }
    .order-food-copy { padding: 15px 14px 55px !important; }
    .order-food-copy h2 { font-size: 14px !important; }
    .order-cart-bar { width: calc(100% - 20px); bottom: 10px; }

    /* Checkout/cart/orders */
    .delivery-flow .container, .delivery-orders .container,
    .delivery-directory .container, .dine-directory .container,
    .dine-restaurant-page .container { width: calc(100% - 24px); }
    .delivery-flow-hero h1 { font-size: 28px; }
    .delivery-flow-hero nav { width: 100%; overflow-x: auto; justify-content: flex-start; }
    .delivery-flow-hero nav b { flex: 0 0 auto; }
    .delivery-cart-item { grid-template-columns: 88px minmax(0,1fr) !important; gap: 12px; }
    .delivery-cart-item img { width: 88px !important; height: 92px !important; }
    .delivery-cart-quantity { grid-column: 1 / -1; justify-self: end; }
    .delivery-address-choice, .delivery-payment-choice { grid-template-columns: 18px 34px minmax(0,1fr) auto; padding: 11px; }
    .delivery-order-card { grid-template-columns: 84px minmax(0,1fr); gap: 12px; }
    .delivery-order-card>img { width: 84px; height: 84px; }
    .delivery-order-card aside { grid-column: 1 / -1; width: 100%; align-items: center; flex-direction: row; justify-content: space-between; }
    .pickup-checkout-header { gap: 18px; align-items: flex-start; flex-direction: column; }
    .pickup-checkout-progress { align-self: stretch; justify-content: center; }

    /* Dine-in detail and supporting flows */
    .dine-restaurant-hero, .dine-restaurant-hero-content { min-height: 430px; }
    .dine-restaurant-identity { align-items: flex-start; flex-direction: column; }
    .dine-restaurant-identity h1 { font-size: 30px; }
    .dine-detail-quick-actions, .dine-preview-grid, .dine-visit-grid,
    .dine-facilities-grid, .dine-info-features { grid-template-columns: 1fr !important; }
    .dine-booking-panel-inner { display: block !important; }
    .dine-booking-panel label { margin-top: 12px !important; }
    .dine-info-card { padding: 18px; }

    /* Forms, modals and long content */
    .form-row > [class*="col-"], .modal .form-row > [class*="col-"] { flex: 0 0 100%; max-width: 100%; }
    .modal-content { max-height: calc(100vh - 20px); overflow-y: auto; }
    .frush-address-overlay { align-items: end; padding: 0; }
    .frush-address-modal { width: 100%; max-height: 94vh; border-radius: 20px 20px 0 0; }
    .frush-address-modal header { grid-template-columns: 42px minmax(0,1fr) 36px; gap: 9px; }
    .frush-address-modal h2 { font-size: 18px; }
    .frush-save-options { grid-template-columns: 1fr 1fr; }
    .frush-address-actions { grid-template-columns: 1fr !important; }
    .table-responsive, .transactions-list { overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .table-responsive table { min-width: 640px; }
}

@media (max-width: 575.98px) {
    .mobile-header-shell { display: block; }
    .mobile-header-shell > .bg-primary {
        display: flex;
        width: 100%;
        height: 64px;
        align-items: center;
        padding: 7px 13px !important;
        background: #fff !important;
        box-shadow: 0 2px 14px rgba(25, 55, 35, .08);
    }
    .mobile-header-shell .mobile-logo {
        display: inline-flex;
        width: 50px;
        height: 50px;
        align-items: center;
        justify-content: center;
        overflow: hidden;
    }
    .mobile-header-shell .mobile-logo img {
        width: 46px !important;
        height: 46px !important;
        max-width: 46px !important;
        object-fit: contain;
    }
    .mobile-header-shell .togglew { margin-right: 10px; }
    .mobile-header-shell .togglew span,
    .mobile-header-shell .togglew span::before,
    .mobile-header-shell .togglew span::after { background: #159a4b !important; }
}

/* Location onboarding must grow with its form instead of clipping actions. */
@media (max-width: 820px) {
    .location-page {
        min-height: 100dvh;
        align-items: flex-start;
        padding: 18px 14px;
        overflow-y: auto;
    }
    .location-shell {
        width: min(100%, 580px);
        height: auto;
        min-height: 0;
        margin: 0 auto;
        overflow: visible;
        border-radius: 22px;
    }
    .location-card { padding: 28px 24px 30px; }
    .location-brand { width: 92px; margin-bottom: 20px; }
    .location-copy h1 { margin: 10px 0 12px; font-size: clamp(29px, 8vw, 38px); }
    .location-copy p { margin-bottom: 18px; font-size: 14px; }
    .location-group .btn-continue { display: block; min-height: 50px; }
    .location-privacy { margin-top: 14px; line-height: 1.5; }
}

@media (max-width: 480px) {
    .location-page { padding: 10px; }
    .location-shell { border-radius: 18px; }
    .location-card { padding: 22px 17px 24px; }
    .location-brand { width: 78px; margin-bottom: 15px; }
    .location-eyebrow { font-size: 9px; }
    .location-copy h1 { font-size: 28px; }
    .location-copy p { font-size: 12px; line-height: 1.55; }
    .location-input-wrap { position: relative; overflow: hidden; }
    .location-input-wrap > i {
        top: 13px;
        left: 0;
        width: 42px;
        height: 30px;
        margin: 0;
        border-right: 1px solid var(--order-line);
    }
    .location-input-wrap input {
        min-height: 50px;
        margin-left: 42px;
        padding-left: 12px;
    }
    .location-input-wrap .locate-me { min-height: 42px; }
    .location-privacy {
        display: flex;
        align-items: flex-start;
        gap: 5px;
        margin-top: 12px;
    }
    .location-privacy i { flex: 0 0 auto; margin: 2px 0 0; }
}

@media (max-width: 420px) {
    .navbar-location-col { display: none !important; }
    .navbar-actions-col { margin-left: auto; }
    .foodie-navbar-actions .nav-cart-action { display: inline-flex !important; }
    .home-redesign .home-photo-hero-gallery { min-height: 240px; }
    .home-redesign .home-favourite-group-heading { gap: 8px; align-items: flex-start; flex-direction: column; }
    .order-product-list article { grid-template-columns: 96px minmax(0,1fr) !important; }
    .order-food-photo { width: 96px !important; }
    .order-food-copy { padding-right: 10px !important; padding-left: 10px !important; }
    .delivery-address-choice, .delivery-payment-choice { grid-template-columns: 18px 32px minmax(0,1fr); }
    .delivery-payment-choice em { display: none; }
}

/* Keep logical direction correct when Arabic is active. */
[dir="rtl"] .home-redesign .see-all { margin-right: auto !important; margin-left: 0 !important; }

/* Persistent home cart summary. */
.home-persistent-cart { position:fixed;z-index:1040;right:24px;bottom:24px;left:24px;width:min(720px,calc(100% - 48px));min-height:72px;margin:0 auto;padding:12px 14px;display:grid;grid-template-columns:46px minmax(0,1fr) auto;gap:12px;align-items:center;border-radius:17px;color:#fff;background:linear-gradient(105deg,#119d4a,#20bf64);box-shadow:0 16px 38px rgba(10,109,49,.3); }
.home-persistent-cart[hidden] { display:none !important; }
.home-persistent-cart-icon { display:grid;width:46px;height:46px;place-items:center;border-radius:12px;color:#129c4a;background:#fff;font-size:20px; }
.home-persistent-cart-copy { min-width:0; }
.home-persistent-cart-copy strong,.home-persistent-cart-copy small { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.home-persistent-cart-copy strong { font-size:14px; }
.home-persistent-cart-copy small { margin-top:3px;color:rgba(255,255,255,.78);font-size:10px; }
.home-persistent-cart>a { padding:12px 16px;border-radius:11px;color:#118a43;background:#fff;font-size:11px;font-weight:800;text-decoration:none;white-space:nowrap; }

.delivery-directory-filters { margin-bottom:31px !important;padding-bottom:10px;overflow-x:auto;overflow-y:hidden;scrollbar-gutter:stable; }

@media (max-width: 767.98px) {
    .delivery-flow .delivery-cart-item > button[data-remove-item] { top:50px;left:13px; }
    .delivery-directory-filters { margin-bottom:28px !important;padding-bottom:13px; }
    .delivery-directory-heading { align-items:center !important;flex-direction:column;text-align:center; }
    .delivery-directory-heading>b { margin-top:10px; }
    .home-redesign #middle_banner { padding-top:18px; }
    .home-redesign #middle_banner .slick-arrow { top:0;transform:translateY(-100%); }
    .home-redesign #middle_banner .slick-prev { right:46px;left:auto; }
    .home-redesign #middle_banner .slick-next { right:8px; }
    .section-footer .footer-about { text-align:center; }
    .section-footer .logo-footer,.section-footer #footer_logo_web { margin-right:auto !important;margin-left:auto !important; }
    .section-footer .title { width:max-content;max-width:100%;margin-right:auto !important;margin-left:auto !important; }
    .section-footer .title::before,.section-footer .title::after { right:auto !important;left:50% !important;transform:translateX(-50%); }
}

@media (max-width: 480px) {
    .home-persistent-cart { right:10px;bottom:12px;left:10px;width:calc(100% - 20px);min-height:64px;grid-template-columns:40px minmax(0,1fr) auto;gap:9px;padding:10px; }
    .home-persistent-cart-icon { width:40px;height:40px; }
    .home-persistent-cart>a { padding:10px 11px;font-size:9px; }
}
[dir="rtl"] .foodie-navbar-actions .desktop-menu-toggle { margin-right: 4px !important; margin-left: 0 !important; }