/* Mobile restaurant page. All desktop rules remain owned by the parent/child theme. */
 .menu-price-mobile { display: none; }
 .rf-checkout-mobile-order-summary { display: none; }
@media (max-width: 767.98px) {
    .rf-checkout #cart-header-order { display: block !important; }
    .rf-checkout #cart-header-order > .mt-2 { display: block !important; margin-top: 8px !important; }
    .rf-checkout #cart-header-order .rf-checkout-header-time-slot { display: block !important; width: 100% !important; margin-top: 8px !important; padding: 4px !important; border-radius: 12px !important; background: #fff !important; }
    .rf-checkout #cart-header-order .rf-checkout-header-time-slot .btn-timepicker { display: block !important; width: 100% !important; min-height: 38px !important; border: 0 !important; border-radius: 10px !important; background: #f5f3f0 !important; }
    .rf-checkout-mobile-order-summary { display: block !important; margin-bottom: 12px; }
    .rf-checkout .rf-checkout-mobile-order-summary > div.py-2.border-top { display: flex !important; flex-direction: column !important; align-items: stretch !important; gap: 8px !important; padding: 0 !important; border-top: 0 !important; }
    .rf-checkout .rf-checkout-mobile-order-summary .rf-order-type-switch { width: 100% !important; flex: 0 0 auto !important; }
    .rf-checkout .rf-checkout-mobile-order-summary .rf-checkout-mobile-time-slot { width: 100% !important; flex: 0 0 auto !important; }
    .rf-checkout-mobile-order-summary .rf-order-time-summary { display: none !important; }
    .rf-checkout-mobile-time-slot { display: block !important; margin-top: 8px !important; padding: 4px !important; border-radius: 12px !important; background: #fff !important; }
    .rf-checkout-mobile-time-slot .btn-timepicker { display: block !important; width: 100% !important; min-height: 38px !important; border: 0 !important; border-radius: 10px !important; background: #f5f3f0 !important; }
    html, body { max-width: 100%; overflow-x: clip; }
    body > header.header { min-height: 60px !important; }
    body > main { padding-top: 0 !important; }

    #page-wrapper > .container { max-width: none; padding: 0 16px; }
    .lb-restaurant-layout { padding-top: 12px !important; padding-bottom: 24px !important; margin-inline: -12px; }
    .lb-restaurant-layout > .col-lg-6 { padding-inline: 12px; }

    .rf-hero { margin: 0 0 16px; overflow: visible !important; border-radius: 0 !important; box-shadow: none !important; background: transparent; }
    .rf-hero__media { height: auto !important; min-height: 0 !important; overflow: visible; background: transparent !important; }
    .rf-hero__bg { position: relative !important; inset: auto !important; width: 100%; height: clamp(178px, 49vw, 205px); overflow: hidden; border-radius: 16px; background: #f0ece8; }
    .rf-hero__bg-img { width: 100%; height: 100%; object-fit: cover; }

    #local-box > .local-search { display: none !important; }
    .rf-hero__card--desktop { display: none !important; }
    .rf-hero__mobile-info { display: grid !important; grid-template-columns: 50px minmax(0, 1fr) auto; align-items: center; gap: 10px; margin-top: 14px; }
    .rf-hero__mobile-logo { width: 50px; height: 50px; overflow: hidden; border-radius: 12px; background: #fff; box-shadow: 0 3px 12px rgba(15,23,42,.10); }
    .rf-hero__mobile-logo img, .rf-hero__mobile-logo span { display: flex; width: 100%; height: 100%; align-items: center; justify-content: center; object-fit: cover; color: #ff4d00; }
    .rf-hero__mobile-copy { min-width: 0; }
    .rf-hero__mobile-title { overflow: hidden; color: #171717; font-size: clamp(1.35rem, 6vw, 1.5rem); font-weight: 800; line-height: 1.1; text-overflow: ellipsis; white-space: nowrap; }
    .rf-hero__mobile-rating { display: inline-flex; align-items: center; gap: 4px; margin-top: 5px; padding: 0; border: 0; background: transparent; color: #6b7280; font-size: .82rem; }
    .rf-hero__mobile-rating span { color: #ff4d00; }
    .rf-hero__mobile-info-btn { display: inline-flex; min-height: 38px; align-items: center; gap: 6px; padding: 7px 10px; border: 1px solid #e5e7eb; border-radius: 999px; background: #fff; color: #3f3f46; font-size: .76rem; font-weight: 800; white-space: nowrap; }
    .rf-hero__logo-wrap { width: 52px !important; height: 52px !important; border-radius: 12px !important; box-shadow: 0 4px 14px rgba(15,23,42,.10) !important; }
    .rf-hero__logo-img, .rf-hero__logo-fallback { border-radius: 12px !important; }
    .rf-hero__text { min-width: 0; text-align: left !important; }
    .rf-hero__title { margin: 0 !important; font-size: clamp(1.35rem, 6vw, 1.58rem) !important; line-height: 1.1 !important; font-weight: 800 !important; color: #171717; }
    .rf-hero__rating { margin-top: 6px !important; gap: 2px; font-size: .82rem !important; }
    .rf-hero__rating .rf-star { font-size: .92rem !important; }
    .rating-note, .rf-hero__sub { display: none !important; }
    .rf-hero__actions { grid-column: auto !important; justify-self: end; margin-left: 0 !important; }
    .rf-hero__info-btn { min-height: 38px; padding: 7px 10px !important; border-color: #e5e7eb !important; background: #fff !important; font-size: .76rem !important; white-space: nowrap; box-shadow: none; }

    .rf-mobile-topbar { margin: 0 -4px; padding: 0 4px !important; border: 0 !important; }
    .rf-mobile-topbar > .py-2.border-top { display: flex !important; flex-direction: column; align-items: stretch !important; gap: 8px; padding: 0 !important; border: 0 !important; }
    .rf-order-type-switch { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; min-height: 58px; padding: 3px; gap: 3px; border-radius: 28px; background: #efedea; }
    .rf-order-type-switch__btn { min-width: 0; border: 0 !important; border-radius: 24px !important; padding: 6px 8px !important; background: transparent !important; color: #4b5563; }
    .rf-order-type-switch__btn.is-active { background: #fff !important; color: #171717; box-shadow: 0 1px 5px rgba(15,23,42,.12); }
    .rf-order-type-switch__top { display: flex; align-items: center; justify-content: center; gap: 6px; font-weight: 800; line-height: 1.1; }
    .rf-order-type-switch__top i { color: #ff4d00; }
    .rf-order-type-switch__sub { display: block; margin-top: 3px; font-size: .7rem; line-height: 1.05; }

    .lb-menu-panel { display: flex; flex-direction: column; }
    .lb-menu-panel > .rf-mobile-topbar { order: 1; }
    .lb-menu-panel > .menu-search { order: 2; margin-top: 16px; }
    .lb-menu-panel > .lb-mobile-categories-slot { order: 3; }
    .lb-menu-panel > .menu-list { order: 4; }
    .lb-menu-panel .rf-menu-search-wrap { padding: 0 !important; border: 0 !important; }
    .lb-menu-panel .rf-menu-search__input { min-height: 50px; box-shadow: none !important; }

    .rf-mobile-categories { position: sticky; top: 60px; z-index: 90; box-sizing: border-box; min-height: 62px; margin: 0 -16px; padding: 0 8px 0 16px; background: #fff; border-bottom: 1px solid #ece9e5; }
    .rf-mobile-categories__row { display: grid; grid-template-columns: minmax(0, 1fr) 44px; align-items: center; min-height: 62px; }
    .rf-mobile-categories__slider { grid-column: 1; grid-row: 1; min-width: 0; position: relative; overflow: hidden; }
    .rf-mobile-categories__scroll { width: 100% !important; max-width: none; min-width: 0; overflow-x: auto !important; overflow-y: hidden; scrollbar-width: none; scroll-behavior: smooth; overscroll-behavior-inline: contain; -webkit-overflow-scrolling: touch; }
    .rf-mobile-categories__scroll::-webkit-scrollbar { display: none; }
    .rf-mobile-categories__list { width: max-content; min-width: 100%; gap: 8px; padding: 12px 0 !important; }
    .rf-mobile-categories__list .nav-item { flex: 0 0 auto; }
    .rf-mobile-categories__list .nav-link { display: block; padding: 8px 14px !important; border: 0; border-radius: 999px; background: transparent; color: #242424; font-size: .84rem; font-weight: 700; line-height: 1.05; white-space: nowrap; }
    .rf-mobile-categories__list .nav-link.active { background: #2b2928; color: #fff; }
    .rf-mobile-categories__more { grid-column: 2; grid-row: 1; justify-self: center; align-self: center; position: relative !important; z-index: 3; display: inline-flex !important; align-items: center; justify-content: center; width: 34px; height: 34px; margin: 0; border: 0; border-radius: 50%; background: #f4f1ed; color: #2d2926; box-shadow: none; }
    .rf-mobile-categories__more:focus-visible { outline: 2px solid #ff4d00; outline-offset: 2px; }

    .rf-category-sheet[hidden] { display: none !important; }
    .rf-category-sheet { position: fixed; inset: 0; z-index: 1100; }
    .rf-category-sheet__backdrop { position: absolute; inset: 0; background: rgba(15,23,42,.48); }
    .rf-category-sheet__panel { position: absolute; left: 16px; right: 16px; top: 8px; bottom: 8px; display: flex; flex-direction: column; overflow: hidden; border: 1px solid #e4e1dd; background: #fff; box-shadow: 0 18px 50px rgba(15,23,42,.22); }
    .rf-category-sheet__head { display: flex; align-items: center; justify-content: space-between; padding: 16px; border-bottom: 1px solid #e8e5e1; }
    .rf-category-sheet__head h2 { margin: 0; color: #2d2926; font-size: 1.18rem; font-weight: 800; }
    .rf-category-sheet__close { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border: 0; background: transparent; color: #2d2926; font-size: 1.2rem; }
    .rf-category-sheet__list { overflow-y: auto; overscroll-behavior: contain; }
    .rf-category-sheet__list a { display: block; padding: 18px 16px; border-bottom: 1px solid #eee; color: #2d2926; font-weight: 700; text-decoration: none; }
    .rf-category-sheet__list a.active { color: #fff; background: #2d2926; }
    .rf-category-sheet-open { overflow: hidden; }
    @media (min-width: 768px) { .rf-mobile-categories__more, .rf-category-sheet { display: none !important; } }

    .menu-list { margin-top: 8px; }
    .menu-group-item { padding-inline: 0 !important; }
    .menu-group-item .category-title { padding: 13px 0 !important; font-size: 1.05rem; font-weight: 800; }
    .menu-group-item .category-title .badge,
    .menu-group-item .category-title small { font-size: .75rem; font-weight: 600; }
    .menu-items { padding-inline: 0 !important; }
    .menu-item.menu-item-card { padding: 9px 10px !important; border-radius: 10px !important; box-shadow: 0 1px 5px rgba(15,23,42,.08) !important; margin-bottom: 9px !important; }
    .menu-item.menu-item-card:hover, .menu-item.menu-item-card:focus-within { transform: none !important; box-shadow: none !important; }
    .menu-item.menu-item-card .menu-card-row { gap: 10px !important; }
    .menu-item.menu-item-card .menu-name { margin-bottom: 2px !important; font-size: .86rem !important; line-height: 1.2; }
    .menu-item.menu-item-card .menu-desc { margin-top: 0; font-size: .73rem !important; line-height: 1.25; }
    .menu-item.menu-item-card .menu-detail { flex-direction: column; align-items: flex-end; justify-content: flex-start !important; gap: 5px !important; width: auto; }
    .menu-item.menu-item-card .menu-price { display: none; }
    .menu-item.menu-item-card .menu-price-mobile { display: block !important; margin-top: 3px; color: #f4511e; font-size: .8rem !important; line-height: 1.15; }
    .menu-item.menu-item-card .menu-price-mobile s { margin-right: 3px; color: #6b7280; }
    .menu-item.menu-item-card .menu-price { font-size: .8rem !important; }
    .menu-item.menu-item-card .menu-item-image { flex-basis: 74px !important; width: 74px !important; height: 64px !important; border-radius: 9px; }
    .menu-item.menu-item-card .menu-button .btn-cart { width: 38px !important; min-width: 38px !important; height: 38px !important; border: 0 !important; border-radius: 50% !important; background: #f4511e !important; color: #fff !important; box-shadow: none !important; }
    .menu-item.menu-item-card .menu-button .btn-cart i { font-size: 14px !important; color: #fff !important; }

    #cart-mobile-buttons { right: max(16px, env(safe-area-inset-right)) !important; bottom: max(16px, calc(env(safe-area-inset-bottom) + 12px)) !important; }

    /* Compatibility for the currently cached live Blade DOM. Remove after the
       V3 Blade markers are visible in the public HTML. */
    .content #local-box .rf-hero__media {
        display: grid;
        grid-template-rows: clamp(178px, 49vw, 205px) auto;
        gap: 14px;
        height: auto !important;
        min-height: 0 !important;
    }
    .content #local-box .rf-hero__media > .rf-hero__bg {
        position: relative !important;
        inset: auto !important;
        grid-row: 1;
        height: 100%;
        overflow: hidden;
        border-radius: 16px;
    }
    .content #local-box .rf-hero__media > .rf-hero__card:not(.rf-hero__card--desktop) {
        position: relative !important;
        inset: auto !important;
        grid-row: 2;
        display: grid !important;
        grid-template-columns: 50px minmax(0, 1fr) auto;
        align-items: center !important;
        gap: 10px !important;
        width: 100%;
        margin: 0;
        padding: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }
    .content #local-box .rf-hero__card:not(.rf-hero__card--desktop) .rf-hero__logo-wrap {
        width: 50px !important;
        height: 50px !important;
        border-radius: 12px !important;
    }
    .content #local-box .rf-hero__card:not(.rf-hero__card--desktop) .rf-hero__title {
        overflow: hidden;
        font-size: clamp(1.35rem, 6vw, 1.5rem) !important;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .content #local-box .rf-hero__card:not(.rf-hero__card--desktop) .rating-note,
    .content #local-box .rf-hero__card:not(.rf-hero__card--desktop) .rf-hero__sub { display: none !important; }
    .content #local-box .rf-hero__card:not(.rf-hero__card--desktop) .rf-hero__actions {
        grid-column: auto !important;
        justify-self: end;
    }

    .content > .panel:has(> .rf-mobile-topbar) { display: flex; flex-direction: column; }
    .content > .panel:has(> .rf-mobile-topbar) > .rf-mobile-topbar { display: contents !important; }
    .content > .panel:has(> .rf-mobile-topbar) > .rf-mobile-topbar > .py-2 { order: 1; }
    .content > .panel:has(> .rf-mobile-topbar) > .rf-mobile-topbar > .lb-menu-search { display: none !important; }
    .content > .panel:has(> .rf-mobile-topbar) > .menu-search { order: 2; margin-top: 16px; }
    .content > .panel:has(> .rf-mobile-topbar) > .rf-mobile-topbar > .rf-mobile-categories { order: 3; }
    .content > .panel:has(> .rf-mobile-topbar) > .menu-list { order: 4; }
}

/* Keep cart quantity controls aligned for every cart item on compact layouts. */
@media (max-width: 991.98px) {
    body.lb-restaurant-reference .lb-restaurant-layout .cart-items > ul {
        width: 100% !important;
    }

    body.lb-restaurant-reference .lb-restaurant-layout .cart-items > ul > li {
        box-sizing: border-box !important;
        width: 100% !important;
        min-width: 0 !important;
        grid-template-columns: minmax(0, 1fr) 28px 28px 28px 64px !important;
    }

    body.lb-restaurant-reference .lb-restaurant-layout .cart-items > ul > li .cart-btn:not(.cart-btn-plus),
    body.lb-restaurant-reference .lb-restaurant-layout .cart-items > ul > li .cart-item-qty,
    body.lb-restaurant-reference .lb-restaurant-layout .cart-items > ul > li .cart-btn-plus {
        justify-self: stretch !important;
        align-self: start !important;
    }
}

/* Keep menu prices neutral/dark on mobile instead of using the action orange. */
@media (max-width: 767.98px) {
    .menu-item.menu-item-card .menu-price-mobile,
    .menu-item.menu-item-card .menu-price-mobile b {
        color: #000 !important;
    }
}

/* Mobile menu add control: white circular button with orange outline and plus. */
@media (max-width: 767.98px) {
    .menu-item.menu-item-card .menu-button .btn-cart {
        width: 44px !important;
        min-width: 44px !important;
        height: 44px !important;
        padding: 0 !important;
        border: 1px solid rgba(255, 122, 26, .45) !important;
        border-radius: 999px !important;
        background: #fff !important;
        color: #ff7a1a !important;
        box-shadow: 0 4px 12px rgba(255, 122, 26, .10) !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .menu-item.menu-item-card .menu-button .btn-cart .fa-plus {
        color: #ff7a1a !important;
        font-size: 18px !important;
        line-height: 1 !important;
    }
}

/* Mobile cart CTA: place the orange button inside a white rounded tray. */
@media (max-width: 767.98px) {
    #cart-mobile-buttons {
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        width: auto !important;
        height: auto !important;
        padding: 8px 16px calc(8px + env(safe-area-inset-bottom)) !important;
        border-radius: 18px 18px 0 0 !important;
        background: #fff !important;
        box-shadow: 0 -2px 12px rgba(15, 23, 42, .12) !important;
    }

    #cart-mobile-buttons .cart-sticky-button {
        width: 100% !important;
        margin: 0 !important;
    }
}

/* Keep the mobile restaurant actions on the cover image, in a compact white
   control group. The restaurant name and rating stay full-width below it. */
@media (max-width: 767.98px) {
    .rf-hero__mobile-info {
        position: relative !important;
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .rf-hero__mobile-copy {
        grid-column: 1 !important;
        width: 100% !important;
    }

    .rf-hero__mobile-actions {
        position: absolute !important;
        top: -68px !important;
        right: 0 !important;
        z-index: 4 !important;
        display: inline-flex !important;
        align-items: center !important;
        gap: 6px !important;
        width: auto !important;
        padding: 6px !important;
        border-radius: 999px !important;
        background: #fff !important;
        box-shadow: 0 3px 12px rgba(15, 23, 42, .16) !important;
    }
}

/* Lieferando-style article dialog: a centered desktop card with a bounded
   content area and a full-height mobile sheet with a sticky action footer. */
#cart-box-modal.modal.show {
    overflow: hidden !important;
}

#cart-box-modal.modal.show > .menu-item-modal,
#cart-box-modal.modal.show > .modal-dialog {
    width: min(450px, calc(100vw - 32px)) !important;
    max-width: 450px !important;
    height: auto !important;
    max-height: calc(100dvh - 32px) !important;
    margin: 16px auto !important;
    display: flex !important;
    align-items: stretch !important;
}

#cart-box-modal.modal.show > .menu-item-modal > .modal-content,
#cart-box-modal.modal.show > .modal-dialog > .modal-content {
    width: 100% !important;
    height: auto !important;
    max-height: calc(100dvh - 32px) !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
    border-radius: 18px !important;
}

#cart-box-modal.modal.show .modal-top {
    order: 1 !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
    border-radius: 18px 18px 0 0 !important;
    box-shadow: none !important;
}

#cart-box-modal.modal.show .modal-top img {
    display: block !important;
    width: 100% !important;
    height: 200px !important;
    max-height: 200px !important;
    object-fit: cover !important;
    border-radius: 18px 18px 0 0 !important;
}

#cart-box-modal.modal.show .modal-header {
    order: 2 !important;
    flex: 0 0 auto !important;
    padding: 12px 48px 8px 18px !important;
    background: #fff !important;
    border-bottom: 0 !important;
}

#cart-box-modal.modal.show .modal-body {
    order: 3 !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    padding: 8px 18px 10px !important;
}

#cart-box-modal.modal.show .modal-footer {
    order: 4 !important;
    flex: 0 0 auto !important;
    padding: 10px 18px 12px !important;
    background: #fff !important;
    border-top: 1px solid #f0ece8 !important;
}

@media (max-width: 767.98px) {
    #cart-box-modal.modal.show > .menu-item-modal,
    #cart-box-modal.modal.show > .modal-dialog {
        width: 100% !important;
        max-width: none !important;
        height: 100dvh !important;
        max-height: 100dvh !important;
        margin: 0 !important;
    }

    #cart-box-modal.modal.show > .menu-item-modal > .modal-content,
    #cart-box-modal.modal.show > .modal-dialog > .modal-content {
        height: 100dvh !important;
        max-height: 100dvh !important;
        border-radius: 18px 18px 0 0 !important;
    }

    #cart-box-modal.modal.show .modal-top img {
        height: 240px !important;
        max-height: 240px !important;
    }

    #cart-box-modal.modal.show .modal-header {
        padding: 12px 52px 8px 18px !important;
    }

    #cart-box-modal.modal.show .modal-body {
        padding: 8px 18px 10px !important;
    }

    #cart-box-modal.modal.show .modal-footer {
        padding: 10px 18px calc(10px + env(safe-area-inset-bottom)) !important;
    }
}

/* Compact article popup on every viewport size, not only mobile. */
#cart-box-modal .modal-content {
    display: flex !important;
    flex-direction: column !important;
    max-height: min(92dvh, 760px) !important;
    overflow: hidden !important;
}

#cart-box-modal .modal-header {
    flex: 0 0 auto !important;
    padding: 10px 16px 6px !important;
}

#cart-box-modal .modal-header .modal-title {
    font-size: 1.2rem !important;
    line-height: 1.15 !important;
}

#cart-box-modal .modal-body {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow-y: auto !important;
    padding: 8px 14px 6px !important;
}

#cart-box-modal .menu-options {
    margin: 0 0 8px !important;
    padding: 9px 11px 6px !important;
    border-radius: 12px !important;
}

#cart-box-modal .menu-option {
    margin-bottom: 7px !important;
    padding-bottom: 6px !important;
}

#cart-box-modal .menu-options .option-details {
    margin-bottom: 4px !important;
}

#cart-box-modal .menu-options .option-details h5 {
    font-size: .9rem !important;
}

#cart-box-modal .menu-options .form-check,
#cart-box-modal .menu-options .radio,
#cart-box-modal .menu-options .checkbox {
    margin-bottom: 3px !important;
    min-height: 26px !important;
}

#cart-box-modal .menu-comment {
    margin: 0 !important;
    padding: 8px !important;
    border-radius: 10px !important;
}

#cart-box-modal .menu-comment textarea {
    min-height: 48px !important;
    padding: 7px 9px !important;
}

#cart-box-modal .modal-footer {
    flex: 0 0 auto !important;
    padding: 8px 14px 10px !important;
}

#cart-box-modal .modal-footer .row {
    gap: 8px !important;
}

#cart-box-modal .modal-footer button[type="submit"] {
    min-height: 42px !important;
    padding-top: 6px !important;
    padding-bottom: 6px !important;
}

/* Natural-height article popup: never scroll the popup itself. */
#cart-box-modal.modal.show,
#cart-box-modal.modal.show > .modal-dialog,
#cart-box-modal.modal.show > .menu-item-modal {
    overflow: visible !important;
}

#cart-box-modal.modal.show > .modal-dialog,
#cart-box-modal.modal.show > .menu-item-modal,
#cart-box-modal.modal.show > .modal-dialog > .modal-content,
#cart-box-modal.modal.show > .menu-item-modal > .modal-content {
    height: auto !important;
    max-height: none !important;
}

#cart-box-modal.modal.show > .modal-dialog > .modal-content,
#cart-box-modal.modal.show > .menu-item-modal > .modal-content {
    overflow: visible !important;
}

#cart-box-modal.modal.show .modal-body {
    flex: 0 0 auto !important;
    max-height: none !important;
    overflow: visible !important;
}

/* Tablet: center the restaurant search against the full content width. */
@media (min-width: 768px) and (max-width: 1100px) {
    .lb-menu-panel > .menu-search,
    .content > .panel > .menu-search {
        box-sizing: border-box;
        width: 100% !important;
        min-width: 0;
        align-self: stretch;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) minmax(0, 600px) minmax(0, 1fr);
    }

    .lb-menu-panel > .menu-search .rf-menu-search-wrap,
    .content > .panel > .menu-search .rf-menu-search-wrap {
        box-sizing: border-box;
        grid-column: 2;
        width: 100% !important;
        max-width: 600px;
        margin: 0 !important;
        padding-inline: 0 !important;
    }

    .lb-menu-panel > .menu-search .rf-menu-search,
    .content > .panel > .menu-search .rf-menu-search,
    .lb-menu-panel > .menu-search .rf-menu-search__field,
    .content > .panel > .menu-search .rf-menu-search__field {
        width: 100%;
        min-width: 0;
    }
}

/* Tablet restaurant menu: the Bootstrap d-lg-none category bar is still
   visible below 992px, so keep it before the menu list and horizontally
   scrollable at 768-991px as well. Mobile rules above remain unchanged. */
@media (min-width: 768px) and (max-width: 1100px) {
    /* The restaurant page already has its search field in the header. The
       local search placeholder must not leave an empty strip above the hero. */
    #local-box > .local-search { display: none !important; }

    /* Keep the tablet action buttons identical to the desktop restaurant actions. */
    .content #local-box .rf-hero__info-btn {
        width: 130px !important;
        min-width: 130px !important;
        height: 48px !important;
        min-height: 48px !important;
        justify-content: center !important;
        padding: 8px 12px !important;
        border-radius: 999px !important;
    }
    .content #local-box .rf-hero__info-btn .btn-text { display: inline !important; }

    /* The favorite control belongs to the mobile hero variant and should not
       be shown on the compact layouts. */
    .content #local-box .rf-hero__mobile-favorite { display: none !important; }

    /* An empty cart must not show the fixed tablet/mobile cart bar. */
    #cart-mobile-buttons.hide,
    #cart-mobile-buttons[style*="display: none"] {
        display: none !important;
    }

    .lb-menu-panel {
        display: flex;
        flex-direction: column;
    }
    .lb-menu-panel > .rf-mobile-topbar { order: 1; }
    .lb-menu-panel > .menu-search { order: 2; }
    .lb-menu-panel > .lb-mobile-categories-slot {
        order: 3;
        min-width: 0;
    }
    .lb-menu-panel > .menu-list { order: 4; }

    .rf-mobile-categories {
        position: sticky;
        top: var(--rf-navbar-height, 106px);
        z-index: 90;
        box-sizing: border-box;
        min-height: 62px;
        margin: 0 -16px;
        padding: 0 8px 0 16px;
        background: #fff;
        border-bottom: 1px solid #ece9e5;
    }
    .rf-mobile-categories__row {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        align-items: center;
        min-height: 62px;
    }
    .rf-mobile-categories__slider {
        grid-column: 1;
        min-width: 0;
        position: relative;
        overflow: hidden;
    }
    .rf-mobile-categories__scroll {
        width: 100% !important;
        max-width: none;
        min-width: 0;
        overflow-x: auto !important;
        overflow-y: hidden;
        scrollbar-width: none;
        scroll-behavior: smooth;
        overscroll-behavior-inline: contain;
        -webkit-overflow-scrolling: touch;
        touch-action: pan-x pan-y;
    }
    .rf-mobile-categories__scroll::-webkit-scrollbar { display: none; }
    .rf-mobile-categories__list {
        display: flex;
        width: max-content;
        min-width: 100%;
        gap: 8px;
        padding: 12px 0 !important;
    }
    .rf-mobile-categories__list .nav-item { flex: 0 0 auto; }
    .rf-mobile-categories__list .nav-link {
        display: block;
        padding: 8px 14px !important;
        border: 0;
        border-radius: 999px;
        background: transparent;
        color: #242424;
        font-size: .84rem;
        font-weight: 700;
        line-height: 1.05;
        white-space: nowrap;
    }
    .rf-mobile-categories__list .nav-link.active {
        background: #2b2928;
        color: #fff;
    }
    .rf-mobile-categories__more,
    .rf-category-sheet { display: none !important; }
}

/* Tablet restaurant page: the header owns the single order switch and time
   slot. The duplicate controls below the cover are mobile-only. */
@media (min-width: 768px) and (max-width: 1100px) {
    .lb-menu-panel > .rf-mobile-topbar {
        display: none !important;
    }

    .rf-checkout-mobile-order-summary {
        display: block !important;
        margin-bottom: 12px;
    }

    .rf-checkout .rf-checkout-mobile-order-summary > div.py-2.border-top {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 8px !important;
        padding: 0 !important;
        border-top: 0 !important;
    }

    .rf-checkout .rf-checkout-mobile-order-summary .rf-order-type-switch,
    .rf-checkout .rf-checkout-mobile-order-summary .rf-checkout-mobile-time-slot {
        width: 100% !important;
        flex: 0 0 auto !important;
    }

    .rf-checkout-mobile-order-summary .rf-order-time-summary {
        display: none !important;
    }

    .rf-checkout-mobile-time-slot {
        display: block !important;
        margin-top: 8px !important;
        padding: 4px !important;
        border-radius: 12px !important;
        background: #fff !important;
    }

    .rf-checkout-mobile-time-slot .btn-timepicker {
        display: block !important;
        width: 100% !important;
        min-height: 38px !important;
        border: 0 !important;
        border-radius: 10px !important;
        background: #f5f3f0 !important;
    }
}

/* Compact restaurant masthead, inspired by the mobile reference. This file is
   loaded by the local layout only; all new rules stop below tablet width. */
@media (max-width: 767.98px) {
    body > header.header:has(.lb-header--restaurant) {
        min-height: 84px !important;
        box-shadow: 0 2px 6px rgba(0, 0, 0, .10);
    }
    body > header.header .lb-header--restaurant .lb-header__inner {
        height: 84px;
        min-height: 84px;
        padding-inline: 12px 20px;
        gap: 0;
    }
    .lb-header--restaurant .lb-restaurant-back { color: #f36805; flex-basis: 32px; width: 32px; }
    body > header.header .lb-header--restaurant .navbar-brand .rf-brand-copy { display: none !important; }
    body > header.header .lb-header--restaurant .navbar-brand img.img-logo { width: 36px !important; height: 36px !important; }

/* Ensure the brand copy (Lieferbaba.de + slogan) is visible on restaurant pages */
body > header.header .lb-header--restaurant .navbar-brand .rf-brand-copy {
    display: flex !important;
}

/* Remove any unintended vertical space between the header and the hero image */
.lb-hero, .content #local-box .rf-hero__media {
    margin-top: 12px !important;
}

/* Increase slogan font size (subtitle) on mobile */
.rf-brand-copy__subtitle {
    font-size: 2.8rem !important; /* doppelt so groß */
}

/* Override any hidden subtitle on restaurant pages */
.lb-header--restaurant .navbar-brand .rf-brand-copy__subtitle {
    display: block !important;
    font-size: 2.8rem !important;
}

    #page-wrapper > .container { padding-inline: 20px; }
    .lb-restaurant-layout { padding-top: 0 !important; }
    .rf-hero { position: relative; margin-bottom: 24px; }
    .content #local-box .rf-hero__media {
        display: block;
        height: auto !important;
        min-height: 0 !important;
    }
    .content #local-box .rf-hero__media > .rf-hero__bg {
        display: block;
        height: clamp(140px, 40vw, 220px);
        border-radius: 14px;
    }
    .rf-hero__mobile-info {
        position: relative;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: start;
        gap: 10px;
        margin-top: 16px;
    }
    .rf-hero__mobile-logo {
        position: absolute;
        left: 12px;
        bottom: calc(100% + 28px);
        width: 56px;
        height: 56px;
        border-radius: 8px;
        box-shadow: 0 1px 6px rgba(0, 0, 0, .12);
    }
    .rf-hero__mobile-logo img { object-fit: contain; }
    .rf-hero__mobile-title {
        color: #303438;
        font-size: 24px;
        line-height: 1.2;
        white-space: normal;
        overflow-wrap: anywhere;
    }
    .rf-hero__mobile-rating { margin-top: 6px; color: #303438; font-size: 13px; }
    button.rf-hero__mobile-rating,
    .rf-hero__mobile-rating { text-decoration: none !important; border-bottom: 0 !important; }
    .rf-hero__mobile-rating .rf-hero__mobile-rating-value {
        color: #303438 !important;
        font-size: .78rem !important;
        line-height: 1.1;
        text-decoration: underline !important;
        text-underline-offset: 2px;
    }
    .rf-hero__mobile-rating span { color: #f36805; font-size: 20px; line-height: 1; }
    .rf-hero__mobile-info-btn {
        width: 38px;
        min-width: 38px;
        height: 38px;
        min-height: 38px;
        justify-content: center;
        padding: 0;
        border: 1px solid #e5e7eb;
        border-radius: 50%;
        background: #fff;
        color: #303438;
        font-size: 0;
    }
    .rf-hero__mobile-info-btn svg { width: 16px; height: 16px; }
    .rf-hero__mobile-actions { display: flex; align-items: center; gap: 6px; }
    .rf-hero__mobile-favorite {
        display: none !important;
        align-items: center;
        justify-content: center;
        flex: 0 0 34px;
        width: 34px;
        height: 34px;
        padding: 7px;
        border: 0;
        border-radius: 50%;
        background: #f5f3f0;
        color: #303438;
    }
    .rf-hero__mobile-favorite svg { fill: none; stroke: currentColor; stroke-width: 1.8; }
    .rf-hero__mobile-favorite.is-active { color: #f36805; }
    .rf-hero__mobile-favorite.is-active svg { fill: currentColor; }
    .rf-hero__mobile-favorite:focus-visible { outline: 2px solid #f36805; outline-offset: 2px; }
    .rf-order-type-switch { min-height: 48px; padding: 2px; gap: 0; background: #efede9; }
    .rf-order-type-switch__btn { padding: 5px 8px !important; }
    .rf-order-type-switch__top { font-size: 14px; font-weight: 500; }
    .rf-order-type-switch__top i { color: #303438; }
    .rf-order-type-switch__btn.is-active .rf-order-type-switch__top i { color: #f36805; }
    .rf-order-type-switch__sub { font-size: 11px; }
    .rf-order-time-summary {
        display: flex !important;
        width: 100%;
        min-height: 42px;
        align-items: center;
        gap: 8px;
        margin-top: 0;
        padding: 9px 14px;
        border: 1px solid #e6e1dc;
        border-radius: 12px;
        background: #fff;
        color: #242424;
        font-size: 14px;
        font-weight: 600;
        text-align: left;
        box-shadow: 0 1px 4px rgba(15, 23, 42, .06);
    }
    .rf-order-time-summary i:first-child { color: #f36805; }
    .rf-order-time-summary i:last-child { margin-left: auto; color: #6b625e; }
    .rf-order-time-summary:focus-visible { outline: 2px solid #f36805; outline-offset: 2px; }

    /* Restaurant-page order controls: mode first, live time summary directly below. */
    .content #local-box > .card {
        margin-top: 8px !important;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }
    .content #local-box > .card > .card-body {
        display: flex;
        flex-direction: column;
        gap: 8px;
        padding: 0 !important;
    }
    .content #local-box > .card .rf-mobile-order-type {
        order: 1;
        margin-bottom: 0 !important;
    }
    .content #local-box > .card .rf-mobile-order-time {
        order: 2;
        margin-bottom: 0 !important;
    }
    .content #local-box > .card .rf-mobile-order-time #orderTimePicker {
        width: 100%;
        min-height: 42px;
        padding: 8px 14px !important;
        border: 1px solid #e6e1dc !important;
        border-radius: 12px !important;
        background: #fff !important;
        color: #242424;
        text-align: left;
        box-shadow: 0 1px 4px rgba(15, 23, 42, .06);
    }
    .content #local-box > .card .rf-mobile-order-time #orderTimePicker b {
        font-weight: 600;
    }
    .lb-menu-panel > .menu-search,
    .content > .panel:has(> .rf-mobile-topbar) > .menu-search { margin-top: 30px; }
    .content .rf-menu-search-wrap { padding: 0 !important; border: 0 !important; }
    .content .rf-menu-search__input {
        height: 42px;
        min-height: 42px;
        border: 1px solid #96918c;
        border-radius: 999px;
        background: #fff;
        padding: 9px 42px 9px 54px;
        font-size: 16px;
        font-weight: 400;
        box-shadow: none !important;
    }
    .content .rf-menu-search__input::placeholder { color: #777; font-weight: 400; }
    .content .rf-menu-search__icon { left: 20px; color: #f36805; font-size: 20px; }
    .content .rf-menu-search__input:focus { border-color: #f36805; outline: 2px solid #ffe0ca; outline-offset: 2px; }
    .rf-hero__mobile-info-btn:focus-visible,
    .rf-hero__mobile-rating:focus-visible,
    .rf-order-type-switch__btn:focus-visible { outline: 2px solid #f36805; outline-offset: 2px; }
    /* Keep the category scroller inside the same column as search and dishes. */
    body,
    body > main,
    #page-wrapper,
    .lb-restaurant-layout .content,
    .lb-restaurant-layout .panel,
    .lb-restaurant-layout .menu-group-item,
    .lb-restaurant-layout .category-title { background-color: #fff; }
    .lb-restaurant-layout .content,
    .lb-menu-panel,
    .lb-mobile-categories-slot { min-width: 0; max-width: 100%; }
    .lb-mobile-categories-slot { background: #fff; }
    .lb-restaurant-layout .rf-mobile-categories {
        top: 84px;
        width: 100%;
        max-width: 100%;
        margin: 0;
        padding: 0 8px 0 16px;
        background: #fff;
        box-shadow: none;
    }
    .rf-mobile-categories.rf-mobile-categories--pinned {
        top: 84px !important;
        margin-top: 0 !important;
    }
    .rf-mobile-categories__scroll { min-width: 0; max-width: 100%; }

    /* Older cached markup uses the same card for mobile and desktop. */
    .content #local-box .rf-hero__card:not(.rf-hero__card--desktop) {
        grid-template-columns: minmax(0, 1fr) auto !important;
        margin-top: 16px;
    }
    .content #local-box .rf-hero__card:not(.rf-hero__card--desktop) .rf-hero__logo-wrap {
        position: absolute;
        left: 12px;
        bottom: calc(100% + 28px);
        width: 56px !important;
        height: 56px !important;
        border-radius: 8px !important;
    }
    .content #local-box .rf-hero__card:not(.rf-hero__card--desktop) .rf-hero__title {
        font-size: 24px !important;
        white-space: normal;
        overflow-wrap: anywhere;
    }

    /* Compact vertical rhythm between restaurant controls on mobile. */
    .content #local-box .rf-hero { margin-bottom: 8px !important; }
    .content #local-box .rf-hero__mobile-info { margin-top: 8px !important; }
    .content #local-box > .card { margin-top: 0 !important; }
    .content #local-box > .card > .card-body { gap: 4px; }
    .rf-mobile-topbar > .py-2.border-top { gap: 4px; }
    .lb-menu-panel > .menu-search,
    .content > .panel:has(> .rf-mobile-topbar) > .menu-search { margin-top: 8px !important; }
    .lb-restaurant-layout .rf-mobile-categories__row { min-height: 52px; }
    .lb-restaurant-layout .rf-mobile-categories__list { padding-top: 7px !important; padding-bottom: 7px !important; }

    /* Force the CartBox article dialog to the viewport bottom on mobile. */
    #cart-box-modal.modal.show {
        position: fixed !important;
        inset: 0 !important;
        display: flex !important;
        align-items: flex-end !important;
        background: rgba(35, 35, 35, .42) !important;
        padding: 0 !important;
        overflow: hidden !important;
    }
    body:has(#cart-box-modal.modal.show) .modal-backdrop.show {
        opacity: 0 !important;
        background: transparent !important;
    }
    body.modal-open,
    body:has(#cart-box-modal.modal.show) {
        overflow: hidden !important;
        overscroll-behavior: none !important;
        touch-action: none !important;
    }
    #cart-box-modal.modal.show > .modal-dialog,
    #cart-box-modal.modal.show > .menu-item-modal {
        position: absolute !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        top: auto !important;
        width: 100% !important;
        max-width: none !important;
        height: 100dvh !important;
        max-height: 100dvh !important;
        min-height: 0 !important;
        margin: 0 !important;
        display: block !important;
        transform: none !important;
    }
    #cart-box-modal.modal.show > .modal-dialog > .modal-content,
    #cart-box-modal.modal.show > .menu-item-modal > .modal-content {
        width: 100% !important;
        height: 100dvh !important;
        max-height: 100dvh !important;
        overflow: hidden !important;
        border: 0 !important;
        border-radius: 24px 24px 0 0 !important;
        display: flex !important;
        flex-direction: column !important;
    }
    #cart-box-modal.modal.show .modal-body {
        min-height: 0 !important;
        max-height: none !important;
        flex: 1 1 auto !important;
        overflow-y: auto !important;
        overscroll-behavior: contain !important;
        touch-action: pan-y !important;
    }
    #cart-box-modal .modal-body .spinner {
        font-size: .8rem;
    }
    #cart-box-modal .modal-body .spinner i {
        font-size: 1.35rem !important;
    }
    #cart-box-modal .modal-content { position: relative; }
    #cart-box-modal .modal-top {
        order: 1;
        margin: 0 !important;
        border-radius: 24px 24px 0 0 !important;
        box-shadow: none !important;
    }
    #cart-box-modal .modal-top img {
        width: 100%;
        max-height: 260px;
        object-fit: cover;
    }
    #cart-box-modal .modal-header {
        order: 2;
        position: static !important;
        padding: 14px 54px 8px 18px !important;
        border-bottom: 0 !important;
    }
    #cart-box-modal .modal-header::before { display: none; }
    #cart-box-modal .modal-title {
        margin: 0;
        font-size: 1.15rem;
        font-weight: 800;
    }
    #cart-box-modal .modal-header .btn-close {
        position: absolute !important;
        top: 16px;
        right: 16px;
        z-index: 10;
        width: 56px;
        height: 56px;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 50%;
        background-color: #f4f4f4;
        background-size: 20px;
        opacity: 1;
        box-shadow: none;
    }
    #cart-box-modal .modal-header .btn-close:hover,
    #cart-box-modal .modal-header .btn-close:focus {
        opacity: 1;
        box-shadow: none;
    }
    #cart-box-modal .mobile-item-price {
        margin-top: 3px;
        color: #f4511e;
        font-size: .9rem;
        font-weight: 800;
    }
    #cart-box-modal .modal-body { order: 3; }
    #cart-box-modal .menu-options {
        padding: 12px 0;
        border-top: 1px solid #eee9e4;
    }
    #cart-box-modal .menu-option {
        border-bottom: 1px solid #eee9e4;
    }
    #cart-box-modal .modal-footer {
        order: 4;
        flex: 0 0 auto;
    }
}

@media (max-width: 374.98px) {
    .rf-hero__mobile-info { grid-template-columns: minmax(0, 1fr); }
    .rf-hero__mobile-actions { justify-content: flex-end; }
}

@media (min-width: 768px) and (max-width: 1024px) {
    .lb-restaurant-layout { padding-top: 20px !important; }
    .rf-hero__media { height: 250px; }
}

/* Keep the mobile CartBox as one centered Lieferando-style dialog. The
   viewport outside the card is only the dimmed overlay, never an empty white
   part of the modal content. */
@media (max-width: 767.98px) {
    #cart-box-modal.modal.show {
        position: fixed !important;
        inset: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 8px !important;
        overflow: hidden !important;
        background: rgba(35, 35, 35, .42) !important;
        overscroll-behavior: none !important;
    }

    body:has(#cart-box-modal.modal.show) .modal-backdrop.show {
        opacity: 0 !important;
        background: transparent !important;
    }

    #cart-box-modal.modal.show > .modal-dialog,
    #cart-box-modal.modal.show > .menu-item-modal {
        position: relative !important;
        inset: auto !important;
        width: min(444px, 100%) !important;
        height: auto !important;
        max-height: calc(100dvh - 16px) !important;
        margin: 0 !important;
        display: block !important;
        transform: none !important;
    }

    #cart-box-modal.modal.show > .modal-dialog > .modal-content,
    #cart-box-modal.modal.show > .menu-item-modal > .modal-content {
        width: 100% !important;
        height: auto !important;
        max-height: calc(100dvh - 16px) !important;
        overflow: hidden !important;
        border-radius: 0 !important;
    }

    /* Article dialog layout: compact Lieferando-style card without a
       product/icon banner. Existing form controls and request handlers stay
       unchanged; these rules only change presentation on mobile. */
    #cart-box-modal.modal.show .modal-content {
        display: flex !important;
        flex-direction: column !important;
        border-radius: 24px !important;
        background: #fff !important;
        box-shadow: 0 18px 44px rgba(0, 0, 0, .24) !important;
    }

    #cart-box-modal.modal.show .modal-top {
        display: block !important;
        order: 1 !important;
        margin: 0 !important;
        border-radius: 24px 24px 0 0 !important;
        box-shadow: none !important;
        background: #f6f2ec !important;
    }

    #cart-box-modal.modal.show .modal-top img {
        display: block !important;
        width: 100% !important;
        max-height: 260px !important;
        object-fit: cover !important;
        border-radius: 24px 24px 0 0 !important;
    }

    #cart-box-modal.modal.show .modal-header {
        order: 1 !important;
        position: relative !important;
        padding: 38px 52px 8px 20px !important;
        background: #fff !important;
    }

    #cart-box-modal.modal.show:has(.modal-top) .modal-header {
        order: 2 !important;
        position: static !important;
        padding-top: 20px !important;
    }

    #cart-box-modal.modal.show .modal-header::before {
        display: block !important;
        content: '';
        position: absolute;
        top: 11px;
        left: 50%;
        width: 42px;
        height: 4px;
        border-radius: 999px;
        background: #d2d2d2;
        transform: translateX(-50%);
    }

    #cart-box-modal.modal.show .modal-title {
        color: #171717 !important;
        font-size: 1.28rem !important;
        font-weight: 800 !important;
        line-height: 1.15 !important;
    }

    #cart-box-modal.modal.show .mobile-item-price {
        margin-top: 5px !important;
        color: #ff4d00 !important;
        font-size: 1rem !important;
        font-weight: 800 !important;
    }

    #cart-box-modal.modal.show .modal-header .btn-close {
        top: 13px !important;
        right: 13px !important;
        width: 42px !important;
        height: 42px !important;
        border-radius: 50% !important;
        background-color: #f4f4f4 !important;
        background-size: 19px !important;
    }

    #cart-box-modal.modal.show .modal-body {
        order: 2 !important;
        padding: 0 20px 12px !important;
        max-height: min(58dvh, 520px) !important;
        overflow-y: auto !important;
    }

    #cart-box-modal.modal.show:has(.modal-top) .modal-body {
        order: 3 !important;
    }

    #cart-box-modal.modal.show .rf-modal-description {
        margin: 0 0 16px !important;
        padding: 0 !important;
        color: #5f636b !important;
        font-size: .95rem !important;
        line-height: 1.55 !important;
    }

    #cart-box-modal.modal.show .rf-modal-description p {
        margin-bottom: 0 !important;
    }

    #cart-box-modal.modal.show .menu-options {
        margin: 0 0 16px !important;
        padding: 16px 16px 10px !important;
        border: 1px solid #f0e2da !important;
        border-radius: 16px !important;
        background: #fffaf7 !important;
    }

    #cart-box-modal.modal.show .menu-option {
        margin: 0 0 14px !important;
        padding: 0 0 12px !important;
        border-bottom: 1px solid #eee7e2 !important;
    }

    #cart-box-modal.modal.show .menu-option:last-child {
        margin-bottom: 0 !important;
        padding-bottom: 0 !important;
        border-bottom: 0 !important;
    }

    #cart-box-modal.modal.show .menu-options .option-details {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 10px !important;
        margin: 0 0 8px !important;
        padding: 0 !important;
        background: transparent !important;
    }

    #cart-box-modal.modal.show .menu-options .option-details h5 {
        display: flex !important;
        align-items: center !important;
        width: 100% !important;
        margin: 0 !important;
        color: #171717 !important;
        font-size: .92rem !important;
        font-weight: 800 !important;
    }

    #cart-box-modal.modal.show .menu-options .option-details h5 .pull-right {
        float: none !important;
        margin-left: auto !important;
        white-space: nowrap !important;
        color: #ff4d00 !important;
        font-size: .78rem !important;
        font-weight: 700 !important;
    }

    #cart-box-modal.modal.show .menu-options .option-group {
        padding: 0 !important;
    }

    #cart-box-modal.modal.show .menu-comment {
        margin: 0 !important;
        padding: 14px !important;
        border: 1px solid #eee2db !important;
        border-radius: 14px !important;
        background: #fff !important;
    }

    #cart-box-modal.modal.show .menu-comment textarea {
        min-height: 68px !important;
        padding: 10px 12px !important;
        border: 0 !important;
        resize: vertical;
        box-shadow: none !important;
        /* iOS Safari zooms focused controls below 16px. */
        font-size: 16px !important;
        line-height: 1.35 !important;
    }

    #cart-box-modal.modal.show input,
    #cart-box-modal.modal.show select,
    #cart-box-modal.modal.show textarea {
        font-size: 16px !important;
    }

    #cart-box-modal.modal.show .modal-footer {
        order: 3 !important;
        padding: 14px 20px calc(14px + env(safe-area-inset-bottom)) !important;
        border-top: 1px solid #f2efed !important;
        background: #fff !important;
    }

    #cart-box-modal.modal.show:has(.modal-top) .modal-footer {
        order: 4 !important;
    }

    #cart-box-modal.modal.show .modal-footer .row {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        gap: 14px !important;
    }

    #cart-box-modal.modal.show .modal-footer .col-sm-5,
    #cart-box-modal.modal.show .modal-footer .col-sm-7 {
        width: 100% !important;
        max-width: none !important;
        flex: 0 0 auto !important;
        padding: 0 !important;
    }

    #cart-box-modal.modal.show .modal-footer .input-group {
        width: 164px !important;
        max-width: 100% !important;
        min-height: 46px !important;
        margin: 0 auto !important;
        border: 1px solid #f0e3dc !important;
        background: #fff !important;
    }

    #cart-box-modal.modal.show .modal-footer .input-group .form-control {
        min-width: 42px !important;
        padding: 0 !important;
        border: 0 !important;
        font-size: 1rem !important;
        font-weight: 800 !important;
    }

    #cart-box-modal.modal.show .modal-footer .input-group .btn {
        min-width: 42px !important;
        padding: 0 !important;
        color: #171717 !important;
        font-size: 1.1rem !important;
    }

    #cart-box-modal.modal.show .modal-footer .input-group .btn:last-child {
        color: #ff4d00 !important;
    }

    #cart-box-modal.modal.show .modal-footer .col-sm-7 {
        flex: 0 0 auto !important;
    }

    #cart-box-modal.modal.show .modal-footer .btn-primary > .d-flex {
        gap: 4px !important;
    }

    #cart-box-modal.modal.show .modal-footer .btn-primary > .d-flex .col {
        min-width: 0 !important;
        flex: 1 1 auto !important;
    }

    #cart-box-modal.modal.show .modal-footer .btn-primary {
        width: 100% !important;
        min-height: 50px !important;
        border: 0 !important;
        border-radius: 999px !important;
        background: #ff7017 !important;
        box-shadow: none !important;
        font-size: 1rem !important;
        font-weight: 800 !important;
    }

    .cart-items .cart-note-link {
        all: unset !important;
        box-sizing: border-box !important;
        color: #3f454b !important;
        cursor: pointer !important;
        display: block !important;
        font-size: 14px !important;
        line-height: 1.35 !important;
        margin: 4px 0 0 !important;
        padding: 0 !important;
        text-align: left !important;
        text-decoration: underline !important;
        width: max-content !important;
    }

    /* Final compact pass: keep the footer/actions inside the viewport. */
    #cart-box-modal.modal.show > .modal-dialog > .modal-content,
    #cart-box-modal.modal.show > .menu-item-modal > .modal-content {
        height: auto !important;
        max-height: calc(100dvh - 16px) !important;
        display: flex !important;
        flex-direction: column !important;
        overflow: hidden !important;
    }

    #cart-box-modal.modal.show .modal-body {
        flex: 1 1 auto !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow-y: auto !important;
        padding: 0 12px 6px !important;
    }

    #cart-box-modal.modal.show .modal-header {
        flex: 0 0 auto !important;
        padding: 8px 44px 4px 12px !important;
    }

    #cart-box-modal.modal.show .modal-title {
        font-size: 1.08rem !important;
        line-height: 1.1 !important;
    }

    #cart-box-modal.modal.show .menu-options {
        margin: 0 0 6px !important;
        padding: 7px 9px 4px !important;
        border-radius: 11px !important;
    }

    #cart-box-modal.modal.show .menu-option {
        margin: 0 0 5px !important;
        padding: 0 0 4px !important;
    }

    #cart-box-modal.modal.show .menu-options .option-details {
        margin: 0 0 3px !important;
    }

    #cart-box-modal.modal.show .menu-options .option-details h5 {
        font-size: .84rem !important;
    }

    #cart-box-modal.modal.show .menu-options .form-check,
    #cart-box-modal.modal.show .menu-options .radio,
    #cart-box-modal.modal.show .menu-options .checkbox {
        margin-bottom: 2px !important;
        min-height: 24px !important;
    }

    #cart-box-modal.modal.show .menu-comment {
        margin: 0 !important;
        padding: 7px !important;
        border-radius: 9px !important;
    }

    #cart-box-modal.modal.show .menu-comment textarea {
        min-height: 42px !important;
        padding: 6px 8px !important;
    }

    #cart-box-modal.modal.show .modal-footer {
        flex: 0 0 auto !important;
        padding: 7px 12px calc(7px + env(safe-area-inset-bottom)) !important;
    }

    #cart-box-modal.modal.show .modal-footer .row {
        gap: 6px !important;
    }

    #cart-box-modal.modal.show .modal-footer .input-group {
        min-height: 36px !important;
    }

    #cart-box-modal.modal.show .modal-footer .btn-primary {
        min-height: 42px !important;
        font-size: .95rem !important;
    }
}

/* Final Lieferando-style dialog geometry. Keep this override last so it wins
   over the older compact rules above. */
#cart-box-modal.modal.show {
    overflow: hidden !important;
}

#cart-box-modal.modal.show > .menu-item-modal,
#cart-box-modal.modal.show > .modal-dialog {
    width: min(450px, calc(100vw - 32px)) !important;
    max-width: 450px !important;
    height: auto !important;
    max-height: calc(100dvh - 32px) !important;
    margin: 16px auto !important;
    display: flex !important;
    align-items: stretch !important;
}

#cart-box-modal.modal.show > .menu-item-modal > .modal-content,
#cart-box-modal.modal.show > .modal-dialog > .modal-content {
    width: 100% !important;
    height: auto !important;
    max-height: calc(100dvh - 32px) !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
    border-radius: 18px !important;
}

#cart-box-modal.modal.show .modal-top {
    order: 1 !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
    border-radius: 18px 18px 0 0 !important;
    box-shadow: none !important;
}

#cart-box-modal.modal.show .modal-top img {
    display: block !important;
    width: 100% !important;
    height: 200px !important;
    max-height: 200px !important;
    object-fit: cover !important;
    border-radius: 18px 18px 0 0 !important;
}

#cart-box-modal.modal.show .modal-header {
    order: 2 !important;
    flex: 0 0 auto !important;
    padding: 12px 48px 8px 18px !important;
    background: #fff !important;
    border-bottom: 0 !important;
}

#cart-box-modal.modal.show .modal-body {
    order: 3 !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    padding: 8px 18px 10px !important;
}

#cart-box-modal.modal.show .modal-footer {
    order: 4 !important;
    flex: 0 0 auto !important;
    padding: 10px 18px 12px !important;
    background: #fff !important;
    border-top: 1px solid #f0ece8 !important;
}

@media (max-width: 767.98px) {
    #cart-box-modal.modal.show > .menu-item-modal,
    #cart-box-modal.modal.show > .modal-dialog {
        width: 100% !important;
        max-width: none !important;
        height: 100dvh !important;
        max-height: 100dvh !important;
        margin: 0 !important;
    }

    #cart-box-modal.modal.show > .menu-item-modal > .modal-content,
    #cart-box-modal.modal.show > .modal-dialog > .modal-content {
        height: 100dvh !important;
        max-height: 100dvh !important;
        border-radius: 18px 18px 0 0 !important;
    }

    #cart-box-modal.modal.show .modal-top img {
        height: 240px !important;
        max-height: 240px !important;
    }

    #cart-box-modal.modal.show .modal-header {
        padding: 12px 52px 8px 18px !important;
    }

    #cart-box-modal.modal.show .modal-body {
        padding: 8px 18px 10px !important;
    }

    #cart-box-modal.modal.show .modal-footer {
        padding: 10px 18px calc(10px + env(safe-area-inset-bottom)) !important;
    }
}
/* On mobile the restaurant logo remains visible inside the story/status ring.
   The story preview is still clickable and opens the story viewer, but it must
   not permanently cover the restaurant identity in the header. */
@media (max-width: 767.98px) {
    .rf-hero__mobile-logo {
        position: absolute !important;
    }
    .rf-hero__mobile-info {
        grid-template-columns: minmax(0, 1fr) auto !important;
    }
    .rf-hero__mobile-copy {
        grid-column: 1 !important;
    }
    .rf-hero__mobile-copy,
    .rf-hero__mobile-title,
    .rf-hero__mobile-rating {
        text-align: left !important;
    }
    .rf-hero__mobile-copy {
        justify-self: stretch !important;
        align-self: start !important;
    }
    .rf-hero__mobile-logo--story img:not(.rf-story-preview-media) {
        opacity: 1 !important;
    }
    .rf-hero__mobile-logo--story .rf-story-preview-media {
        opacity: 0 !important;
        pointer-events: none !important;
    }
    .rf-hero__mobile-logo--story .rf-story-new-badge {
        display: block !important;
        width: auto !important;
        height: auto !important;
        min-width: 0 !important;
        min-height: 0 !important;
        right: -10px !important;
        bottom: -4px !important;
        padding: 2px 6px !important;
        border: 2px solid #fff !important;
        border-radius: 999px !important;
        background: #ef5b28 !important;
        color: #fff !important;
        font-size: 10px !important;
        line-height: 1.1 !important;
        box-shadow: 0 2px 6px rgba(0, 0, 0, .18) !important;
    }
}


/* 20261027 mobile social hero layout fix */
@media (max-width: 767.98px) {
    /* Keep the logo and identity together below the cover. */
    .rf-hero__mobile-info {
        position: relative !important;
        display: grid !important;
        grid-template-columns: 48px minmax(0, 1fr) !important;
        align-items: center !important;
        gap: 8px 10px !important;
        margin-top: 12px !important;
        padding: 0 2px !important;
    }
    .rf-hero__mobile-logo {
        position: static !important;
        grid-column: 1 !important;
        grid-row: 1 !important;
        width: 48px !important;
        height: 48px !important;
        flex: 0 0 48px !important;
        border-radius: 12px !important;
        box-shadow: 0 3px 12px rgba(15,23,42,.12) !important;
    }
    .rf-hero__mobile-copy {
        grid-column: 2 !important;
        grid-row: 1 !important;
        min-width: 0 !important;
        width: auto !important;
    }
    .rf-hero__mobile-title {
        display: block !important;
        max-width: 100% !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        font-size: clamp(1.05rem, 5vw, 1.35rem) !important;
        line-height: 1.15 !important;
    }
    .rf-hero__mobile-rating { margin-top: 4px !important; }
    .rf-hero__mobile-actions {
        position: static !important;
        grid-column: 1 / -1 !important;
        grid-row: 2 !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 40px !important;
        align-items: center !important;
        gap: 6px !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
    }
    .rf-hero__mobile-actions .rf-hero__menu-btn,
    .rf-hero__mobile-actions .rf-hero__social-btn,
    .rf-hero__mobile-actions .rf-hero__mobile-info-btn {
        box-sizing: border-box !important;
        width: 100% !important;
        min-width: 0 !important;
        height: 40px !important;
        min-height: 40px !important;
        margin: 0 !important;
        padding: 6px 8px !important;
        justify-content: center !important;
        gap: 5px !important;
        font-size: 11px !important;
        line-height: 1 !important;
        white-space: nowrap !important;
    }
    .rf-hero__mobile-actions .babafeed-image {
        width: 22px !important;
        height: 22px !important;
        flex-basis: 22px !important;
        border-radius: 6px !important;
    }
    .rf-hero__mobile-actions .rf-hero__mobile-info-btn {
        display: inline-flex !important;
        padding: 0 !important;
        font-size: 0 !important;
        border-radius: 999px !important;
    }
    .rf-hero__mobile-actions .rf-hero__mobile-info-btn svg {
        width: 16px !important;
        height: 16px !important;
    }
}


/* 20261027 Lieferando-style mobile menu cards */
@media (max-width: 767.98px) {
    .menu-item.menu-item-card {
        position: relative !important;
        padding: 12px 12px !important;
        border: 1px solid rgba(15, 23, 42, .06) !important;
        border-radius: 12px !important;
        background: #fff !important;
        box-shadow: 0 3px 14px rgba(15, 23, 42, .08) !important;
        overflow: hidden !important;
    }
    .menu-item.menu-item-card .menu-card-row.has-image {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 104px !important;
        grid-template-rows: auto !important;
        align-items: start !important;
        gap: 10px !important;
        position: relative !important;
    }
    .menu-item.menu-item-card .menu-card-row.no-image {
        display: block !important;
        position: relative !important;
    }
    .menu-item.menu-item-card .menu-main {
        grid-column: 1 !important;
        grid-row: 1 !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    .menu-item.menu-item-card .menu-card-row.no-image .menu-main {
        padding-right: 40px !important;
    }
    .menu-item.menu-item-card .menu-item-image {
        grid-column: 2 !important;
        grid-row: 1 !important;
        align-self: start !important;
        width: 104px !important;
        height: 88px !important;
        flex: none !important;
        margin: 0 !important;
        border-radius: 10px !important;
        background-size: cover !important;
    }
    .menu-item.menu-item-card .menu-name {
        margin: 1px 0 3px !important;
        color: #202124 !important;
        font-size: .98rem !important;
        font-weight: 800 !important;
        line-height: 1.2 !important;
    }
    .menu-item.menu-item-card .menu-desc {
        margin: 0 !important;
        color: #30343b !important;
        font-size: .78rem !important;
        line-height: 1.35 !important;
        -webkit-line-clamp: 3 !important;
    }
    .menu-item.menu-item-card .menu-price-mobile {
        margin-top: 3px !important;
        color: #202124 !important;
        font-size: .78rem !important;
        line-height: 1.2 !important;
    }
    .menu-item.menu-item-card .menu-tags-row {
        gap: 4px !important;
        margin-top: 7px !important;
    }
    .menu-item.menu-item-card .menu-tag-pill {
        padding: 3px 7px !important;
        font-size: .68rem !important;
        line-height: 1.1 !important;
    }
    .menu-item.menu-item-card .menu-detail {
        position: absolute !important;
        top: -2px !important;
        right: -2px !important;
        z-index: 3 !important;
        display: block !important;
        width: auto !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    .menu-item.menu-item-card .menu-detail .menu-price,
    .menu-item.menu-item-card .menu-detail .menu-meta {
        display: none !important;
    }
    .menu-item.menu-item-card .menu-button .btn-cart {
        width: 34px !important;
        min-width: 34px !important;
        height: 34px !important;
        padding: 0 !important;
        border: 1px solid rgba(255, 122, 26, .32) !important;
        border-radius: 50% !important;
        background: #fff !important;
        color: #f4511e !important;
        box-shadow: 0 2px 7px rgba(15,23,42,.08) !important;
    }
    .menu-item.menu-item-card .menu-button .btn-cart .fa-plus {
        color: #f4511e !important;
        font-size: 16px !important;
    }
    .menu-item.menu-item-card .menu-productinfo-row {
        margin-top: 5px !important;
    }
}


/* 20261027 mobile menu product info label */
@media (max-width: 767.98px) {
    .menu-item.menu-item-card .menu-name-row {
        display: flex !important;
        align-items: baseline !important;
        flex-wrap: wrap !important;
        gap: 0 8px !important;
        margin-bottom: 3px !important;
        min-width: 0 !important;
    }
    .menu-item.menu-item-card .menu-name-row .menu-name {
        margin: 0 !important;
    }
    .menu-item.menu-item-card .menu-productinfo-label {
        color: #30343b !important;
        font-size: .68rem !important;
        font-weight: 500 !important;
        line-height: 1.2 !important;
        text-decoration: underline !important;
        text-underline-offset: 2px !important;
        white-space: nowrap !important;
    }
}


/* 20261027 full-width mobile menu cards */
@media (max-width: 767.98px) {
    /* Lieferando-style: article rows run edge to edge, while their content
       keeps comfortable inner padding. */
    .menu-list .menu-group-item {
        margin-inline: -16px !important;
        width: calc(100% + 32px) !important;
    }
    .menu-group-item .category-title {
        padding-inline: 16px !important;
    }
    .menu-items {
        margin-inline: -16px !important;
        width: calc(100% + 32px) !important;
        padding-inline: 0 !important;
    }
    .menu-item.menu-item-card {
        width: 100% !important;
        margin: 0 !important;
        padding: 12px 16px !important;
        border-right: 0 !important;
        border-left: 0 !important;
        border-top: 0 !important;
        border-bottom: 1px solid #e5e7eb !important;
        border-radius: 0 !important;
        box-shadow: none !important;
    }
    .menu-item.menu-item-card:first-child {
        border-top: 1px solid #e5e7eb !important;
    }
}


/* 20261027 mobile menu spacing and larger plus */
@media (max-width: 767.98px) {
    .menu-list .menu-group-item,
    .menu-items {
        margin-inline: -8px !important;
        width: calc(100% + 16px) !important;
    }
    .menu-item.menu-item-card {
        width: calc(100% - 12px) !important;
        margin-inline: 6px !important;
        border-right: 1px solid #e5e7eb !important;
        border-left: 1px solid #e5e7eb !important;
        border-radius: 8px !important;
    }
    .menu-item.menu-item-card .menu-button .btn-cart {
        width: 42px !important;
        min-width: 42px !important;
        height: 42px !important;
    }
    .menu-item.menu-item-card .menu-button .btn-cart .fa-plus {
        font-size: 20px !important;
    }
}


/* 20261027 final Lieferando list separators */
@media (max-width: 767.98px) {
    .menu-item.menu-item-card {
        width: 100% !important;
        margin-inline: 0 !important;
        border-top: 0 !important;
        border-right: 0 !important;
        border-bottom: 1px solid #e5e7eb !important;
        border-left: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
    }
    .menu-item.menu-item-card:first-child {
        border-top: 0 !important;
    }
}


/* 20261027 Lieferando plus button size */
@media (max-width: 767.98px) {
    .menu-item.menu-item-card .menu-button .btn-cart {
        width: 34px !important;
        min-width: 34px !important;
        height: 34px !important;
        border: 1px solid rgba(255, 122, 26, .25) !important;
        border-radius: 50% !important;
        background: #fff !important;
        color: #f4511e !important;
        box-shadow: 0 1px 4px rgba(15, 23, 42, .06) !important;
    }
    .menu-item.menu-item-card .menu-button .btn-cart .fa-plus {
        color: #f4511e !important;
        font-size: 16px !important;
        font-weight: 400 !important;
    }
}


/* 20261027 Lieferando-style mobile logo overlay */
@media (max-width: 767.98px) {
    .rf-hero__media {
        position: relative !important;
        z-index: 1 !important;
    }
    .rf-hero__bg {
        border-radius: 16px !important;
    }
    .rf-hero__mobile-info {
        position: relative !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        grid-template-rows: auto auto !important;
        align-items: start !important;
        gap: 8px 10px !important;
        margin-top: 0 !important;
        padding: 14px 2px 0 !important;
    }
    .rf-hero__mobile-logo {
        position: absolute !important;
        top: -38px !important;
        left: 12px !important;
        z-index: 5 !important;
        width: 56px !important;
        height: 56px !important;
        border: 3px solid #fff !important;
        border-radius: 12px !important;
        background: #fff !important;
        box-shadow: 0 3px 12px rgba(15, 23, 42, .18) !important;
    }
    .rf-hero__mobile-logo img,
    .rf-hero__mobile-logo span {
        border-radius: 9px !important;
        object-fit: cover !important;
    }
    .rf-hero__mobile-copy {
        grid-column: 1 !important;
        grid-row: 1 !important;
        min-width: 0 !important;
        padding-left: 0 !important;
    }
    .rf-hero__mobile-title {
        display: block !important;
        color: #171717 !important;
        font-size: clamp(1.15rem, 5.5vw, 1.5rem) !important;
        font-weight: 800 !important;
        line-height: 1.15 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }
    .rf-hero__mobile-rating { margin-top: 4px !important; }
    .rf-hero__mobile-actions {
        position: static !important;
        grid-column: 1 / -1 !important;
        grid-row: 2 !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
    }
}