:root {
    --brand: #e51b12;
    --brand-dark: #a90f0a;
    --brand-black: #15110f;
    --brand-gold: #c99a2e;
    --gold-soft: #fff4d6;
    --ink: #181512;
    --muted: #6f675d;
    --paper: #fffaf0;
    --surface: #ffffff;
    --line: #eadfce;
    --line-strong: #d9c39b;
    --shadow-soft: 0 10px 28px rgba(21, 17, 15, .07);
    --shadow-lift: 0 18px 42px rgba(21, 17, 15, .12);
}

/* V1.1 customer reservation redesign: dark, mobile-first, three-step booking flow. */
body.reservation-body {
    background: #080706 !important;
    color: #f7efe6;
}

body.reservation-body main {
    background:
        radial-gradient(circle at 18% 0%, rgba(176, 18, 28, .2), transparent 34%),
        linear-gradient(180deg, #100f0d 0%, #080706 42%, #070604 100%) !important;
}

body.reservation-body [hidden] {
    display: none !important;
}

.reservation-body .reservation-page {
    min-height: calc(100vh - 68px);
    padding: 26px 0 70px !important;
    color: #f7efe6;
}

.reservation-body .reservation-page > .container-xxl {
    max-width: 1180px !important;
}

.reservation-body .reservation-hero {
    margin-bottom: 18px !important;
}

.reservation-body .reservation-hero .reservation-title-icon {
    width: 40px !important;
    height: 40px !important;
    border: 1px solid rgba(227, 27, 47, .38);
    background: rgba(227, 27, 47, .13) !important;
    color: #ff3347 !important;
}

.reservation-body .reservation-hero .eyebrow {
    color: rgba(247, 239, 230, .58) !important;
    font-size: .75rem !important;
    letter-spacing: .12em !important;
}

.reservation-body .reservation-hero h1 {
    color: #fff9f0 !important;
    font-size: clamp(1.7rem, 4vw, 2.55rem) !important;
    line-height: 1.05 !important;
    letter-spacing: 0 !important;
}

.reservation-body .reservation-layout {
    grid-template-columns: minmax(0, 1fr) 286px !important;
    gap: 18px !important;
    align-items: flex-start;
}

.reservation-body .reservation-form-card,
.reservation-body .reservation-mini-card,
.reservation-body .reservation-history-card {
    border: 1px solid rgba(255, 255, 255, .1) !important;
    background: rgba(18, 17, 16, .92) !important;
    color: #f7efe6 !important;
    box-shadow: 0 22px 60px rgba(0, 0, 0, .32) !important;
    backdrop-filter: blur(14px);
}

.reservation-body .reservation-form-card {
    position: relative;
    overflow: hidden;
    padding: 18px !important;
    border-radius: 24px !important;
}

.reservation-body .reservation-form-card::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(135deg, rgba(255, 255, 255, .07), transparent 34%);
}

.reservation-body .reservation-form-card > * {
    position: relative;
    z-index: 1;
}

.reservation-body .reservation-booking-head {
    align-items: center !important;
    margin-bottom: 16px !important;
    padding: 0 !important;
    border: 0 !important;
}

.reservation-body .reservation-booking-head .reservation-title-icon {
    width: 34px !important;
    height: 34px !important;
    background: rgba(227, 27, 47, .14) !important;
    color: #ff3347 !important;
}

.reservation-body .reservation-booking-head h2,
.reservation-body .reservation-step-heading h2 {
    margin: 0 !important;
    color: #fff9f0 !important;
    font-size: clamp(1.35rem, 3vw, 2rem) !important;
    line-height: 1.08 !important;
    letter-spacing: 0 !important;
}

.reservation-body .reservation-confirm-pill {
    min-height: 36px !important;
    padding: 8px 12px !important;
    border: 1px solid rgba(227, 27, 47, .28) !important;
    background: rgba(227, 27, 47, .1) !important;
    color: #ffced4 !important;
    font-size: .82rem !important;
    box-shadow: none !important;
}

.reservation-body .reservation-confirm-pill i {
    color: #ff3347 !important;
}

.reservation-lux-progress {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 14px;
}

.reservation-lux-progress button {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 42px;
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 999px;
    background: rgba(255, 255, 255, .045);
    color: rgba(247, 239, 230, .64);
    font-size: .84rem;
    font-weight: 650;
}

.reservation-lux-progress i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .08);
    color: inherit;
    font-style: normal;
    font-size: .76rem;
}

.reservation-lux-progress button.is-active {
    border-color: rgba(227, 27, 47, .72);
    background: #df1727;
    color: #fff;
}

.reservation-lux-progress button.is-complete {
    color: #fff5e8;
    border-color: rgba(255, 255, 255, .16);
}

.reservation-lux-progress button.is-complete i {
    font-size: 0;
}

.reservation-lux-progress button.is-complete i::before {
    content: "✓";
    font-size: .8rem;
}

.reservation-step-heading {
    display: none;
    margin-bottom: 14px;
}

.reservation-step-heading.is-active {
    display: block;
}

.reservation-form-card[data-current-step="1"] [data-step-panel]:not([data-step-panel="1"]),
.reservation-form-card[data-current-step="2"] [data-step-panel]:not([data-step-panel="2"]),
.reservation-form-card[data-current-step="3"] [data-step-panel]:not([data-step-panel="3"]) {
    display: none !important;
}

.reservation-body .reservation-form-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 14px !important;
}

.reservation-body .reservation-wide-field,
.reservation-body .reservation-step-actions,
.reservation-body .reservation-final-summary {
    grid-column: 1 / -1;
}

.reservation-body .reservation-step-logic,
.reservation-body .reservation-compact-utility {
    display: none !important;
}

.reservation-body .reservation-form-card .form-label {
    margin-bottom: 7px !important;
    color: rgba(247, 239, 230, .78) !important;
    font-size: .84rem !important;
    font-weight: 550 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}

.reservation-body .reservation-control-shell {
    min-height: 58px !important;
    border: 1px solid rgba(255, 255, 255, .14) !important;
    border-radius: 16px !important;
    background: rgba(255, 255, 255, .07) !important;
    box-shadow: none !important;
}

.reservation-body .reservation-control-icon {
    color: rgba(255, 255, 255, .76) !important;
}

.reservation-body .reservation-form-card .form-control,
.reservation-body .reservation-form-card .form-select {
    min-height: 58px !important;
    border: 1px solid rgba(255, 255, 255, .14) !important;
    border-radius: 16px !important;
    background-color: rgba(255, 255, 255, .07) !important;
    color: #fff9f0 !important;
    font-size: 1rem !important;
    box-shadow: none !important;
}

.reservation-body .reservation-control-shell .form-control,
.reservation-body .reservation-control-shell .form-select {
    border: 0 !important;
    background-color: transparent !important;
}

.reservation-body .reservation-form-card .form-control::placeholder {
    color: rgba(247, 239, 230, .42) !important;
}

.reservation-body .reservation-form-card .form-control:focus,
.reservation-body .reservation-form-card .form-select:focus,
.reservation-body .reservation-control-shell:focus-within {
    border-color: rgba(227, 27, 47, .74) !important;
    box-shadow: 0 0 0 4px rgba(227, 27, 47, .13) !important;
}

.reservation-body .reservation-flow-primary,
.reservation-body .reservation-submit,
.reservation-body .reservation-sticky-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 54px;
    border: 0;
    border-radius: 999px;
    background: #df1727 !important;
    color: #fff !important;
    font-size: 1rem;
    font-weight: 750 !important;
    text-decoration: none;
    box-shadow: 0 16px 34px rgba(223, 23, 39, .28);
}

.reservation-body .reservation-flow-primary:hover,
.reservation-body .reservation-submit:hover,
.reservation-body .reservation-sticky-cta:hover {
    background: #f01e30 !important;
}

.reservation-body .reservation-flow-secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 54px;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 999px;
    background: rgba(255, 255, 255, .06);
    color: #fff9f0;
    font-size: 1rem;
    font-weight: 650;
}

.reservation-body .reservation-step-actions {
    display: grid;
    grid-template-columns: 140px minmax(0, 1fr);
    gap: 10px;
    margin-top: 2px;
}

.reservation-body .reservation-form-card[data-current-step="1"] .reservation-step-actions {
    grid-template-columns: 1fr;
}

.reservation-body .reservation-submit-row {
    margin-top: 16px;
}

.reservation-body .reservation-availability-panel {
    padding: 14px 16px !important;
    border: 1px solid rgba(255, 255, 255, .1) !important;
    border-radius: 18px !important;
    background: rgba(255, 255, 255, .045) !important;
    box-shadow: none !important;
}

.reservation-body .reservation-availability-panel > .reservation-inline-icon {
    width: 32px !important;
    height: 32px !important;
    background: rgba(54, 175, 103, .14) !important;
    color: #4ee28d !important;
}

.reservation-body .reservation-availability-panel strong {
    display: none !important;
}

.reservation-body .reservation-availability-panel h3 {
    margin: 0 !important;
    color: #fff9f0 !important;
    font-size: 1rem !important;
    font-weight: 650 !important;
}

.reservation-body .reservation-floor-map {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.reservation-body .reservation-floor-map-head {
    margin-bottom: 10px;
    padding: 0 !important;
}

.reservation-body .reservation-floor-map-head .reservation-title-icon {
    display: none !important;
}

.reservation-body .reservation-floor-map-head h3,
.reservation-body .reservation-option-head h3 {
    color: #fff9f0 !important;
    font-size: 1rem !important;
    font-weight: 700 !important;
}

.reservation-body .reservation-map-actions {
    gap: 9px !important;
}

.reservation-body .reservation-map-legend {
    color: rgba(247, 239, 230, .66) !important;
    font-size: .78rem !important;
}

.reservation-body .reservation-floor-map-head .btn,
.reservation-body .reservation-map-actions .btn {
    min-height: 38px;
    border-color: rgba(255, 255, 255, .18) !important;
    border-radius: 999px;
    background: rgba(255, 255, 255, .06) !important;
    color: #fff9f0 !important;
    box-shadow: none !important;
}

.reservation-body .reservation-map-stage {
    border: 1px solid rgba(255, 255, 255, .1) !important;
    border-radius: 18px !important;
    background: #0c0b0a !important;
    box-shadow: none !important;
}

.reservation-body .reservation-map-stage.is-floor {
    width: min(100%, 860px) !important;
}

.reservation-body .reservation-map-hotspot {
    box-shadow: 0 0 0 1px rgba(255, 255, 255, .16), 0 10px 24px rgba(0, 0, 0, .28) !important;
}

.reservation-body .reservation-map-hotspot.is-selected {
    box-shadow: 0 0 0 3px #df1727, 0 0 28px rgba(223, 23, 39, .58) !important;
}

.reservation-body .reservation-table-policy {
    margin-bottom: 10px !important;
    padding: 10px 12px !important;
    border: 1px solid rgba(255, 255, 255, .1) !important;
    border-radius: 14px !important;
    background: rgba(255, 255, 255, .045) !important;
    color: rgba(247, 239, 230, .7) !important;
    font-size: .82rem !important;
}

.reservation-body .reservation-option-section {
    margin-top: 12px !important;
}

.reservation-body .reservation-option-head {
    margin-bottom: 10px !important;
    padding: 0 !important;
    border: 0 !important;
}

.reservation-body .reservation-option-head > span {
    display: none !important;
}

.reservation-body .reservation-table-picker {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px !important;
}

.reservation-body .reservation-table-choice {
    min-height: 92px !important;
    padding: 14px !important;
    border: 1px solid rgba(255, 255, 255, .12) !important;
    border-radius: 18px !important;
    background: rgba(255, 255, 255, .055) !important;
    color: #fff9f0 !important;
    box-shadow: none !important;
    transition: border-color .18s ease, background-color .18s ease, transform .18s ease;
}

.reservation-body .reservation-table-choice:hover {
    transform: translateY(-1px);
    border-color: rgba(255, 255, 255, .28) !important;
}

.reservation-body .reservation-table-choice:has(input:checked) {
    border-color: #df1727 !important;
    background: rgba(223, 23, 39, .16) !important;
    box-shadow: inset 0 0 0 1px rgba(223, 23, 39, .46) !important;
}

.reservation-body .reservation-table-choice.is-booked,
.reservation-body .reservation-table-choice.is-too-small {
    opacity: .42;
}

.reservation-body .reservation-table-choice input {
    accent-color: #df1727;
}

.reservation-body .reservation-table-main strong {
    color: #fff9f0 !important;
    font-size: 1rem !important;
    font-weight: 700 !important;
}

.reservation-body .reservation-table-main small,
.reservation-body .reservation-table-meta small,
.reservation-body .reservation-table-choice em {
    color: rgba(247, 239, 230, .64) !important;
    font-size: .8rem !important;
    font-weight: 500 !important;
}

.reservation-body .reservation-table-tier {
    border: 0 !important;
    background: rgba(196, 156, 77, .13) !important;
    color: #e7c884 !important;
}

.reservation-body .reservation-stay-notice {
    border-color: rgba(196, 156, 77, .22) !important;
    background: rgba(196, 156, 77, .1) !important;
    color: #f4d99a !important;
}

.reservation-body .reservation-final-summary {
    padding: 14px !important;
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 18px;
    background: rgba(255, 255, 255, .045);
}

.reservation-body .reservation-final-summary > span {
    display: block;
    margin-bottom: 10px;
    color: rgba(247, 239, 230, .62);
    font-size: .78rem;
    font-weight: 650;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.reservation-body .reservation-final-summary dl {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin: 0;
}

.reservation-body .reservation-final-summary div {
    min-width: 0;
}

.reservation-body .reservation-final-summary dt {
    color: rgba(247, 239, 230, .54);
    font-size: .75rem;
    font-weight: 500;
}

.reservation-body .reservation-final-summary dd {
    margin: 2px 0 0;
    color: #fff9f0;
    font-size: .94rem;
    font-weight: 650;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.reservation-body .reservation-special-card {
    padding: 14px !important;
    border: 1px solid rgba(255, 255, 255, .1) !important;
    border-radius: 18px !important;
    background: rgba(255, 255, 255, .045) !important;
}

.reservation-body .reservation-special-card-head strong {
    color: #fff9f0 !important;
}

.reservation-body .reservation-special-card-head small {
    color: rgba(247, 239, 230, .56) !important;
}

.reservation-body .reservation-occasion-option {
    border-color: rgba(255, 255, 255, .12) !important;
    background: rgba(255, 255, 255, .055) !important;
    color: #fff9f0 !important;
}

.reservation-body .reservation-occasion-option:has(input:checked) {
    border-color: rgba(227, 27, 47, .72) !important;
    background: rgba(227, 27, 47, .14) !important;
}

.reservation-body .reservation-side-panel {
    position: sticky;
    top: 82px;
    display: grid;
    gap: 14px;
}

.reservation-body .reservation-mini-card,
.reservation-body .reservation-history-card {
    padding: 15px !important;
    border-radius: 20px !important;
}

.reservation-body .reservation-card-heading .reservation-title-icon {
    width: 34px !important;
    height: 34px !important;
    background: rgba(255, 255, 255, .07) !important;
    color: #e7c884 !important;
}

.reservation-body .reservation-mini-card .eyebrow,
.reservation-body .reservation-history-card summary span {
    color: rgba(247, 239, 230, .54) !important;
}

.reservation-body .reservation-mini-card h2,
.reservation-body .reservation-empty-bookings strong {
    color: #fff9f0 !important;
    font-size: 1.08rem !important;
}

.reservation-body .reservation-hours-row,
.reservation-body .reservation-active-list div {
    border-color: rgba(255, 255, 255, .1) !important;
}

.reservation-body .reservation-hours-row span,
.reservation-body .reservation-hours-row strong,
.reservation-body .reservation-hours-card small,
.reservation-body .reservation-active-list span,
.reservation-body .reservation-empty-bookings span,
.reservation-body .reservation-history-list span,
.reservation-body .reservation-history-list em {
    color: rgba(247, 239, 230, .66) !important;
}

.reservation-body .reservation-active-list strong {
    color: #fff9f0 !important;
}

.reservation-body .reservation-active-table-chips i,
.reservation-body .reservation-active-table-chips small {
    border-color: rgba(255, 255, 255, .12) !important;
    background: rgba(255, 255, 255, .06) !important;
    color: #f3d488 !important;
}

.reservation-body .reservation-booking-links a,
.reservation-body .reservation-danger-link {
    border: 1px solid rgba(255, 255, 255, .14) !important;
    background: rgba(255, 255, 255, .08) !important;
    color: #fff9f0 !important;
}

.reservation-body .reservation-danger-link {
    color: #ffb8bf !important;
}

.reservation-body .reservation-history-card summary {
    color: #fff9f0 !important;
}

.reservation-body .reservation-sticky-cta {
    display: none;
}

.reservation-body .reservation-calendar-dialog,
.reservation-body .reservation-map-dialog {
    border-color: rgba(255, 255, 255, .12) !important;
    background: #11100e !important;
    color: #fff9f0 !important;
}

@media (max-width: 991.98px) {
    .reservation-body .reservation-layout {
        grid-template-columns: 1fr !important;
    }

    .reservation-body .reservation-side-panel {
        position: static;
    }
}

@media (max-width: 767.98px) {
    body.reservation-body main {
        padding-bottom: 86px;
    }

    .reservation-body .reservation-page {
        padding: 14px 0 36px !important;
    }

    .reservation-body .reservation-page > .container-xxl {
        padding-inline: 12px !important;
    }

    .reservation-body .reservation-hero {
        margin-bottom: 12px !important;
    }

    .reservation-body .reservation-hero .reservation-title-icon {
        display: none !important;
    }

    .reservation-body .reservation-hero h1 {
        font-size: 1.72rem !important;
    }

    .reservation-body .reservation-form-card {
        padding: 14px !important;
        border-radius: 22px !important;
    }

    .reservation-body .reservation-booking-head {
        gap: 10px !important;
    }

    .reservation-body .reservation-booking-head .reservation-title-icon,
    .reservation-body .reservation-confirm-pill {
        display: none !important;
    }

    .reservation-lux-progress {
        gap: 6px;
        margin-bottom: 12px;
    }

    .reservation-lux-progress button {
        min-height: 38px;
        padding: 0 8px;
        font-size: .78rem;
    }

    .reservation-lux-progress i {
        width: 20px;
        height: 20px;
    }

    .reservation-body .reservation-form-grid {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }

    .reservation-body .reservation-control-shell,
    .reservation-body .reservation-form-card .form-control,
    .reservation-body .reservation-form-card .form-select {
        min-height: 56px !important;
        border-radius: 15px !important;
    }

    .reservation-body .reservation-step-actions {
        grid-template-columns: 1fr;
    }

    .reservation-body .reservation-step-actions [data-reservation-next],
    .reservation-body .reservation-submit-row .reservation-submit,
    .reservation-body .reservation-form-card[data-current-step="1"] .reservation-step-actions {
        display: none !important;
    }

    .reservation-body .reservation-step-actions .reservation-flow-secondary {
        order: 2;
    }

    .reservation-body .reservation-table-picker {
        grid-template-columns: 1fr;
    }

    .reservation-body .reservation-floor-map-head {
        display: grid !important;
        grid-template-columns: 1fr auto;
        align-items: center !important;
        gap: 8px !important;
    }

    .reservation-body .reservation-map-legend {
        display: none !important;
    }

    .reservation-body .reservation-map-stage.is-floor {
        width: 100% !important;
    }

    .reservation-body .reservation-final-summary dl {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .reservation-body .reservation-side-panel {
        gap: 12px;
    }

    .reservation-body .reservation-hours-card,
    .reservation-body .reservation-history-card {
        display: none !important;
    }

    .reservation-body .reservation-sticky-cta {
        position: fixed;
        z-index: 1040;
        left: 12px;
        right: 12px;
        bottom: 14px;
        display: inline-flex;
        width: calc(100% - 24px);
    }
}

@media (max-width: 430px) {
    .reservation-lux-progress button span {
        display: none;
    }

    .reservation-lux-progress button {
        gap: 0;
    }

    .reservation-body .reservation-final-summary dl {
        grid-template-columns: 1fr;
    }
}

/* Premium direct ordering experience */
:root {
    --lux-red: #d71920;
    --lux-red-dark: #a91118;
    --lux-black: #101010;
    --lux-ink: #1c1a18;
    --lux-muted: #74706b;
    --lux-soft: #faf8f4;
    --lux-white: #ffffff;
    --lux-line: #ebe6dd;
    --lux-line-strong: #ded6ca;
    --lux-gold: #b99650;
    --lux-shadow-card: 0 14px 40px rgba(20, 18, 16, .08);
    --lux-shadow-lift: 0 22px 52px rgba(20, 18, 16, .14);
}

body {
    background:
        linear-gradient(180deg, #fff 0, #fbfaf7 280px, var(--lux-soft) 100%);
    color: var(--lux-ink);
}

.site-navbar {
    min-height: 68px;
    background: rgba(255, 255, 255, .96) !important;
    border-bottom: 1px solid rgba(16, 16, 16, .07);
    box-shadow: 0 8px 24px rgba(16, 16, 16, .055);
    backdrop-filter: blur(18px);
}

.site-navbar .container {
    max-width: 1220px;
}

.brand-logo {
    width: min(184px, 42vw);
}

.nav-link {
    color: var(--lux-black);
    font-size: .95rem;
    font-weight: 800;
}

.nav-link:hover,
.nav-link:focus,
.nav-link.active {
    color: var(--lux-black);
}

.track-order-nav {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 10px;
    border: 1px solid transparent;
    border-radius: 12px;
    line-height: 1;
    white-space: nowrap;
}

.track-order-nav > span {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #cfc8bc;
}

.track-order-nav.is-disabled {
    color: #a19a90;
    cursor: default;
    opacity: .72;
}

.track-order-nav.is-live {
    color: var(--lux-red);
    border-color: rgba(215, 25, 32, .16);
    background: #fff7f6;
    box-shadow: 0 10px 22px rgba(215, 25, 32, .1);
}

.track-order-nav.is-live > span {
    background: var(--lux-red);
    box-shadow: 0 0 0 0 rgba(215, 25, 32, .48);
    animation: trackOrderPulse 1.35s ease-out infinite;
}

.track-order-nav.is-live:hover,
.track-order-nav.is-live:focus,
.track-order-nav.is-live.active {
    color: var(--lux-red);
    border-color: rgba(215, 25, 32, .28);
    background: #fff1ef;
}

.track-order-dropdown .track-order-nav {
    border: 1px solid rgba(215, 25, 32, .16);
}

.track-order-menu {
    min-width: 240px;
    border: 1px solid rgba(16, 16, 16, .08);
    border-radius: 14px;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(16, 16, 16, .12);
}

.track-order-menu-item {
    display: grid;
    gap: 2px;
    border-radius: 10px;
    padding: 9px 10px;
}

.track-order-menu-item strong {
    color: var(--lux-black);
    font-size: .9rem;
}

.track-order-menu-item small {
    color: var(--lux-muted);
    font-size: .78rem;
    font-weight: 600;
}

@keyframes trackOrderPulse {
    0% {
        box-shadow: 0 0 0 0 rgba(215, 25, 32, .42);
    }
    70% {
        box-shadow: 0 0 0 7px rgba(215, 25, 32, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(215, 25, 32, 0);
    }
}

@media (max-width: 767px) {
    .site-navbar {
        min-height: 58px;
    }

    .site-navbar .container {
        padding-right: 10px;
        padding-left: 10px;
    }

    .brand-logo {
        width: min(138px, 33vw);
    }

    .header-actions {
        gap: 6px !important;
    }

    .header-actions .nav-link {
        font-size: .78rem;
    }

    .track-order-nav {
        padding: 6px 7px;
        gap: 5px;
    }

    .auth-nav-login,
    .header-signup-btn,
    .logged-in-pill {
        display: none !important;
    }
}

.header-cart-btn,
.nav-cart-btn,
.btn-brand {
    --bs-btn-bg: var(--lux-red);
    --bs-btn-border-color: var(--lux-red);
    --bs-btn-hover-bg: var(--lux-red-dark);
    --bs-btn-hover-border-color: var(--lux-red-dark);
    border-radius: 999px;
    box-shadow: 0 12px 24px rgba(215, 25, 32, .18);
}

.premium-order-page {
    padding: 24px 0 56px;
}

.premium-order-page .container-xxl {
    max-width: 1220px;
}

.order-hero {
    display: grid;
    grid-template-columns: minmax(260px, .72fr) minmax(320px, 1fr);
    align-items: end;
    gap: 32px;
    padding: 30px 0 24px;
}

.order-hero-copy .eyebrow {
    color: var(--lux-gold);
    font-size: .72rem;
    letter-spacing: .16em;
}

.order-hero-copy h1 {
    margin: 0;
    color: var(--lux-black);
    font-size: clamp(2rem, 4vw, 3.2rem);
    line-height: 1.02;
    font-weight: 900;
    letter-spacing: 0;
}

.order-hero-copy p:last-child {
    margin: 12px 0 0;
    color: var(--lux-muted);
    font-size: 1rem;
}

.order-search-wrap {
    position: relative;
}

.order-search-wrap::before {
    content: "";
    position: absolute;
    left: 22px;
    top: 50%;
    z-index: 1;
    width: 15px;
    height: 15px;
    border: 2px solid #8c8780;
    border-radius: 50%;
    transform: translateY(-58%);
    pointer-events: none;
}

.order-search-wrap::after {
    content: "";
    position: absolute;
    left: 35px;
    top: 50%;
    z-index: 1;
    width: 7px;
    height: 2px;
    background: #8c8780;
    transform: translateY(5px) rotate(45deg);
    transform-origin: left center;
    pointer-events: none;
}

.order-search {
    min-height: 60px;
    border: 1px solid var(--lux-line-strong);
    border-radius: 999px;
    background: var(--lux-white);
    padding: 0 24px 0 52px;
    color: var(--lux-black);
    font-size: 1rem;
    font-weight: 650;
    box-shadow: 0 16px 44px rgba(16, 16, 16, .08);
}

.order-search:focus {
    border-color: rgba(215, 25, 32, .72);
    box-shadow: 0 0 0 .18rem rgba(215, 25, 32, .1), 0 18px 48px rgba(16, 16, 16, .1);
}

.order-search::placeholder {
    color: #918b83;
    font-weight: 500;
}

.premium-category-tabs {
    top: 68px;
    z-index: 20;
    display: flex;
    gap: 10px;
    margin: 0 -2px 24px;
    padding: 12px 2px;
    overflow-x: auto;
    border-bottom: 0;
    background: rgba(250, 248, 244, .92);
    backdrop-filter: blur(18px);
    scrollbar-width: none;
}

.premium-category-tabs::-webkit-scrollbar {
    display: none;
}

.category-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 0 18px;
    border: 1px solid var(--lux-line-strong);
    border-radius: 999px;
    background: var(--lux-white);
    color: var(--lux-black);
    font-size: .92rem;
    font-weight: 800;
    text-decoration: none;
    white-space: nowrap;
    box-shadow: 0 8px 18px rgba(16, 16, 16, .04);
    transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease, border-color .18s ease;
}

.category-pill:hover,
.category-pill:focus {
    color: var(--lux-black);
    transform: translateY(-1px);
    border-color: #c8c0b4;
    box-shadow: 0 12px 24px rgba(16, 16, 16, .08);
}

.category-pill.active {
    color: #fff;
    background: var(--lux-red);
    border-color: var(--lux-red);
    box-shadow: 0 14px 28px rgba(215, 25, 32, .18);
}

.order-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 32px;
    align-items: start;
}

.premium-menu-category {
    scroll-margin-top: 148px;
    margin-bottom: 32px;
}

.premium-category-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 24px;
    padding: 0 0 16px;
    margin-bottom: 16px;
    border-bottom: 1px solid var(--lux-line);
}

.premium-category-heading h2 {
    margin: 0;
    color: var(--lux-black);
    font-size: 1.2rem;
    line-height: 1.2;
    font-weight: 900;
}

.premium-category-heading p {
    margin: 6px 0 0;
    color: var(--lux-muted);
    font-size: .94rem;
}

.premium-category-heading > span {
    color: var(--lux-muted);
    font-size: .86rem;
    font-weight: 700;
    white-space: nowrap;
}

.premium-product-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 24px;
}

.product-card {
    display: flex;
    min-width: 0;
    flex-direction: column;
    overflow: hidden;
    background: var(--lux-white);
    border: 1px solid rgba(16, 16, 16, .055);
    border-radius: 16px;
    box-shadow: var(--lux-shadow-card);
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.product-card:hover {
    transform: translateY(-4px);
    border-color: rgba(185, 150, 80, .36);
    box-shadow: var(--lux-shadow-lift);
}

.product-image-shell {
    position: relative;
    display: grid;
    min-height: 166px;
    place-items: center;
    overflow: hidden;
    background:
        radial-gradient(circle at 72% 22%, rgba(185, 150, 80, .2), transparent 30%),
        linear-gradient(135deg, #f8f5ee 0%, #eee7dc 48%, #fff 100%);
}

.product-image-shell::after {
    content: "";
    position: absolute;
    inset: auto 24px 18px;
    height: 10px;
    border-radius: 999px;
    background: rgba(16, 16, 16, .08);
    filter: blur(8px);
}

.product-image-shell.has-image img {
    width: 100%;
    height: 100%;
    min-height: 166px;
    object-fit: cover;
}

.product-image-mark {
    position: relative;
    z-index: 1;
    display: grid;
    width: 86px;
    height: 86px;
    place-items: center;
    border: 1px solid rgba(185, 150, 80, .34);
    border-radius: 50%;
    background: rgba(255, 255, 255, .68);
    color: var(--lux-black);
    font-size: 1.05rem;
    font-weight: 900;
    letter-spacing: .08em;
    box-shadow: inset 0 0 0 10px rgba(255, 255, 255, .34);
}

.dish-badge {
    position: absolute;
    top: 14px;
    left: 14px;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0 10px;
    border: 1px solid rgba(185, 150, 80, .34);
    border-radius: 999px;
    background: rgba(255, 255, 255, .9);
    color: #7c622a;
    font-size: .74rem;
    font-weight: 850;
    letter-spacing: .01em;
    backdrop-filter: blur(12px);
}

.product-content {
    display: flex;
    min-height: 168px;
    flex: 1;
    flex-direction: column;
    padding: 18px;
}

.product-content h3 {
    margin: 0;
    color: var(--lux-black);
    font-size: 1.02rem;
    line-height: 1.26;
    font-weight: 900;
    letter-spacing: 0;
}

.product-content p {
    display: -webkit-box;
    min-height: 42px;
    margin: 8px 0 18px;
    overflow: hidden;
    color: var(--lux-muted);
    font-size: .92rem;
    line-height: 1.5;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.product-card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-top: auto;
}

.food-price {
    color: var(--lux-black);
    font-size: 1.02rem;
    line-height: 1;
    font-weight: 900;
    white-space: nowrap;
}

.premium-qty-stepper {
    display: inline-grid;
    width: auto;
    grid-template-columns: 38px 42px 38px;
    overflow: hidden;
    border: 1px solid var(--lux-line-strong);
    border-radius: 999px;
    background: var(--lux-white);
}

.premium-qty-stepper .qty-button,
.premium-qty-stepper .qty-value {
    width: auto;
    min-height: 38px;
}

.premium-qty-stepper .qty-button {
    border: 0;
    background: #fff;
    color: var(--lux-black);
    font-size: 1.05rem;
    font-weight: 900;
}

.premium-qty-stepper .qty-button.plus {
    background: var(--lux-red);
    color: #fff;
}

.premium-qty-stepper .qty-button.plus:hover,
.premium-qty-stepper .qty-button.plus:focus {
    background: var(--lux-red-dark);
}

.premium-qty-stepper .qty-button:disabled {
    color: #b7b1aa;
    background: #f7f5f1;
}

.premium-qty-stepper .qty-value {
    display: grid;
    place-items: center;
    border-inline: 1px solid var(--lux-line);
    color: var(--lux-black);
    font-size: .92rem;
    font-weight: 900;
}

.order-sidebar {
    position: sticky;
    top: 108px;
}

.premium-cart-card {
    background: rgba(255, 255, 255, .96);
    border: 1px solid rgba(16, 16, 16, .07);
    border-radius: 18px;
    box-shadow: 0 20px 52px rgba(16, 16, 16, .11);
    padding: 24px;
    backdrop-filter: blur(18px);
}

.premium-cart-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 22px;
}

.premium-cart-header h2 {
    margin: 0;
    color: var(--lux-black);
    font-size: 1.12rem;
    line-height: 1.2;
    font-weight: 900;
}

.cart-count-pill {
    background: #fffaf0;
    border: 1px solid rgba(185, 150, 80, .32);
    color: #7c622a;
    border-radius: 999px;
    padding: 7px 11px;
    font-size: .78rem;
    font-weight: 850;
}

.premium-cart-empty {
    display: grid;
    place-items: center;
    padding: 28px 14px 18px;
    text-align: center;
}

.empty-cart-icon {
    display: grid;
    width: 48px;
    height: 48px;
    margin-bottom: 14px;
    place-items: center;
    border: 1px solid var(--lux-line);
    border-radius: 50%;
    color: var(--lux-muted);
    font-size: 1.6rem;
    font-weight: 400;
}

.premium-cart-empty p {
    margin: 0;
    color: var(--lux-black);
    font-weight: 900;
}

.premium-cart-empty small {
    display: block;
    margin-top: 5px;
    color: var(--lux-muted);
}

.menu-cart-items {
    display: grid;
    max-height: 300px;
    gap: 12px;
    margin-bottom: 20px;
    overflow-y: auto;
    padding-right: 4px;
}

.menu-cart-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: start;
    color: var(--lux-muted);
    font-size: .93rem;
    line-height: 1.4;
}

.menu-cart-item span {
    min-width: 0;
}

.menu-cart-item strong {
    color: var(--lux-black);
    font-weight: 900;
    white-space: nowrap;
}

.menu-cart-totals {
    display: grid;
    gap: 12px;
    padding: 18px 0;
    margin-bottom: 18px;
    border-top: 1px solid var(--lux-line);
    border-bottom: 1px solid var(--lux-line);
}

.menu-cart-totals > div {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    color: var(--lux-muted);
}

.menu-cart-totals strong {
    color: var(--lux-black);
}

.menu-cart-totals .total {
    margin-top: 4px;
    padding-top: 14px;
    border-top: 1px solid var(--lux-line);
    color: var(--lux-black);
    font-size: 1.08rem;
    font-weight: 900;
}

.premium-checkout-btn,
.premium-review-btn {
    min-height: 48px;
    border-radius: 999px;
    font-weight: 900;
}

.premium-review-btn {
    margin-top: 10px;
    border-color: var(--lux-line-strong);
    color: var(--lux-black);
}

.secure-checkout-note {
    margin: 14px 0 0;
    color: var(--lux-muted);
    font-size: .82rem;
    text-align: center;
}

.mobile-cart-drawer {
    position: fixed;
    inset: 0;
    z-index: 1080;
    visibility: hidden;
    pointer-events: none;
}

.mobile-cart-drawer.is-open {
    visibility: visible;
    pointer-events: auto;
}

.mobile-cart-backdrop {
    position: absolute;
    inset: 0;
    border: 0;
    background: rgba(16, 16, 16, .38);
    opacity: 0;
    transition: opacity .2s ease;
}

.mobile-cart-drawer.is-open .mobile-cart-backdrop {
    opacity: 1;
}

.mobile-cart-panel {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    max-height: min(78vh, 680px);
    overflow-y: auto;
    border-radius: 24px 24px 0 0;
    background: #fff;
    box-shadow: 0 -24px 60px rgba(16, 16, 16, .22);
    padding: 10px 20px calc(22px + env(safe-area-inset-bottom));
    transform: translateY(100%);
    transition: transform .24s ease;
}

.mobile-cart-drawer.is-open .mobile-cart-panel {
    transform: translateY(0);
}

.mobile-cart-handle {
    width: 44px;
    height: 5px;
    margin: 4px auto 18px;
    border-radius: 999px;
    background: #ddd7ce;
}

.mobile-cart-close {
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border: 1px solid var(--lux-line);
    border-radius: 50%;
    background: #fff;
    color: var(--lux-black);
    font-size: 1.4rem;
    line-height: 1;
}

.mobile-cart-open {
    overflow: hidden;
}

@media (min-width: 1200px) {
    .premium-product-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (min-width: 1500px) {
    .premium-order-page .container-xxl {
        max-width: 1380px;
    }

    .premium-product-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (max-width: 991.98px) {
    .order-hero {
        grid-template-columns: 1fr;
        gap: 20px;
        padding-top: 20px;
    }

    .order-layout {
        display: block;
    }

    .premium-product-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    body {
        padding-bottom: 78px;
    }

    .site-navbar {
        min-height: 60px;
    }

    .brand-logo {
        width: min(152px, 58vw);
    }

    .premium-order-page {
        padding-top: 0;
    }

    .order-hero {
        gap: 16px;
        padding: 18px 0 14px;
    }

    .order-hero-copy .eyebrow {
        margin-bottom: 8px !important;
        font-size: .66rem;
    }

    .order-hero-copy h1 {
        font-size: 2rem;
    }

    .order-hero-copy p:last-child {
        margin-top: 8px;
        font-size: .9rem;
    }

    .order-search {
        width: 100%;
        min-height: 52px;
        padding-left: 50px;
        font-size: .94rem;
    }

    .premium-category-tabs {
        top: 60px;
        margin-bottom: 18px !important;
        padding: 10px 0 12px;
    }

    .category-pill {
        min-height: 40px;
        padding-inline: 16px;
        font-size: .88rem;
    }

    .premium-menu-category {
        scroll-margin-top: 118px;
        margin-bottom: 28px !important;
    }

    .premium-category-heading {
        align-items: flex-start;
        padding-bottom: 12px;
        margin-bottom: 14px;
    }

    .premium-category-heading h2 {
        font-size: 1.1rem;
    }

    .premium-category-heading p {
        font-size: .88rem;
    }

    .premium-product-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .product-card {
        display: flex;
        grid-template-columns: none;
        border-radius: 14px;
    }

    .product-image-shell {
        min-height: 150px;
        aspect-ratio: auto;
    }

    .product-image-shell.has-image img {
        min-height: 150px;
    }

    .product-image-mark {
        width: 62px;
        height: 62px;
        font-size: .86rem;
    }

    .dish-badge {
        top: 10px;
        left: 10px;
        min-height: 24px;
        padding-inline: 8px;
        font-size: .66rem;
    }

    .product-content {
        min-height: 146px;
        padding: 14px;
    }

    .product-content h3 {
        font-size: .98rem;
    }

    .product-content p {
        min-height: 38px;
        margin: 6px 0 14px;
        font-size: .86rem;
        line-height: 1.4;
    }

    .product-card-footer {
        align-items: flex-end;
        gap: 12px;
    }

    .food-price {
        font-size: .96rem;
    }

    .premium-qty-stepper {
        grid-template-columns: 36px 40px 36px;
        flex: 0 0 auto;
    }

    .premium-qty-stepper .qty-button,
    .premium-qty-stepper .qty-value {
        min-height: 36px;
    }

    .mobile-order-bar {
        left: 12px;
        right: 12px;
        gap: 8px;
        padding-bottom: calc(10px + env(safe-area-inset-bottom));
    }

    .mobile-order-bar.has-checkout {
        grid-template-columns: .82fr .82fr 1.36fr;
    }

    .mobile-order-link,
    .mobile-order-primary {
        min-height: 48px;
        border-radius: 999px;
        font-size: .9rem;
        box-shadow: 0 14px 28px rgba(16, 16, 16, .12);
    }

    .mobile-order-link {
        border-color: var(--lux-line);
        background: rgba(255, 255, 255, .96);
    }

    .mobile-order-link.active {
        color: var(--lux-red);
        border-color: rgba(215, 25, 32, .28);
        background: #fff;
    }

    .mobile-order-primary {
        background: var(--lux-red);
        border-color: var(--lux-red);
        color: #fff;
    }
}

@media (max-width: 420px) {
    .product-card {
        grid-template-columns: none;
    }

    .product-content {
        padding: 12px;
    }

    .premium-qty-stepper {
        grid-template-columns: 34px 36px 34px;
    }
}

body {
    color: var(--ink);
    background: #f6f2ea;
    font-size: 15px;
    line-height: 1.55;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
}

a {
    color: var(--brand);
}

.text-brand,
.link-brand {
    color: var(--brand) !important;
}

.text-muted {
    color: var(--muted) !important;
}

.btn-brand {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--brand);
    --bs-btn-border-color: var(--brand);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--brand-dark);
    --bs-btn-hover-border-color: var(--brand-dark);
    --bs-btn-focus-shadow-rgb: 215, 25, 32;
    box-shadow: 0 8px 18px rgba(215, 25, 32, .18);
    font-weight: 800;
}

.btn-outline-dark {
    --bs-btn-color: var(--brand-black);
    --bs-btn-border-color: var(--brand-black);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--brand-black);
    --bs-btn-hover-border-color: var(--brand-black);
    font-weight: 700;
}

.btn,
.form-control,
.form-select {
    min-height: 44px;
}

.form-control,
.form-select {
    border-color: #dbcdb8;
    background-color: #fff;
}

.form-control:focus,
.form-select:focus {
    border-color: var(--brand);
    box-shadow: 0 0 0 .18rem rgba(215, 25, 32, .14);
}

.site-navbar {
    border-bottom: 1px solid rgba(201, 154, 46, .34);
    box-shadow: 0 1px 6px rgba(21, 17, 15, .05);
    min-height: 52px;
    padding-top: .15rem;
    padding-bottom: .15rem;
}

.brand-link,
.admin-brand-link {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.brand-logo {
    display: block;
    width: min(168px, 44vw);
    height: auto;
}

.admin-brand-link {
    color: #fff;
    font-weight: 800;
    letter-spacing: .02em;
}

.admin-brand-logo {
    width: 176px;
    max-width: 46vw;
    height: auto;
    background: #fff;
    border-radius: 6px;
    padding: 7px 10px;
}

.login-logo {
    width: min(100%, 260px);
    height: auto;
}

.nav-link {
    color: var(--brand-black);
    font-weight: 700;
}

.nav-link:hover,
.nav-link:focus,
.nav-link.active {
    color: var(--brand);
}

.header-cart-btn,
.nav-cart-btn {
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding-inline: 14px;
}

.page-section {
    padding-top: 8px;
}

.page-heading {
    border-bottom: 1px solid rgba(201, 154, 46, .38);
    padding-bottom: 10px;
}

.eyebrow {
    color: var(--brand-dark);
    font-size: .78rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.order-page {
    padding-top: 10px;
}

.order-toolbar {
    display: grid;
    grid-template-columns: minmax(190px, 260px) minmax(260px, 1fr) auto;
    align-items: center;
    gap: 10px;
    background: #fff;
    border: 1px solid rgba(201, 154, 46, .28);
    border-radius: 8px;
    box-shadow: 0 1px 6px rgba(21, 17, 15, .05);
    padding: 9px 10px;
    margin-bottom: 10px;
}

.order-toolbar-copy {
    min-width: 0;
}

.order-toolbar-copy h1 {
    margin: 0;
    font-size: 1.24rem;
    line-height: 1.15;
    font-weight: 900;
    color: var(--brand-black);
}

.order-toolbar-copy span {
    display: block;
    margin-top: 2px;
    color: var(--muted);
    font-size: .84rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.order-search-wrap {
    position: relative;
    min-width: 0;
}

.order-search {
    min-height: 38px;
    border: 2px solid var(--brand);
    border-radius: 999px;
    padding-inline: 18px;
    font-weight: 600;
}

.order-search::placeholder {
    color: #9b9185;
    font-weight: 500;
}

.order-cart-shortcut {
    min-height: 38px;
    border-radius: 999px;
    padding-inline: 18px;
    white-space: nowrap;
}

.category-tabs {
    display: flex;
    gap: .5rem;
    overflow-x: auto;
    position: sticky;
    top: 52px;
    z-index: 15;
    background: rgba(246, 242, 234, .96);
    border-bottom: 1px solid rgba(201, 154, 46, .3);
    margin-inline: -4px;
    padding: 7px 4px;
    backdrop-filter: blur(10px);
    scrollbar-width: none;
}

.category-tabs::-webkit-scrollbar {
    display: none;
}

.category-tabs .btn {
    min-height: 32px;
    white-space: nowrap;
    border-radius: 999px;
    background: #fff;
    border-color: rgba(201, 154, 46, .45) !important;
    color: var(--brand-black);
    font-weight: 800;
}

.category-tabs .btn:hover,
.category-tabs .btn:focus {
    background: var(--brand-black);
    color: #fff;
    border-color: var(--brand-black) !important;
}

.menu-category,
.category-heading {
    scroll-margin-top: 98px;
}

.order-market-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 318px;
    gap: 12px;
    align-items: start;
}

.menu-products {
    min-width: 0;
}

.market-heading {
    display: flex;
    align-items: baseline;
    gap: 10px;
    padding: 5px 2px 7px;
    border-bottom: 1px solid rgba(201, 154, 46, .3);
}

.market-heading h2 {
    margin: 0;
    font-size: 1rem;
    line-height: 1.2;
    font-weight: 900;
    color: var(--brand-black);
}

.market-heading p {
    margin: 0;
    color: var(--muted);
    font-size: .86rem;
}

.product-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
    gap: 10px;
}

.food-card {
    border: 1px solid var(--line);
    border-radius: 6px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(21, 17, 15, .05);
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

.food-card:hover {
    transform: translateY(-1px);
    border-color: rgba(201, 154, 46, .55);
    box-shadow: var(--shadow-lift);
}

.food-card .card-img-top {
    height: 132px;
    object-fit: cover;
    background: linear-gradient(180deg, #fff7e4, #fff);
}

.food-card .card-body {
    padding: 9px;
}

.food-card h3 {
    color: var(--brand-black);
    font-weight: 900;
    font-size: .94rem;
    line-height: 1.25;
    margin-bottom: 4px;
}

.market-food-card p {
    display: -webkit-box;
    min-height: 34px;
    margin-bottom: 8px;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    font-size: .82rem;
    line-height: 1.35;
}

.food-card .fw-bold {
    color: var(--brand-dark);
    font-size: 1.02rem;
}

.food-card-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.food-price {
    color: var(--brand);
    font-size: 1rem;
    line-height: 1;
    font-weight: 900;
    white-space: nowrap;
}

.qty-stepper {
    display: inline-grid;
    grid-template-columns: 32px 34px 32px;
    align-items: center;
    border: 1px solid #d7c49e;
    border-radius: 6px;
    overflow: hidden;
    background: #fff;
}

.qty-button {
    width: 32px;
    min-height: 32px;
    border: 0;
    background: #fff;
    color: var(--brand-black);
    font-size: 1rem;
    font-weight: 800;
    line-height: 1;
}

.qty-button.plus {
    background: var(--brand);
    color: #fff;
}

.qty-button:hover:not(:disabled),
.qty-button:focus:not(:disabled) {
    background: var(--gold-soft);
}

.qty-button.plus:hover,
.qty-button.plus:focus {
    background: var(--brand-dark);
}

.qty-button:disabled {
    color: #b8c0cc;
    background: #f6f7f9;
}

.qty-button.is-loading {
    opacity: .65;
}

.qty-value {
    min-height: 32px;
    display: grid;
    place-items: center;
    border-left: 1px solid #eadfce;
    border-right: 1px solid #eadfce;
    font-weight: 800;
    font-size: .9rem;
}

.qty-pop {
    animation: qty-pop .22s ease-out;
}

.menu-cart-summary {
    position: sticky;
    top: 104px;
    background: #fff;
    border: 1px solid rgba(201, 154, 46, .42);
    border-radius: 6px;
    box-shadow: 0 2px 10px rgba(21, 17, 15, .08);
    padding: 12px;
}

.market-cart-summary {
    max-height: calc(100vh - 118px);
    overflow: auto;
}

.market-cart-summary h2 {
    margin: 0;
    font-size: 1rem;
    font-weight: 900;
}

.cart-count-pill {
    white-space: nowrap;
    background: var(--gold-soft);
    color: var(--brand);
    border: 1px solid rgba(201, 154, 46, .45);
    border-radius: 999px;
    padding: 5px 10px;
    font-size: .8rem;
    font-weight: 800;
}

.menu-cart-items {
    display: grid;
    gap: 8px;
    max-height: 300px;
    overflow-y: auto;
    padding-right: 4px;
    margin-bottom: 12px;
}

.menu-cart-item,
.menu-cart-totals > div {
    display: flex;
    justify-content: space-between;
    gap: 12px;
}

.menu-cart-item {
    color: var(--muted);
    font-size: .86rem;
    line-height: 1.3;
}

.menu-cart-item strong {
    color: var(--ink);
    white-space: nowrap;
}

.menu-cart-totals {
    border-top: 1px solid var(--line);
    padding-top: 10px;
    margin-bottom: 12px;
    display: grid;
    gap: 7px;
    font-size: .92rem;
}

.menu-cart-totals .total {
    border-top: 1px solid var(--line);
    padding-top: 10px;
    font-size: 1.08rem;
}

.total-pop {
    animation: qty-pop .25s ease-out;
}

.cart-list,
.cart-note-panel,
.summary-panel,
.lookup-panel,
.checkout-form,
.payment-state,
.empty-state,
.admin-panel,
.login-panel,
.stat-card {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 8px;
}

.cart-list,
.cart-note-panel,
.summary-panel,
.lookup-panel,
.checkout-form,
.payment-state,
.empty-state,
.admin-panel,
.login-panel,
.stat-card {
    border-color: rgba(201, 154, 46, .3);
}

.cart-row {
    display: grid;
    grid-template-columns: 74px 1fr 90px 110px auto;
    gap: 10px;
    align-items: center;
    padding: 10px;
    border-bottom: 1px solid rgba(234, 223, 206, .95);
    background: #fff;
    transition: opacity .18s ease, transform .18s ease;
}

.cart-row:last-child {
    border-bottom: 0;
}

.cart-row.is-removing {
    opacity: 0;
    transform: translateX(10px);
}

.cart-row img {
    width: 74px;
    height: 74px;
    object-fit: cover;
    border-radius: 8px;
    background: var(--paper);
}

.cart-line-total {
    min-width: 96px;
}

.cart-note-panel textarea {
    min-height: 104px;
    resize: vertical;
}

.promo-panel .form-control {
    min-width: 0;
}

.promo-applied-card {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    background: #fff8e6;
    border: 1px solid rgba(201, 154, 46, .45);
    border-radius: 8px;
    padding: 12px;
}

.summary-panel,
.cart-note-panel,
.lookup-panel,
.checkout-form,
.payment-state,
.empty-state,
.admin-panel,
.login-panel {
    padding: 16px;
}

.checkout-form,
.lookup-panel,
.summary-panel,
.cart-note-panel,
.cart-list {
    box-shadow: var(--shadow-soft);
}

.summary-panel {
    position: sticky;
    top: 70px;
    border-top: 3px solid var(--brand-gold);
}

.payment-state,
.empty-state {
    max-width: 680px;
    margin: 0 auto;
    text-align: center;
}

.mobile-order-bar {
    position: fixed;
    left: 10px;
    right: 10px;
    bottom: 0;
    z-index: 1040;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
    align-items: center;
    background: transparent;
    border-top: 0;
    box-shadow: none;
    padding: 7px 0 calc(7px + env(safe-area-inset-bottom));
    backdrop-filter: blur(12px);
}

.mobile-order-bar.has-checkout {
    grid-template-columns: .9fr .9fr 1.2fr;
}

.mobile-order-link,
.mobile-order-primary {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    min-height: 42px;
    border-radius: 8px;
    font-weight: 900;
    font-size: .92rem;
    text-decoration: none;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mobile-order-link {
    color: var(--ink);
    background: rgba(255, 255, 255, .98);
    border: 1px solid rgba(201, 154, 46, .35);
}

.mobile-order-link.active {
    color: var(--brand);
    border-color: rgba(215, 25, 32, .42);
    background: #fff3ef;
}

.mobile-order-primary {
    color: #fff;
    background: var(--brand);
    border: 1px solid var(--brand);
    box-shadow: 0 8px 18px rgba(215, 25, 32, .2);
}

.toast-stack {
    position: fixed;
    right: 18px;
    top: 82px;
    z-index: 2040;
    display: grid;
    gap: 10px;
    width: min(390px, calc(100vw - 28px));
    pointer-events: none;
}

.app-toast {
    display: flex;
    gap: 11px;
    align-items: center;
    min-height: 52px;
    padding: 13px 15px;
    border: 1px solid rgba(16, 16, 16, .08);
    border-left: 3px solid var(--brand);
    border-radius: 14px;
    background: rgba(255, 255, 255, .96);
    color: var(--brand-black);
    box-shadow: 0 18px 42px rgba(16, 16, 16, .14);
    backdrop-filter: blur(14px);
    font-size: .92rem;
    font-weight: 650;
    line-height: 1.35;
    animation: toast-in .22s ease-out;
}

.app-toast.warning {
    border-left-color: #c48a00;
}

.app-toast.success {
    border-left-color: #159a5b;
}

.app-toast.danger {
    border-left-color: var(--brand-dark);
}

.app-toast.info {
    border-left-color: var(--brand-gold);
}

.toast-dot {
    width: 9px;
    height: 9px;
    border-radius: 999px;
    background: #159a5b;
    flex: 0 0 auto;
    box-shadow: 0 0 0 4px rgba(21, 154, 91, .1);
}

.app-toast.warning .toast-dot {
    background: #c48a00;
    box-shadow: 0 0 0 4px rgba(196, 138, 0, .12);
}

.app-toast.danger .toast-dot {
    background: var(--brand);
    box-shadow: 0 0 0 4px rgba(215, 25, 32, .12);
}

.app-toast.info .toast-dot {
    background: var(--brand-gold);
    box-shadow: 0 0 0 4px rgba(201, 154, 46, .12);
}

.toast-message {
    min-width: 0;
}

.app-toast.is-hiding {
    animation: toast-out .2s ease-in forwards;
}

.cart-pulse {
    animation: cart-pulse .45s ease-out;
}

.btn.is-added {
    --bs-btn-bg: #2e7d32;
    --bs-btn-border-color: #2e7d32;
    --bs-btn-hover-bg: #236327;
    --bs-btn-hover-border-color: #236327;
}

@keyframes toast-in {
    from {
        opacity: 0;
        transform: translateY(10px) scale(.98);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes toast-out {
    to {
        opacity: 0;
        transform: translateY(8px) scale(.98);
    }
}

@keyframes cart-pulse {
    0% {
        transform: scale(1);
    }

    45% {
        transform: scale(1.06);
    }

    100% {
        transform: scale(1);
    }
}

@keyframes qty-pop {
    0% {
        transform: scale(1);
    }

    45% {
        transform: scale(1.18);
    }

    100% {
        transform: scale(1);
    }
}

.admin-body {
    background: #f8f4ec;
}

.admin-body .navbar.bg-dark {
    background: var(--brand-black) !important;
    border-bottom: 3px solid var(--brand-gold);
}

.admin-main {
    max-width: 1440px;
}

.stat-card {
    padding: 18px;
    border-top: 4px solid var(--brand-gold);
}

.stat-card span {
    display: block;
    color: var(--muted);
    font-size: .9rem;
}

.stat-card strong {
    display: block;
    font-size: 1.8rem;
    color: var(--brand-black);
}

.admin-thumb {
    width: 62px;
    height: 62px;
    border-radius: 8px;
    object-fit: cover;
    background: var(--paper);
    border: 1px solid var(--line);
}

.sort-input {
    width: 82px;
}

.admin-login-body {
    min-height: 100vh;
    background:
        linear-gradient(135deg, var(--brand-black), var(--brand-dark) 62%, #3d0d0f);
}

.login-shell {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 20px;
}

.login-panel {
    width: min(100%, 420px);
    box-shadow: 0 24px 70px rgba(0, 0, 0, .26);
}

.payment-hosted-shell {
    background: #f4f7fb;
    border-top: 1px solid #e3e8ef;
    padding: 36px 12px 56px;
}

.payment-hosted-page {
    width: min(100%, 1080px);
    margin: 0 auto;
    background: #fff;
    border: 1px solid #d8e0ea;
    border-radius: 8px;
    box-shadow: 0 18px 50px rgba(31, 41, 51, .08);
    padding: 24px;
}

.payment-test-banner {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    background: #fff4d6;
    border: 1px solid #f6c95d;
    color: #6f4e00;
    border-radius: 8px;
    padding: 12px 14px;
    margin-bottom: 20px;
}

.payment-hosted-header {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: flex-start;
    border-bottom: 1px solid #e3e8ef;
    padding-bottom: 18px;
    margin-bottom: 22px;
}

.payment-lock {
    white-space: nowrap;
    border: 1px solid #cfd8e3;
    border-radius: 999px;
    color: #1f5f45;
    background: #eefaf4;
    padding: 6px 12px;
    font-size: .85rem;
    font-weight: 700;
}

.payment-method-panel,
.payment-order-panel {
    border: 1px solid #e3e8ef;
    border-radius: 8px;
    padding: 18px;
}

.payment-method {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    border: 1px solid #d7dee8;
    border-radius: 8px;
    padding: 14px;
    margin-bottom: 12px;
    background: #fff;
}

.payment-method.active {
    border-color: var(--brand);
    box-shadow: 0 0 0 3px rgba(180, 35, 24, .08);
}

.payment-badge {
    border-radius: 999px;
    background: var(--brand);
    color: #fff;
    font-size: .75rem;
    font-weight: 700;
    padding: 4px 10px;
}

.payment-badge.muted {
    background: #eef2f6;
    color: #475467;
}

.payment-card-preview {
    background: #f8fafc;
    border: 1px solid #e3e8ef;
    border-radius: 8px;
    padding: 16px;
    margin-bottom: 12px;
}

.payment-card-preview .form-control[readonly] {
    background: #fff;
}

.payment-small-print {
    background: #f8fafc;
    border: 1px solid #e3e8ef;
    border-radius: 8px;
    color: var(--muted);
    font-size: .86rem;
    padding: 12px;
}

.payment-action-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.payment-action-card {
    width: 100%;
    text-align: left;
    border: 1px solid #d7dee8;
    border-radius: 8px;
    background: #fff;
    color: var(--ink);
    padding: 14px;
    min-height: 142px;
    transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}

.payment-action-card strong,
.payment-action-card span,
.payment-action-card small {
    display: block;
}

.payment-action-card strong {
    font-size: 1rem;
    margin-bottom: 4px;
}

.payment-action-card span {
    font-size: .9rem;
    margin-bottom: 8px;
}

.payment-action-card small {
    color: var(--muted);
    line-height: 1.35;
}

.payment-action-card:hover,
.payment-action-card:focus {
    transform: translateY(-1px);
    box-shadow: 0 8px 24px rgba(31, 41, 51, .1);
}

.payment-action-card.paid {
    border-color: #2e7d32;
}

.payment-action-card.failed {
    border-color: #b42318;
}

.payment-action-card.cancelled {
    border-color: #8a5a00;
}

.payment-action-card.pending {
    border-color: #2563eb;
}

@media (max-width: 767.98px) {
    body {
        padding-bottom: 66px;
    }

    .toast-stack {
        right: 14px;
        top: 70px;
        bottom: auto;
        width: calc(100vw - 28px);
    }

    .container {
        padding-left: 14px;
        padding-right: 14px;
    }

    .site-navbar .navbar-brand {
        max-width: 182px;
    }

    .brand-logo {
        width: min(150px, 56vw);
    }

    .admin-brand-logo {
        width: 148px;
    }

    .site-navbar .nav-cart-btn,
    .site-navbar .navbar-toggler {
        display: none;
    }

    .navbar-toggler {
        min-height: 38px;
        padding: .25rem .5rem;
    }

    .page-heading {
        margin-bottom: 10px !important;
        padding-bottom: 8px;
    }

    .order-page {
        padding-top: 8px;
    }

    .order-toolbar {
        display: grid;
        grid-template-columns: 1fr;
        gap: 7px;
        padding: 8px 14px 8px 8px;
        margin-bottom: 8px;
    }

    .order-toolbar-copy h1 {
        font-size: 1.05rem;
    }

    .order-toolbar-copy span {
        font-size: .78rem;
        white-space: normal;
    }

    .order-search {
        width: calc(100% - 16px);
        min-height: 38px;
        border-width: 1.5px;
        padding-inline: 14px;
        font-size: .9rem;
    }

    .order-cart-shortcut {
        display: none;
    }

    .page-heading .btn {
        width: 100%;
        min-height: 38px;
    }

    .category-tabs {
        top: 52px;
        margin-bottom: 14px !important;
    }

    .order-market-layout {
        display: block;
    }

    .market-heading {
        padding-top: 3px;
        padding-bottom: 6px;
    }

    .market-heading h2 {
        font-size: 1rem;
    }

    .market-heading p {
        display: none;
    }

    .product-grid {
        display: grid;
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .menu-category {
        margin-bottom: 18px !important;
    }

    .food-card:hover {
        transform: none;
    }

    .menu-category .row {
        --bs-gutter-y: .5rem;
    }

    .menu-category .food-card {
        display: grid;
        grid-template-columns: 92px minmax(0, 1fr);
        min-height: 112px;
    }

    .menu-category .food-card .card-img-top {
        width: 92px;
        height: 100%;
        min-height: 112px;
        border-radius: 0;
    }

    .menu-category .food-card .card-body {
        min-width: 0;
        padding: 9px 10px;
    }

    .menu-category .food-card h3 {
        font-size: .9rem;
        line-height: 1.25;
        margin-bottom: 2px !important;
    }

    .menu-category .food-card p {
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        overflow: hidden;
        margin-bottom: 6px;
    }

    .food-card-actions {
        flex-direction: column;
        align-items: flex-start !important;
        gap: 5px !important;
    }

    .food-card-actions form,
    .qty-stepper {
        width: 118px;
        flex: 0 0 auto;
    }

    .qty-stepper {
        grid-template-columns: 1fr 1fr 1fr;
    }

    .qty-button,
    .qty-value {
        width: auto;
        min-height: 34px;
    }

    .cart-row {
        grid-template-columns: 72px minmax(0, 1fr);
        padding: 10px;
    }

    .cart-row img {
        width: 72px;
        height: 72px;
    }

    .cart-stepper,
    .cart-line-total,
    .cart-row form[data-cart-control]:not(.cart-stepper) {
        grid-column: 2;
    }

    .cart-line-total {
        text-align: left !important;
    }

    .cart-row .btn {
        width: fit-content;
        min-height: 38px;
    }

    .summary-panel {
        position: static;
    }

    .summary-panel,
    .cart-note-panel,
    .lookup-panel,
    .checkout-form,
    .payment-state,
    .empty-state,
    .admin-panel,
    .login-panel {
        padding: 12px;
    }

    .checkout-form .btn-lg,
    .summary-panel .btn {
        width: 100%;
    }

    .payment-hosted-header {
        flex-direction: column;
    }

    .payment-action-grid {
        grid-template-columns: 1fr;
    }
}

/* Final premium ordering overrides. Kept last so the ordering page is not affected by older MVP styles. */
body {
    background: linear-gradient(180deg, #fff 0, #fbfaf7 280px, var(--lux-soft) 100%);
    color: var(--lux-ink);
}

html,
body {
    max-width: 100%;
    overflow-x: hidden;
}

.site-navbar {
    min-height: 68px;
    background: rgba(255, 255, 255, .96) !important;
    border-bottom: 1px solid rgba(16, 16, 16, .07);
    box-shadow: 0 8px 24px rgba(16, 16, 16, .055);
    backdrop-filter: blur(18px);
}

.site-navbar .container,
.premium-order-page .container-xxl {
    max-width: 1220px;
}

.site-navbar .container {
    position: relative;
}

.brand-logo {
    width: min(184px, 42vw);
}

.nav-link,
.nav-link:hover,
.nav-link:focus,
.nav-link.active {
    color: var(--lux-black);
    font-size: .95rem;
    font-weight: 800;
}

.header-actions {
    display: flex !important;
    align-items: center;
}

.auth-nav-login {
    color: var(--lux-muted) !important;
}

.header-signup-btn {
    min-height: 36px;
    padding: 7px 13px;
    border-color: var(--lux-line-strong);
    color: var(--lux-black);
    font-size: .86rem;
    font-weight: 700;
    background: #fff;
}

.logged-in-pill {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 0 10px;
    border: 1px solid rgba(185, 150, 80, .28);
    border-radius: 10px;
    background: #fffaf0;
    color: var(--lux-black);
    font-size: .74rem;
    font-weight: 800;
    white-space: nowrap;
}

.header-cart-btn,
.nav-cart-btn,
.btn-brand {
    --bs-btn-bg: var(--lux-red);
    --bs-btn-border-color: var(--lux-red);
    --bs-btn-hover-bg: var(--lux-red-dark);
    --bs-btn-hover-border-color: var(--lux-red-dark);
    border-radius: 999px;
    box-shadow: 0 12px 24px rgba(215, 25, 32, .18);
}

.premium-order-page {
    padding: 24px 0 56px;
}

.order-hero {
    display: grid;
    grid-template-columns: minmax(260px, .72fr) minmax(320px, 1fr);
    align-items: end;
    gap: 32px;
    padding: 30px 0 24px;
}

.order-hero-copy .eyebrow {
    color: var(--lux-gold);
    font-size: .72rem;
    letter-spacing: .16em;
}

.order-hero-copy h1 {
    margin: 0;
    color: var(--lux-black);
    font-size: clamp(2rem, 4vw, 3.2rem);
    line-height: 1.02;
    font-weight: 900;
    letter-spacing: 0;
}

.order-hero-copy p:last-child {
    margin: 12px 0 0;
    color: var(--lux-muted);
    font-size: 1rem;
}

.order-search-wrap {
    position: relative;
}

.order-search-wrap::before {
    content: "";
    position: absolute;
    left: 22px;
    top: 50%;
    z-index: 1;
    width: 15px;
    height: 15px;
    border: 2px solid #8c8780;
    border-radius: 50%;
    transform: translateY(-58%);
    pointer-events: none;
}

.order-search-wrap::after {
    content: "";
    position: absolute;
    left: 35px;
    top: 50%;
    z-index: 1;
    width: 7px;
    height: 2px;
    background: #8c8780;
    transform: translateY(5px) rotate(45deg);
    transform-origin: left center;
    pointer-events: none;
}

.order-search {
    width: 100%;
    min-height: 60px;
    border: 1px solid var(--lux-line-strong);
    border-radius: 999px;
    background: var(--lux-white);
    padding: 0 24px 0 52px;
    color: var(--lux-black);
    font-size: 1rem;
    font-weight: 650;
    box-shadow: 0 16px 44px rgba(16, 16, 16, .08);
}

.order-search:focus {
    border-color: rgba(215, 25, 32, .72);
    box-shadow: 0 0 0 .18rem rgba(215, 25, 32, .1), 0 18px 48px rgba(16, 16, 16, .1);
}

.premium-category-tabs {
    top: 68px;
    z-index: 20;
    display: flex;
    gap: 10px;
    margin: 0 -2px 24px;
    padding: 12px 2px;
    overflow-x: auto;
    border-bottom: 0;
    background: rgba(250, 248, 244, .92);
    backdrop-filter: blur(18px);
    scrollbar-width: none;
}

.premium-category-tabs::-webkit-scrollbar {
    display: none;
}

.category-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 0 18px;
    border: 1px solid var(--lux-line-strong);
    border-radius: 999px;
    background: var(--lux-white);
    color: var(--lux-black);
    font-size: .92rem;
    font-weight: 800;
    text-decoration: none;
    white-space: nowrap;
    box-shadow: 0 8px 18px rgba(16, 16, 16, .04);
    transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease, border-color .18s ease;
}

.category-pill:hover,
.category-pill:focus {
    color: var(--lux-black);
    transform: translateY(-1px);
    border-color: #c8c0b4;
    box-shadow: 0 12px 24px rgba(16, 16, 16, .08);
}

.category-pill.active {
    color: #fff;
    background: var(--lux-red);
    border-color: var(--lux-red);
    box-shadow: 0 14px 28px rgba(215, 25, 32, .18);
}

.order-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 32px;
    align-items: start;
}

.premium-menu-category {
    scroll-margin-top: 148px;
    margin-bottom: 32px !important;
}

.premium-category-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 24px;
    padding: 0 0 16px;
    margin-bottom: 16px;
    border-bottom: 1px solid var(--lux-line);
}

.premium-category-heading h2 {
    margin: 0;
    color: var(--lux-black);
    font-size: 1.2rem;
    line-height: 1.2;
    font-weight: 900;
}

.premium-category-heading p {
    margin: 6px 0 0;
    color: var(--lux-muted);
    font-size: .94rem;
}

.premium-category-heading > span {
    color: var(--lux-muted);
    font-size: .86rem;
    font-weight: 700;
    white-space: nowrap;
}

.premium-product-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 24px;
}

.product-card {
    display: flex;
    min-width: 0;
    flex-direction: column;
    overflow: hidden;
    background: var(--lux-white);
    border: 1px solid rgba(16, 16, 16, .055);
    border-radius: 16px;
    box-shadow: var(--lux-shadow-card);
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.product-card:hover {
    transform: translateY(-4px);
    border-color: rgba(185, 150, 80, .36);
    box-shadow: var(--lux-shadow-lift);
}

.product-image-shell {
    position: relative;
    display: grid;
    min-height: 166px;
    place-items: center;
    overflow: hidden;
    background:
        radial-gradient(circle at 72% 22%, rgba(185, 150, 80, .2), transparent 30%),
        linear-gradient(135deg, #f8f5ee 0%, #eee7dc 48%, #fff 100%);
}

.product-image-shell::after {
    content: "";
    position: absolute;
    inset: auto 24px 18px;
    height: 10px;
    border-radius: 999px;
    background: rgba(16, 16, 16, .08);
    filter: blur(8px);
}

.product-image-shell.has-image img {
    width: 100%;
    height: 100%;
    min-height: 166px;
    object-fit: cover;
}

.product-image-mark {
    position: relative;
    z-index: 1;
    display: grid;
    width: 86px;
    height: 86px;
    place-items: center;
    border: 1px solid rgba(185, 150, 80, .34);
    border-radius: 50%;
    background: rgba(255, 255, 255, .68);
    color: var(--lux-black);
    font-size: 1.05rem;
    font-weight: 900;
    letter-spacing: .08em;
    box-shadow: inset 0 0 0 10px rgba(255, 255, 255, .34);
}

.dish-badge {
    position: absolute;
    top: 14px;
    left: 14px;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0 10px;
    border: 1px solid rgba(185, 150, 80, .34);
    border-radius: 999px;
    background: rgba(255, 255, 255, .9);
    color: #7c622a;
    font-size: .74rem;
    font-weight: 850;
    letter-spacing: .01em;
    backdrop-filter: blur(12px);
}

.product-content {
    display: flex;
    min-height: 168px;
    flex: 1;
    flex-direction: column;
    padding: 18px;
}

.product-content h3 {
    margin: 0;
    color: var(--lux-black);
    font-size: 1.02rem;
    line-height: 1.26;
    font-weight: 900;
    letter-spacing: 0;
}

.product-content p {
    display: -webkit-box;
    min-height: 42px;
    margin: 8px 0 18px;
    overflow: hidden;
    color: var(--lux-muted);
    font-size: .92rem;
    line-height: 1.5;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.product-card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-top: auto;
}

.food-price {
    color: var(--lux-black);
    font-size: 1.02rem;
    line-height: 1;
    font-weight: 900;
    white-space: nowrap;
}

.premium-qty-stepper {
    display: inline-grid;
    width: auto;
    grid-template-columns: 38px 42px 38px;
    overflow: hidden;
    border: 1px solid var(--lux-line-strong);
    border-radius: 999px;
    background: var(--lux-white);
    flex: 0 0 auto;
}

.premium-qty-stepper .qty-button,
.premium-qty-stepper .qty-value {
    width: auto;
    min-height: 38px;
}

.premium-qty-stepper .qty-button {
    border: 0;
    background: #fff;
    color: var(--lux-black);
    font-size: 1.05rem;
    font-weight: 900;
}

.premium-qty-stepper .qty-button.plus {
    background: var(--lux-red);
    color: #fff;
}

.premium-qty-stepper .qty-button.plus:hover,
.premium-qty-stepper .qty-button.plus:focus {
    background: var(--lux-red-dark);
}

.premium-qty-stepper .qty-button:disabled {
    color: #b7b1aa;
    background: #f7f5f1;
}

.premium-qty-stepper .qty-value {
    display: grid;
    place-items: center;
    border-inline: 1px solid var(--lux-line);
    color: var(--lux-black);
    font-size: .92rem;
    font-weight: 900;
}

.order-sidebar {
    position: sticky;
    top: 108px;
}

.premium-cart-card {
    background: rgba(255, 255, 255, .96);
    border: 1px solid rgba(16, 16, 16, .07);
    border-radius: 18px;
    box-shadow: 0 20px 52px rgba(16, 16, 16, .11);
    padding: 24px;
    backdrop-filter: blur(18px);
}

.premium-cart-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 22px;
}

.premium-cart-header h2 {
    margin: 0;
    color: var(--lux-black);
    font-size: 1.12rem;
    line-height: 1.2;
    font-weight: 900;
}

.cart-count-pill {
    background: #fffaf0;
    border: 1px solid rgba(185, 150, 80, .32);
    color: #7c622a;
    border-radius: 999px;
    padding: 7px 11px;
    font-size: .78rem;
    font-weight: 850;
}

.premium-cart-empty {
    display: grid;
    place-items: center;
    padding: 28px 14px 18px;
    text-align: center;
}

.empty-cart-icon {
    display: grid;
    width: 48px;
    height: 48px;
    margin-bottom: 14px;
    place-items: center;
    border: 1px solid var(--lux-line);
    border-radius: 50%;
    color: var(--lux-muted);
    font-size: 1.6rem;
    font-weight: 400;
}

.premium-cart-empty p {
    margin: 0;
    color: var(--lux-black);
    font-weight: 900;
}

.premium-cart-empty small {
    display: block;
    margin-top: 5px;
    color: var(--lux-muted);
}

.menu-cart-items {
    display: grid;
    max-height: 300px;
    gap: 12px;
    margin-bottom: 20px;
    overflow-y: auto;
    padding-right: 4px;
}

.menu-cart-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: start;
    color: var(--lux-muted);
    font-size: .93rem;
    line-height: 1.4;
}

.menu-cart-item strong {
    color: var(--lux-black);
    font-weight: 900;
    white-space: nowrap;
}

.menu-cart-totals {
    display: grid;
    gap: 12px;
    padding: 18px 0;
    margin-bottom: 18px;
    border-top: 1px solid var(--lux-line);
    border-bottom: 1px solid var(--lux-line);
}

.menu-cart-totals > div {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    color: var(--lux-muted);
}

.menu-cart-totals strong {
    color: var(--lux-black);
}

.menu-cart-totals .total {
    margin-top: 4px;
    padding-top: 14px;
    border-top: 1px solid var(--lux-line);
    color: var(--lux-black);
    font-size: 1.08rem;
    font-weight: 900;
}

.premium-checkout-btn,
.premium-review-btn {
    min-height: 48px;
    border-radius: 999px;
    font-weight: 900;
}

.premium-review-btn {
    margin-top: 10px;
    border-color: var(--lux-line-strong);
    color: var(--lux-black);
}

.secure-checkout-note {
    margin: 14px 0 0;
    color: var(--lux-muted);
    font-size: .82rem;
    text-align: center;
}

.mobile-cart-drawer {
    position: fixed;
    inset: 0;
    z-index: 1080;
    visibility: hidden;
    pointer-events: none;
}

.mobile-cart-drawer.is-open {
    visibility: visible;
    pointer-events: auto;
}

.mobile-cart-backdrop {
    position: absolute;
    inset: 0;
    border: 0;
    background: rgba(16, 16, 16, .38);
    opacity: 0;
    transition: opacity .2s ease;
}

.mobile-cart-drawer.is-open .mobile-cart-backdrop {
    opacity: 1;
}

.mobile-cart-panel {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    max-height: min(78vh, 680px);
    overflow-y: auto;
    border-radius: 24px 24px 0 0;
    background: #fff;
    box-shadow: 0 -24px 60px rgba(16, 16, 16, .22);
    padding: 10px 20px calc(22px + env(safe-area-inset-bottom));
    transform: translateY(100%);
    transition: transform .24s ease;
}

.mobile-cart-drawer.is-open .mobile-cart-panel {
    transform: translateY(0);
}

.mobile-cart-handle {
    width: 44px;
    height: 5px;
    margin: 4px auto 18px;
    border-radius: 999px;
    background: #ddd7ce;
}

.mobile-cart-close {
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border: 1px solid var(--lux-line);
    border-radius: 50%;
    background: #fff;
    color: var(--lux-black);
    font-size: 1.4rem;
    line-height: 1;
}

.mobile-cart-open {
    overflow: hidden;
}

@media (min-width: 1200px) {
    .premium-product-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (min-width: 1500px) {
    .premium-order-page .container-xxl {
        max-width: 1380px;
    }

    .premium-product-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (max-width: 991.98px) {
    .order-hero {
        grid-template-columns: 1fr;
        gap: 20px;
        padding-top: 20px;
    }

    .order-layout {
        display: block;
    }

    .premium-product-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    body {
        padding-bottom: 78px;
    }

    .site-navbar {
        min-height: 60px;
    }

    .brand-logo {
        width: min(122px, 38vw);
    }

    .site-navbar .container {
        padding-left: 16px;
        padding-right: 16px;
    }

    .site-navbar .header-cart-btn {
        display: inline-flex !important;
        align-items: center;
        min-height: 38px;
        padding-inline: 12px;
        font-size: .82rem;
    }

    .header-actions {
        position: static;
        margin-left: 0 !important;
        gap: 8px !important;
        transform: none;
    }

    .header-actions .nav-link {
        display: none;
    }

    .premium-order-page {
        padding-top: 0;
    }

    .order-hero {
        gap: 16px;
        padding: 18px 0 14px;
    }

    .order-hero-copy .eyebrow {
        margin-bottom: 8px !important;
        font-size: .66rem;
    }

    .order-hero-copy h1 {
        font-size: 2rem;
    }

    .order-hero-copy p:last-child {
        margin-top: 8px;
        font-size: .9rem;
    }

    .order-search {
        width: 100%;
        min-height: 52px;
        padding-left: 50px;
        font-size: .94rem;
    }

    .premium-category-tabs {
        top: 60px;
        margin-bottom: 18px !important;
        padding: 10px 0 12px;
    }

    .category-pill {
        min-height: 40px;
        padding-inline: 16px;
        font-size: .88rem;
    }

    .premium-menu-category {
        scroll-margin-top: 118px;
        margin-bottom: 28px !important;
    }

    .premium-category-heading {
        align-items: flex-start;
        padding-bottom: 12px;
        margin-bottom: 14px;
    }

    .premium-category-heading h2 {
        font-size: 1.1rem;
    }

    .premium-category-heading p {
        font-size: .88rem;
    }

    .premium-product-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .product-card {
        display: grid;
        grid-template-columns: 118px minmax(0, 1fr);
        border-radius: 14px;
    }

    .product-card:hover {
        transform: none;
    }

    .product-image-shell {
        min-height: 100%;
        aspect-ratio: auto;
    }

    .product-image-shell.has-image img {
        min-height: 100%;
    }

    .product-image-mark {
        width: 62px;
        height: 62px;
        font-size: .86rem;
    }

    .dish-badge {
        top: 10px;
        left: 10px;
        min-height: 24px;
        padding-inline: 8px;
        font-size: .66rem;
    }

    .product-content {
        min-width: 0;
        min-height: 146px;
        padding: 14px;
    }

    .product-content h3 {
        font-size: .98rem;
    }

    .product-content p {
        min-height: 38px;
        margin: 6px 0 14px;
        font-size: .86rem;
        line-height: 1.4;
    }

    .product-card-footer {
        display: grid;
        grid-template-columns: 1fr;
        justify-items: start;
        align-items: start;
        gap: 10px;
    }

    .food-price {
        font-size: .96rem;
    }

    .premium-qty-stepper {
        width: auto;
        grid-template-columns: 36px 40px 36px;
    }

    .premium-qty-stepper .qty-button,
    .premium-qty-stepper .qty-value {
        width: auto;
        min-height: 36px;
    }

    .mobile-order-bar {
        left: 12px;
        right: 12px;
        gap: 8px;
        padding-bottom: calc(10px + env(safe-area-inset-bottom));
    }

    .mobile-order-bar.has-checkout {
        grid-template-columns: .82fr .82fr 1.36fr;
    }

    .mobile-order-link,
    .mobile-order-primary {
        min-height: 48px;
        border-radius: 999px;
        font-size: .9rem;
        box-shadow: 0 14px 28px rgba(16, 16, 16, .12);
    }

    .mobile-order-link {
        border-color: var(--lux-line);
        background: rgba(255, 255, 255, .96);
    }

    .mobile-order-link.active {
        color: var(--lux-red);
        border-color: rgba(215, 25, 32, .28);
        background: #fff;
    }

    .mobile-order-primary {
        background: var(--lux-red);
        border-color: var(--lux-red);
        color: #fff;
    }
}

@media (max-width: 420px) {
    .product-card {
        grid-template-columns: 108px minmax(0, 1fr);
    }

    .product-content {
        padding: 12px;
    }

    .premium-qty-stepper {
        grid-template-columns: 34px 36px 34px;
    }
}

/* Final ordering-page polish: compact, premium, conversion-focused. */
.premium-order-page {
    padding-top: 18px;
}

.order-hero {
    gap: 28px;
    padding: 22px 0 20px;
}

.order-hero-copy h1 {
    font-size: clamp(1.9rem, 3vw, 2.7rem);
}

@media (max-width: 767.98px) {
    .premium-order-page {
        padding-top: 0;
    }

    .order-hero {
        gap: 14px;
        padding: 16px 0 12px;
    }

    .order-hero-copy h1 {
        font-size: 1.75rem;
    }
}

/* Production refinement: tighter desktop layout and sturdier ordering controls. */
.premium-order-page .container-xxl,
.site-navbar .container {
    max-width: 1280px;
}

.order-hero {
    grid-template-columns: minmax(260px, 420px) minmax(340px, 700px);
    justify-content: space-between;
}

.order-search-wrap {
    width: 100%;
    max-width: 700px;
    justify-self: end;
}

.order-layout {
    grid-template-columns: minmax(0, 1fr) clamp(360px, 29vw, 392px);
    gap: clamp(20px, 2vw, 28px);
}

.menu-products {
    min-width: 0;
}

.premium-product-grid {
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
}

.product-card {
    border-radius: 16px;
    box-shadow: 0 14px 34px rgba(16, 16, 16, .07);
}

.product-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 20px 44px rgba(16, 16, 16, .1);
}

.product-image-shell {
    aspect-ratio: 16 / 10;
    min-height: 0;
    background:
        radial-gradient(circle at 24% 20%, rgba(255, 255, 255, .86), transparent 34%),
        linear-gradient(135deg, #f9f6ef 0%, #ece3d4 52%, #f7f3ec 100%);
}

.product-image-shell::before {
    content: "";
    position: absolute;
    inset: 16px;
    border: 1px solid rgba(185, 150, 80, .18);
    border-radius: 14px;
    pointer-events: none;
}

.product-image-shell::after {
    opacity: .32;
}

.product-image-mark {
    width: auto;
    height: auto;
    padding: 7px 12px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .82);
    color: #8f7650;
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    box-shadow: none;
}

.product-content {
    padding: 18px;
}

.product-content h3 {
    font-weight: 700;
}

.product-content p {
    color: #625d56;
    font-weight: 400;
}

.product-card-footer {
    gap: 10px;
}

.food-price {
    font-weight: 800;
}

.premium-qty-stepper {
    width: 112px;
    grid-template-columns: 36px 40px 36px;
    overflow: hidden;
    border: 1px solid var(--lux-line-strong);
    border-radius: 999px;
    background: #fff;
    flex: 0 0 auto;
}

.premium-qty-stepper .qty-button,
.premium-qty-stepper .qty-value {
    width: 100%;
    min-height: 36px;
}

.premium-qty-stepper .qty-button {
    display: grid;
    place-items: center;
    font-size: .95rem;
}

.premium-qty-stepper .qty-value {
    border-left: 1px solid var(--lux-line);
    border-right: 1px solid var(--lux-line);
    font-size: .9rem;
    font-weight: 800;
}

.category-pill {
    box-shadow: 0 6px 14px rgba(16, 16, 16, .035);
}

.category-pill:hover,
.category-pill:focus {
    transform: translateY(-1px);
    box-shadow: 0 10px 20px rgba(16, 16, 16, .06);
}

.category-pill.active {
    background: var(--lux-red);
    border-color: var(--lux-red);
    box-shadow: none;
}

.premium-cart-card {
    position: sticky;
    top: 88px;
    border-color: rgba(16, 16, 16, .06);
    box-shadow: 0 20px 52px rgba(16, 16, 16, .09);
}

.premium-cart-header h2 {
    font-weight: 800;
}

.menu-cart-item span {
    font-weight: 500;
}

.secure-checkout-note {
    max-width: 270px;
    margin-inline: auto;
    line-height: 1.45;
}

@media (min-width: 1200px) {
    .premium-product-grid {
        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    }
}

@media (min-width: 1400px) {
    .premium-product-grid {
        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    }
}

@media (max-width: 991.98px) {
    .order-search-wrap {
        max-width: none;
        justify-self: stretch;
    }
}

@media (max-width: 767.98px) {
    html,
    body {
        width: 100%;
        max-width: 100%;
        overflow-x: hidden;
    }

    .site-navbar .header-cart-btn {
        display: none !important;
    }

    .site-navbar .container,
    .premium-order-page .container-xxl {
        width: 100%;
        max-width: 100%;
        padding-left: 12px;
        padding-right: 12px;
        overflow-x: hidden;
    }

    .order-hero {
        grid-template-columns: 1fr;
    }

    .order-search-wrap {
        width: 100%;
        max-width: calc(100vw - 24px);
    }

    .order-search {
        width: calc(100vw - 24px);
        max-width: calc(100vw - 24px);
        box-sizing: border-box;
    }

    .premium-category-tabs {
        margin-left: -12px;
        margin-right: -12px;
        padding-left: 12px;
        padding-right: 12px;
        overflow-x: auto;
    }

    .premium-product-grid {
        width: calc(100vw - 24px);
        max-width: calc(100vw - 24px);
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .product-card {
        width: 100%;
        max-width: calc(100vw - 24px);
        display: grid;
        grid-template-columns: 124px minmax(0, 1fr);
        border-radius: 16px;
        overflow: hidden;
    }

    .product-image-shell {
        height: 100%;
        min-height: 152px;
        aspect-ratio: auto;
    }

    .product-image-shell.has-image img {
        min-height: 100%;
    }

    .product-content {
        min-height: 0;
        padding: 16px;
    }

    .product-content h3 {
        font-size: 1rem;
    }

    .product-content p {
        min-height: 0;
        margin-bottom: 14px;
    }

    .product-card-footer {
        display: grid;
        grid-template-columns: 1fr;
        justify-items: start;
        align-items: start;
        gap: 10px;
    }

    .premium-qty-stepper {
        width: 136px;
        grid-template-columns: 44px 48px 44px;
    }

    .premium-qty-stepper .qty-button,
    .premium-qty-stepper .qty-value {
        min-height: 42px;
    }
}

@media (max-width: 420px) {
    .product-card {
        grid-template-columns: 112px minmax(0, 1fr);
    }

    .product-image-shell {
        min-height: 148px;
    }
}

/* Mobile density refinement: compact ordering first, premium without wasted space. */
@media (max-width: 767.98px) {
    body {
        padding-bottom: 66px;
    }

    .site-navbar {
        min-height: 56px;
        padding: 0;
        box-shadow: 0 4px 14px rgba(16, 16, 16, .045);
    }

    .brand-logo {
        width: 132px;
        max-width: 150px;
        max-height: 24px;
        height: auto;
    }

    .premium-order-page {
        padding-top: 0;
        padding-bottom: 18px;
    }

    .order-hero {
        display: block;
        padding: 14px 0 10px;
    }

    .order-hero-copy .eyebrow {
        margin-bottom: 5px !important;
        font-size: 11px;
        line-height: 1.1;
        letter-spacing: .14em;
    }

    .order-hero-copy h1 {
        margin: 0 0 5px;
        font-size: 30px;
        line-height: 1.05;
    }

    .order-hero-copy p:last-child {
        margin: 0 0 10px;
        font-size: 14px;
        line-height: 1.35;
    }

    .order-search-wrap {
        margin: 0;
    }

    .order-search {
        min-height: 48px;
        height: 48px;
        border-radius: 24px;
        padding: 0 16px 0 46px;
        font-size: 14px;
        box-shadow: 0 8px 20px rgba(16, 16, 16, .055);
    }

    .order-search-wrap::before {
        left: 18px;
        width: 14px;
        height: 14px;
    }

    .order-search-wrap::after {
        left: 30px;
    }

    .premium-category-tabs {
        top: 56px;
        gap: 8px;
        margin: 0 -12px 8px;
        padding: 8px 12px 10px;
        background: rgba(250, 248, 244, .96);
    }

    .category-pill {
        min-height: 40px;
        height: 40px;
        padding: 0 16px;
        font-size: 14px;
        box-shadow: none;
    }

    .category-pill:hover,
    .category-pill:focus {
        transform: none;
        box-shadow: none;
    }

    .category-pill.active {
        background: var(--lux-red);
        box-shadow: none;
    }

    .premium-menu-category {
        scroll-margin-top: 110px;
        margin-bottom: 18px !important;
    }

    .premium-category-heading {
        align-items: flex-start;
        gap: 10px;
        margin: 0 0 10px;
        padding: 0 0 10px;
    }

    .premium-category-heading h2 {
        font-size: 20px;
        line-height: 1.15;
        margin-bottom: 4px;
    }

    .premium-category-heading p {
        margin: 0;
        font-size: 14px;
        line-height: 1.35;
    }

    .premium-category-heading span {
        padding-top: 3px;
        font-size: 13px;
        white-space: nowrap;
    }

    .premium-product-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
        margin: 0;
    }

    .product-card {
        display: flex;
        flex-direction: column;
        border-radius: 14px;
        box-shadow: 0 8px 18px rgba(16, 16, 16, .065);
    }

    .product-card:hover {
        transform: none;
    }

    .product-image-shell {
        width: 100%;
        height: auto;
        min-height: 0;
        aspect-ratio: 1 / 1;
    }

    .product-image-shell::before {
        inset: 10px;
        border-radius: 12px;
    }

    .product-image-shell.has-image img {
        min-height: 0;
    }

    .product-image-mark {
        padding: 6px 9px;
        font-size: .58rem;
        letter-spacing: .06em;
        white-space: nowrap;
    }

    .dish-badge {
        top: 8px;
        left: 8px;
        min-height: 22px;
        padding: 0 7px;
        font-size: .62rem;
    }

    .product-content {
        display: flex;
        flex: 1 1 auto;
        flex-direction: column;
        min-height: 0;
        padding: 10px;
    }

    .product-content h3 {
        min-height: 36px;
        margin: 0 0 6px;
        font-size: 14px;
        line-height: 1.25;
        font-weight: 700;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .product-content p {
        display: none;
    }

    .product-card-footer {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 6px;
        margin-top: auto;
    }

    .food-price {
        min-width: 0;
        font-size: 14px;
        line-height: 1.15;
        font-weight: 800;
        white-space: nowrap;
    }

    .premium-qty-stepper {
        width: 108px;
        height: 38px;
        grid-template-columns: 36px 36px 36px;
        flex: 0 0 auto;
    }

    .premium-qty-stepper .qty-button,
    .premium-qty-stepper .qty-value {
        min-height: 38px;
        height: 38px;
        font-size: 14px;
    }

    .premium-qty-stepper.is-empty {
        width: 40px;
        grid-template-columns: 40px;
        border-color: var(--lux-red);
        background: var(--lux-red);
    }

    .premium-qty-stepper.is-empty .qty-button[value="decrement"],
    .premium-qty-stepper.is-empty .qty-value {
        display: none;
    }

    .premium-qty-stepper.is-empty .qty-button.plus {
        width: 40px;
        min-height: 40px;
        height: 40px;
        border-radius: 999px;
        background: var(--lux-red);
    }

    .mobile-order-bar {
        left: 12px;
        right: 12px;
        gap: 8px;
        padding: 8px 0 calc(8px + env(safe-area-inset-bottom));
    }

    .mobile-order-link,
    .mobile-order-primary {
        min-height: 44px;
        font-size: 14px;
    }
}

@media (max-width: 390px) {
    .food-price {
        font-size: 13px;
    }

    .premium-qty-stepper {
        width: 102px;
        grid-template-columns: 34px 34px 34px;
    }

    .premium-qty-stepper .qty-button,
    .premium-qty-stepper .qty-value {
        min-height: 38px;
        height: 38px;
    }
}

/* Mobile polish pass: denser scan path and checkout-focused bottom bar. */
@media (max-width: 767.98px) {
    body {
        padding-bottom: 58px;
    }

    .order-hero {
        padding: 10px 0 8px;
    }

    .order-hero-copy h1 {
        margin-bottom: 4px;
        font-size: 29px;
    }

    .order-hero-copy p:last-child {
        margin-bottom: 8px;
        font-size: 13.5px;
    }

    .order-search {
        min-height: 46px;
        height: 46px;
    }

    .premium-category-tabs {
        margin-bottom: 6px;
        padding-top: 6px;
        padding-bottom: 8px;
    }

    .category-pill {
        min-height: 38px;
        height: 38px;
        font-size: 13.5px;
    }

    .premium-menu-category {
        margin-bottom: 14px !important;
    }

    .premium-category-heading {
        margin-bottom: 9px;
        padding-bottom: 8px;
    }

    .premium-category-heading h2 {
        font-size: 19px;
    }

    .premium-category-heading p {
        font-size: 13px;
    }

    .premium-category-heading span {
        color: #8a837a;
        font-size: 12px;
        font-weight: 700;
    }

    .premium-product-grid {
        gap: 9px;
    }

    .product-card {
        border-radius: 13px;
    }

    .product-image-shell {
        aspect-ratio: 6 / 5;
        background:
            radial-gradient(circle at 18% 14%, rgba(255, 255, 255, .7), transparent 30%),
            linear-gradient(135deg, #fbf8f1 0%, #eee5d7 58%, #f8f4ec 100%);
    }

    .product-image-shell::before {
        inset: 9px;
        border-color: rgba(185, 150, 80, .14);
    }

    .product-image-shell::after {
        opacity: .2;
    }

    .product-image-mark {
        padding: 5px 8px;
        color: #9b815b;
        font-size: .52rem;
        letter-spacing: .035em;
    }

    .product-content {
        padding: 9px;
    }

    .product-content h3 {
        min-height: 34px;
        margin-bottom: 5px;
        font-size: 13.5px;
    }

    .product-card-footer {
        gap: 4px;
        align-items: center;
    }

    .food-price {
        min-width: 0;
        font-size: 13.5px;
        white-space: nowrap;
    }

    .premium-qty-stepper {
        width: 82px;
        height: 34px;
        grid-template-columns: 27px 28px 27px;
    }

    .premium-qty-stepper .qty-button,
    .premium-qty-stepper .qty-value {
        min-height: 34px;
        height: 34px;
        font-size: 13px;
    }

    .premium-qty-stepper.is-empty {
        width: 34px;
        grid-template-columns: 34px;
    }

    .premium-qty-stepper.is-empty .qty-button.plus {
        width: 34px;
        min-height: 34px;
        height: 34px;
    }

    .mobile-order-bar {
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 8px;
        padding: 6px 0 calc(6px + env(safe-area-inset-bottom));
    }

    .mobile-order-bar.has-checkout {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .mobile-order-bar.cart-empty {
        grid-template-columns: 1fr;
    }

    .mobile-cart-summary,
    .mobile-order-primary {
        display: flex;
        align-items: center;
        justify-content: center;
        min-width: 0;
        min-height: 42px;
        border-radius: 999px;
        font-size: 13.5px;
        font-weight: 850;
        text-decoration: none;
        box-shadow: 0 10px 22px rgba(16, 16, 16, .1);
    }

    .mobile-cart-summary {
        gap: 6px;
        padding: 0 13px;
        color: var(--lux-black);
        background: rgba(255, 255, 255, .97);
        border: 1px solid var(--lux-line);
        justify-content: flex-start;
    }

    .mobile-cart-summary strong {
        color: var(--lux-black);
        font-weight: 900;
        white-space: nowrap;
    }

    .mobile-summary-dot {
        color: #9a9187;
    }

    .mobile-order-primary {
        min-width: 116px;
        padding: 0 18px;
        color: #fff;
        background: var(--lux-red);
        border: 1px solid var(--lux-red);
    }

    .mobile-order-link {
        display: none !important;
    }
}

/* Desktop ordering helpers: sticky cart and quick actions. */
@media (min-width: 992px) {
    html,
    body {
        overflow-x: clip;
    }

    .order-sidebar {
        position: sticky;
        top: 84px;
        align-self: start;
        height: auto;
    }

    .order-sidebar .premium-cart-card {
        position: static;
        max-height: calc(100vh - 104px);
        overflow-y: auto;
        overscroll-behavior: contain;
        scrollbar-width: thin;
    }

    .order-sidebar .menu-cart-items {
        max-height: min(36vh, 320px);
        overflow-y: auto;
        padding-right: 4px;
    }
}

.floating-actions {
    position: fixed;
    right: 22px;
    bottom: 22px;
    z-index: 1040;
    display: grid;
    justify-items: end;
    gap: 10px;
    pointer-events: none;
}

.floating-action {
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    border-radius: 999px;
    border: 1px solid rgba(16, 16, 16, .08);
    color: #fff;
    font-size: 13px;
    font-weight: 900;
    text-decoration: none;
    box-shadow: 0 14px 30px rgba(16, 16, 16, .16);
    pointer-events: auto;
    transition: transform .18s ease, box-shadow .18s ease, opacity .18s ease;
}

.floating-action:hover,
.floating-action:focus {
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 18px 36px rgba(16, 16, 16, .2);
}

.floating-whatsapp {
    width: auto;
    min-width: 112px;
    padding: 0 16px;
    background: #25d366;
}

.floating-label-short {
    display: none;
}

.floating-top {
    background: var(--lux-black);
    font-size: 19px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(8px);
}

.floating-top.is-visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

@media (max-width: 767.98px) {
    .floating-actions {
        right: 12px;
        bottom: calc(72px + env(safe-area-inset-bottom));
        gap: 8px;
    }

    .floating-action {
        width: 42px;
        height: 42px;
        min-width: 42px;
        padding: 0;
        font-size: 12px;
    }

    .floating-label-full {
        display: none;
    }

    .floating-label-short {
        display: inline;
    }

    .floating-top {
        font-size: 17px;
    }
}

/* Dense desktop ordering pass: compact scan path without changing mobile cards. */
@media (min-width: 992px) {
    .site-navbar {
        min-height: 56px;
    }

    .brand-logo {
        width: min(164px, 30vw);
    }

    .premium-order-page {
        padding: 12px 0 34px;
    }

    .premium-order-page .container-xxl,
    .site-navbar .container {
        max-width: 1320px;
    }

    .order-hero {
        grid-template-columns: minmax(250px, 360px) minmax(320px, 560px);
        gap: 18px;
        padding: 14px 0 12px;
    }

    .order-hero-copy h1 {
        font-size: clamp(1.8rem, 2.4vw, 2.35rem);
    }

    .order-hero-copy p:last-child {
        margin-top: 6px;
        font-size: .88rem;
    }

    .order-search-wrap {
        max-width: 560px;
    }

    .order-search {
        min-height: 46px;
        padding-left: 46px;
        font-size: .9rem;
        box-shadow: 0 10px 28px rgba(16, 16, 16, .055);
    }

    .order-search-wrap::before {
        left: 18px;
        width: 13px;
        height: 13px;
    }

    .order-search-wrap::after {
        left: 30px;
    }

    .premium-category-tabs {
        top: 56px;
        gap: 8px;
        margin: 0 0 16px;
        padding: 12px 0;
    }

    .category-pill {
        min-height: 34px;
        padding: 0 15px;
        font-size: .84rem;
    }

    .order-layout {
        grid-template-columns: minmax(0, 1fr) clamp(320px, 25vw, 350px);
        gap: 16px;
    }

    .menu-category {
        margin-bottom: 28px;
    }

    .menu-category-header {
        margin-bottom: 10px;
        padding-bottom: 10px;
    }

    .menu-category-header h2 {
        font-size: 1.14rem;
    }

    .menu-category-header p {
        font-size: .88rem;
    }

    .premium-product-grid {
        grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
        gap: 12px;
    }

    .product-card {
        border-radius: 12px;
        box-shadow: 0 9px 22px rgba(16, 16, 16, .055);
    }

    .product-card:hover {
        transform: translateY(-1px);
        box-shadow: 0 13px 28px rgba(16, 16, 16, .08);
    }

    .product-image-shell {
        aspect-ratio: 16 / 7;
    }

    .product-image-shell::before {
        inset: 10px;
        border-radius: 10px;
    }

    .product-image-mark {
        padding: 5px 10px;
        font-size: .58rem;
    }

    .dish-badge {
        top: 10px;
        left: 10px;
        padding: 5px 9px;
        font-size: .6rem;
    }

    .product-content {
        padding: 12px;
    }

    .product-content h3 {
        margin-bottom: 5px;
        font-size: .95rem;
        line-height: 1.25;
    }

    .product-content p {
        min-height: 34px;
        margin: 5px 0 12px;
        font-size: .82rem;
        line-height: 1.35;
    }

    .food-price {
        font-size: .94rem;
    }

    .premium-qty-stepper {
        width: 104px;
        grid-template-columns: 33px 38px 33px;
    }

    .premium-qty-stepper .qty-button,
    .premium-qty-stepper .qty-value {
        min-height: 34px;
    }

    .premium-cart-card {
        padding: 18px;
        border-radius: 14px;
    }

    .premium-cart-header {
        margin-bottom: 14px;
    }

    .premium-cart-empty {
        padding: 22px 8px;
    }

    .order-sidebar {
        top: 72px;
    }

    .order-sidebar .premium-cart-card {
        max-height: calc(100vh - 90px);
    }
}

/* Premium checkout refinement. */
.checkout-page {
    padding-top: 20px;
}

.checkout-heading {
    margin-bottom: 16px;
}

.checkout-heading h1 {
    margin: 0;
    color: var(--lux-black);
    font-size: clamp(1.9rem, 3vw, 2.45rem);
    line-height: 1.05;
    font-weight: 900;
}

.checkout-heading p {
    margin: 7px 0 0;
    color: var(--lux-muted);
    font-size: .95rem;
}

.checkout-progress {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0;
    margin: 0;
    list-style: none;
}

.checkout-progress li {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--lux-muted);
    font-size: .78rem;
    font-weight: 800;
    white-space: nowrap;
}

.checkout-progress li::before {
    content: "";
    width: 9px;
    height: 9px;
    border-radius: 999px;
    background: var(--lux-line-strong);
}

.checkout-progress li.active {
    color: var(--lux-black);
}

.checkout-progress li.active::before {
    background: var(--lux-red);
}

.checkout-alert,
.checkout-returning,
.checkout-panel,
.checkout-summary-card {
    border: 1px solid rgba(16, 16, 16, .07);
    border-radius: 14px;
    background: rgba(255, 255, 255, .97);
    box-shadow: 0 14px 34px rgba(16, 16, 16, .065);
}

.checkout-returning {
    margin-bottom: 12px;
    overflow: hidden;
}

.checkout-returning summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 14px;
    cursor: pointer;
    color: var(--lux-black);
    font-weight: 850;
    list-style: none;
}

.checkout-returning summary::-webkit-details-marker {
    display: none;
}

.checkout-returning summary small {
    color: var(--lux-muted);
    font-size: .78rem;
    font-weight: 600;
}

.checkout-returning-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 14px 8px;
    color: var(--lux-black);
    font-size: .82rem;
    font-weight: 700;
}

.checkout-returning-header small {
    color: var(--lux-muted);
    font-size: .76rem;
    font-weight: 400;
}

.checkout-returning-body {
    padding: 0 14px 14px;
}

.checkout-lookup-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 132px;
    gap: 10px;
    align-items: end;
}

.checkout-previous-orders {
    margin-top: 12px;
}

.checkout-auth-options {
    display: grid;
    gap: 12px;
}

.checkout-auth-copy {
    display: grid;
    gap: 4px;
}

.checkout-auth-copy strong {
    color: var(--lux-black);
    font-size: .9rem;
    font-weight: 800;
}

.checkout-auth-copy p,
.checkout-privacy-copy,
.remembered-device-note {
    margin: 0;
    color: var(--lux-muted);
    font-size: .78rem;
    line-height: 1.35;
}

.checkout-auth-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.checkout-auth-actions > small {
    color: var(--lux-muted);
    font-size: .74rem;
}

.google-signin-slot {
    display: inline-flex;
    min-width: 224px;
    min-height: 40px;
    align-items: center;
}

.google-signin-slot.is-loading {
    opacity: .62;
    pointer-events: none;
}

.checkout-guest-link {
    min-height: 36px;
    padding-inline: 6px;
    color: var(--lux-muted);
    font-size: .8rem;
    font-weight: 700;
    text-decoration: none;
}

.checkout-guest-link:hover,
.checkout-guest-link:focus {
    color: var(--lux-red);
}

.checkout-saved-card,
.checkout-history-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border: 1px solid var(--lux-line);
    border-radius: 12px;
    padding: 10px;
    background: var(--lux-soft);
}

.checkout-saved-card p,
.checkout-history-item small,
.checkout-history-item span {
    display: block;
    color: var(--lux-muted);
    font-size: .8rem;
}

.checkout-order-history {
    display: grid;
    gap: 8px;
    margin-top: 8px;
}

.checkout-history-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 10px;
    margin: 2px 0 4px;
}

.checkout-history-heading > div {
    display: grid;
    gap: 2px;
}

.checkout-history-heading strong {
    color: var(--lux-black);
    font-size: .9rem;
    font-weight: 700;
}

.checkout-history-heading span {
    display: block;
    color: var(--lux-muted);
    font-size: .76rem;
}

.checkout-history-sort {
    flex: 0 0 auto;
}

.checkout-history-sort .form-select {
    min-width: 164px;
    min-height: 34px;
    border-color: var(--lux-line-strong);
    color: var(--lux-black);
    font-size: .78rem !important;
    font-weight: 600;
}

.checkout-history-account-link {
    color: var(--lux-red);
    font-size: .78rem;
    font-weight: 800;
    text-decoration: none;
    white-space: nowrap;
}

.checkout-history-item.reorder-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    padding: 10px;
    background: #fff;
}

.reorder-card.is-secondary {
    background: #fbfaf7;
}

.reorder-card-main {
    display: grid;
    min-width: 0;
    gap: 6px;
}

.reorder-items {
    display: grid;
    gap: 4px;
}

.reorder-item-line {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    color: var(--lux-black);
    font-size: .86rem;
    line-height: 1.25;
}

.reorder-item-line span {
    min-width: 0;
    color: var(--lux-black);
    font-weight: 500;
}

.reorder-item-line strong {
    color: var(--lux-black);
    font-weight: 700;
}

.reorder-item-line em {
    color: var(--lux-black);
    font-style: normal;
    font-weight: 600;
    white-space: nowrap;
}

.reorder-more-items summary {
    width: fit-content;
    cursor: pointer;
    color: var(--lux-red);
    font-size: .76rem;
    font-weight: 700;
}

.reorder-more-items > div {
    display: grid;
    gap: 6px;
    margin-top: 7px;
}

.reorder-total-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding-top: 6px;
    border-top: 1px solid var(--lux-line);
}

.reorder-total-row span {
    color: var(--lux-muted);
    font-size: .78rem;
}

.reorder-total-row strong {
    color: var(--lux-black);
    font-size: .92rem;
    font-weight: 700;
}

.reorder-meta-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    color: var(--lux-muted);
    font-size: .74rem;
}

.reorder-status-badge {
    display: inline-flex;
    align-items: center;
    min-height: 22px;
    border: 1px solid rgba(185, 150, 80, .28);
    border-radius: 10px;
    padding: 0 7px;
    color: #7c622a;
    background: #fffaf0;
    font-weight: 600;
}

.reorder-card.is-secondary .reorder-status-badge {
    border-color: rgba(16, 16, 16, .1);
    color: var(--lux-muted);
    background: #f3f1ec;
}

.reorder-order-number {
    display: block;
    color: var(--lux-muted);
    font-size: .72rem;
}

.reorder-card form {
    align-self: center;
}

.reorder-card .btn {
    min-width: 94px;
    min-height: 36px;
}

.checkout-history-pagination {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    margin-top: 4px;
}

.checkout-history-pagination a {
    display: inline-flex;
    min-width: 34px;
    min-height: 34px;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--lux-line-strong);
    border-radius: 10px;
    padding: 0 10px;
    color: var(--lux-black);
    background: #fff;
    font-size: .78rem;
    font-weight: 700;
    text-decoration: none;
}

.checkout-history-pagination a:hover,
.checkout-history-pagination a:focus,
.checkout-history-pagination a.active {
    border-color: var(--lux-red);
    color: #fff;
    background: var(--lux-red);
}

.checkout-panel {
    padding: 18px;
}

.checkout-inline-note {
    margin-bottom: 10px;
    border: 1px solid rgba(13, 110, 253, .18);
    border-radius: 10px;
    background: rgba(13, 110, 253, .06);
    color: #38506d;
    padding: 9px 11px;
    font-size: .86rem;
}

.checkout-section {
    padding: 14px 0;
    border-top: 1px solid var(--lux-line);
}

.checkout-section:first-of-type {
    padding-top: 0;
    border-top: 0;
}

.checkout-section-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}

.checkout-section-heading h2 {
    margin: 0;
    color: var(--lux-black);
    font-size: 1rem;
    font-weight: 900;
}

.checkout-section-heading span,
.form-label em {
    color: var(--lux-muted);
    font-size: .76rem;
    font-style: normal;
    font-weight: 700;
}

.form-label span {
    color: var(--lux-red);
}

.checkout-page .form-control {
    min-height: 42px;
    border-color: var(--lux-line-strong);
    border-radius: 10px;
    font-size: .93rem;
}

.checkout-page .form-text {
    margin-top: 5px;
    font-size: .76rem;
}

.checkout-field-error {
    margin-top: 5px;
    color: var(--lux-red);
    font-size: .76rem;
    font-weight: 700;
    line-height: 1.35;
}

.checkout-segmented {
    display: inline-grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px;
    padding: 4px;
    border: 1px solid var(--lux-line);
    border-radius: 999px;
    background: var(--lux-soft);
}

.checkout-segmented button {
    min-width: 120px;
    min-height: 38px;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: var(--lux-black);
    font-weight: 850;
}

.checkout-segmented button.active {
    color: #fff;
    background: var(--lux-red);
}

.checkout-pickup-note {
    margin-top: 10px;
    border-radius: 10px;
    background: #fff8e6;
    border: 1px solid rgba(185, 150, 80, .25);
    padding: 10px 12px;
    color: #6f5630;
    font-size: .86rem;
}

.checkout-notes {
    min-height: 74px;
    resize: vertical;
}

.checkout-main-cta {
    width: min(100%, 280px);
    min-height: 48px;
    margin-top: 4px;
    font-weight: 900;
}

.checkout-form-trust,
.checkout-summary-trust {
    margin: 10px 0 0;
    color: var(--lux-muted);
    font-size: .78rem;
    line-height: 1.45;
}

.checkout-summary-card {
    position: sticky;
    top: 76px;
    padding: 18px;
}

.checkout-summary-head {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

.checkout-summary-head h2 {
    margin: 0;
    color: var(--lux-black);
    font-size: 1.08rem;
    font-weight: 900;
}

.checkout-summary-head a,
.checkout-help-link {
    color: var(--lux-red);
    font-size: .82rem;
    font-weight: 850;
    text-decoration: none;
}

.checkout-summary-items {
    display: grid;
    gap: 8px;
    max-height: 210px;
    overflow-y: auto;
    padding-right: 4px;
}

.checkout-summary-items div,
.checkout-total-box div,
.checkout-timing div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.checkout-summary-items span,
.checkout-total-box span,
.checkout-timing span {
    color: var(--lux-muted);
    font-size: .84rem;
}

.checkout-summary-items strong,
.checkout-total-box strong,
.checkout-timing strong {
    color: var(--lux-black);
    font-size: .86rem;
    white-space: nowrap;
}

.checkout-timing {
    display: grid;
    gap: 8px;
    margin: 14px 0;
    padding: 12px;
    border-radius: 12px;
    background: var(--lux-soft);
}

.checkout-total-box {
    display: grid;
    gap: 9px;
    border-top: 1px solid var(--lux-line);
    padding-top: 12px;
}

.checkout-total-box .total {
    margin-top: 3px;
}

.checkout-total-box .total span,
.checkout-total-box .total strong {
    color: var(--lux-black);
    font-size: 1.08rem;
    font-weight: 900;
}

.checkout-summary-cta {
    min-height: 46px;
    margin-top: 14px;
    font-weight: 900;
}

.checkout-mobile-cta {
    position: fixed;
    left: 12px;
    right: 12px;
    bottom: calc(10px + env(safe-area-inset-bottom));
    z-index: 1045;
}

.checkout-mobile-cta button {
    width: 100%;
    min-height: 48px;
    border: 0;
    border-radius: 999px;
    background: var(--lux-red);
    color: #fff;
    font-weight: 900;
    box-shadow: 0 16px 32px rgba(215, 25, 32, .25);
}

@media (max-width: 991.98px) {
    .checkout-page {
        padding-top: 12px;
        padding-bottom: 82px !important;
    }

    .checkout-progress {
        justify-content: flex-start;
    }

    .checkout-layout {
        row-gap: 14px;
    }

    .checkout-summary-card {
        position: static;
    }
}

@media (max-width: 767.98px) {
    .checkout-heading {
        margin-bottom: 10px;
    }

    .checkout-heading h1 {
        font-size: 1.8rem;
    }

    .checkout-heading p {
        font-size: .86rem;
    }

    .checkout-progress {
        gap: 7px;
        overflow-x: auto;
        padding-bottom: 2px;
    }

    .checkout-returning summary,
    .checkout-returning-header,
    .checkout-returning-body,
    .checkout-panel,
    .checkout-summary-card {
        padding-left: 12px;
        padding-right: 12px;
    }

    .checkout-lookup-form {
        grid-template-columns: 1fr;
    }

    .checkout-section {
        padding: 12px 0;
    }

    .checkout-segmented {
        width: 100%;
    }

    .checkout-segmented button {
        min-width: 0;
    }

    .checkout-main-cta,
    .checkout-summary-cta {
        display: none;
    }

    .checkout-body .floating-actions {
        display: none;
    }
}

/* Extra compact desktop menu cards: keep sparse categories from stretching. */
@media (min-width: 992px) {
    .premium-product-grid {
        grid-template-columns: repeat(auto-fill, minmax(190px, 210px));
        gap: 10px;
        justify-content: start;
    }

    .product-image-shell {
        aspect-ratio: 16 / 8;
    }

    .product-image-shell.has-image img {
        min-height: 0;
    }

    .product-content {
        padding: 10px;
    }

    .product-content h3 {
        min-height: 36px;
        margin-bottom: 4px;
        font-size: .88rem;
    }

    .product-content p {
        min-height: 32px;
        margin: 4px 0 10px;
        font-size: .78rem;
        line-height: 1.3;
    }

    .product-card-footer {
        gap: 6px;
    }

    .food-price {
        font-size: .88rem;
    }

    .premium-qty-stepper {
        width: 94px;
        grid-template-columns: 30px 34px 30px;
    }

    .premium-qty-stepper .qty-button,
    .premium-qty-stepper .qty-value {
        min-height: 32px;
        font-size: .82rem;
    }
}

@media (min-width: 992px) {
    .order-sidebar .premium-cart-header {
        position: sticky;
        top: 0;
        z-index: 2;
        margin: -18px -18px 12px;
        padding: 18px 18px 12px;
        border-bottom: 1px solid rgba(16, 16, 16, .06);
        background: rgba(255, 255, 255, .98);
        backdrop-filter: blur(10px);
    }
}

/* Controlled premium radius system: sharper, less playful geometry. */
:root {
    --radius-sm: 10px;
    --radius-md: 12px;
    --radius-lg: 14px;
}

.product-card,
.premium-cart-card,
.summary-panel,
.checkout-alert,
.checkout-returning,
.checkout-panel,
.checkout-summary-card,
.mobile-cart-panel {
    border-radius: var(--radius-lg) !important;
}

.mobile-cart-panel {
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

.mobile-order-bar {
    border-radius: var(--radius-lg) !important;
}

.form-control,
.form-select,
.checkout-page .form-control,
.order-search,
.promo-code-form input,
.cart-note-form textarea {
    border-radius: var(--radius-sm) !important;
}

.btn,
.btn-brand,
.btn-outline-dark,
.header-cart-btn,
.nav-cart-btn,
.premium-checkout-btn,
.premium-review-btn,
.mobile-order-primary,
.checkout-main-cta,
.checkout-summary-cta,
.checkout-mobile-cta button,
.checkout-lookup-form button,
.checkout-history-item button,
.checkout-saved-card button {
    border-radius: var(--radius-md) !important;
}

.category-pill,
.checkout-segmented,
.checkout-segmented button {
    border-radius: var(--radius-md) !important;
}

.premium-qty-stepper,
.qty-stepper {
    border-radius: var(--radius-md) !important;
}

.premium-qty-stepper .qty-button,
.premium-qty-stepper .qty-value,
.qty-stepper .qty-button,
.qty-stepper .qty-value,
.premium-qty-stepper.is-empty .qty-button.plus {
    border-radius: var(--radius-sm) !important;
}

.premium-qty-stepper.is-empty {
    border-radius: var(--radius-md) !important;
}

.dish-badge,
.cart-count-pill,
.product-image-mark,
.checkout-inline-note,
.checkout-pickup-note,
.checkout-timing,
.checkout-saved-card,
.checkout-history-item,
.auth-method-card,
.mobile-cart-close,
.empty-cart-icon,
.toast,
.alert {
    border-radius: var(--radius-sm) !important;
}

.product-image-shell::before {
    border-radius: var(--radius-sm) !important;
}

.floating-actions {
    align-items: end;
}

.floating-top {
    order: 1;
}

.floating-cart {
    order: 2;
    position: relative;
    background: var(--lux-red);
}

.floating-cart svg {
    width: 21px;
    height: 21px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.floating-cart-count {
    position: absolute;
    top: -7px;
    right: -7px;
    min-width: 19px;
    height: 19px;
    padding: 0 5px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 2px solid #fff;
    border-radius: 10px;
    background: var(--lux-black);
    color: #fff;
    font-size: .64rem;
    font-weight: 800;
    line-height: 1;
}

.floating-whatsapp {
    order: 3;
    width: 46px;
    min-width: 46px;
    padding: 0;
}

.floating-action {
    border-radius: var(--radius-sm) !important;
}

.floating-label-full {
    display: none;
}

.floating-label-short {
    display: inline;
}

/* Inter typography system: clean, modern, readable, and restrained. */
:root {
    --font-ui: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

html,
body,
button,
input,
select,
textarea,
.btn {
    font-family: var(--font-ui);
}

body {
    font-weight: 400;
    line-height: 1.5;
}

.order-hero-copy h1,
.checkout-heading h1 {
    font-weight: 800 !important;
    letter-spacing: 0;
}

.premium-category-heading h2,
.menu-category-header h2,
.premium-cart-header h2,
.checkout-section-heading h2,
.checkout-summary-head h2,
.checkout-total-box .total strong,
.checkout-total-box .total span {
    font-weight: 700 !important;
    letter-spacing: 0;
}

.product-content h3 {
    font-weight: 700 !important;
    letter-spacing: 0;
}

.order-hero-copy p,
.product-content p,
.premium-cart-empty p,
.premium-cart-empty small,
.menu-cart-item span,
.menu-cart-totals span,
.secure-checkout-note,
.checkout-heading p,
.checkout-returning summary small,
.checkout-saved-card p,
.checkout-history-item small,
.checkout-history-item span,
.checkout-summary-items span,
.checkout-total-box span,
.checkout-timing span,
.checkout-form-trust,
.checkout-summary-trust,
.form-text {
    font-weight: 400 !important;
}

.nav-link,
.form-label,
.checkout-section-heading span,
.form-label em,
.category-pill,
.food-price,
.menu-cart-item strong,
.menu-cart-totals strong,
.checkout-summary-items strong,
.checkout-total-box strong,
.checkout-timing strong,
.cart-count-pill {
    font-weight: 600 !important;
}

.btn,
.btn-brand,
.btn-outline-dark,
.header-cart-btn,
.nav-cart-btn,
.premium-checkout-btn,
.premium-review-btn,
.mobile-order-primary,
.checkout-main-cta,
.checkout-summary-cta,
.checkout-mobile-cta button,
.checkout-segmented button,
.qty-button {
    font-weight: 700 !important;
}

.eyebrow,
.dish-badge,
.product-image-mark {
    font-weight: 700 !important;
}

/* Cart overlap fix and tighter ordering density. */
@media (min-width: 992px) {
    .premium-order-page {
        padding-top: 10px;
    }

    .order-hero {
        padding-top: 10px;
        padding-bottom: 10px;
    }

    .premium-category-tabs {
        margin-bottom: 12px;
        padding-top: 10px;
        padding-bottom: 10px;
    }

    .premium-menu-category {
        margin-bottom: 22px !important;
    }

    .premium-category-heading {
        margin-bottom: 8px;
        padding-bottom: 8px;
    }

    .premium-product-grid {
        gap: 8px;
    }

    .product-content {
        padding: 9px;
        justify-content: flex-start;
    }

    .product-content p {
        min-height: 0;
        margin: 3px 0 10px;
    }

    .product-card-footer {
        margin-top: 0;
    }

    .order-sidebar .premium-cart-card {
        display: flex;
        max-height: calc(100vh - 86px);
        flex-direction: column;
        overflow: hidden;
        padding: 16px;
    }

    .order-sidebar .premium-cart-header {
        position: static;
        z-index: auto;
        flex: 0 0 auto;
        margin: 0 0 10px;
        padding: 0 0 10px;
        border-bottom: 1px solid rgba(16, 16, 16, .06);
        background: transparent;
        backdrop-filter: none;
    }

    .order-sidebar [data-cart-filled]:not(.d-none) {
        display: flex;
        min-height: 0;
        flex-direction: column;
    }

    .order-sidebar .menu-cart-items {
        flex: 1 1 auto;
        max-height: min(36vh, 300px);
        gap: 8px;
        margin-bottom: 14px;
        overflow-y: auto;
        padding-right: 4px;
    }

    .menu-cart-item {
        gap: 10px;
        font-size: .88rem;
        line-height: 1.32;
    }

    .menu-cart-totals {
        gap: 9px;
        padding: 13px 0;
        margin-bottom: 13px;
    }

    .menu-cart-totals > div {
        gap: 12px;
    }

    .menu-cart-totals .total {
        margin-top: 2px;
        padding-top: 10px;
        font-size: 1rem;
    }

    .premium-checkout-btn,
    .premium-review-btn {
        min-height: 44px;
    }

    .premium-review-btn {
        margin-top: 8px;
    }

    .secure-checkout-note {
        margin-top: 10px;
        font-size: .76rem;
        line-height: 1.35;
    }
}

@media (max-width: 767.98px) {
    .premium-product-grid {
        gap: 8px;
    }

    .product-content {
        padding: 9px;
    }

    .mobile-order-bar {
        padding-top: 7px;
        padding-bottom: calc(7px + env(safe-area-inset-bottom));
    }
}

/* Site-wide type scale refinement: smaller, cleaner, and denser. */
body {
    font-size: 15px;
}

.order-hero-copy h1,
.checkout-heading h1 {
    font-size: clamp(1.55rem, 2vw, 2.05rem) !important;
    line-height: 1.06 !important;
}

.order-hero-copy p:last-child,
.checkout-heading p,
.page-heading p,
.payment-hosted-header p {
    font-size: .84rem !important;
    line-height: 1.35;
}

.premium-category-heading h2,
.menu-category-header h2,
.premium-cart-header h2,
.checkout-section-heading h2,
.checkout-summary-head h2,
.summary-panel h2,
.payment-method-panel h2,
.payment-order-panel h2 {
    font-size: .98rem !important;
    line-height: 1.18 !important;
}

.page-heading h1,
.payment-hosted-header h1,
.payment-state h1 {
    font-size: clamp(1.2rem, 1.7vw, 1.45rem) !important;
    line-height: 1.16 !important;
}

.premium-category-heading p,
.menu-category-header p,
.checkout-returning summary,
.checkout-returning-header,
.checkout-saved-card,
.checkout-history-item,
.checkout-pickup-note,
.payment-small-print {
    font-size: .82rem !important;
    line-height: 1.36;
}

.category-pill,
.nav-link,
.form-label,
.checkout-section-heading span,
.form-label em,
.cart-count-pill,
.dish-badge,
.product-image-mark,
.eyebrow,
.form-text,
.small,
small {
    font-size: .76rem !important;
}

.product-content h3,
.cart-row h2 {
    font-size: .82rem !important;
    line-height: 1.22 !important;
}

.product-content p {
    font-size: .74rem !important;
    line-height: 1.28 !important;
}

.food-price,
.menu-cart-item,
.menu-cart-totals > div,
.checkout-summary-items div,
.checkout-total-box div,
.checkout-timing div,
.cart-row,
.payment-method,
.payment-order-panel .d-flex {
    font-size: .82rem !important;
}

.menu-cart-totals .total,
.checkout-total-box .total,
.summary-panel .h5,
.payment-order-panel .h5 {
    font-size: .98rem !important;
}

.btn,
.mobile-order-link,
.mobile-order-primary,
.checkout-segmented button,
.qty-button,
.qty-value {
    font-size: .84rem !important;
}

.form-control,
.form-select,
.checkout-page .form-control {
    min-height: 40px;
    font-size: .86rem !important;
}

.checkout-panel,
.checkout-summary-card,
.summary-panel,
.payment-method-panel,
.payment-order-panel {
    padding: 16px;
}

.checkout-heading,
.page-heading {
    margin-bottom: 12px !important;
}

.checkout-section {
    padding: 12px 0;
}

.checkout-section-heading {
    margin-bottom: 8px;
}

.checkout-summary-items,
.checkout-total-box,
.checkout-timing {
    gap: 7px;
}

@media (min-width: 992px) {
    .order-hero {
        gap: 14px;
    }

    .order-search {
        min-height: 42px;
        font-size: .84rem !important;
    }

    .product-content h3 {
        min-height: 32px;
    }

    .premium-cart-card,
    .order-sidebar .premium-cart-card {
        padding: 14px;
    }

    .premium-checkout-btn,
    .premium-review-btn {
        min-height: 42px;
    }
}

@media (max-width: 767.98px) {
    body {
        font-size: 14px;
    }

    .order-hero-copy h1,
    .checkout-heading h1 {
        font-size: 1.55rem !important;
        line-height: 1.06 !important;
    }

    .premium-category-heading h2,
    .menu-category-header h2 {
        font-size: 1rem !important;
    }

    .product-content h3 {
        min-height: 32px;
        font-size: 13px !important;
    }

    .food-price,
    .btn,
    .mobile-order-link,
    .mobile-order-primary {
        font-size: 13px !important;
    }

    .form-control,
    .form-select,
    .checkout-page .form-control {
        font-size: 14px !important;
    }

    .checkout-panel,
    .checkout-summary-card,
    .summary-panel {
        padding: 12px;
    }

    .checkout-history-heading {
        align-items: flex-start;
        flex-direction: column;
        gap: 2px;
    }

    .checkout-history-sort,
    .checkout-history-sort .form-select {
        width: 100%;
    }

    .checkout-history-item.reorder-card {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .reorder-card .btn {
        width: 100%;
    }

    .checkout-history-pagination a {
        min-width: 32px;
        min-height: 32px;
        padding: 0 9px;
    }

    .reorder-item-line {
        gap: 8px;
        font-size: 13px;
    }
}

/* Checkout saved-details clarity states. */
.checkout-state-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
    margin: 12px 0 8px;
}

.checkout-state-heading > div {
    display: grid;
    gap: 2px;
}

.checkout-state-heading strong {
    color: var(--lux-black);
    font-size: .88rem;
    font-weight: 700;
}

.checkout-state-heading span,
.checkout-history-helper,
.checkout-muted-message {
    margin: 0;
    color: var(--lux-muted);
    font-size: .78rem;
    line-height: 1.35;
}

.saved-details-found {
    align-items: flex-start;
    margin-bottom: 10px;
}

.saved-details-applied {
    align-items: flex-start;
    margin-bottom: 10px;
    border-color: rgba(28, 128, 76, .24) !important;
    background: linear-gradient(180deg, #fff 0, #f7fbf7 100%) !important;
}

.saved-details-copy {
    display: grid;
    min-width: 0;
    gap: 5px;
}

.saved-details-copy strong {
    color: var(--lux-black);
    font-size: .88rem;
    font-weight: 700;
}

.saved-details-copy p {
    margin: 0;
}

.saved-details-preview {
    display: grid;
    gap: 5px;
    margin: 0;
}

.saved-details-preview > div {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr);
    gap: 10px;
}

.saved-details-preview dt {
    color: var(--lux-muted);
    font-size: .75rem;
    font-weight: 600;
}

.saved-details-preview dd {
    min-width: 0;
    margin: 0;
    color: var(--lux-black);
    font-size: .8rem;
    font-weight: 650;
    word-break: break-word;
}

.saved-details-copy span {
    display: inline;
    margin-left: 8px;
}

.checkout-saved-actions {
    display: grid;
    flex: 0 0 auto;
    gap: 7px;
    justify-items: end;
}

.checkout-saved-actions a {
    color: var(--lux-muted);
    font-size: .74rem;
    font-weight: 600;
    text-decoration: none;
}

.checkout-saved-actions a:hover,
.checkout-saved-actions a:focus {
    color: var(--lux-red);
}

.saved-applied-title {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.saved-state-badge,
.reorder-loaded-badge {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    min-height: 22px;
    border: 1px solid rgba(28, 128, 76, .2);
    border-radius: 10px;
    padding: 0 8px;
    color: #2d714c;
    background: #f3fbf5;
    font-size: .72rem;
    font-weight: 700;
}

.current-details-summary {
    display: grid;
    gap: 8px;
    margin-top: 7px;
    border: 1px solid rgba(16, 16, 16, .08);
    border-radius: 12px;
    padding: 10px;
    background: rgba(255, 255, 255, .76);
}

.current-details-summary > span {
    margin-left: 0;
    color: var(--lux-black);
    font-size: .76rem;
    font-weight: 700;
}

.current-details-summary dl {
    display: grid;
    gap: 6px;
    margin: 0;
}

.current-details-summary dl > div {
    display: grid;
    grid-template-columns: 86px minmax(0, 1fr);
    gap: 10px;
}

.current-details-summary dt {
    color: var(--lux-muted);
    font-size: .74rem;
    font-weight: 500;
}

.current-details-summary dd {
    min-width: 0;
    margin: 0;
    color: var(--lux-black);
    font-size: .78rem;
    font-weight: 600;
    word-break: break-word;
}

.checkout-history-helper {
    margin-top: -2px;
    margin-bottom: 2px;
}

.reorder-card.is-loaded {
    border-color: rgba(28, 128, 76, .24);
    box-shadow: 0 10px 28px rgba(28, 128, 76, .08);
}

.checkout-field-filled {
    animation: checkout-field-fill 1.6s ease-out;
}

.checkout-cta-help {
    margin: 7px 0 0;
    color: var(--lux-muted);
    font-size: .76rem;
}

.checkout-save-address {
    margin-top: 12px;
    color: var(--lux-muted);
    font-size: .82rem;
}

.checkout-saved-address-note {
    display: grid;
    gap: 2px;
    margin-bottom: 10px;
    padding: 10px 12px;
    border: 1px solid rgba(17, 119, 77, .18);
    border-radius: var(--radius-md);
    background: rgba(17, 119, 77, .045);
}

.checkout-saved-address-note strong {
    color: var(--lux-black);
    font-size: .9rem;
    font-weight: 700;
}

.checkout-saved-address-note span {
    color: var(--lux-muted);
    font-size: .8rem;
    line-height: 1.35;
}

.checkout-section.saved-address-selected > .row,
.checkout-section.saved-address-selected .checkout-save-address {
    display: none;
}

/* Customer account: compact saved details and order history. */
.account-body {
    background: linear-gradient(180deg, #fff 0, #fbfaf7 280px, var(--lux-soft) 100%);
}

.account-page {
    max-width: 1180px;
    padding-top: 24px;
}

.account-heading {
    margin-bottom: 16px;
}

.account-heading h1 {
    margin: 0 0 4px;
    color: var(--lux-black);
    font-size: clamp(1.6rem, 3vw, 2.15rem);
    font-weight: 800;
}

.account-heading p {
    margin: 0;
    color: var(--lux-muted);
    font-size: .9rem;
}

.account-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 18px;
    align-items: start;
}

/* Customer authentication entry point. */
.auth-body {
    background: linear-gradient(180deg, #fff 0, #fbfaf7 260px, var(--lux-soft) 100%);
}

.auth-page {
    max-width: 1120px;
    padding-top: 34px;
    padding-bottom: 54px;
}

.auth-shell {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 420px;
    gap: 22px;
    align-items: stretch;
}

.auth-copy-panel,
.auth-card {
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-lg);
    background: #fff;
    box-shadow: var(--lux-shadow-card);
}

.auth-copy-panel {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 430px;
    padding: 34px;
    background:
        linear-gradient(135deg, rgba(215, 25, 32, .07), transparent 42%),
        linear-gradient(180deg, #fff, #fffaf3);
}

.auth-copy-panel h1 {
    max-width: 620px;
    margin: 0 0 10px;
    color: var(--lux-black);
    font-size: clamp(2rem, 4vw, 3rem);
    line-height: 1.02;
    font-weight: 800;
}

.auth-copy-panel p {
    max-width: 560px;
    margin: 0;
    color: var(--lux-muted);
    font-size: .98rem;
    line-height: 1.55;
}

.auth-benefits {
    display: grid;
    gap: 8px;
    margin: 24px 0 0;
    padding: 0;
    list-style: none;
}

.auth-benefits li {
    position: relative;
    padding-left: 18px;
    color: var(--lux-black);
    font-size: .9rem;
    font-weight: 700;
}

.auth-benefits li::before {
    content: "";
    position: absolute;
    left: 0;
    top: .55em;
    width: 7px;
    height: 7px;
    border-radius: 10px;
    background: var(--lux-red);
}

.auth-card {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 24px;
}

.auth-card h2 {
    margin: 14px 0 6px;
    color: var(--lux-black);
    font-size: 1.35rem;
    font-weight: 800;
}

.auth-muted,
.auth-privacy-copy {
    color: var(--lux-muted);
    font-size: .86rem;
    line-height: 1.45;
}

.auth-mode-switch {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px;
    padding: 4px;
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-md);
    background: var(--lux-soft);
}

.auth-mode-switch a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    border-radius: var(--radius-sm);
    color: var(--lux-black);
    font-size: .86rem;
    font-weight: 800;
    text-decoration: none;
}

.auth-mode-switch a.active {
    color: #fff;
    background: var(--lux-red);
}

.auth-google-slot {
    width: 100%;
    min-height: 44px;
    margin: 10px 0 0;
}

.auth-method-list {
    display: grid;
    gap: 10px;
    margin-top: 14px;
}

.auth-method-card {
    display: grid;
    width: 100%;
    gap: 10px;
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-lg);
    padding: 12px;
    background: #fff;
    color: var(--lux-black);
    text-align: left;
    text-decoration: none;
    box-shadow: 0 8px 22px rgba(20, 18, 16, .04);
}

.auth-method-card.is-ready {
    border-color: rgba(215, 25, 32, .18);
    background: linear-gradient(180deg, #fff, #fffaf8);
}

.auth-method-button {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    cursor: pointer;
    transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.auth-method-button:hover,
.auth-method-button:focus {
    color: var(--lux-black);
    border-color: var(--lux-line-strong);
    box-shadow: 0 12px 28px rgba(20, 18, 16, .08);
    transform: translateY(-1px);
}

.auth-method-copy {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.auth-method-copy strong {
    display: block;
    color: var(--lux-black);
    font-size: .9rem;
    font-weight: 800;
}

.auth-method-copy small {
    display: block;
    margin-top: 2px;
    color: var(--lux-muted);
    font-size: .76rem;
    line-height: 1.3;
}

.auth-method-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    min-width: 42px;
    height: 42px;
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-md);
    background: var(--lux-soft);
    color: var(--lux-black);
    font-size: .78rem;
    font-weight: 900;
}

.auth-method-status {
    justify-self: end;
    border: 1px solid rgba(185, 150, 80, .28);
    border-radius: var(--radius-sm);
    padding: 5px 8px;
    background: #fff9ea;
    color: #7b622c;
    font-size: .7rem;
    font-weight: 800;
    white-space: nowrap;
}

.auth-guest-method .auth-method-status {
    border-color: var(--lux-line);
    background: var(--lux-soft);
    color: var(--lux-muted);
}

.auth-divider {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 18px 0;
    color: var(--lux-muted);
    font-size: .78rem;
    font-weight: 700;
}

.auth-divider::before,
.auth-divider::after {
    content: "";
    flex: 1;
    height: 1px;
    background: var(--lux-line);
}

.auth-state-badge {
    width: fit-content;
    border: 1px solid rgba(28, 128, 76, .22);
    border-radius: var(--radius-sm);
    padding: 5px 9px;
    background: rgba(28, 128, 76, .06);
    color: #187447;
    font-size: .76rem;
    font-weight: 800;
}

.auth-summary {
    display: grid;
    gap: 10px;
    margin: 16px 0 18px;
    padding: 14px;
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-md);
    background: var(--lux-soft);
}

.auth-summary div {
    display: grid;
    grid-template-columns: 82px minmax(0, 1fr);
    gap: 10px;
}

.auth-summary dt {
    color: var(--lux-muted);
    font-size: .74rem;
    font-weight: 700;
}

.auth-summary dd {
    margin: 0;
    color: var(--lux-black);
    font-size: .84rem;
    font-weight: 700;
    word-break: break-word;
}

.auth-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.auth-logout-form {
    margin-top: 12px;
}

@media (max-width: 767.98px) {
    .site-navbar {
        min-height: 58px;
    }

    .site-navbar .container {
        gap: 8px;
    }

    .brand-logo {
        width: min(128px, 34vw);
    }

    .header-actions {
        gap: 7px !important;
    }

    .header-actions .nav-link {
        font-size: .78rem;
    }

    .header-actions .auth-nav-login {
        display: inline-flex !important;
    }

    .header-signup-btn,
    .header-cart-btn {
        min-height: 32px;
        padding: 6px 9px;
        font-size: .76rem;
    }

    .logged-in-pill {
        display: none;
    }

    .auth-page {
        padding-top: 14px;
        padding-bottom: 28px;
    }

    .auth-shell {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .auth-copy-panel {
        min-height: auto;
        padding: 18px;
    }

    .auth-copy-panel h1 {
        font-size: 1.85rem;
    }

    .auth-copy-panel p {
        font-size: .88rem;
    }

    .auth-benefits {
        margin-top: 14px;
        gap: 6px;
    }

    .auth-benefits li {
        font-size: .82rem;
    }

    .auth-card {
        padding: 16px;
    }

    .auth-card h2 {
        font-size: 1.15rem;
    }

    .auth-method-card {
        padding: 10px;
        gap: 8px;
    }

    .auth-method-button {
        grid-template-columns: 1fr;
    }

    .auth-method-icon {
        width: 38px;
        min-width: 38px;
        height: 38px;
    }

    .auth-method-copy strong {
        font-size: .84rem;
    }

    .auth-method-copy small {
        font-size: .72rem;
    }

    .auth-method-status {
        justify-self: start;
        margin-left: 48px;
    }

    .auth-summary div {
        grid-template-columns: 68px minmax(0, 1fr);
    }
}

@media (max-width: 420px) {
    .header-actions > .nav-link:first-child {
        display: none;
    }

    .header-actions .auth-nav-login {
        display: inline-flex !important;
    }
}

.account-main,
.account-side {
    display: grid;
    gap: 14px;
}

.account-side {
    position: sticky;
    top: 78px;
}

.account-card {
    border: 1px solid rgba(16, 16, 16, .07);
    border-radius: var(--radius-lg);
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 14px 34px rgba(16, 16, 16, .055);
    padding: 16px;
}

.account-section-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}

.account-section-head.compact {
    margin-bottom: 10px;
}

.account-section-head h2,
.account-summary-card h2 {
    margin: 0;
    color: var(--lux-black);
    font-size: 1rem;
    font-weight: 800;
}

.account-section-head > span {
    color: var(--lux-muted);
    font-size: .78rem;
    font-weight: 700;
    white-space: nowrap;
}

.account-section-divider {
    margin: 16px 0;
    border-top: 1px solid var(--lux-line);
}

.account-form-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 16px;
}

.account-form-actions .btn {
    min-width: 130px;
}

.account-required-note {
    margin: -2px 0 14px;
    padding: 10px 12px;
    border: 1px solid rgba(185, 150, 80, .24);
    border-radius: var(--radius-md);
    background: #fffaf0;
    color: var(--lux-muted);
    font-size: .82rem;
    line-height: 1.35;
    font-weight: 600;
}

.account-readonly-grid,
.account-address-summary {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.account-readonly-grid div,
.account-address-summary div {
    padding: 12px;
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-md);
    background: #fffdf9;
}

.account-readonly-grid span,
.account-address-summary span {
    display: block;
    margin-bottom: 4px;
    color: var(--lux-muted);
    font-size: .74rem;
    font-weight: 700;
}

.account-readonly-grid strong,
.account-address-summary strong {
    display: block;
    color: var(--lux-black);
    font-size: .9rem;
    line-height: 1.25;
    font-weight: 800;
    overflow-wrap: anywhere;
}

.account-summary-card p {
    margin: 6px 0 0;
    color: var(--lux-muted);
    font-size: .84rem;
    line-height: 1.4;
}

.account-safe-note {
    margin-top: 12px;
    border: 1px solid rgba(185, 150, 80, .24);
    border-radius: var(--radius-md);
    background: #fffaf0;
    color: #7b6a52;
    padding: 9px 10px;
    font-size: .78rem;
    font-weight: 650;
}

.account-orders {
    display: grid;
    gap: 8px;
}

.account-orders article {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    padding-bottom: 9px;
    border-bottom: 1px solid var(--lux-line);
}

.account-orders article:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.account-orders span,
.account-orders small {
    display: block;
}

.account-orders span {
    color: var(--lux-black);
    font-size: .82rem;
    font-weight: 650;
}

.account-orders small {
    margin-top: 3px;
    color: var(--lux-muted);
    font-size: .74rem;
}

.account-orders strong {
    color: var(--lux-black);
    font-size: .84rem;
    font-weight: 800;
    white-space: nowrap;
}

.account-actions-card {
    padding: 12px;
}

[data-checkout-submit].is-disabled,
[data-checkout-submit]:disabled {
    cursor: not-allowed;
    opacity: .56;
    box-shadow: none !important;
}

.reorder-confirm-modal .modal-content {
    border: 1px solid rgba(16, 16, 16, .08);
    border-radius: var(--radius-lg);
    box-shadow: 0 24px 70px rgba(16, 16, 16, .18);
}

.reorder-confirm-modal .modal-header,
.reorder-confirm-modal .modal-footer {
    border-color: var(--lux-line);
}

.reorder-confirm-modal .modal-title {
    margin: 0;
    color: var(--lux-black);
    font-size: 1.05rem;
    font-weight: 800;
}

.reorder-confirm-modal .modal-body p {
    color: var(--lux-muted);
    font-size: .86rem;
}

.reorder-modal-totals {
    display: grid;
    gap: 8px;
    border: 1px solid var(--lux-line);
    border-radius: 12px;
    padding: 10px;
    background: var(--lux-soft);
}

.reorder-modal-totals div {
    display: flex;
    justify-content: space-between;
    gap: 12px;
}

.reorder-modal-totals span {
    color: var(--lux-muted);
    font-size: .82rem;
}

.reorder-modal-totals strong {
    color: var(--lux-black);
    font-size: .86rem;
}

@keyframes checkout-field-fill {
    0% {
        border-color: rgba(28, 128, 76, .52);
        box-shadow: 0 0 0 4px rgba(28, 128, 76, .12);
        background: #f7fbf7;
    }

    100% {
        border-color: var(--lux-line-strong);
        box-shadow: none;
        background: #fff;
    }
}

@media (max-width: 767.98px) {
    .checkout-state-heading {
        margin: 10px 0 7px;
    }

    .checkout-auth-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .google-signin-slot {
        width: 100%;
    }

    .checkout-saved-card {
        flex-direction: column;
        align-items: stretch;
    }

    .checkout-saved-actions {
        justify-items: stretch;
    }

    .checkout-saved-actions .btn {
        width: 100%;
    }

    .saved-details-copy span {
        display: block;
        margin: 2px 0 0;
    }

    .current-details-summary dl > div {
        grid-template-columns: 72px minmax(0, 1fr);
    }

    .saved-details-preview > div {
        grid-template-columns: 66px minmax(0, 1fr);
    }

    .reorder-confirm-modal .modal-footer {
        display: grid;
        grid-template-columns: 1fr;
    }
}

@media (max-width: 991.98px) {
    .account-grid {
        grid-template-columns: 1fr;
    }

    .account-side {
        position: static;
    }
}

@media (max-width: 767.98px) {
    .account-page {
        padding-top: 14px;
    }

    .account-card {
        padding: 14px;
    }

    .account-section-head {
        display: grid;
        gap: 4px;
    }

    .account-form-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .account-form-actions .btn {
        width: 100%;
    }

    .account-readonly-grid,
    .account-address-summary {
        grid-template-columns: 1fr;
        gap: 8px;
    }
}

/* Premium cart funnel: compact review, sticky summary, secondary promo/note actions. */
.cart-body {
    background: linear-gradient(180deg, #fff 0, #fbfaf7 300px, var(--lux-soft) 100%);
}

.cart-body .cart-page {
    max-width: 1220px;
    padding-top: 24px;
    padding-bottom: 104px;
}

.cart-page-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 20px;
}

.cart-page-heading h1 {
    margin: 0 0 5px;
    color: var(--lux-black);
    font-size: clamp(1.55rem, 2.2vw, 2rem);
    line-height: 1.08;
    font-weight: 800;
    letter-spacing: 0;
}

.cart-page-heading p:not(.eyebrow) {
    margin: 0;
    color: var(--lux-muted);
    font-size: .88rem;
    line-height: 1.35;
}

.cart-continue-link {
    display: inline-flex;
    align-items: center;
    min-height: 38px;
    color: var(--lux-black);
    font-size: .86rem;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
}

.cart-continue-link:hover,
.cart-continue-link:focus {
    color: var(--lux-red);
}

.cart-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) clamp(360px, 30vw, 400px);
    gap: 24px;
    align-items: start;
}

.cart-main {
    min-width: 0;
}

.cart-body .cart-empty-state {
    max-width: 560px;
    padding: 30px 22px;
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-lg);
    background: #fff;
    box-shadow: 0 16px 36px rgba(16, 16, 16, .06);
    text-align: center;
}

.cart-body .cart-empty-state h2 {
    margin: 0 0 8px;
    color: var(--lux-black);
    font-size: 1.1rem;
    font-weight: 800;
}

.cart-body .cart-empty-state p {
    margin: 0 0 16px;
    color: var(--lux-muted);
    font-size: .88rem;
}

.cart-body .premium-cart-list {
    display: grid;
    gap: 10px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.cart-body .premium-cart-row {
    display: grid;
    grid-template-columns: 88px minmax(0, 1fr) 104px minmax(92px, auto) auto;
    gap: 14px;
    align-items: center;
    padding: 16px;
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-lg);
    background: #fff;
    box-shadow: 0 10px 28px rgba(16, 16, 16, .045);
    transition: opacity .18s ease, transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.cart-body .premium-cart-row:hover {
    border-color: var(--lux-line-strong);
    box-shadow: 0 14px 34px rgba(16, 16, 16, .07);
}

.cart-body .premium-cart-row img {
    width: 88px;
    height: 88px;
    object-fit: cover;
    border-radius: 12px;
    background:
        radial-gradient(circle at 75% 22%, rgba(185, 150, 80, .14), transparent 32%),
        linear-gradient(135deg, #f8f5ef 0%, #eee8dd 100%);
}

.cart-item-info {
    min-width: 0;
}

.cart-body .premium-cart-row h2 {
    display: -webkit-box;
    margin: 0 0 6px;
    overflow: hidden;
    color: var(--lux-black);
    font-size: .95rem !important;
    line-height: 1.22 !important;
    font-weight: 700;
    letter-spacing: 0;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.cart-item-info span {
    color: var(--lux-muted);
    font-size: .8rem;
    font-weight: 500;
}

.cart-body .cart-stepper {
    width: 104px;
    grid-template-columns: 32px 38px 32px;
    justify-self: end;
    overflow: hidden;
    border: 1px solid var(--lux-line-strong);
    border-radius: var(--radius-md);
    background: #fff;
}

.cart-body .cart-stepper .qty-button,
.cart-body .cart-stepper .qty-value {
    min-height: 34px;
    width: auto;
}

.cart-body .cart-stepper .qty-button {
    border: 0;
    background: #fff;
    color: var(--lux-black);
    font-size: .95rem !important;
    font-weight: 800;
}

.cart-body .cart-stepper .qty-button:hover,
.cart-body .cart-stepper .qty-button:focus {
    background: #f6f3ee;
}

.cart-body .cart-stepper .qty-button.plus {
    background: var(--lux-red);
    color: #fff;
}

.cart-body .cart-stepper .qty-button.plus:hover,
.cart-body .cart-stepper .qty-button.plus:focus {
    background: var(--lux-red-dark);
}

.cart-body .cart-stepper .qty-value {
    display: grid;
    place-items: center;
    border-inline: 1px solid var(--lux-line);
    color: var(--lux-black);
    font-size: .82rem !important;
    font-weight: 800;
}

.cart-body .cart-line-total {
    min-width: 92px;
    color: var(--lux-black);
    font-size: .9rem;
    font-weight: 800;
    text-align: right;
    white-space: nowrap;
}

.cart-remove-form {
    justify-self: end;
}

.cart-remove-link,
.cart-clear-form button {
    border: 0;
    background: transparent;
    color: #9b312d;
    font-size: .78rem;
    font-weight: 650;
    text-decoration: none;
    padding: 0;
}

.cart-remove-link:hover,
.cart-remove-link:focus,
.cart-clear-form button:hover,
.cart-clear-form button:focus {
    color: var(--lux-red);
    text-decoration: underline;
}

.cart-body .premium-cart-note {
    margin-top: 14px;
    padding: 14px;
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-lg);
    background: #fff;
    box-shadow: 0 10px 28px rgba(16, 16, 16, .045);
}

.cart-note-heading,
.cart-note-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.cart-note-heading {
    margin-bottom: 8px;
}

.cart-note-heading .form-label {
    margin: 0;
    color: var(--lux-black);
    font-size: .88rem !important;
    font-weight: 700 !important;
}

.cart-note-heading .form-label span,
.cart-note-heading > span,
.cart-note-footer span {
    color: var(--lux-muted);
    font-size: .76rem;
    font-weight: 500;
}

.cart-body .premium-cart-note textarea {
    min-height: 72px;
    resize: vertical;
    border-color: var(--lux-line-strong);
    font-size: .86rem !important;
    line-height: 1.45;
}

.cart-note-footer {
    margin-top: 8px;
}

.cart-note-footer .btn {
    min-height: 34px;
    padding: 5px 12px;
    font-size: .78rem !important;
}

.cart-clear-form {
    margin-top: 12px;
}

.cart-summary-column {
    min-width: 0;
}

.cart-body .premium-cart-summary {
    position: sticky;
    top: 82px;
    padding: 18px;
    border: 1px solid var(--lux-line);
    border-top: 1px solid var(--lux-line);
    border-radius: var(--radius-lg);
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 18px 48px rgba(16, 16, 16, .08);
}

.cart-summary-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 14px;
}

.cart-summary-head h2 {
    margin: 0;
    color: var(--lux-black);
    font-size: 1rem !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;
}

.cart-summary-head > span {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    min-height: 30px;
    padding: 0 10px;
    border: 1px solid rgba(185, 150, 80, .32);
    border-radius: var(--radius-sm);
    background: #fffaf0;
    color: #7b612b;
    font-size: .78rem;
    font-weight: 700;
    white-space: nowrap;
}

.cart-summary-lines {
    display: grid;
    gap: 10px;
    padding: 14px 0;
    border-top: 1px solid var(--lux-line);
    border-bottom: 1px solid var(--lux-line);
}

.cart-summary-lines > div {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    color: var(--lux-muted);
    font-size: .88rem;
}

.cart-summary-lines strong {
    color: var(--lux-black);
    font-weight: 750;
    white-space: nowrap;
}

.cart-summary-lines .cart-summary-total {
    margin-top: 4px;
    padding-top: 12px;
    border-top: 1px solid var(--lux-line);
    color: var(--lux-black);
    font-size: 1.02rem;
}

.cart-summary-lines .cart-summary-total strong {
    font-size: 1.1rem;
    font-weight: 800;
}

.cart-timing-box {
    display: grid;
    gap: 9px;
    margin: 14px 0 10px;
    padding: 12px;
    border-radius: var(--radius-md);
    background: #f7f4ef;
}

.cart-timing-box div {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    color: var(--lux-muted);
    font-size: .84rem;
}

.cart-timing-box strong {
    color: var(--lux-black);
    font-weight: 750;
}

.cart-summary-note {
    margin: 0 0 12px;
    color: var(--lux-muted);
    font-size: .75rem;
    line-height: 1.42;
}

.cart-promo-panel {
    margin-bottom: 14px;
}

.cart-promo-panel details {
    border-top: 1px solid var(--lux-line);
    border-bottom: 1px solid var(--lux-line);
    padding: 10px 0;
}

.cart-promo-panel summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    color: var(--lux-black);
    cursor: pointer;
    font-size: .84rem;
    font-weight: 700;
    list-style: none;
}

.cart-promo-panel summary::-webkit-details-marker {
    display: none;
}

.cart-promo-panel summary::after {
    content: "+";
    color: var(--lux-muted);
    font-size: .95rem;
    font-weight: 800;
}

.cart-promo-panel details[open] summary::after {
    content: "-";
}

.cart-promo-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    margin-top: 10px;
}

.cart-promo-form .form-control {
    min-height: 38px;
    font-size: .82rem !important;
}

.cart-promo-form .btn {
    min-height: 38px;
    padding-inline: 13px;
    font-size: .78rem !important;
}

.premium-promo-applied {
    align-items: center;
    padding: 10px;
    border-radius: var(--radius-md);
    background: #fff8e6;
}

.premium-promo-applied span,
.premium-promo-applied small {
    display: block;
    color: var(--lux-muted);
    font-size: .72rem;
}

.premium-promo-applied strong {
    display: block;
    color: var(--lux-black);
    font-size: .86rem;
}

.cart-checkout-cta {
    min-height: 46px;
    border-radius: var(--radius-md) !important;
    font-size: .9rem !important;
    font-weight: 800 !important;
    box-shadow: 0 14px 26px rgba(215, 25, 32, .2);
}

.cart-trust-text {
    display: grid;
    gap: 4px;
    margin-top: 12px;
    color: var(--lux-muted);
    font-size: .76rem;
    line-height: 1.35;
    text-align: center;
}

.cart-trust-text a {
    color: var(--lux-red);
    font-weight: 700;
    text-decoration: none;
}

.cart-trust-text a:hover,
.cart-trust-text a:focus {
    text-decoration: underline;
}

.cart-body .mobile-order-bar {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
}

.cart-body .mobile-order-bar.has-checkout {
    grid-template-columns: minmax(0, 1fr) auto;
}

.cart-body .mobile-order-bar.cart-empty {
    grid-template-columns: 1fr;
}

@media (max-width: 991.98px) {
    .cart-body .cart-page {
        padding-top: 18px;
    }

    .cart-layout {
        grid-template-columns: 1fr;
    }

    .cart-body .premium-cart-summary {
        position: static;
    }
}

@media (max-width: 767.98px) {
    .cart-body .cart-page {
        padding: 14px 12px 96px;
    }

    .cart-page-heading {
        align-items: flex-start;
        flex-direction: column;
        gap: 8px;
        margin-bottom: 14px;
    }

    .cart-page-heading h1 {
        margin-bottom: 4px;
        font-size: 1.55rem;
    }

    .cart-page-heading p:not(.eyebrow) {
        font-size: .82rem;
    }

    .cart-continue-link {
        min-height: 30px;
        font-size: .82rem;
    }

    .cart-layout {
        gap: 14px;
    }

    .cart-body .premium-cart-list {
        gap: 8px;
    }

    .cart-body .premium-cart-row {
        grid-template-columns: 72px minmax(0, 1fr);
        gap: 9px 10px;
        padding: 10px;
        border-radius: var(--radius-lg);
    }

    .cart-body .premium-cart-row img {
        grid-column: 1;
        grid-row: 1 / span 3;
        width: 72px;
        height: 72px;
        border-radius: var(--radius-sm);
    }

    .cart-item-info {
        grid-column: 2;
        grid-row: 1;
    }

    .cart-body .premium-cart-row h2 {
        margin-bottom: 4px;
        font-size: .88rem !important;
    }

    .cart-item-info span {
        font-size: .74rem;
    }

    .cart-body .cart-stepper {
        grid-column: 2;
        grid-row: 2;
        width: 96px;
        grid-template-columns: 30px 36px 30px;
        justify-self: start;
    }

    .cart-body .cart-stepper .qty-button,
    .cart-body .cart-stepper .qty-value {
        min-height: 32px;
    }

    .cart-body .cart-line-total {
        grid-column: 2;
        grid-row: 2;
        min-width: 0;
        justify-self: end;
        align-self: center;
        font-size: .86rem;
    }

    .cart-remove-form {
        grid-column: 2;
        grid-row: 3;
        justify-self: start;
    }

    .cart-body .premium-cart-note,
    .cart-body .premium-cart-summary {
        padding: 12px;
    }

    .cart-note-heading,
    .cart-note-footer {
        align-items: flex-start;
    }

    .cart-note-footer {
        flex-direction: column;
        gap: 7px;
    }

    .cart-note-footer .btn {
        width: auto;
    }

    .cart-summary-head,
    .cart-summary-lines {
        margin-bottom: 10px;
    }

    .cart-timing-box {
        margin-top: 10px;
        padding: 10px;
    }

    .cart-body .mobile-order-bar {
        left: 10px;
        right: 10px;
        padding-top: 7px;
        padding-bottom: calc(7px + env(safe-area-inset-bottom));
    }

    .cart-body .mobile-cart-summary,
    .cart-body .mobile-order-primary {
        min-height: 42px;
        border-radius: var(--radius-md) !important;
    }

    .cart-body .floating-actions {
        display: none;
    }
}

@media (max-width: 390px) {
    .cart-promo-form {
        grid-template-columns: 1fr;
    }
}

/* Unified premium system pass for admin and secondary funnel pages. */
.admin-body,
.admin-login-body {
    font-family: var(--font-ui);
    color: var(--lux-ink);
}

.admin-body {
    min-height: 100vh;
    background:
        linear-gradient(180deg, #fff 0, #fbfaf7 260px, var(--lux-soft) 100%);
}

.admin-navbar {
    min-height: 60px;
    padding: 0;
    border-bottom: 1px solid rgba(16, 16, 16, .07);
    background: rgba(255, 255, 255, .97);
    box-shadow: 0 8px 24px rgba(16, 16, 16, .055);
    backdrop-filter: blur(18px);
}

.admin-nav-container {
    max-width: 1360px;
    margin: 0 auto;
    padding-inline: 22px;
}

.admin-brand-link {
    color: var(--lux-black) !important;
    font-weight: 800;
    letter-spacing: 0;
}

.admin-brand-logo {
    width: min(160px, 42vw);
    max-width: none;
    padding: 0;
    border-radius: 0;
    background: transparent;
}

.admin-brand-link span {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 0 8px;
    border: 1px solid rgba(185, 150, 80, .32);
    border-radius: var(--radius-sm);
    background: #fffaf0;
    color: #7b612b;
    font-size: .75rem;
    font-weight: 700;
}

.admin-navbar-toggler {
    min-height: 36px;
    padding: 4px 8px;
    border-color: var(--lux-line-strong);
    border-radius: var(--radius-sm);
}

.admin-navbar .navbar-collapse {
    gap: 16px;
}

.admin-navbar .navbar-nav {
    gap: 4px;
    margin-left: 18px;
}

.admin-navbar .nav-link {
    display: inline-flex;
    align-items: center;
    min-height: 36px;
    padding: 0 10px !important;
    border-radius: var(--radius-md);
    color: var(--lux-muted) !important;
    font-size: .82rem !important;
    font-weight: 700 !important;
}

.admin-navbar .nav-link:hover,
.admin-navbar .nav-link:focus {
    color: var(--lux-black) !important;
    background: #f5f1eb;
}

.admin-navbar .nav-link.active {
    color: #fff !important;
    background: var(--lux-red);
    box-shadow: 0 10px 22px rgba(215, 25, 32, .14);
}

.admin-userbar {
    margin-left: auto;
}

.admin-userbar .navbar-text {
    color: var(--lux-muted) !important;
    font-size: .78rem !important;
    font-weight: 600;
}

.admin-logout-btn {
    min-height: 34px;
    padding-inline: 12px;
    border-color: var(--lux-line-strong);
    color: var(--lux-black);
    font-size: .78rem !important;
}

.admin-main {
    max-width: 1360px;
    padding: 24px 22px 54px !important;
}

.admin-main > .d-flex:first-child {
    margin-bottom: 18px !important;
}

.admin-main > .d-flex:first-child h1,
.admin-panel h1,
.admin-panel h2 {
    color: var(--lux-black);
    font-weight: 800;
    letter-spacing: 0;
}

.admin-main > .d-flex:first-child h1 {
    font-size: clamp(1.35rem, 1.9vw, 1.8rem) !important;
    line-height: 1.08;
}

.admin-panel h1,
.admin-panel h2 {
    font-size: 1rem !important;
    line-height: 1.2;
}

.admin-panel h3 {
    color: var(--lux-black);
    font-weight: 750;
}

.admin-panel,
.stat-card {
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-lg);
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 14px 36px rgba(16, 16, 16, .06);
}

.admin-panel {
    padding: 18px !important;
}

.stat-card {
    min-height: 112px;
    padding: 16px;
    border-top: 1px solid var(--lux-line);
    position: relative;
    overflow: hidden;
}

.stat-card::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: linear-gradient(180deg, var(--lux-red), var(--lux-gold));
}

.stat-card.stat-card-action::before {
    background: #2b7fc3;
}

.stat-card.stat-card-danger::before {
    background: #d71920;
}

.stat-card.stat-card-ok::before {
    background: #187447;
}

.stat-card span {
    display: block;
    color: var(--lux-muted);
    font-size: .78rem;
    font-weight: 600;
}

.stat-card strong {
    display: block;
    margin-top: 8px;
    color: var(--lux-black);
    font-size: clamp(1.35rem, 2.2vw, 1.75rem);
    line-height: 1;
    font-weight: 800;
}

.admin-body .row.g-4 {
    --bs-gutter-x: 18px;
    --bs-gutter-y: 18px;
}

.admin-body .row.g-3 {
    --bs-gutter-x: 12px;
    --bs-gutter-y: 12px;
}

.admin-body .table-responsive {
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-md);
    overflow: auto;
    background: #fff;
}

.admin-body .table {
    margin-bottom: 0;
    color: var(--lux-ink);
    font-size: .84rem;
}

.admin-body .table thead th {
    padding: 11px 12px;
    border-bottom: 1px solid var(--lux-line);
    background: #fbfaf7;
    color: var(--lux-muted);
    font-size: .7rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    white-space: nowrap;
}

.admin-body .table tbody td {
    padding: 12px;
    border-color: var(--lux-line);
    vertical-align: middle;
}

.admin-body .table tbody tr:hover td {
    background: #fffdfa;
}

.admin-body .table a {
    color: var(--lux-black);
    font-weight: 700;
    text-decoration: none;
}

.admin-body .table a:hover,
.admin-body .table a:focus {
    color: var(--lux-red);
}

.admin-body .small,
.admin-body small,
.admin-body .form-text {
    color: var(--lux-muted) !important;
}

.admin-body .form-control,
.admin-body .form-select,
.admin-login-body .form-control {
    min-height: 38px;
    border-color: var(--lux-line-strong);
    border-radius: var(--radius-sm) !important;
    color: var(--lux-black);
    font-size: .84rem !important;
}

.admin-body textarea.form-control {
    min-height: 82px;
}

.admin-body .form-label,
.admin-login-body .form-label {
    margin-bottom: 6px;
    color: var(--lux-black);
    font-size: .78rem !important;
    font-weight: 700 !important;
}

.admin-body .form-check-input {
    border-color: var(--lux-line-strong);
}

.admin-body .form-check-input:checked {
    border-color: var(--lux-red);
    background-color: var(--lux-red);
}

.admin-body .btn {
    min-height: 36px;
    padding: 6px 13px;
    font-size: .8rem !important;
    font-weight: 700 !important;
}

.admin-body .btn-sm {
    min-height: 32px;
    padding: 4px 10px;
    font-size: .74rem !important;
}

.admin-body .btn-outline-danger {
    --bs-btn-color: #9b312d;
    --bs-btn-border-color: #e3cbc8;
    --bs-btn-hover-bg: #9b312d;
    --bs-btn-hover-border-color: #9b312d;
    --bs-btn-hover-color: #fff;
}

.admin-body .badge {
    min-height: 24px;
    display: inline-flex;
    align-items: center;
    border-radius: var(--radius-sm);
    padding: 0 8px;
    font-weight: 700;
}

.admin-body .text-bg-light {
    border: 1px solid var(--lux-line-strong);
    background: #fbfaf7 !important;
    color: var(--lux-black) !important;
}

.admin-body .text-bg-secondary {
    background: #34302b !important;
}

.admin-body .text-bg-success {
    background: #167249 !important;
}

.admin-board-helper {
    color: var(--lux-muted);
    font-size: .78rem;
    line-height: 1.35;
}

.admin-ops-strip {
    display: grid;
    grid-template-columns: repeat(3, minmax(120px, 160px)) minmax(220px, 1fr);
    gap: 10px;
    align-items: stretch;
    margin-bottom: 12px;
}

.admin-ops-card,
.admin-ops-note {
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-md);
    background: #fff;
    padding: 12px;
    box-shadow: 0 10px 24px rgba(16, 16, 16, .045);
}

.admin-ops-card {
    position: relative;
    overflow: hidden;
}

.admin-ops-card::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--lux-muted);
}

.admin-ops-card.danger::before {
    background: #d71920;
}

.admin-ops-card.ok::before,
.admin-ops-card.ready::before {
    background: #187447;
}

.admin-ops-card.success::before {
    background: #187447;
}

.admin-ops-card.returned::before {
    background: #6f3b91;
}

.admin-ops-card.action::before {
    background: var(--lux-gold);
}

.admin-ops-card span {
    display: block;
    color: var(--lux-muted);
    font-size: .72rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.admin-ops-card strong {
    display: block;
    margin-top: 4px;
    color: var(--lux-black);
    font-size: 1.6rem;
    line-height: 1;
    font-weight: 800;
}

.admin-ops-note {
    display: flex;
    align-items: center;
    color: var(--lux-muted);
    font-size: .78rem;
    line-height: 1.4;
}

.admin-order-row td:first-child {
    border-left: 4px solid transparent;
}

.admin-order-row.order-row-overdue td {
    background: #fff2f1;
}

.admin-order-row.order-row-overdue td:first-child {
    border-left-color: #d71920;
}

.admin-order-row.order-row-urgent td {
    background: #fff8e8;
}

.admin-order-row.order-row-urgent td:first-child {
    border-left-color: var(--lux-gold);
}

.admin-order-row.order-row-active td:first-child {
    border-left-color: #2b7fc3;
}

.admin-order-row.order-row-ready td {
    background: #f3fbf6;
}

.admin-order-row.order-row-ready td:first-child,
.admin-order-row.order-row-complete td:first-child {
    border-left-color: #187447;
}

.admin-order-row.order-row-muted {
    opacity: .72;
}

.admin-order-row.order-row-declined td {
    background: #fff1f0;
}

.admin-order-row.order-row-declined td:first-child {
    border-left-color: #a91118;
}

.admin-order-row.order-row-returned td {
    background: #f8f1ff;
}

.admin-order-row.order-row-returned td:first-child {
    border-left-color: #6f3b91;
}

.order-sla-timer {
    display: inline-grid;
    min-width: 118px;
    gap: 2px;
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-md);
    padding: 7px 9px;
    background: #fff;
}

.order-sla-timer strong {
    color: var(--lux-black);
    font-size: .82rem;
    font-weight: 850;
    line-height: 1.1;
}

.order-sla-timer small {
    color: var(--lux-muted);
    font-size: .68rem;
    font-weight: 650;
    line-height: 1.25;
}

.order-sla-timer.is-overdue {
    border-color: rgba(215, 25, 32, .28);
    background: #fff1f0;
}

.order-sla-timer.is-overdue strong,
.order-sla-timer.is-overdue small {
    color: #a91118;
}

.order-sla-timer.is-urgent {
    border-color: rgba(185, 150, 80, .35);
    background: #fff8e6;
}

.order-sla-timer.is-ready,
.order-sla-timer.is-delivery,
.order-sla-timer.is-done,
.order-sla-timer.is-completed {
    border-color: rgba(24, 116, 71, .22);
    background: #f0fbf5;
}

.order-sla-timer.is-ready strong,
.order-sla-timer.is-delivery strong,
.order-sla-timer.is-done strong,
.order-sla-timer.is-completed strong {
    color: #187447;
}

.order-sla-timer.is-declined {
    border-color: rgba(215, 25, 32, .22);
    background: #fff1f0;
}

.order-sla-timer.is-declined strong {
    color: #a91118;
}

.order-sla-timer.is-returned {
    border-color: rgba(111, 59, 145, .22);
    background: #f8f1ff;
}

.order-sla-timer.is-returned strong {
    color: #6f3b91;
}

.admin-order-badge {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-sm);
    padding: 0 8px;
    background: #fbfaf7;
    color: var(--lux-black);
    font-size: .72rem;
    font-weight: 800;
    white-space: nowrap;
}

.order-badge-paid,
.order-badge-ready,
.order-badge-completed {
    border-color: rgba(24, 116, 71, .22);
    background: #f0fbf5;
    color: #187447;
}

.order-badge-pending,
.order-badge-preparing {
    border-color: rgba(185, 150, 80, .28);
    background: #fff8e6;
    color: #7b622c;
}

.order-badge-failed {
    border-color: rgba(215, 25, 32, .22);
    background: #fff1f0;
    color: #a91118;
}

.order-badge-returned {
    border-color: rgba(111, 59, 145, .22);
    background: #f8f1ff;
    color: #6f3b91;
}

.order-badge-new {
    border-color: rgba(43, 127, 195, .22);
    background: #eef7ff;
    color: #1e638f;
}

.admin-row-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.admin-detail-sla {
    display: grid;
    gap: 4px;
    margin-bottom: 14px;
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-md);
    padding: 12px;
    background: #fff;
}

.admin-detail-sla div {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
}

.admin-detail-sla span {
    color: var(--lux-muted);
    font-size: .78rem;
    font-weight: 800;
}

.admin-detail-sla strong span {
    color: var(--lux-black);
    font-size: 1.05rem;
}

.admin-detail-sla.order-row-overdue {
    border-color: rgba(215, 25, 32, .24);
    background: #fff2f1;
}

.admin-detail-sla.order-row-ready,
.admin-detail-sla.order-row-complete {
    border-color: rgba(24, 116, 71, .2);
    background: #f3fbf6;
}

.admin-detail-sla.order-row-declined {
    border-color: rgba(215, 25, 32, .24);
    background: #fff2f1;
}

.admin-detail-sla.order-row-returned {
    border-color: rgba(111, 59, 145, .24);
    background: #f8f1ff;
}

.admin-board-heading {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    align-items: end;
    margin-bottom: 18px;
}

.admin-board-heading h1 {
    margin: 0 0 4px;
    color: var(--lux-black);
    font-size: clamp(1.8rem, 3vw, 2.35rem);
    line-height: 1.05;
    font-weight: 800;
}

.admin-board-heading p:last-child {
    margin: 0;
    color: var(--lux-muted);
    font-size: .9rem;
}

.operator-stats {
    grid-template-columns: repeat(6, minmax(120px, 1fr));
}

.operator-board {
    display: grid;
    grid-template-columns: repeat(5, minmax(220px, 1fr));
    gap: 12px;
    margin-bottom: 18px;
    overflow-x: auto;
    padding-bottom: 4px;
}

.operator-column {
    min-width: 220px;
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-lg);
    background: rgba(255, 255, 255, .95);
    box-shadow: 0 14px 34px rgba(16, 16, 16, .055);
    overflow: hidden;
}

.operator-column-head {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    align-items: start;
    min-height: 96px;
    border-bottom: 1px solid var(--lux-line);
    padding: 14px;
    background: #fbfaf7;
}

.operator-column-head h2 {
    margin: 0;
    color: var(--lux-black);
    font-size: .98rem;
    line-height: 1.15;
    font-weight: 850;
}

.operator-column-head p {
    margin: 5px 0 0;
    color: var(--lux-muted);
    font-size: .72rem;
    line-height: 1.25;
}

.operator-column-head > strong {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 34px;
    height: 34px;
    border-radius: var(--radius-md);
    color: #fff;
    background: var(--lux-black);
    font-size: .9rem;
}

.operator-column-danger .operator-column-head {
    background: #fff1f0;
}

.operator-column-danger .operator-column-head > strong {
    background: #a91118;
}

.operator-column-hot .operator-column-head {
    background: #fff8e6;
}

.operator-column-hot .operator-column-head > strong {
    background: #9b6f1f;
}

.operator-column-delivery .operator-column-head,
.operator-column-success .operator-column-head {
    background: #f0fbf5;
}

.operator-column-delivery .operator-column-head > strong,
.operator-column-success .operator-column-head > strong {
    background: #187447;
}

.operator-column-returned .operator-column-head {
    background: #f8f1ff;
}

.operator-column-returned .operator-column-head > strong {
    background: #6f3b91;
}

.operator-card-list {
    display: grid;
    gap: 10px;
    max-height: calc(100vh - 300px);
    min-height: 220px;
    overflow-y: auto;
    padding: 10px;
}

.operator-empty {
    display: grid;
    place-items: center;
    min-height: 92px;
    border: 1px dashed var(--lux-line-strong);
    border-radius: var(--radius-md);
    color: var(--lux-muted);
    font-size: .78rem;
    font-weight: 700;
}

.operator-card {
    display: grid;
    gap: 10px;
    border: 1px solid var(--lux-line);
    border-left: 5px solid transparent;
    border-radius: var(--radius-lg);
    padding: 12px;
    background: #fff;
    box-shadow: 0 8px 22px rgba(16, 16, 16, .045);
}

.operator-card.order-row-overdue,
.operator-card.order-row-declined {
    border-left-color: #a91118;
    background: #fff7f6;
}

.operator-card.order-row-urgent {
    border-left-color: var(--lux-gold);
    background: #fffaf0;
}

.operator-card.order-row-active {
    border-left-color: #2b7fc3;
}

.operator-card.order-row-ready,
.operator-card.order-row-complete {
    border-left-color: #187447;
    background: #fafffc;
}

.operator-card.order-row-returned {
    border-left-color: #6f3b91;
    background: #fcf8ff;
}

.operator-card-top,
.operator-card-foot,
.operator-items div {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    align-items: center;
}

.operator-card-top a {
    color: var(--lux-black);
    font-size: .9rem;
    font-weight: 850;
    text-decoration: none;
}

.operator-card-customer {
    display: grid;
    gap: 2px;
}

.operator-card-customer strong {
    color: var(--lux-black);
    font-size: .88rem;
    font-weight: 800;
}

.operator-card-customer span,
.operator-items small {
    color: var(--lux-muted);
    font-size: .74rem;
    line-height: 1.25;
}

.operator-items {
    display: grid;
    gap: 5px;
}

.operator-items span {
    color: var(--lux-black);
    font-size: .78rem;
    font-weight: 650;
}

.operator-items em {
    color: var(--lux-muted);
    font-size: .72rem;
    font-style: normal;
    font-weight: 700;
    white-space: nowrap;
}

.operator-reason {
    border: 1px solid rgba(215, 25, 32, .18);
    border-radius: var(--radius-md);
    padding: 8px;
    background: #fff1f0;
}

.operator-card.order-row-returned .operator-reason {
    border-color: rgba(111, 59, 145, .2);
    background: #f8f1ff;
}

.operator-reason span {
    display: block;
    color: var(--lux-muted);
    font-size: .66rem;
    font-weight: 850;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.operator-reason p {
    margin: 3px 0 0;
    color: var(--lux-black);
    font-size: .76rem;
    line-height: 1.35;
    font-weight: 650;
}

.operator-card-foot strong {
    color: var(--lux-black);
    font-size: .92rem;
    font-weight: 850;
    white-space: nowrap;
}

@media (max-width: 991.98px) {
    .admin-ops-strip {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .admin-ops-note {
        grid-column: 1 / -1;
    }
}

@media (max-width: 767.98px) {
    .admin-ops-strip {
        grid-template-columns: 1fr 1fr;
    }

    .admin-ops-note {
        grid-column: 1 / -1;
    }

    .admin-body .table {
        min-width: 920px;
    }
}

.admin-thumb {
    width: 58px;
    height: 58px;
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-sm);
    background: #f8f5ef;
    object-fit: cover;
}

.sort-input {
    width: 76px;
}

.admin-body .input-group-text {
    border-color: var(--lux-line-strong);
    background: #fbfaf7;
    color: var(--lux-muted);
    font-size: .76rem;
}

.admin-body .list-group-item {
    border-color: var(--lux-line);
    color: var(--lux-ink);
    font-size: .84rem;
}

.admin-body dl {
    margin-bottom: 16px;
}

.admin-body dt {
    color: var(--lux-muted);
    font-weight: 700;
}

.admin-body dd {
    color: var(--lux-black);
}

.admin-login-body {
    min-height: 100vh;
    background:
        radial-gradient(circle at 18% 18%, rgba(185, 150, 80, .18), transparent 30%),
        linear-gradient(135deg, #100f0e 0%, #211a16 54%, #5c1215 100%);
}

.login-shell {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 20px;
}

.login-panel {
    width: min(100%, 420px);
    padding: 24px !important;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: var(--radius-lg);
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 30px 80px rgba(0, 0, 0, .26);
}

.login-logo {
    width: min(100%, 230px);
    height: auto;
}

.login-panel h1 {
    color: var(--lux-black);
    font-weight: 800;
    letter-spacing: 0;
}

.payment-state,
.payment-hosted-page,
.payment-method-panel,
.payment-order-panel {
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-lg);
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 16px 40px rgba(16, 16, 16, .065);
}

.payment-state {
    max-width: 620px;
    margin: 34px auto 0;
    padding: 28px;
}

.payment-state h1 {
    color: var(--lux-black);
    font-size: clamp(1.35rem, 2vw, 1.7rem) !important;
    font-weight: 800;
}

.payment-hosted-shell {
    padding: 26px 12px 54px;
    border-top: 0;
    background: linear-gradient(180deg, #fff 0, var(--lux-soft) 100%);
}

.payment-hosted-page {
    max-width: 1080px;
    padding: 20px;
}

.payment-test-banner,
.payment-lock,
.payment-badge {
    border-radius: var(--radius-sm);
}

.payment-method {
    border-radius: var(--radius-md);
}

.payment-action-card {
    border-radius: var(--radius-md);
}

/* Admin live orders board */
.live-orders-page {
    display: grid;
    gap: 14px;
}

.live-orders-toolbar {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) minmax(520px, auto);
    gap: 18px;
    align-items: end;
}

.live-orders-title h1 {
    margin: 0;
    color: var(--lux-black);
    font-size: clamp(1.8rem, 3vw, 2.35rem);
    line-height: 1.02;
    font-weight: 800;
}

.live-orders-title p:last-child {
    margin: 6px 0 0;
    color: var(--lux-muted);
    font-size: .86rem;
}

.live-title-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
}

.live-connection {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 28px;
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-sm);
    padding: 0 10px;
    background: #fbfaf7;
    color: var(--lux-muted);
    font-size: .76rem;
    font-weight: 800;
}

.live-connection span {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--lux-muted);
}

.live-connection.is-live {
    border-color: rgba(24, 116, 71, .22);
    background: #f0fbf5;
    color: #187447;
}

.live-connection.is-live span {
    background: #187447;
    box-shadow: 0 0 0 5px rgba(24, 116, 71, .12);
}

.live-connection.is-reconnecting,
.live-connection.is-polling {
    border-color: rgba(185, 150, 80, .32);
    background: #fff8e6;
    color: #7b612b;
}

.live-connection.is-reconnecting span,
.live-connection.is-polling span {
    background: var(--lux-gold);
}

.live-connection.is-offline {
    border-color: rgba(215, 25, 32, .24);
    background: #fff1f0;
    color: #a91118;
}

.live-connection.is-offline span {
    background: #d71920;
}

.live-toolbar-controls {
    display: grid;
    grid-template-columns: auto minmax(220px, 310px) minmax(150px, 190px) auto auto;
    gap: 8px;
    align-items: center;
}

.live-clock {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-sm);
    padding: 0 12px;
    background: #fff;
    color: var(--lux-black);
    font-size: .82rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
}

.live-search,
.live-filter {
    min-height: 38px !important;
}

.live-sound-toggle.is-off {
    color: var(--lux-muted) !important;
    border-color: var(--lux-line-strong) !important;
    background: #fbfaf7 !important;
}

.live-sound-warning {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    justify-content: space-between;
    border: 1px solid rgba(185, 150, 80, .32);
    border-radius: var(--radius-md);
    padding: 10px 12px;
    background: #fff8e6;
    color: #7b612b;
    font-size: .8rem;
}

.live-sound-warning strong {
    color: var(--lux-black);
}

.live-kpi-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(120px, 1fr));
    gap: 10px;
}

.live-kpi-card {
    display: flex;
    gap: 10px;
    align-items: center;
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-lg);
    padding: 11px 12px;
    background: #fff;
    box-shadow: 0 10px 24px rgba(16, 16, 16, .045);
}

.live-kpi-icon {
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-sm);
    background: #f7f4ef;
    color: var(--lux-black);
    font-size: .78rem;
    font-weight: 850;
}

.live-kpi-card span:not(.live-kpi-icon) {
    display: block;
    color: var(--lux-muted);
    font-size: .66rem;
    font-weight: 850;
    letter-spacing: .06em;
    line-height: 1.2;
    text-transform: uppercase;
}

.live-kpi-card strong {
    display: block;
    margin-top: 2px;
    color: var(--lux-black);
    font-size: 1.45rem;
    line-height: 1;
    font-weight: 800;
}

.live-kpi-card small {
    display: block;
    margin-top: 3px;
    color: var(--lux-muted);
    font-size: .68rem;
    line-height: 1.2;
}

.live-kpi-card.is-danger .live-kpi-icon {
    background: #fff1f0;
    color: #a91118;
}

.live-kpi-card.is-amber .live-kpi-icon {
    background: #fff8e6;
    color: #7b612b;
}

.live-kpi-card.is-green .live-kpi-icon {
    background: #f0fbf5;
    color: #187447;
}

.live-kpi-card.is-purple .live-kpi-icon {
    background: #f8f1ff;
    color: #6f3b91;
}

.live-board-layout {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    align-items: start;
}

.live-workflow-board {
    display: contents;
}

.live-exceptions-panel {
    display: grid;
    gap: 10px;
    min-width: 0;
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-lg);
    padding: 10px;
    background: #fff;
    box-shadow: 0 14px 34px rgba(16, 16, 16, .055);
}

.live-exceptions-title {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    align-items: center;
    padding: 0 2px;
}

.live-exceptions-title span {
    color: var(--lux-black);
    font-size: .8rem;
    font-weight: 850;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.live-exceptions-title small {
    color: var(--lux-muted);
    font-size: .72rem;
    font-weight: 700;
}

.live-board-column {
    min-width: 0;
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-lg);
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 14px 34px rgba(16, 16, 16, .055);
    overflow: hidden;
}

.live-exceptions-panel .live-board-column {
    box-shadow: none;
}

.live-column-head {
    position: static;
    z-index: 2;
    display: flex;
    justify-content: space-between;
    gap: 10px;
    align-items: start;
    min-height: 68px;
    border-bottom: 1px solid var(--lux-line);
    padding: 10px 12px;
    background: #fbfaf7;
}

.live-column-head h2 {
    margin: 0;
    color: var(--lux-black);
    font-size: .9rem;
    line-height: 1.15;
    font-weight: 850;
}

.live-column-head p {
    margin: 4px 0 0;
    color: var(--lux-muted);
    font-size: .68rem;
    line-height: 1.25;
}

.live-column-head strong {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 32px;
    height: 32px;
    border-radius: var(--radius-sm);
    background: var(--lux-black);
    color: #fff;
    font-size: .84rem;
}

.live-board-column.is-attention .live-column-head,
.live-board-column.is-declined .live-column-head {
    background: #fff1f0;
}

.live-board-column.is-attention .live-column-head strong,
.live-board-column.is-declined .live-column-head strong {
    background: #a91118;
}

.live-board-column.is-processing .live-column-head {
    background: #fff8e6;
}

.live-board-column.is-processing .live-column-head strong {
    background: #9b6f1f;
}

.live-board-column.is-delivery .live-column-head,
.live-board-column.is-done .live-column-head {
    background: #f0fbf5;
}

.live-board-column.is-delivery .live-column-head strong,
.live-board-column.is-done .live-column-head strong {
    background: #187447;
}

.live-board-column.is-returned .live-column-head {
    background: #f8f1ff;
}

.live-board-column.is-returned .live-column-head strong {
    background: #6f3b91;
}

.live-column-list {
    display: grid;
    gap: 4px;
    max-height: none;
    min-height: 0;
    overflow: visible;
    padding: 6px;
}

.live-board-column.is-compact .live-column-list {
    max-height: none;
    min-height: 0;
}

.live-order-card {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr) auto minmax(58px, .34fr) auto;
    gap: 5px;
    align-items: center;
    border: 1px solid transparent;
    border-left: 4px solid transparent;
    border-radius: 12px;
    min-height: 30px;
    padding: 3px 6px;
    background: #34302b;
    box-shadow: 0 8px 22px rgba(16, 16, 16, .045);
    cursor: pointer;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease, background .18s ease;
}

.live-order-card:hover,
.live-order-card:focus {
    border-color: rgba(255, 255, 255, .34);
    box-shadow: 0 12px 28px rgba(16, 16, 16, .13);
    outline: 0;
    transform: translateY(-.5px);
}

.live-order-card.order-row-overdue,
.live-order-card.order-row-declined {
    border-left-color: #a91118;
}

.live-order-card.order-row-urgent {
    border-left-color: var(--lux-gold);
}

.live-order-card.order-row-active {
    border-left-color: #9b6f1f;
}

.live-order-card.order-row-ready,
.live-order-card.order-row-complete {
    border-left-color: #187447;
}

.live-order-card.order-row-returned {
    border-left-color: #6f3b91;
}

.live-order-card.is-live-highlight {
    animation: live-order-highlight 1.2s ease-in-out 0s 4;
}

.live-order-card.is-section-needs_attention {
    background: #b71920;
}

.live-order-card.is-section-processing {
    background: #9b6f1f;
}

.live-order-card.is-section-delivery {
    background: #116f45;
}

.live-order-card.is-section-done {
    background: #145d3d;
}

.live-order-card.is-section-declined {
    background: #8f171c;
}

.live-order-card.is-section-returned {
    background: #6f3b91;
}

.live-order-number {
    min-width: 0;
    overflow: hidden;
    color: #fff;
    font-size: .8rem;
    font-weight: 850;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.live-row-items {
    min-width: 0;
    overflow: hidden;
    color: rgba(255, 255, 255, .92);
    font-size: .78rem;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.live-row-total {
    color: #fff;
    font-size: .78rem;
    font-weight: 850;
    white-space: nowrap;
}

.live-row-timer {
    display: inline-grid;
    min-width: 0;
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 9px;
    padding: 1px 5px;
    background: rgba(255, 255, 255, .14);
}

.live-row-timer strong {
    min-width: 0;
    overflow: hidden;
    color: #fff;
    font-size: .68rem;
    font-weight: 850;
    line-height: 1.1;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.live-row-timer small {
    display: none;
}

.live-row-timer.is-active {
    border-color: rgba(255, 255, 255, .24);
    background: rgba(255, 255, 255, .14);
}

.live-row-timer.is-urgent {
    border-color: rgba(255, 255, 255, .3);
    background: rgba(255, 255, 255, .18);
}

.live-row-timer.is-overdue,
.live-row-timer.is-failed,
.live-row-timer.is-declined {
    border-color: rgba(255, 255, 255, .32);
    background: rgba(255, 255, 255, .18);
}

.live-row-timer.is-overdue strong,
.live-row-timer.is-failed strong,
.live-row-timer.is-declined strong {
    color: #fff;
}

.live-row-timer.is-delivery,
.live-row-timer.is-done,
.live-row-timer.is-ready {
    border-color: rgba(255, 255, 255, .22);
    background: rgba(255, 255, 255, .14);
}

.live-row-timer.is-delivery strong,
.live-row-timer.is-done strong,
.live-row-timer.is-ready strong {
    color: #fff;
}

.live-row-timer.is-returned {
    border-color: rgba(255, 255, 255, .22);
    background: rgba(255, 255, 255, .14);
}

.live-row-timer.is-returned strong {
    color: #fff;
}

.live-row-actions {
    display: inline-flex;
    justify-content: flex-end;
    gap: 4px;
    align-items: center;
    white-space: nowrap;
}

.live-row-actions .btn {
    min-height: 22px;
    border-color: rgba(255, 255, 255, .5);
    padding: 1px 7px;
    color: #fff;
    font-size: .66rem !important;
    line-height: 1.05;
}

.live-row-actions .btn:hover,
.live-row-actions .btn:focus {
    border-color: #fff;
    background: rgba(255, 255, 255, .16);
    color: #fff;
}

/* Live board color refresh: light operator rows with status-led accents. */
.live-board-column {
    background: #fff;
    box-shadow: 0 12px 30px rgba(16, 16, 16, .045);
}

.live-board-column.is-attention .live-column-head,
.live-board-column.is-declined .live-column-head {
    background: linear-gradient(90deg, #fff5f5 0%, #fff 100%);
}

.live-board-column.is-processing .live-column-head {
    background: linear-gradient(90deg, #fff8e7 0%, #fff 100%);
}

.live-board-column.is-received .live-column-head,
.live-board-column.is-kitchen .live-column-head {
    background: linear-gradient(90deg, #fff8e7 0%, #fff 100%);
}

.live-board-column.is-delivery .live-column-head,
.live-board-column.is-dispatch .live-column-head {
    background: linear-gradient(90deg, #edfaff 0%, #fff 100%);
}

.live-board-column.is-done .live-column-head,
.live-board-column.is-delivered .live-column-head {
    background: linear-gradient(90deg, #effbf5 0%, #fff 100%);
}

.live-board-column.is-returned .live-column-head,
.live-board-column.is-exceptions .live-column-head {
    background: linear-gradient(90deg, #f8f2ff 0%, #fff 100%);
}

.live-column-list {
    gap: 0;
    padding: 6px 10px 9px;
    background: #fff;
}

.live-order-card {
    grid-template-columns: 50px minmax(0, 1fr) auto minmax(58px, .34fr) auto;
    gap: 8px;
    border: 0;
    border-bottom: 1px solid #eee9e1;
    border-left: 3px solid #d8d1c7;
    border-radius: 0;
    min-height: 34px;
    padding: 5px 8px;
    background: #fff !important;
    box-shadow: none;
}

.live-column-list .live-order-card:first-child {
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

.live-column-list .live-order-card:last-child {
    border-bottom: 0;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
}

.live-order-card:hover,
.live-order-card:focus {
    border-color: #eee9e1;
    border-left-color: currentColor;
    background: #fffdf9 !important;
    box-shadow: inset 0 0 0 1px rgba(16, 16, 16, .035);
    transform: none;
}

.live-order-card.is-section-needs_attention {
    color: #d71920;
    border-left-color: #d71920;
}

.live-order-card.is-section-processing {
    color: #c97900;
    border-left-color: #e18800;
}

.live-order-card.is-section-received,
.live-order-card.is-section-kitchen {
    color: #c97900;
    border-left-color: #e18800;
}

.live-order-card.is-section-delivery,
.live-order-card.is-section-dispatch {
    color: #007c83;
    border-left-color: #00898f;
}

.live-order-card.is-section-done,
.live-order-card.is-section-delivered {
    color: #137a4a;
    border-left-color: #15824f;
}

.live-order-card.is-section-declined,
.live-order-card.is-section-exceptions {
    color: #d71920;
    border-left-color: #d71920;
}

.live-order-card.is-section-returned {
    color: #7140a0;
    border-left-color: #7140a0;
}

.live-order-number,
.live-row-items,
.live-row-total {
    color: var(--lux-black);
}

.live-order-number {
    font-size: .78rem;
    font-weight: 850;
}

.live-row-items {
    font-size: .76rem;
    font-weight: 750;
}

.live-row-total {
    font-size: .76rem;
    font-weight: 800;
}

.live-row-timer {
    border-color: #ebe5dc;
    border-radius: 10px;
    padding: 2px 8px;
    background: #fbfaf7;
}

.live-row-timer strong {
    color: #746d64;
    font-size: .66rem;
}

.live-order-card.is-section-needs_attention .live-row-timer,
.live-order-card.is-section-declined .live-row-timer {
    border-color: rgba(215, 25, 32, .16);
    background: #fff6f6;
}

.live-order-card.is-section-needs_attention .live-row-timer strong,
.live-order-card.is-section-declined .live-row-timer strong {
    color: #d71920;
}

.live-order-card.is-section-processing .live-row-timer,
.live-order-card.is-section-received .live-row-timer,
.live-order-card.is-section-kitchen .live-row-timer {
    border-color: rgba(225, 136, 0, .18);
    background: #fff9ec;
}

.live-order-card.is-section-processing .live-row-timer strong,
.live-order-card.is-section-received .live-row-timer strong,
.live-order-card.is-section-kitchen .live-row-timer strong {
    color: #a96600;
}

.live-order-card.is-section-delivery .live-row-timer,
.live-order-card.is-section-dispatch .live-row-timer {
    border-color: rgba(0, 137, 143, .18);
    background: #effcfd;
}

.live-order-card.is-section-delivery .live-row-timer strong,
.live-order-card.is-section-dispatch .live-row-timer strong {
    color: #007c83;
}

.live-order-card.is-section-done .live-row-timer,
.live-order-card.is-section-delivered .live-row-timer {
    border-color: rgba(19, 122, 74, .18);
    background: #effbf5;
}

.live-order-card.is-section-done .live-row-timer strong,
.live-order-card.is-section-delivered .live-row-timer strong {
    color: #137a4a;
}

.live-order-card.is-section-returned .live-row-timer {
    border-color: rgba(113, 64, 160, .18);
    background: #faf5ff;
}

.live-order-card.is-section-returned .live-row-timer strong {
    color: #7140a0;
}

.live-row-actions .btn {
    min-height: 24px;
    border: 0;
    border-radius: 8px;
    box-shadow: none;
    color: #fff;
    font-size: .66rem !important;
}

.live-order-card.is-section-processing .live-row-actions .btn,
.live-order-card.is-section-received .live-row-actions .btn,
.live-order-card.is-section-kitchen .live-row-actions .btn {
    background: #d28700;
}

.live-order-card.is-section-delivery .live-row-actions .btn,
.live-order-card.is-section-dispatch .live-row-actions .btn {
    background: #00898f;
}

.live-order-card.is-section-done .live-row-actions .btn,
.live-order-card.is-section-delivered .live-row-actions .btn {
    background: #15824f;
}

.live-order-card.is-section-needs_attention .live-row-actions .btn,
.live-order-card.is-section-declined .live-row-actions .btn,
.live-order-card.is-section-exceptions .live-row-actions .btn {
    background: #d71920;
}

.live-order-card.is-section-returned .live-row-actions .btn {
    background: #7140a0;
}

.live-row-actions .btn:hover,
.live-row-actions .btn:focus {
    filter: brightness(.94);
    color: #fff;
}

.live-board-column.is-received .live-column-head strong,
.live-board-column.is-kitchen .live-column-head strong {
    background: #c97900;
}

.live-board-column.is-dispatch .live-column-head strong {
    background: #00898f;
}

.live-board-column.is-delivered .live-column-head strong {
    background: #15824f;
}

.live-board-column.is-exceptions .live-column-head strong {
    background: #7140a0;
}

.live-status-line {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    align-items: center;
    border-top: 1px solid var(--lux-line);
    padding-top: 10px;
    color: var(--lux-muted);
    font-size: .74rem;
    font-weight: 700;
}

.live-status-line strong {
    color: var(--lux-black);
}

.live-order-detail-panel {
    max-width: none;
}

.live-detail-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, .8fr) minmax(280px, .8fr);
    gap: 18px;
}

.live-order-drawer-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1200;
    display: flex;
    justify-content: flex-end;
    background: rgba(16, 16, 16, .34);
}

body.live-drawer-open {
    overflow: hidden;
}

.live-order-drawer-backdrop[hidden] {
    display: none;
}

.live-order-drawer {
    position: relative;
    width: min(460px, 100vw);
    height: 100%;
    overflow-y: auto;
    border-left: 1px solid var(--lux-line);
    background: #fff;
    box-shadow: -24px 0 60px rgba(16, 16, 16, .18);
    padding: 22px;
}

.live-drawer-close {
    position: absolute;
    top: 14px;
    right: 14px;
    width: 34px;
    height: 34px;
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-sm);
    background: #fff;
    color: var(--lux-black);
    font-size: 1.35rem;
    line-height: 1;
}

.live-drawer-head {
    display: flex;
    justify-content: space-between;
    gap: 36px;
    align-items: flex-start;
    margin-bottom: 14px;
}

.live-drawer-head h2 {
    margin: 0;
    color: var(--lux-black);
    font-size: 1.28rem;
    line-height: 1.15;
    font-weight: 800;
}

.live-drawer-badges {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.live-drawer-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin: 12px 0;
}

.live-drawer-grid > div,
.live-drawer-section {
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-md);
    background: #fbfaf7;
}

.live-drawer-grid > div {
    display: grid;
    gap: 2px;
    padding: 10px;
}

.live-drawer-grid span,
.live-drawer-section h3 {
    color: var(--lux-muted);
    font-size: .68rem;
    font-weight: 850;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.live-drawer-grid strong {
    min-width: 0;
    overflow-wrap: anywhere;
    color: var(--lux-black);
    font-size: .86rem;
    font-weight: 800;
}

.live-drawer-section {
    display: grid;
    gap: 9px;
    margin-top: 10px;
    padding: 12px;
}

.live-drawer-section h3 {
    margin: 0;
}

.live-drawer-section p {
    margin: 0;
    color: var(--lux-muted);
    font-size: .82rem;
    line-height: 1.4;
    overflow-wrap: anywhere;
}

.live-drawer-section p strong {
    color: var(--lux-black);
}

.live-drawer-items,
.live-drawer-total {
    display: grid;
    gap: 7px;
}

.live-drawer-items div,
.live-drawer-total div {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    color: var(--lux-black);
    font-size: .84rem;
}

.live-drawer-items span,
.live-drawer-total span {
    min-width: 0;
    overflow-wrap: anywhere;
}

.live-drawer-total .is-total {
    border-top: 1px solid var(--lux-line);
    padding-top: 8px;
    font-size: .98rem;
}

@keyframes live-order-highlight {
    0%,
    100% {
        box-shadow: 0 8px 22px rgba(16, 16, 16, .045);
        transform: translateY(0);
    }

    50% {
        border-color: rgba(215, 25, 32, .34);
        box-shadow: 0 16px 36px rgba(215, 25, 32, .16);
        transform: translateY(-2px);
    }
}

@media (max-width: 1320px) {
    .live-orders-toolbar {
        grid-template-columns: 1fr;
    }

    .live-toolbar-controls {
        grid-template-columns: auto minmax(220px, 1fr) minmax(150px, 190px) auto auto;
    }

    .live-board-layout {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 991.98px) {
    .live-kpi-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .live-toolbar-controls {
        grid-template-columns: 1fr 1fr;
    }

    .live-board-layout {
        grid-template-columns: 1fr;
    }

    .live-order-card {
        grid-template-columns: 46px minmax(0, 1fr) auto minmax(58px, .42fr) auto;
    }

    .live-detail-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767.98px) {
    .live-orders-page {
        gap: 10px;
    }

    .live-toolbar-controls {
        grid-template-columns: 1fr;
    }

    .live-kpi-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    .live-kpi-card {
        padding: 9px;
    }

    .live-board-layout {
        grid-template-columns: 1fr;
    }

    .live-order-card {
        grid-template-columns: minmax(112px, 1fr) auto auto;
    }

    .live-row-items,
    .live-row-timer {
        display: none;
    }

    .live-column-list {
        max-height: none;
    }
}

@media (max-width: 991.98px) {
    .admin-navbar .navbar-collapse {
        padding: 12px 0 14px;
    }

    .admin-navbar .navbar-nav {
        gap: 6px;
        margin: 12px 0;
    }

    .admin-navbar .nav-link {
        justify-content: flex-start;
        width: 100%;
        min-height: 38px;
        padding-inline: 12px !important;
    }

    .admin-userbar {
        align-items: flex-start !important;
        flex-direction: column;
        gap: 8px !important;
        margin-left: 0;
        padding-top: 10px;
        border-top: 1px solid var(--lux-line);
    }
}

@media (max-width: 767.98px) {
    .admin-nav-container {
        padding-inline: 12px;
    }

    .admin-brand-logo {
        width: min(142px, 54vw);
    }

    .admin-main {
        padding: 16px 12px 42px !important;
    }

    .admin-main > .d-flex:first-child {
        align-items: flex-start !important;
        flex-direction: column;
        gap: 10px;
    }

    .admin-main > .d-flex:first-child .btn {
        width: 100%;
    }

    .admin-panel {
        padding: 14px !important;
    }

    .stat-card {
        min-height: 96px;
        padding: 14px;
    }

    .admin-body .table {
        min-width: 680px;
        font-size: .8rem;
    }

    .admin-body .table thead th,
    .admin-body .table tbody td {
        padding: 10px;
    }

    .payment-state {
        margin-top: 18px;
        padding: 20px;
    }
}

/* Premium post-payment confirmation experience. */
.confirmation-body {
    min-height: 100vh;
    background:
        linear-gradient(180deg, #fff 0, #fbfaf7 280px, var(--lux-soft) 100%);
    color: var(--lux-ink);
}

.confirmation-body .floating-actions {
    display: none;
}

.confirmation-page {
    padding: 24px 14px 58px;
}

.confirmation-shell {
    width: min(100%, 1160px);
    margin: 0 auto;
}

.confirmation-hero {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr) minmax(220px, 280px);
    gap: 18px;
    align-items: center;
    padding: 20px;
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-lg);
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 18px 48px rgba(16, 16, 16, .07);
}

.confirmation-icon {
    display: grid;
    width: 52px;
    height: 52px;
    place-items: center;
    border-radius: var(--radius-lg);
    background: #f7f4ef;
    color: var(--lux-black);
    font-size: 1.4rem;
    font-weight: 800;
}

.confirmation-paid .confirmation-icon {
    border: 1px solid rgba(22, 114, 73, .2);
    background: #ecf8f1;
    color: #167249;
}

.confirmation-pending .confirmation-icon {
    border: 1px solid rgba(185, 150, 80, .28);
    background: #fff8e6;
    color: #7b612b;
}

.confirmation-failed .confirmation-icon,
.confirmation-cancelled .confirmation-icon {
    border: 1px solid rgba(155, 49, 45, .2);
    background: #fff0ee;
    color: #9b312d;
}

.confirmation-hero-copy h1 {
    margin: 0 0 6px;
    color: var(--lux-black);
    font-size: clamp(1.7rem, 3vw, 2.35rem);
    line-height: 1.05;
    font-weight: 800;
    letter-spacing: 0;
}

.confirmation-hero-copy .confirmation-greeting,
.tracking-greeting {
    margin: 0 0 4px;
    color: var(--lux-black);
    font-size: clamp(.98rem, 1.8vw, 1.16rem);
    line-height: 1.15;
    font-weight: 800;
}

.confirmation-hero-copy p:not(.eyebrow):not(.confirmation-greeting) {
    max-width: 640px;
    margin: 0;
    color: var(--lux-muted);
    font-size: .92rem;
    line-height: 1.4;
}

.confirmation-order-number {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 12px;
    padding: 8px 10px;
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-md);
    background: #fbfaf7;
}

.confirmation-order-number span {
    color: var(--lux-black);
    font-size: .86rem;
    font-weight: 800;
}

.confirmation-order-number button {
    min-height: 28px;
    border: 1px solid var(--lux-line-strong);
    border-radius: var(--radius-sm);
    background: #fff;
    color: var(--lux-black);
    font-size: .74rem;
    font-weight: 700;
    padding: 0 9px;
}

.confirmation-order-number button:hover,
.confirmation-order-number button:focus {
    border-color: var(--lux-red);
    color: var(--lux-red);
}

.confirmation-estimate-card {
    display: grid;
    gap: 5px;
    justify-self: end;
    width: 100%;
    padding: 14px;
    border: 1px solid rgba(185, 150, 80, .25);
    border-radius: var(--radius-lg);
    background: #fffaf0;
}

.confirmation-estimate-card span,
.confirmation-estimate-card small {
    color: #7b6a52;
    font-size: .78rem;
    font-weight: 600;
}

.confirmation-estimate-card strong {
    color: var(--lux-black);
    font-size: 1.35rem;
    line-height: 1;
    font-weight: 800;
}

.confirmation-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 380px;
    gap: 22px;
    align-items: start;
    margin-top: 22px;
}

.confirmation-main {
    display: grid;
    gap: 14px;
    min-width: 0;
}

.confirmation-card,
.confirmation-help-card {
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-lg);
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 14px 36px rgba(16, 16, 16, .055);
}

.confirmation-card {
    padding: 18px;
}

.confirmation-section-head {
    margin-bottom: 14px;
}

.confirmation-section-head h2 {
    margin: 0;
    color: var(--lux-black);
    font-size: 1rem;
    line-height: 1.2;
    font-weight: 800;
    letter-spacing: 0;
}

.confirmation-muted {
    color: var(--lux-muted);
    font-size: .78rem;
    line-height: 1.4;
}

.confirmation-timeline {
    display: grid;
    gap: 0;
    margin-bottom: 12px;
}

.confirmation-step {
    position: relative;
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 12px;
    align-items: start;
    min-height: 46px;
    color: var(--lux-muted);
}

.confirmation-step::after {
    content: "";
    position: absolute;
    left: 16px;
    top: 32px;
    bottom: 0;
    width: 1px;
    background: var(--lux-line);
}

.confirmation-step:last-child::after {
    display: none;
}

.confirmation-step span {
    position: relative;
    z-index: 1;
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;
    border: 1px solid var(--lux-line-strong);
    border-radius: var(--radius-sm);
    background: #fff;
    color: var(--lux-muted);
    font-size: .76rem;
    font-weight: 800;
}

.confirmation-step strong {
    padding-top: 7px;
    color: inherit;
    font-size: .9rem;
    font-weight: 700;
}

.confirmation-step.is-complete span {
    border-color: rgba(22, 114, 73, .25);
    background: #ecf8f1;
    color: #167249;
}

.confirmation-step.is-complete strong {
    color: var(--lux-black);
}

.confirmation-step.is-active span {
    border-color: rgba(215, 25, 32, .22);
    background: #fff1f2;
    color: var(--lux-red);
}

.confirmation-step.is-active strong {
    color: var(--lux-black);
}

.confirmation-details-list {
    display: grid;
    gap: 11px;
}

.confirmation-details-list > div {
    display: grid;
    grid-template-columns: 150px minmax(0, 1fr);
    gap: 16px;
    padding-bottom: 11px;
    border-bottom: 1px solid var(--lux-line);
}

.confirmation-details-list > div:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.confirmation-details-list span {
    color: var(--lux-muted);
    font-size: .8rem;
    font-weight: 650;
}

.confirmation-details-list strong {
    color: var(--lux-black);
    font-size: .86rem;
    font-weight: 700;
    line-height: 1.4;
}

.confirmation-help-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px;
}

.confirmation-help-card h2 {
    margin: 0 0 4px;
    color: var(--lux-black);
    font-size: 1rem;
    font-weight: 800;
}

.confirmation-help-card p {
    margin: 0;
    color: var(--lux-muted);
    font-size: .84rem;
    line-height: 1.4;
}

.confirmation-help-actions {
    display: flex;
    flex: 0 0 auto;
    gap: 9px;
}

.confirmation-help-card .btn {
    flex: 0 0 auto;
}

.confirmation-save-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px;
    border: 1px solid rgba(185, 150, 80, .24);
    border-radius: var(--radius-lg);
    background: #fffaf0;
    box-shadow: 0 14px 36px rgba(16, 16, 16, .05);
}

.confirmation-save-card h2 {
    margin: 0 0 5px;
    color: var(--lux-black);
    font-size: 1rem;
    font-weight: 800;
}

.confirmation-save-card p:not(.eyebrow) {
    margin: 0;
    color: #7b6a52;
    font-size: .84rem;
    line-height: 1.4;
}

.confirmation-save-actions {
    display: flex;
    flex: 0 0 auto;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;
}

.confirmation-save-actions .btn {
    min-height: 40px;
    font-size: .82rem !important;
}

.confirmation-no-thanks {
    color: var(--lux-muted);
    font-size: .8rem;
    font-weight: 700;
    text-decoration: none;
}

.confirmation-menu-link {
    display: none;
}

.confirmation-summary {
    position: sticky;
    top: 82px;
}

.confirmation-summary-card {
    box-shadow: 0 20px 52px rgba(16, 16, 16, .09);
}

.confirmation-items {
    display: grid;
    gap: 10px;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--lux-line);
}

.confirmation-items > div,
.confirmation-totals > div,
.confirmation-payment-box > div {
    display: flex;
    justify-content: space-between;
    gap: 16px;
}

.confirmation-items span,
.confirmation-totals span,
.confirmation-payment-box span {
    min-width: 0;
    color: var(--lux-muted);
    font-size: .84rem;
    line-height: 1.35;
}

.confirmation-items strong,
.confirmation-totals strong,
.confirmation-payment-box strong {
    color: var(--lux-black);
    font-size: .86rem;
    font-weight: 800;
    white-space: nowrap;
}

.confirmation-totals {
    display: grid;
    gap: 10px;
    padding: 14px 0;
    border-bottom: 1px solid var(--lux-line);
}

.confirmation-total-row {
    margin-top: 4px;
    padding-top: 12px;
    border-top: 1px solid var(--lux-line);
}

.confirmation-total-row span,
.confirmation-total-row strong {
    color: var(--lux-black);
    font-size: 1rem;
    font-weight: 800;
}

.confirmation-total-row strong {
    font-size: 1.14rem;
}

.confirmation-payment-box {
    display: grid;
    gap: 8px;
    margin: 14px 0;
    padding: 12px;
    border-radius: var(--radius-md);
    background: #f7f4ef;
}

.confirmation-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 9px;
}

.confirmation-actions .btn {
    min-height: 42px;
    border-color: var(--lux-line-strong);
    font-size: .82rem !important;
}

.confirmation-not-found-card {
    max-width: 620px;
    margin: 22px auto 0;
    text-align: center;
}

.confirmation-not-found-card h2 {
    color: var(--lux-black);
    font-size: 1.15rem;
    font-weight: 800;
}

.confirmation-not-found-card p {
    color: var(--lux-muted);
}

@media (max-width: 991.98px) {
    .confirmation-hero {
        grid-template-columns: 48px minmax(0, 1fr);
    }

    .confirmation-estimate-card {
        grid-column: 1 / -1;
        justify-self: stretch;
    }

    .confirmation-grid {
        grid-template-columns: 1fr;
    }

    .confirmation-summary {
        position: static;
    }
}

@media (max-width: 767.98px) {
    .confirmation-page {
        padding: 12px 10px 36px;
    }

    .confirmation-hero {
        grid-template-columns: 42px minmax(0, 1fr);
        gap: 12px;
        padding: 14px;
    }

    .confirmation-icon {
        width: 42px;
        height: 42px;
        font-size: 1.1rem;
    }

    .confirmation-hero-copy h1 {
        font-size: 1.55rem;
    }

    .confirmation-hero-copy .confirmation-greeting,
    .tracking-greeting {
        font-size: .98rem;
    }

    .confirmation-hero-copy p:not(.eyebrow):not(.confirmation-greeting) {
        font-size: .84rem;
    }

    .confirmation-order-number {
        width: 100%;
        justify-content: space-between;
        margin-top: 10px;
    }

    .confirmation-estimate-card {
        padding: 12px;
    }

    .confirmation-grid {
        gap: 12px;
        margin-top: 12px;
        display: flex;
        flex-direction: column;
    }

    .confirmation-main {
        display: contents;
    }

    .confirmation-main .confirmation-card:first-child {
        order: 1;
    }

    .confirmation-summary {
        order: 2;
    }

    .confirmation-main .confirmation-card:nth-of-type(2) {
        order: 3;
    }

    .confirmation-help-card {
        order: 4;
    }

    .confirmation-save-card {
        order: 5;
    }

    .confirmation-main {
        gap: 12px;
    }

    .confirmation-card {
        padding: 14px;
    }

    .confirmation-details-list > div {
        grid-template-columns: 1fr;
        gap: 4px;
    }

    .confirmation-help-card {
        align-items: stretch;
        flex-direction: column;
        padding: 14px;
    }

    .confirmation-save-card {
        align-items: stretch;
        flex-direction: column;
        padding: 14px;
    }

    .confirmation-help-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .confirmation-save-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .confirmation-help-card .btn,
    .confirmation-save-actions .btn {
        width: 100%;
    }

    .confirmation-menu-link {
        display: inline-flex;
    }

    .confirmation-summary-card .confirmation-actions {
        display: none;
    }

    .confirmation-actions {
        grid-template-columns: 1fr;
    }
}

.confirmation-live-card,
.tracking-summary-row,
.tracking-card,
.tracking-status-card {
    border: 1px solid var(--lux-line);
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 14px 38px rgba(16, 16, 16, .07);
}

.confirmation-live-card {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
    gap: 14px;
    align-items: center;
    margin: 16px 0 20px;
    padding: 16px;
}

.confirmation-live-card span,
.tracking-summary-row span,
.tracking-status-card span,
.tracking-address span {
    display: block;
    color: var(--lux-muted);
    font-size: .78rem;
    font-weight: 700;
}

.confirmation-live-card strong,
.tracking-summary-row strong,
.tracking-status-card strong {
    color: var(--lux-black);
    font-size: .98rem;
    font-weight: 800;
}

.confirmation-live-actions,
.tracking-actions {
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
}

.tracking-page {
    min-height: calc(100vh - 68px);
    padding: 24px 0 44px;
    background: linear-gradient(180deg, #fff 0, #fbfaf7 100%);
}

.tracking-shell {
    width: min(1120px, calc(100% - 28px));
    margin: 0 auto;
}

.tracking-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 280px;
    gap: 16px;
    align-items: stretch;
    margin-bottom: 14px;
}

.tracking-hero h1 {
    margin: 0;
    color: var(--lux-black);
    font-size: clamp(2rem, 4vw, 3rem);
    line-height: 1.05;
    font-weight: 800;
}

.tracking-greeting {
    margin-bottom: 5px;
}

.tracking-hero p:last-child {
    margin: 8px 0 0;
    color: var(--lux-muted);
    font-size: .98rem;
}

.tracking-status-card {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 4px;
    padding: 18px;
}

.tracking-status-card strong {
    color: var(--lux-red);
    font-size: 1.25rem;
}

.tracking-status-card small {
    color: var(--lux-muted);
    font-weight: 600;
}

.tracking-summary-row {
    display: grid;
    grid-template-columns: 1fr 1fr auto;
    gap: 14px;
    align-items: center;
    margin-bottom: 18px;
    padding: 14px 16px;
}

.tracking-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(280px, .85fr);
    gap: 18px;
}

.tracking-card {
    padding: 18px;
}

.tracking-card:nth-child(3) {
    grid-column: 1 / -1;
}

.tracking-section-head {
    margin-bottom: 14px;
}

.tracking-section-head h2 {
    margin: 0;
    color: var(--lux-black);
    font-size: 1.05rem;
    font-weight: 800;
}

.tracking-stepper {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 8px;
}

.tracking-step {
    min-height: 86px;
    padding: 12px 10px;
    border: 1px solid var(--lux-line);
    border-radius: 12px;
    background: #fbfaf7;
}

.tracking-step span {
    display: inline-flex;
    width: 24px;
    height: 24px;
    align-items: center;
    justify-content: center;
    margin-bottom: 8px;
    border-radius: 10px;
    background: #eee8de;
    color: var(--lux-muted);
    font-size: .78rem;
    font-weight: 800;
}

.tracking-step strong {
    display: block;
    color: var(--lux-muted);
    font-size: .86rem;
    line-height: 1.2;
    font-weight: 800;
}

.tracking-step.is-complete {
    border-color: rgba(20, 123, 74, .2);
    background: #f2fbf6;
}

.tracking-step.is-complete span {
    background: #147b4a;
    color: #fff;
}

.tracking-step.is-complete strong {
    color: #147b4a;
}

.tracking-step.is-active {
    border-color: rgba(215, 25, 32, .24);
    background: #fff5f5;
    box-shadow: inset 0 0 0 1px rgba(215, 25, 32, .1);
}

.tracking-step.is-active span {
    background: var(--lux-red);
    color: #fff;
}

.tracking-step.is-active strong {
    color: var(--lux-black);
}

.tracking-items {
    display: grid;
    gap: 10px;
}

.tracking-items > div {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--lux-line);
}

.tracking-items > div:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.tracking-items span {
    color: var(--lux-black);
    font-weight: 700;
}

.tracking-items strong {
    color: var(--lux-black);
    white-space: nowrap;
}

.tracking-address {
    padding: 14px;
    border-radius: 12px;
    background: #fbfaf7;
}

.tracking-address span {
    color: var(--lux-black);
    font-size: .98rem;
}

.tracking-muted {
    margin: 10px 0 0;
    color: var(--lux-muted);
    font-size: .86rem;
}

.tracking-missing-card {
    max-width: 620px;
    margin: 44px auto;
}

.tracking-missing-card h1 {
    color: var(--lux-black);
    font-size: 2rem;
    font-weight: 800;
}

.account-active-orders {
    display: grid;
    gap: 10px;
}

.account-active-orders article {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    padding: 12px;
    border: 1px solid var(--lux-line);
    border-radius: 12px;
    background: #fff;
}

.account-active-orders span,
.account-active-orders small {
    display: block;
    color: var(--lux-muted);
    font-size: .82rem;
    font-weight: 650;
}

.account-active-orders strong {
    display: block;
    color: var(--lux-black);
    font-size: .98rem;
    font-weight: 800;
}

@media (max-width: 767px) {
    .confirmation-live-card,
    .tracking-summary-row,
    .tracking-hero,
    .tracking-grid,
    .account-active-orders article {
        grid-template-columns: 1fr;
    }

    .confirmation-live-card,
    .tracking-summary-row {
        gap: 10px;
        padding: 12px;
    }

    .confirmation-live-actions,
    .tracking-actions {
        justify-content: stretch;
    }

    .confirmation-live-actions .btn,
    .tracking-actions .btn {
        flex: 1 1 auto;
    }

    .tracking-page {
        padding: 16px 0 28px;
    }

    .tracking-shell {
        width: min(100% - 24px, 1120px);
    }

    .tracking-hero h1 {
        font-size: 1.75rem;
    }

    .tracking-status-card,
    .tracking-card {
        padding: 14px;
    }

    .tracking-stepper {
        grid-template-columns: 1fr;
    }

    .tracking-step {
        display: grid;
        grid-template-columns: 28px 1fr;
        min-height: auto;
        gap: 10px;
        align-items: center;
        padding: 10px;
    }

    .tracking-step span {
        margin-bottom: 0;
    }
}

.tracking-progress-card {
    position: relative;
    grid-column: 1 / -1;
    overflow: hidden;
}

.tracking-progress-card::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at 18% 0, rgba(215, 25, 32, .055), transparent 24%),
        linear-gradient(135deg, rgba(185, 150, 80, .08), transparent 34%);
}

.tracking-grid .tracking-card:nth-child(3) {
    grid-column: auto;
}

.tracking-progress-card .tracking-section-head {
    position: relative;
    z-index: 2;
}

.tracking-stepper {
    --step-count: 5;
    --track-pad: 10%;
    --progress-width: 0%;
    position: relative;
    z-index: 1;
    grid-template-columns: repeat(var(--step-count), minmax(0, 1fr));
    gap: 10px;
    padding-top: 4px;
}

.tracking-stepper::before,
.tracking-stepper::after {
    content: "";
    position: absolute;
    top: 30px;
    left: var(--track-pad);
    height: 3px;
    border-radius: 999px;
    pointer-events: none;
}

.tracking-stepper::before {
    right: var(--track-pad);
    background: linear-gradient(90deg, rgba(234, 223, 206, .65), rgba(217, 195, 155, .72));
}

.tracking-stepper::after {
    width: var(--progress-width);
    background:
        linear-gradient(90deg, #147b4a, #d71920 58%, #fff0d0 72%, #d71920);
    background-size: 54px 100%;
    box-shadow:
        0 0 0 1px rgba(215, 25, 32, .06),
        0 0 16px rgba(215, 25, 32, .24);
    transition: width .55s ease;
}

.tracking-stepper.is-moving::after {
    animation: trackingEnergyFlow 1.15s linear infinite;
}

.tracking-stepper.is-finished::after {
    background: linear-gradient(90deg, #147b4a, #2da56e);
    box-shadow: 0 0 14px rgba(20, 123, 74, .16);
}

.tracking-step {
    position: relative;
    z-index: 2;
    min-height: 92px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .96), rgba(251, 250, 247, .96));
    transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

.tracking-step.is-complete,
.tracking-step.is-active {
    transform: translateY(-1px);
}

.tracking-step.is-active {
    box-shadow:
        inset 0 0 0 1px rgba(215, 25, 32, .12),
        0 14px 28px rgba(215, 25, 32, .1);
}

.tracking-step.is-active::after {
    content: "";
    position: absolute;
    top: 15px;
    left: 23px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .92);
    box-shadow: 0 0 16px rgba(215, 25, 32, .5);
    animation: trackingNodeSpark 1.35s ease-in-out infinite;
}

.tracking-step.is-active span {
    animation: trackingActiveNode 1.35s ease-in-out infinite;
}

@keyframes trackingEnergyFlow {
    from {
        background-position: 0 0;
    }
    to {
        background-position: 54px 0;
    }
}

@keyframes trackingActiveNode {
    0%, 100% {
        box-shadow: 0 0 0 0 rgba(215, 25, 32, .38), 0 0 12px rgba(215, 25, 32, .18);
    }
    50% {
        box-shadow: 0 0 0 7px rgba(215, 25, 32, 0), 0 0 20px rgba(215, 25, 32, .3);
    }
}

@keyframes trackingNodeSpark {
    0%, 100% {
        opacity: .25;
        transform: scale(.72);
    }
    50% {
        opacity: .95;
        transform: scale(1);
    }
}

@media (max-width: 767px) {
    .tracking-grid .tracking-card:nth-child(3) {
        grid-column: auto;
    }

    .tracking-stepper {
        grid-template-columns: 1fr;
        gap: 9px;
        padding-top: 0;
        padding-left: 4px;
    }

    .tracking-stepper::before,
    .tracking-stepper::after {
        top: 20px;
        bottom: 20px;
        left: 22px;
        width: 3px;
        height: auto;
    }

    .tracking-stepper::before {
        right: auto;
    }

    .tracking-stepper::after {
        width: 3px;
        height: var(--progress-width);
        max-height: calc(100% - 40px);
        background:
            linear-gradient(180deg, #147b4a, #d71920 58%, #fff0d0 72%, #d71920);
        background-size: 100% 54px;
        transition: height .55s ease;
    }

    .tracking-stepper.is-moving::after {
        animation: trackingEnergyFlowVertical 1.15s linear infinite;
    }

    .tracking-step.is-active::after {
        top: calc(50% - 5px);
        left: 17px;
    }
}

@keyframes trackingEnergyFlowVertical {
    from {
        background-position: 0 0;
    }
    to {
        background-position: 0 54px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .tracking-stepper.is-moving::after,
    .tracking-step.is-active::after,
    .tracking-step.is-active span {
        animation: none;
    }
}

/* Mobile header navigation: compact fixed access with a premium offcanvas menu. */
.site-navbar {
    position: sticky !important;
    top: 0;
    z-index: 1035;
}

.mobile-menu-button {
    display: inline-flex;
    width: 42px;
    height: 38px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 4px;
    border: 1px solid var(--lux-line-strong);
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 8px 20px rgba(16, 16, 16, .06);
}

.mobile-menu-button span {
    display: block;
    width: 18px;
    height: 2px;
    border-radius: 2px;
    background: var(--lux-black);
}

.mobile-nav-drawer {
    width: min(88vw, 360px);
    border-left: 1px solid var(--lux-line);
    background: #fffdf9;
    box-shadow: -18px 0 42px rgba(16, 16, 16, .14);
}

.mobile-nav-drawer .offcanvas-header {
    align-items: flex-start;
    padding: 18px 18px 12px;
    border-bottom: 1px solid var(--lux-line);
}

.mobile-nav-drawer .offcanvas-header h2 {
    margin: 0;
    color: var(--lux-black);
    font-size: 1.35rem;
    line-height: 1.1;
    font-weight: 800;
}

.mobile-menu-close {
    display: grid;
    width: 36px;
    height: 36px;
    place-items: center;
    border: 1px solid var(--lux-line-strong);
    border-radius: 10px;
    background: #fff;
    color: var(--lux-black);
    font-size: 1.25rem;
    line-height: 1;
}

.mobile-nav-drawer .offcanvas-body {
    padding: 12px;
}

.mobile-nav-list {
    display: grid;
    gap: 8px;
}

.mobile-nav-item {
    display: grid;
    gap: 3px;
    padding: 13px 14px;
    border: 1px solid var(--lux-line);
    border-radius: 14px;
    background: #fff;
    color: var(--lux-black);
    text-decoration: none;
    box-shadow: 0 10px 24px rgba(16, 16, 16, .045);
}

.mobile-nav-item span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: .94rem;
    line-height: 1.1;
    font-weight: 800;
}

.mobile-nav-item small {
    color: var(--lux-muted);
    font-size: .76rem;
    line-height: 1.25;
    font-weight: 500;
}

.mobile-nav-item.active,
.mobile-nav-item:hover,
.mobile-nav-item:focus {
    border-color: rgba(215, 25, 32, .28);
    background: #fff8f6;
    color: var(--lux-red);
}

.mobile-track-item i {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #cfc8bc;
}

.mobile-track-item.is-live i {
    background: var(--lux-red);
    animation: trackOrderPulse 1.35s ease-out infinite;
}

.mobile-track-item.is-live {
    border-color: rgba(215, 25, 32, .2);
    background: #fff6f4;
}

.mobile-track-item.is-disabled {
    color: #9c948a;
    background: #faf8f4;
    box-shadow: none;
}

/* Account dashboard polish: profile left, active order first, history as cards. */
.logged-in-pill {
    text-decoration: none;
}

.logged-in-pill:hover,
.logged-in-pill:focus,
.logged-in-pill.active {
    color: var(--lux-red);
    border-color: rgba(215, 25, 32, .24);
    background: #fff7f6;
}

.account-ready-card {
    border-color: rgba(185, 150, 80, .24);
}

.account-active-card {
    border-color: rgba(215, 25, 32, .16);
    background:
        linear-gradient(135deg, rgba(215, 25, 32, .055), transparent 42%),
        #fff;
    box-shadow: 0 18px 42px rgba(215, 25, 32, .075);
}

.account-active-order-card,
.account-empty-active {
    display: grid;
    gap: 8px;
}

.account-active-order-card > span,
.account-empty-active p {
    color: var(--lux-muted);
    font-size: .82rem;
    font-weight: 650;
}

.account-active-order-card > strong,
.account-empty-active strong {
    color: var(--lux-black);
    font-size: 1.02rem;
    line-height: 1.2;
    font-weight: 800;
}

.account-active-order-card small {
    color: var(--lux-muted);
    font-size: .8rem;
    font-weight: 650;
}

.account-progress {
    height: 7px;
    overflow: hidden;
    border-radius: 10px;
    background: #f0ebe3;
}

.account-progress span {
    display: block;
    height: 100%;
    min-width: 10px;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--lux-red), #147b4a);
}

.account-empty-active p {
    margin: 0;
    line-height: 1.35;
}

.account-order-history {
    display: grid;
    gap: 10px;
}

.account-history-order {
    display: grid;
    gap: 7px;
    padding: 10px;
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-md);
    background: #fff;
    box-shadow: none;
}

.account-history-main,
.account-history-meta {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    align-items: center;
}

.account-history-main > div {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.account-history-main strong,
.account-history-main b {
    color: var(--lux-black);
    font-size: .88rem;
    line-height: 1.15;
    font-weight: 850;
}

.account-history-main span {
    display: block;
    overflow: hidden;
    color: var(--lux-muted);
    font-size: .76rem;
    line-height: 1.25;
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.account-history-main b {
    white-space: nowrap;
}

.account-history-meta span,
.account-history-meta i {
    color: var(--lux-muted);
    font-size: .72rem;
    line-height: 1;
    font-style: normal;
    font-weight: 700;
}

.account-history-meta i {
    border: 1px solid rgba(185, 150, 80, .26);
    border-radius: var(--radius-sm);
    padding: 4px 6px;
    background: #fffaf0;
    color: #80642b;
    font-weight: 800;
    white-space: nowrap;
}

.account-history-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 7px;
}

.account-history-actions form,
.account-history-actions .btn {
    width: 100%;
    min-height: 34px;
    padding: 6px 8px;
    font-size: .78rem;
    border-radius: var(--radius-sm);
}

.account-history-more {
    display: grid;
    gap: 9px;
}

.account-history-more summary {
    min-height: 38px;
    display: grid;
    place-items: center;
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-md);
    background: #fbfaf7;
    color: var(--lux-black);
    cursor: pointer;
    font-size: .8rem;
    font-weight: 800;
    list-style: none;
}

.account-history-more summary::-webkit-details-marker {
    display: none;
}

.account-history-more[open] summary {
    margin-bottom: 9px;
}

.account-action-stack {
    display: grid;
    gap: 8px;
}

@media (max-width: 767.98px) {
    .account-history-actions {
        grid-template-columns: 1fr;
    }

    .account-history-top {
        display: grid;
        gap: 6px;
    }
}

@media (max-width: 991.98px) {
    .desktop-header-actions {
        display: none !important;
    }

    .site-navbar {
        min-height: 58px !important;
        padding: 0 !important;
    }

    .site-navbar .container {
        min-height: 58px;
        display: flex;
        align-items: center;
    }

    .brand-logo {
        width: min(142px, 42vw) !important;
    }
}

@media (min-width: 992px) {
    .mobile-menu-button {
        display: none !important;
    }
}

/* Order Manager: dedicated staff access and compact operations board. */
.manager-body .admin-main {
    max-width: 1500px;
}

.manager-navbar .admin-brand-link span {
    border-color: rgba(201, 154, 46, .32);
    background: #fffaf0;
    color: #7b612b;
}

.manager-userbar .navbar-text {
    color: var(--lux-muted) !important;
    font-size: .78rem !important;
    font-weight: 700;
}

.manager-orders-page {
    gap: 10px;
    padding-bottom: 20px;
}

.manager-orders-page .live-orders-title h1 {
    font-size: clamp(1.55rem, 2.1vw, 2rem);
}

.manager-orders-page .live-orders-title p:last-child {
    max-width: 620px;
}

.manager-orders-toolbar {
    position: sticky;
    top: 62px;
    z-index: 20;
    border: 1px solid rgba(16, 16, 16, .055);
    border-radius: var(--radius-lg);
    padding: 12px;
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 14px 34px rgba(16, 16, 16, .06);
    backdrop-filter: blur(14px);
}

.manager-orders-page .live-toolbar-controls {
    grid-template-columns: auto minmax(230px, 1fr) minmax(140px, 170px) auto auto;
}

.manager-command-bar {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
}

.manager-command-card {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    column-gap: 10px;
    align-items: center;
    min-height: 52px;
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-lg);
    padding: 9px 11px;
    background: #fff;
    box-shadow: 0 10px 24px rgba(16, 16, 16, .04);
    overflow: hidden;
}

.manager-command-card::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--lux-line-strong);
}

.manager-command-card span {
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-sm);
    background: #fbfaf7;
    color: var(--lux-black);
    font-size: .72rem;
    font-weight: 850;
    grid-row: span 2;
}

.manager-command-card strong {
    color: var(--lux-black);
    font-size: .84rem;
    line-height: 1.12;
    font-weight: 800;
}

.manager-command-card small {
    color: var(--lux-muted);
    font-size: .68rem;
    line-height: 1.25;
}

.manager-command-card.is-received::before,
.manager-command-card.is-kitchen::before {
    background: #d28700;
}

.manager-command-card.is-received span,
.manager-command-card.is-kitchen span {
    background: #fff8e7;
    color: #9b6500;
}

.manager-command-card.is-dispatch::before {
    background: #00898f;
}

.manager-command-card.is-dispatch span {
    background: #edfaff;
    color: #007c83;
}

.manager-command-card.is-done::before {
    background: #15824f;
}

.manager-command-card.is-done span {
    background: #effbf5;
    color: #137a4a;
}

.manager-focus-tabs {
    display: flex;
    gap: 8px;
    align-items: center;
    overflow-x: auto;
    padding: 2px;
    scrollbar-width: thin;
}

.manager-focus-tabs button {
    min-height: 36px;
    border: 1px solid var(--lux-line-strong);
    border-radius: var(--radius-md);
    padding: 0 14px;
    background: #fff;
    color: var(--lux-black);
    font-size: .78rem;
    font-weight: 800;
    white-space: nowrap;
    transition: background .16s ease, color .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.manager-focus-tabs button:hover,
.manager-focus-tabs button:focus {
    border-color: rgba(215, 25, 32, .25);
    background: #fff7f6;
}

.manager-focus-tabs button.active {
    border-color: var(--lux-red);
    background: var(--lux-red);
    color: #fff;
    box-shadow: 0 10px 20px rgba(215, 25, 32, .14);
}

.manager-kpi-grid .live-kpi-card {
    min-height: 66px;
    padding: 9px 10px;
}

.manager-kpi-grid .live-kpi-icon {
    width: 29px;
    height: 29px;
    font-size: .72rem;
}

.manager-kpi-grid .live-kpi-card strong {
    font-size: 1.18rem;
}

.manager-board-layout {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.manager-board-layout .live-column-head {
    min-height: 58px;
    padding: 11px 12px;
}

.manager-board-layout .live-column-list {
    min-height: 98px;
    padding: 6px 8px 9px;
}

.manager-orders-page .live-board-column {
    border-color: rgba(16, 16, 16, .08);
    box-shadow: 0 18px 38px rgba(16, 16, 16, .055);
}

.manager-orders-page .live-column-head h2 {
    font-size: .92rem;
}

.manager-orders-page .live-column-head p {
    font-size: .7rem;
}

.manager-orders-page .operator-empty {
    min-height: 64px;
    display: grid;
    place-items: center;
    border: 1px dashed var(--lux-line-strong);
    border-radius: var(--radius-md);
    color: var(--lux-muted);
    font-size: .78rem;
    font-weight: 700;
}

.manager-orders-page .live-order-card {
    grid-template-columns: 48px minmax(0, 1fr) auto minmax(64px, .22fr) minmax(62px, auto);
    gap: 7px;
    min-height: 36px;
    border-left-width: 4px;
    padding: 5px 7px;
}

.manager-orders-page .live-order-card:hover,
.manager-orders-page .live-order-card:focus {
    background: #fffaf6 !important;
    box-shadow: inset 0 0 0 1px rgba(215, 25, 32, .07), 0 8px 18px rgba(16, 16, 16, .035);
}

.manager-orders-page .live-order-number {
    font-size: .74rem;
}

.manager-orders-page .live-row-items {
    font-size: .74rem;
}

.manager-orders-page .live-row-total {
    color: var(--lux-black);
    font-size: .72rem;
}

.manager-orders-page .live-row-timer {
    justify-self: end;
    min-width: 62px;
    text-align: center;
    padding-inline: 6px;
}

.manager-orders-page .live-row-actions:empty {
    display: none;
}

.manager-orders-page .live-row-actions .btn {
    min-height: 24px;
    padding: 3px 8px;
    font-size: .65rem !important;
}

.manager-orders-page .live-order-drawer {
    width: min(540px, 100vw);
}

.manager-orders-page .live-drawer-head {
    padding-bottom: 12px;
    border-bottom: 1px solid var(--lux-line);
}

.manager-orders-page .live-drawer-section form,
.manager-orders-page form.live-drawer-section {
    border: 1px solid rgba(215, 25, 32, .11);
    border-radius: var(--radius-lg);
    padding: 12px;
    background: #fffafa;
}

.manager-drawer-next-action {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    border: 1px solid rgba(215, 25, 32, .12);
    border-radius: var(--radius-lg);
    margin: 0 0 12px;
    padding: 12px;
    background: linear-gradient(90deg, #fff7f5 0%, #fff 100%);
}

.manager-drawer-next-action span {
    display: block;
    color: var(--lux-red);
    font-size: .66rem;
    font-weight: 850;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.manager-drawer-next-action strong {
    display: block;
    color: var(--lux-black);
    font-size: .95rem;
    line-height: 1.2;
}

/* Tablet-first Order Manager workspace. */
.manager-workspace-body {
    min-height: 100vh;
    background: #f7f5f1;
}

.manager-workspace-body .manager-main {
    max-width: none;
    padding: 12px 14px 18px;
}

.manager-workspace-body .alert {
    margin: 0 0 10px;
}

.manager-ops-topbar {
    position: sticky;
    top: 0;
    z-index: 60;
    display: grid;
    grid-template-columns: minmax(210px, .9fr) auto minmax(260px, 1.05fr) auto minmax(360px, auto);
    gap: 10px;
    align-items: center;
    border: 1px solid rgba(16, 16, 16, .07);
    border-radius: var(--radius-lg);
    padding: 10px;
    background: rgba(255, 255, 255, .97);
    box-shadow: 0 16px 38px rgba(16, 16, 16, .075);
    backdrop-filter: blur(16px);
}

.manager-ops-brand {
    display: inline-flex;
    gap: 10px;
    align-items: center;
    min-width: 0;
    color: var(--lux-black);
    text-decoration: none;
}

.manager-ops-brand img {
    width: 138px;
    max-width: 48vw;
    height: 30px;
    object-fit: contain;
}

.manager-ops-brand span {
    border-left: 1px solid var(--lux-line-strong);
    padding-left: 10px;
    color: var(--lux-red);
    font-size: .82rem;
    font-weight: 850;
    letter-spacing: .04em;
    text-transform: uppercase;
    white-space: nowrap;
}

.manager-ops-status,
.manager-ops-metrics,
.manager-ops-actions {
    display: inline-flex;
    gap: 8px;
    align-items: center;
    min-width: 0;
}

.manager-ops-search {
    min-width: 0;
}

.manager-ops-search .form-control {
    min-height: 48px;
    border-radius: var(--radius-md);
    font-size: 1rem;
}

.manager-ops-metrics span {
    display: inline-flex;
    gap: 7px;
    align-items: center;
    min-height: 48px;
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-md);
    padding: 0 12px;
    background: #fff;
    color: var(--lux-muted);
    font-size: .92rem;
    font-weight: 800;
    white-space: nowrap;
}

.manager-ops-metrics span.is-late {
    border-color: rgba(169, 17, 24, .2);
    background: #fff5f5;
    color: #a91118;
}

.manager-ops-metrics strong {
    color: var(--lux-black);
    font-size: 1.1rem;
    font-variant-numeric: tabular-nums;
}

.manager-ops-actions .btn,
.manager-ops-status .live-clock,
.manager-ops-status .live-connection {
    min-height: 48px;
    border-radius: var(--radius-md);
    font-size: .92rem !important;
    font-weight: 800;
}

.manager-ops-actions .btn {
    display: inline-flex;
    gap: 7px;
    align-items: center;
    justify-content: center;
    padding-inline: 12px;
    white-space: nowrap;
}

.manager-orders-page {
    gap: 12px;
}

.manager-orders-page .manager-board-layout {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    align-items: stretch;
}

.manager-workflow-column {
    min-height: calc(100vh - 150px);
    background: #fff;
}

.manager-workflow-column .live-column-head {
    position: sticky;
    top: 78px;
    z-index: 5;
    min-height: 76px;
    padding: 14px 15px;
}

.manager-workflow-column .live-column-head h2 {
    font-size: 1.18rem;
    letter-spacing: 0;
}

.manager-workflow-column .live-column-head p {
    max-width: 280px;
    font-size: 1rem;
}

.manager-workflow-column .live-column-head strong {
    min-width: 42px;
    height: 42px;
    font-size: 1.05rem;
}

.manager-workflow-column .live-column-list {
    display: grid;
    gap: 12px;
    max-height: calc(100vh - 235px);
    overflow-y: auto;
    padding: 12px;
    background: #fff;
}

.manager-workflow-column .operator-empty {
    min-height: 170px;
    border-radius: var(--radius-lg);
    font-size: 1rem;
}

.manager-order-card {
    display: grid;
    gap: 12px;
    border: 1px solid var(--lux-line);
    border-left: 6px solid var(--lux-red);
    border-radius: var(--radius-lg);
    padding: 14px;
    background: #fff;
    box-shadow: 0 14px 30px rgba(16, 16, 16, .075);
    cursor: pointer;
    transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.manager-order-card:hover,
.manager-order-card:focus {
    outline: 0;
    transform: translateY(-1px);
    box-shadow: 0 18px 38px rgba(16, 16, 16, .11);
}

.manager-order-card.is-section-kitchen {
    border-left-color: #d28700;
}

.manager-order-card.is-section-dispatch {
    border-left-color: #007c83;
}

.manager-order-card.is-late {
    border-color: rgba(169, 17, 24, .28);
    border-left-color: #8f171c;
    background: #fff8f8;
}

.manager-order-card-head {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: flex-start;
}

.manager-order-card-head strong,
.manager-order-card-head b {
    color: var(--lux-black);
    font-size: 1.1rem;
    line-height: 1.15;
    font-weight: 850;
}

.manager-order-card-head span {
    display: block;
    margin-top: 3px;
    color: var(--lux-muted);
    font-size: 1rem;
    font-weight: 700;
}

.manager-order-meta {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
}

.manager-order-meta div,
.manager-order-items,
.manager-order-note {
    display: grid;
    gap: 3px;
}

.manager-order-meta span,
.manager-order-items span,
.manager-order-note span {
    color: var(--lux-muted);
    font-size: 1rem;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
}

.manager-order-meta strong,
.manager-order-items strong,
.manager-order-note strong {
    min-width: 0;
    overflow: hidden;
    color: var(--lux-black);
    font-size: 1rem;
    line-height: 1.28;
    font-weight: 750;
    text-overflow: ellipsis;
}

.manager-order-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.manager-order-badges span {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-sm);
    padding: 0 10px;
    background: #fbfaf7;
    color: var(--lux-muted);
    font-size: 1rem;
    font-weight: 800;
}

.manager-order-badges .is-payment {
    border-color: rgba(19, 122, 74, .2);
    background: #effbf5;
    color: #137a4a;
}

.manager-order-badges .is-status {
    border-color: rgba(215, 25, 32, .18);
    background: #fff6f5;
    color: var(--lux-red);
}

.manager-order-card.is-section-kitchen .manager-order-badges .is-status {
    border-color: rgba(210, 135, 0, .24);
    background: #fff8e7;
    color: #9b6500;
}

.manager-order-card.is-section-dispatch .manager-order-badges .is-status {
    border-color: rgba(0, 124, 131, .24);
    background: #edfaff;
    color: #007c83;
}

.manager-order-note {
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-md);
    padding: 10px;
    background: #fbfaf7;
}

.manager-order-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.manager-order-actions form {
    display: contents;
}

.manager-main-action,
.manager-secondary-action {
    min-height: 48px;
    border-radius: var(--radius-md);
    font-size: 1rem !important;
    font-weight: 850;
}

.manager-main-action {
    grid-column: 1 / -1;
    border: 0;
    background: var(--lux-red);
    color: #fff;
    box-shadow: 0 12px 24px rgba(215, 25, 32, .16);
}

.manager-order-card.is-section-kitchen .manager-main-action {
    background: #d28700;
    box-shadow: 0 12px 24px rgba(210, 135, 0, .15);
}

.manager-order-card.is-section-dispatch .manager-main-action {
    background: #007c83;
    box-shadow: 0 12px 24px rgba(0, 124, 131, .15);
}

.manager-secondary-action {
    border: 1px solid var(--lux-line-strong);
    background: #fff;
    color: var(--lux-black);
}

.manager-view-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1200;
    display: flex;
    justify-content: flex-end;
    background: rgba(16, 16, 16, .34);
}

.manager-view-backdrop[hidden] {
    display: none;
}

.manager-view-panel {
    position: relative;
    width: min(520px, 100vw);
    height: 100%;
    overflow-y: auto;
    border-left: 1px solid var(--lux-line);
    background: #fff;
    box-shadow: -24px 0 60px rgba(16, 16, 16, .18);
    padding: 22px;
}

.manager-view-panel h2 {
    margin: 0 44px 14px 0;
    color: var(--lux-black);
    font-size: 1.65rem;
    font-weight: 850;
}

.manager-panel-search {
    min-height: 48px;
    margin-bottom: 14px;
    border-radius: var(--radius-md);
    font-size: 1rem;
}

.manager-panel-list {
    display: grid;
    gap: 12px;
}

.manager-panel-order {
    display: grid;
    gap: 8px;
    border: 1px solid var(--lux-line);
    border-left: 5px solid #15824f;
    border-radius: var(--radius-lg);
    padding: 14px;
    background: #fff;
}

.manager-panel-order.is-exception {
    border-left-color: #a91118;
    background: #fff8f8;
}

.manager-panel-order.is-compact {
    gap: 7px;
    border-left-width: 4px;
    padding: 11px;
    box-shadow: none;
}

.manager-panel-order.is-compact .manager-panel-actions {
    justify-content: flex-start;
}

.manager-panel-order.is-compact .manager-panel-actions .btn {
    min-height: 34px;
    padding: 6px 12px;
    font-size: .78rem !important;
}

.manager-panel-order-head,
.manager-panel-actions {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    align-items: center;
}

.manager-panel-order-head strong,
.manager-panel-order-head span {
    color: var(--lux-black);
    font-size: 1rem;
    font-weight: 850;
}

.manager-panel-order p,
.manager-panel-order small {
    margin: 0;
    color: var(--lux-muted);
    font-size: .95rem;
    line-height: 1.35;
    font-weight: 650;
}

.manager-panel-reason {
    border-radius: var(--radius-md);
    padding: 10px;
    background: #fff;
    color: #a91118;
    font-size: .95rem;
    font-weight: 800;
}

/* Rider delivery workspace. */
.rider-orders-page {
    display: grid;
    gap: 12px;
}

.rider-ops-topbar {
    grid-template-columns: minmax(210px, .75fr) auto minmax(250px, 1fr) auto auto;
}

.rider-board-layout {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.rider-column {
    min-width: 0;
    min-height: calc(100vh - 150px);
    overflow: hidden;
    border: 1px solid rgba(16, 16, 16, .08);
    border-radius: var(--radius-lg);
    background: #fff;
    box-shadow: 0 18px 38px rgba(16, 16, 16, .055);
}

.rider-column-head {
    position: sticky;
    top: 78px;
    z-index: 5;
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: flex-start;
    min-height: 78px;
    border-bottom: 1px solid var(--lux-line);
    padding: 14px 15px;
    background: #fff;
}

.rider-column.is-ready .rider-column-head {
    background: linear-gradient(90deg, #edfaff 0%, #fff 100%);
}

.rider-column.is-soon .rider-column-head {
    background: linear-gradient(90deg, #fff8e7 0%, #fff 100%);
}

.rider-column.is-mine .rider-column-head {
    background: linear-gradient(90deg, #effbf5 0%, #fff 100%);
}

.rider-column-head h2 {
    margin: 0;
    color: var(--lux-black);
    font-size: 1.18rem;
    line-height: 1.15;
    font-weight: 850;
}

.rider-column-head p {
    margin: 5px 0 0;
    color: var(--lux-muted);
    font-size: 1rem;
    line-height: 1.25;
    font-weight: 600;
}

.rider-column-head strong {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 42px;
    height: 42px;
    border-radius: var(--radius-sm);
    background: var(--lux-black);
    color: #fff;
    font-size: 1.05rem;
    font-weight: 850;
}

.rider-column.is-ready .rider-column-head strong {
    background: #007c83;
}

.rider-column.is-soon .rider-column-head strong {
    background: #d28700;
}

.rider-column.is-mine .rider-column-head strong {
    background: #15824f;
}

.rider-column-list {
    display: grid;
    gap: 12px;
    max-height: calc(100vh - 235px);
    overflow-y: auto;
    padding: 12px;
}

.rider-column-list .operator-empty {
    min-height: 170px;
    border: 1px dashed var(--lux-line-strong);
    border-radius: var(--radius-lg);
    display: grid;
    place-items: center;
    color: var(--lux-muted);
    font-size: 1rem;
    font-weight: 800;
}

.rider-order-card {
    display: grid;
    gap: 12px;
    border: 1px solid var(--lux-line);
    border-left: 6px solid #007c83;
    border-radius: var(--radius-lg);
    padding: 14px;
    background: #fff;
    box-shadow: 0 14px 30px rgba(16, 16, 16, .075);
}

.rider-order-card.is-ready_soon {
    border-left-color: #d28700;
}

.rider-order-card.is-my_delivery {
    border-left-color: #15824f;
}

.rider-order-head {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: flex-start;
}

.rider-order-head strong,
.rider-order-head b {
    color: var(--lux-black);
    font-size: 1.12rem;
    line-height: 1.15;
    font-weight: 850;
}

.rider-order-head span {
    display: block;
    margin-top: 3px;
    color: var(--lux-muted);
    font-size: 1rem;
    font-weight: 700;
}

.rider-order-status,
.rider-order-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.rider-order-status span {
    min-height: 32px;
    display: inline-flex;
    align-items: center;
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-sm);
    padding: 0 10px;
    background: #fbfaf7;
    color: var(--lux-black);
    font-size: 1rem;
    font-weight: 800;
}

.rider-order-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 9px;
}

.rider-order-grid .is-wide,
.rider-order-items,
.rider-order-note {
    grid-column: 1 / -1;
}

.rider-order-grid div,
.rider-order-items,
.rider-order-note {
    display: grid;
    gap: 3px;
}

.rider-order-grid span,
.rider-order-items span,
.rider-order-note span {
    color: var(--lux-muted);
    font-size: 1rem;
    font-weight: 800;
    text-transform: uppercase;
}

.rider-order-grid strong,
.rider-order-items strong,
.rider-order-note strong {
    color: var(--lux-black);
    font-size: 1rem;
    line-height: 1.3;
    font-weight: 750;
}

.rider-order-note {
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-md);
    padding: 10px;
    background: #fbfaf7;
}

.rider-action-form {
    display: contents;
}

.rider-main-action,
.rider-secondary-action {
    min-height: 48px;
    border-radius: var(--radius-md);
    font-size: 1rem !important;
    font-weight: 850;
}

.rider-main-action {
    flex: 1 1 100%;
    border: 0;
    background: #007c83;
    color: #fff;
    box-shadow: 0 12px 24px rgba(0, 124, 131, .16);
}

.rider-main-action.is-green {
    background: #15824f;
    box-shadow: 0 12px 24px rgba(21, 130, 79, .16);
}

.rider-main-action.is-disabled {
    background: #d28700;
    opacity: .78;
}

.rider-secondary-action {
    flex: 1 1 46%;
    border: 1px solid var(--lux-line-strong);
    background: #fff;
    color: var(--lux-black);
}

.rider-gps-action {
    border-color: rgba(0, 124, 131, .28);
    background: #f0fbfb;
    color: #006b70;
}

.rider-issue-box {
    flex: 1 1 100%;
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-md);
    padding: 10px;
    background: #fbfaf7;
}

.rider-issue-box summary {
    color: #a91118;
    cursor: pointer;
    font-size: 1rem;
    font-weight: 850;
}

.rider-issue-box textarea {
    margin-top: 10px;
    margin-bottom: 8px;
    border-radius: var(--radius-sm);
}

.order-manager-admin-list {
    display: grid;
    gap: 10px;
}

.order-manager-admin-card {
    display: grid;
    grid-template-columns: minmax(190px, .62fr) minmax(0, 1.38fr);
    gap: 12px;
    align-items: center;
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-lg);
    padding: 12px;
    background: #fff;
    overflow: hidden;
}

.order-manager-admin-card > div {
    min-width: 0;
}

.order-manager-admin-card strong,
.manager-account-role {
    display: block;
}

.manager-account-role {
    color: var(--lux-red);
    font-size: .68rem;
    font-weight: 850;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.order-manager-admin-card strong {
    color: var(--lux-black);
    font-size: .95rem;
    font-weight: 800;
}

.order-manager-admin-card small {
    display: block;
    margin-top: 3px;
    color: var(--lux-muted);
    font-size: .72rem;
    line-height: 1.35;
}

.order-manager-admin-fields {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
    align-items: center;
    min-width: 0;
}

.order-manager-admin-fields .form-control {
    flex: 1 1 150px;
    min-width: 0;
}

.order-manager-admin-fields .staff-password-field {
    flex: 1 1 190px;
    min-width: 0;
}

.staff-password-field .form-control {
    min-width: 0;
}

.admin-menu-tabs {
    display: inline-flex;
    gap: 6px;
    padding: 5px;
    border: 1px solid var(--lux-line);
    border-radius: 999px;
    background: #fff;
}

.admin-menu-tabs a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 0 16px;
    border-radius: 999px;
    color: var(--lux-muted);
    font-size: .86rem;
    font-weight: 800;
    text-decoration: none;
}

.admin-menu-tabs a.active {
    background: var(--lux-red);
    color: #fff;
}

.admin-menu-table td {
    vertical-align: middle;
}

.admin-menu-table .form-control-sm,
.admin-menu-table .btn-sm {
    min-height: 34px;
}

.order-manager-admin-fields .form-select {
    flex: 0 1 112px;
    min-width: 96px;
}

.order-manager-admin-fields .staff-role-select {
    flex: 1 1 170px;
    min-width: 150px;
}

.order-manager-admin-fields .staff-status-select {
    flex: 0 1 112px;
    min-width: 96px;
}

.order-manager-admin-fields .btn {
    flex: 0 0 auto;
}

.order-manager-admin-fields .btn-outline-danger {
    border-color: rgba(169, 17, 24, .34);
    color: #a91118;
}

.order-manager-admin-fields .btn-outline-danger:hover,
.order-manager-admin-fields .btn-outline-danger:focus {
    background: #a91118;
    color: #fff;
}

.login-muted {
    color: var(--lux-muted);
    font-size: .88rem;
    line-height: 1.45;
}

@media (max-width: 1180px) {
    .order-manager-admin-card,
    .order-manager-admin-fields {
        grid-template-columns: 1fr;
    }

    .order-manager-admin-fields .btn {
        width: 100%;
    }
}

@media (max-width: 991.98px) {
    .manager-userbar {
        margin-left: 0 !important;
    }

    .manager-board-layout {
        grid-template-columns: 1fr;
    }

    .manager-orders-page .live-toolbar-controls {
        grid-template-columns: 1fr;
    }

    .manager-orders-toolbar {
        position: static;
    }

    .manager-command-bar {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .manager-kpi-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .manager-orders-page .live-order-card {
        grid-template-columns: 50px minmax(0, 1fr) auto;
    }

    .manager-orders-page .live-row-timer,
    .manager-orders-page .live-row-actions {
        grid-column: 2 / -1;
        justify-self: start;
    }
}

@media (max-width: 575.98px) {
    .manager-command-bar {
        grid-template-columns: 1fr;
    }

    .manager-kpi-grid {
        grid-template-columns: 1fr 1fr;
    }

    .manager-command-card {
        min-height: 52px;
    }
}

@media (max-width: 1240px) {
    .manager-ops-topbar {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .manager-ops-search,
    .manager-ops-actions {
        grid-column: 1 / -1;
    }

    .manager-ops-actions {
        flex-wrap: wrap;
    }

    .rider-ops-topbar {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .rider-board-layout {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 991.98px) {
    .manager-workspace-body .manager-main {
        padding: 10px;
    }

    .manager-ops-topbar {
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: start;
    }

    .manager-ops-status {
        justify-content: flex-end;
    }

    .manager-ops-metrics,
    .manager-ops-search,
    .manager-ops-actions {
        grid-column: 1 / -1;
    }

    .manager-ops-metrics,
    .manager-ops-actions {
        flex-wrap: wrap;
    }

    .manager-orders-page .manager-board-layout {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 10px;
    }

    .manager-workflow-column {
        min-height: calc(100vh - 230px);
    }

    .manager-workflow-column .live-column-head {
        min-height: 70px;
        padding: 12px;
    }

    .manager-workflow-column .live-column-head h2 {
        font-size: 1rem;
    }

    .manager-workflow-column .live-column-head p {
        display: none;
    }

    .manager-workflow-column .live-column-list {
        max-height: calc(100vh - 310px);
        padding: 10px;
    }

    .manager-order-card {
        padding: 12px;
    }

    .manager-order-actions {
        grid-template-columns: 1fr;
    }

    .rider-board-layout {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 10px;
    }

    .rider-column-head {
        min-height: 70px;
        padding: 12px;
    }

    .rider-column-head h2 {
        font-size: 1rem;
    }

    .rider-column-head p {
        display: none;
    }

    .rider-column-list {
        max-height: calc(100vh - 310px);
        padding: 10px;
    }

    .rider-order-card {
        padding: 12px;
    }

    .rider-order-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 720px) {
    .manager-ops-topbar,
    .manager-orders-page .manager-board-layout,
    .rider-ops-topbar,
    .rider-board-layout {
        grid-template-columns: 1fr;
    }

    .manager-ops-status {
        justify-content: flex-start;
    }

    .manager-ops-brand {
        flex-wrap: wrap;
    }

    .manager-ops-brand span {
        border-left: 0;
        padding-left: 0;
    }

    .manager-workflow-column,
    .manager-workflow-column .live-column-list,
    .rider-column,
    .rider-column-list {
        min-height: 0;
        max-height: none;
        overflow: visible;
    }
}

/* Tony Wong unified button sizing: match the admin compact button system everywhere. */
.btn,
.btn-brand,
.btn-outline-dark,
.btn-outline-danger,
.header-cart-btn,
.nav-cart-btn,
.premium-checkout-btn,
.premium-review-btn,
.mobile-order-primary,
.mobile-order-link,
.checkout-main-cta,
.checkout-summary-cta,
.checkout-mobile-cta button,
.checkout-lookup-form button,
.checkout-history-item button,
.checkout-saved-card button,
.cart-checkout-cta,
.cart-note-footer .btn,
.cart-promo-form .btn,
.confirmation-actions .btn,
.confirmation-help-card .btn,
.confirmation-save-actions .btn,
.tracking-actions .btn,
.account-form-actions .btn,
.account-history-actions .btn,
.cart-clear-form button,
.manager-ops-actions .btn,
.manager-secondary-action,
.manager-main-action,
.order-manager-admin-fields .btn,
.rider-secondary-action,
.rider-main-action {
    box-sizing: border-box;
    min-height: 36px !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 7px;
    border-radius: var(--radius-md) !important;
    padding: 6px 13px !important;
    font-size: .8rem !important;
    line-height: 1.15 !important;
    font-weight: 700 !important;
    white-space: nowrap;
}

.btn-sm,
.btn.btn-sm,
.manager-panel-order.is-compact .manager-panel-actions .btn,
.admin-body .btn-sm {
    min-height: 32px !important;
    padding: 4px 10px !important;
    font-size: .74rem !important;
}

.btn-lg,
.btn.btn-lg,
.checkout-main-cta,
.checkout-summary-cta,
.premium-checkout-btn,
.mobile-order-primary {
    min-height: 40px !important;
    padding: 8px 14px !important;
    font-size: .84rem !important;
}

.account-form-actions .btn {
    min-width: 132px;
}

.account-history-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.account-history-actions form {
    display: contents;
}

.account-history-actions .btn {
    min-height: 36px !important;
    width: 100%;
}

/* Side floating actions must stay identical in size on every viewport. */
.floating-actions .floating-action,
.floating-actions .floating-whatsapp,
.floating-actions .floating-cart,
.floating-actions .floating-top {
    width: 46px !important;
    min-width: 46px !important;
    height: 46px !important;
    padding: 0 !important;
}

@media (max-width: 767.98px) {
    .floating-actions .floating-action,
    .floating-actions .floating-whatsapp,
    .floating-actions .floating-cart,
    .floating-actions .floating-top {
        width: 42px !important;
        min-width: 42px !important;
        height: 42px !important;
        padding: 0 !important;
    }
}

/* Mobile customer header: keep the logo/menu bar visible while scrolling. */
@media (max-width: 767.98px) {
    body:not(.admin-body):not(.manager-workspace-body):not(.rider-workspace-body) {
        padding-top: 58px;
    }

    body:not(.admin-body):not(.manager-workspace-body):not(.rider-workspace-body) .site-navbar {
        position: fixed !important;
        top: 0;
        right: 0;
        left: 0;
        width: 100%;
        z-index: 1060;
        min-height: 58px !important;
        transform: translateZ(0);
    }

    body:not(.admin-body):not(.manager-workspace-body):not(.rider-workspace-body) .site-navbar .container {
        min-height: 58px;
    }

    .mobile-nav-drawer {
        z-index: 1070;
    }
}

.manager-remember-check {
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    gap: 10px;
    align-items: start;
    padding: 11px 12px;
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-md);
    background: #fffaf5;
}

.manager-remember-check .form-check-input {
    margin: 2px 0 0;
}

.manager-remember-check .form-check-label {
    display: grid;
    gap: 2px;
    font-size: .84rem;
    font-weight: 800;
    color: var(--lux-black);
}

.manager-remember-check small {
    color: var(--lux-muted);
    font-size: .74rem;
    font-weight: 500;
    line-height: 1.35;
}

.reservation-page {
    padding: 18px 0 56px;
}

.reservation-page .container-xxl {
    max-width: 1220px;
}

.reservation-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 14px 0 14px;
}

.reservation-hero h1 {
    margin: 0;
    color: var(--lux-black);
    font-size: clamp(1.9rem, 3.2vw, 3.3rem);
    font-weight: 900;
    line-height: 1;
}

.reservation-hero p {
    margin: 6px 0 0;
    color: var(--lux-muted);
    font-size: .9rem;
    font-weight: 700;
}

.reservation-help-strip {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 14px;
}

.reservation-help-strip > div {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 34px;
    padding: 6px 10px;
    border: 1px solid rgba(16, 16, 16, .08);
    border-radius: 999px;
    background: rgba(255, 255, 255, .86);
}

.reservation-help-strip span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 999px;
    background: #fff4f2;
    color: var(--lux-red);
    font-size: .68rem;
    font-weight: 900;
}

.reservation-help-strip strong {
    color: var(--lux-black);
    font-size: .78rem;
    font-weight: 900;
    line-height: 1;
}

.reservation-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 22px;
    align-items: start;
}

.reservation-layout.is-single-column {
    grid-template-columns: minmax(0, 1fr);
}

.reservation-layout.is-single-column .reservation-form-card {
    width: min(100%, 1180px);
}

.reservation-form-card,
.reservation-mini-card,
.reservation-map-card,
.reservation-map-feature,
.reservation-confirmation {
    border: 1px solid rgba(16, 16, 16, .08);
    border-radius: var(--radius-lg);
    background: var(--lux-white);
    box-shadow: var(--lux-shadow-card);
}

.reservation-form-card {
    padding: 22px;
}

.reservation-booking-top {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 360px);
    gap: 16px;
    align-items: stretch;
    margin-bottom: 18px;
}

.reservation-booking-top .reservation-section-head {
    margin-bottom: 0;
}

.reservation-section-head,
.reservation-confirmation {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.reservation-section-head {
    margin-bottom: 18px;
}

.reservation-section-head h2,
.reservation-mini-card h2,
.reservation-map-card h2,
.reservation-map-feature h2,
.reservation-confirmation h2 {
    margin: 0;
    color: var(--lux-black);
    font-size: 1.35rem;
    font-weight: 900;
}

.reservation-map-feature {
    position: relative;
    display: grid;
    grid-template-columns: minmax(240px, 1fr) minmax(320px, 480px);
    align-items: center;
    gap: 18px;
    margin-bottom: 22px;
    padding: 16px 18px;
    overflow: hidden;
    background:
        linear-gradient(135deg, #ffffff 0%, #fffaf0 54%, #fff3ef 100%);
}

.reservation-map-feature-head {
    display: grid;
    align-content: center;
    justify-items: start;
    gap: 12px;
    margin-bottom: 0;
}

.reservation-map-feature-head p:last-child {
    margin: 5px 0 0;
    color: var(--lux-muted);
    font-size: .86rem;
    font-weight: 700;
}

.reservation-ui-icon {
    width: 1em;
    height: 1em;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.reservation-admin-title,
.reservation-heading-with-icon,
.reservation-card-heading,
.reservation-small-icon-heading,
.reservation-icon-heading,
.reservation-icon-button,
.stat-card-label {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.reservation-heading-with-icon,
.reservation-card-heading {
    min-width: 0;
}

.reservation-heading-with-icon > div,
.reservation-card-heading > div {
    min-width: 0;
}

.reservation-small-icon-heading {
    margin: 0;
    gap: 8px;
}

.reservation-icon-heading {
    margin: 0;
}

.reservation-title-icon,
.reservation-stat-icon,
.reservation-inline-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    border-radius: 999px;
}

.reservation-title-icon {
    width: 40px;
    height: 40px;
    font-size: 1.15rem;
}

.reservation-stat-icon {
    width: 34px;
    height: 34px;
    font-size: .98rem;
}

.reservation-inline-icon {
    width: 30px;
    height: 30px;
    font-size: .9rem;
}

.reservation-title-icon.is-red,
.reservation-stat-icon.is-red,
.reservation-inline-icon.is-red {
    background: #fff1ef;
    color: var(--lux-red);
}

.reservation-title-icon.is-gold,
.reservation-stat-icon.is-gold,
.reservation-inline-icon.is-gold {
    background: #fff5d9;
    color: #9a6b00;
}

.reservation-title-icon.is-blue,
.reservation-stat-icon.is-blue,
.reservation-inline-icon.is-blue {
    background: #eef7ff;
    color: #2b7fc3;
}

.reservation-title-icon.is-green,
.reservation-stat-icon.is-green,
.reservation-inline-icon.is-green {
    background: #effaf4;
    color: #187447;
}

.reservation-icon-button {
    justify-content: center;
}

.reservation-icon-button .reservation-ui-icon {
    font-size: 1rem;
}

.stat-card-label {
    color: var(--lux-muted);
    font-size: .78rem;
    font-weight: 700;
}

.stat-card .stat-card-label span {
    display: inline-flex;
}

.reservation-map-preview {
    position: relative;
    justify-self: end;
    display: block;
    width: 100%;
    max-width: 480px;
    padding: 0;
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-md);
    background: #fff;
    cursor: zoom-in;
    overflow: hidden;
    box-shadow: 0 16px 34px rgba(16, 16, 16, .1);
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.reservation-map-preview.is-inline {
    justify-self: stretch;
    max-width: none;
    min-height: 150px;
    box-shadow: 0 12px 26px rgba(16, 16, 16, .08);
}

.reservation-map-preview::after {
    content: "Zoom";
    position: absolute;
    right: 12px;
    bottom: 12px;
    padding: 6px 10px;
    border: 1px solid rgba(16, 16, 16, .1);
    border-radius: 999px;
    background: rgba(255, 255, 255, .92);
    color: var(--lux-black);
    font-size: .72rem;
    font-weight: 900;
    box-shadow: 0 10px 22px rgba(16, 16, 16, .12);
}

.reservation-map-preview.is-inline::after {
    content: "Enlarge";
}

.reservation-map-preview:hover {
    transform: translateY(-2px);
    border-color: rgba(215, 25, 32, .28);
    box-shadow: 0 22px 46px rgba(16, 16, 16, .14);
}

.reservation-table-choice[hidden],
.reservation-option-section[hidden] {
    display: none !important;
}

.reservation-map-preview img {
    display: block;
    width: 100%;
    height: auto;
}

.reservation-map-preview.is-inline img {
    height: 100%;
    min-height: 150px;
    max-height: 170px;
    object-fit: contain;
}

.reservation-map-vitals {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.reservation-map-vitals span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 32px;
    padding: 6px 10px;
    border: 1px solid rgba(185, 150, 80, .28);
    border-radius: 999px;
    background: rgba(255, 255, 255, .78);
    color: var(--lux-muted);
    font-size: .77rem;
    font-weight: 800;
}

.reservation-map-vitals strong {
    color: var(--lux-red);
    font-size: .9rem;
}

.reservation-map-vitals .is-gold {
    border-color: rgba(185, 150, 80, .42);
    background: #fff8e6;
    color: #795200;
}

.reservation-map-vitals .is-gold strong {
    color: #a87900;
}

.reservation-map-vitals .is-silver {
    border-color: rgba(128, 136, 145, .34);
    background: #f6f8fa;
    color: #59616a;
}

.reservation-map-vitals .is-silver strong {
    color: #59616a;
}

.reservation-map-dialog {
    position: relative;
    width: min(1180px, 96vw);
    max-width: 96vw;
    max-height: 94vh;
    padding: 14px;
    border: 0;
    border-radius: var(--radius-lg);
    background: #fff;
    box-shadow: 0 28px 80px rgba(16, 16, 16, .28);
}

.reservation-map-dialog::backdrop {
    background: rgba(16, 16, 16, .62);
}

.reservation-map-dialog-head {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 2px 50px 12px 2px;
}

.reservation-map-dialog-head > div {
    display: grid;
    gap: 3px;
}

.reservation-map-dialog-head strong {
    color: var(--lux-black);
    font-size: 1rem;
    font-weight: 950;
}

.reservation-map-dialog-head > div > span {
    color: var(--lux-muted);
    font-size: .78rem;
    font-weight: 800;
}

.reservation-map-dialog-scroll {
    max-height: calc(94vh - 86px);
    overflow: auto;
    padding: 10px 4px 4px;
}

.reservation-map-stage.is-dialog {
    width: min(1180px, 128vw);
    min-width: 920px;
    margin-inline: 0;
}

.reservation-map-dialog img {
    display: block;
    width: 100%;
    height: auto;
    max-height: calc(94vh - 28px);
    object-fit: contain;
    border-radius: var(--radius-md);
}

.reservation-map-stage.is-dialog img {
    max-height: none;
}

.reservation-map-dialog-close {
    position: absolute;
    top: 20px;
    right: 20px;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border: 1px solid rgba(16, 16, 16, .12);
    border-radius: 50%;
    background: rgba(255, 255, 255, .94);
    color: var(--lux-black);
    font-size: 1.4rem;
    font-weight: 800;
    line-height: 1;
}

.reservation-section-head > span {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 5px 10px;
    border: 1px solid rgba(215, 25, 32, .16);
    border-radius: 999px;
    background: #fff7f6;
    color: var(--lux-red);
    font-size: .76rem;
    font-weight: 900;
}

.reservation-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 15px;
}

.reservation-wide-field {
    grid-column: 1 / -1;
}

.reservation-table-picker {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.reservation-option-section {
    display: grid;
    gap: 10px;
}

.reservation-option-section + .reservation-option-section {
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid var(--lux-line);
}

.reservation-option-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.reservation-option-head h3 {
    margin: 0;
    color: var(--lux-black);
    font-size: .98rem;
    font-weight: 900;
}

.reservation-option-head span {
    color: var(--lux-muted);
    font-size: .76rem;
    font-weight: 800;
}

.reservation-table-policy {
    margin-bottom: 10px;
    padding: 10px 12px;
    border: 1px solid rgba(185, 150, 80, .26);
    border-radius: var(--radius-md);
    background: #fff8e8;
    color: #705018;
    font-size: .82rem;
    font-weight: 700;
    line-height: 1.35;
}

.reservation-table-policy strong {
    color: var(--lux-black);
}

.reservation-stay-notice {
    margin: -2px 0 14px;
    padding: 10px 12px;
    border-left: 3px solid var(--lux-gold);
    background: #fffaf0;
    color: #5f471a;
    font-size: .84rem;
    font-weight: 800;
    line-height: 1.35;
}

.reservation-stay-notice[data-tone="warning"] {
    border-left-color: var(--lux-red);
    background: #fff3f3;
    color: #8f1515;
}

.reservation-stay-notice[data-tone="evening"] {
    border-left-color: #111;
    background: #f7f5f1;
    color: #333;
}

.reservation-hours-card {
    display: grid;
    gap: 10px;
}

.reservation-hours-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 0;
    border-top: 1px solid var(--lux-line);
    border-bottom: 1px solid var(--lux-line);
}

.reservation-hours-row span,
.reservation-hours-card small {
    color: var(--lux-muted);
    font-size: .82rem;
    font-weight: 800;
}

.reservation-hours-row strong {
    color: var(--lux-black);
    font-size: .9rem;
    font-weight: 900;
    text-align: right;
}

.reservation-availability-panel {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) minmax(260px, 1.2fr);
    gap: 14px;
    align-items: center;
    padding: 13px 14px;
    border: 1px solid rgba(20, 103, 53, .16);
    border-radius: var(--radius-md);
    background: linear-gradient(135deg, #f8fff8 0%, #fffdf8 100%);
}

.reservation-availability-panel h3 {
    margin: 0;
    color: var(--lux-black);
    font-size: 1.05rem;
    font-weight: 900;
}

.reservation-availability-panel > div:first-child > span {
    display: block;
    margin-top: 4px;
    color: var(--lux-muted);
    font-size: .78rem;
    font-weight: 800;
}

.reservation-availability-metrics {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 7px;
}

.reservation-availability-metrics span {
    display: inline-flex;
    min-height: 29px;
    align-items: center;
    padding: 5px 9px;
    border: 1px solid var(--lux-line);
    border-radius: 999px;
    background: rgba(255, 255, 255, .82);
    color: var(--lux-muted);
    font-size: .73rem;
    font-weight: 900;
}

.reservation-availability-metrics .is-gold {
    border-color: rgba(185, 150, 80, .4);
    background: #fff4d5;
    color: #795200;
}

.reservation-availability-metrics .is-silver {
    border-color: rgba(128, 136, 145, .32);
    background: #eef1f4;
    color: #59616a;
}

.reservation-table-choice {
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    gap: 10px;
    min-height: 76px;
    padding: 11px;
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-md);
    background: #fffdf8;
    cursor: pointer;
    transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.reservation-table-choice:has(input:checked) {
    border-color: rgba(215, 25, 32, .44);
    background: #fff5f3;
    box-shadow: inset 4px 0 0 var(--lux-red), 0 12px 26px rgba(215, 25, 32, .14);
}

.reservation-table-choice input {
    margin-top: 3px;
    accent-color: var(--lux-red);
}

.reservation-table-choice span,
.reservation-table-choice strong,
.reservation-table-choice small,
.reservation-table-choice em {
    min-width: 0;
}

.reservation-table-choice span {
    display: grid;
    gap: 2px;
}

.reservation-table-choice strong {
    color: var(--lux-black);
    font-size: .88rem;
    font-weight: 900;
}

.reservation-table-choice small,
.reservation-table-choice em {
    color: var(--lux-muted);
    font-size: .71rem;
    font-style: normal;
    font-weight: 800;
}

.reservation-table-choice em {
    grid-column: 2;
    color: #146735;
}

.reservation-table-choice.is-booked {
    background: #f4f1eb;
    cursor: not-allowed;
    opacity: .72;
}

.reservation-table-choice.is-booked em,
.reservation-table-choice.is-too-small em {
    color: #a91118;
}

.reservation-table-choice.is-nearby-option {
    background: #fbfff7;
    border-color: rgba(20, 103, 53, .18);
}

.reservation-table-choice.is-tier-gold:not(.is-booked) {
    border-color: rgba(185, 150, 80, .5);
    background: #fffdf6;
}

.reservation-table-choice.is-tier-silver:not(.is-booked) {
    border-color: rgba(128, 136, 145, .32);
    background: #fbfcfd;
}

.reservation-table-tier {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    margin-top: 2px;
    padding: 3px 7px;
    border-radius: 999px;
    font-size: .68rem !important;
    line-height: 1.1;
}

.reservation-tier-gold {
    background: #fff2c9;
    color: #795200 !important;
}

.reservation-tier-silver {
    background: #eef1f4;
    color: #59616a !important;
}

.reservation-table-choice.is-best-nearby {
    background: linear-gradient(135deg, #fffdf7 0%, #f4fff4 100%);
    border-color: rgba(185, 150, 80, .48);
    box-shadow: 0 10px 24px rgba(185, 150, 80, .12);
}

.reservation-table-choice.is-best-nearby em {
    color: #795200;
}

.reservation-form-card .form-label {
    color: var(--lux-black);
    font-size: .78rem;
    font-weight: 900;
}

.reservation-form-card .form-control,
.reservation-form-card .form-select,
.reservation-admin-actions .form-control,
.reservation-admin-actions .form-select {
    min-height: 42px;
    border-color: var(--lux-line);
    border-radius: var(--radius-md);
    font-size: .9rem;
    font-weight: 700;
}

.reservation-submit {
    width: 100%;
    margin-top: 18px;
}

.reservation-side-panel {
    display: grid;
    gap: 16px;
    position: sticky;
    top: 88px;
}

.reservation-mini-card {
    padding: 18px;
}

.reservation-map-card {
    padding: 18px;
}

.reservation-map-card img {
    display: block;
    width: 100%;
    height: auto;
    margin-top: 12px;
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-md);
    background: #fff;
}

.reservation-map-card p:last-child {
    margin: 10px 0 0;
    color: var(--lux-muted);
    font-size: .8rem;
    font-weight: 700;
    line-height: 1.35;
}

.reservation-slot-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin-top: 14px;
}

.reservation-slot-list span {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
    min-height: 38px;
    padding: 8px 9px;
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-md);
    background: #fffdf8;
    color: var(--lux-black);
    font-size: .78rem;
    font-weight: 800;
}

.reservation-slot-list strong {
    color: var(--lux-red);
    font-size: .72rem;
}

.reservation-slot-list .is-full {
    color: #9a9389;
    background: #f4f1eb;
}

.reservation-slot-list .is-full strong {
    color: #9a9389;
}

.reservation-capacity-list {
    display: grid;
    gap: 10px;
    margin-top: 14px;
}

.reservation-capacity-list span {
    display: grid;
    gap: 5px;
    padding: 10px 12px;
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-md);
    background: #fffdf8;
}

.reservation-capacity-list strong {
    color: var(--lux-red);
    font-size: .84rem;
}

.reservation-capacity-list small {
    color: var(--lux-muted);
    font-size: .78rem;
    font-weight: 700;
    line-height: 1.35;
}

.reservation-confirmation {
    margin-bottom: 22px;
    padding: 18px;
}

.reservation-confirmation-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
}

.reservation-confirmation p {
    margin: 5px 0 0;
    color: var(--lux-muted);
    font-weight: 700;
}

.reservation-badge {
    display: inline-flex;
    align-items: center;
    min-height: 26px;
    padding: 4px 9px;
    border-radius: 999px;
    font-size: .72rem;
    font-weight: 900;
    line-height: 1;
}

.reservation-badge-pending {
    background: #fff5dc;
    color: #8a5c00;
}

.reservation-badge-confirmed {
    background: #eaf8ef;
    color: #146735;
}

.reservation-badge-cancelled {
    background: #fff0ef;
    color: #a91118;
}

.reservation-badge-completed {
    background: #eef3ff;
    color: #244a9b;
}

.reservation-active-list,
.reservation-recent-list {
    display: grid;
    gap: 10px;
    margin-top: 14px;
}

.reservation-active-list div,
.reservation-recent-list div {
    display: grid;
    gap: 2px;
    padding: 10px 0;
    border-top: 1px solid var(--lux-line);
}

.reservation-active-list strong,
.reservation-recent-list strong {
    color: var(--lux-black);
    font-size: .86rem;
}

.reservation-active-list span,
.reservation-active-list em,
.reservation-active-list a,
.reservation-recent-list span,
.reservation-recent-list em,
.reservation-recent-list a {
    color: var(--lux-muted);
    font-size: .78rem;
    font-style: normal;
    font-weight: 700;
}

.reservation-active-list a,
.reservation-recent-list a {
    color: var(--lux-red);
    text-decoration: none;
}

.reservation-empty-bookings {
    display: grid;
    gap: 4px;
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid var(--lux-line);
}

.reservation-empty-bookings strong {
    color: var(--lux-black);
    font-size: .9rem;
}

.reservation-empty-bookings span {
    color: var(--lux-muted);
    font-size: .78rem;
    font-weight: 700;
}

.reservation-history-card {
    border: 1px solid rgba(16, 16, 16, .08);
    border-radius: var(--radius-lg);
    background: var(--lux-white);
    box-shadow: var(--lux-shadow-card);
}

.reservation-history-card summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 16px;
    cursor: pointer;
    list-style: none;
}

.reservation-history-card summary::-webkit-details-marker {
    display: none;
}

.reservation-history-card summary span {
    color: var(--lux-black);
    font-size: .9rem;
    font-weight: 900;
}

.reservation-history-card summary strong {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 26px;
    height: 26px;
    border-radius: 999px;
    background: #f4f1eb;
    color: var(--lux-muted);
    font-size: .75rem;
    font-weight: 900;
}

.reservation-history-list {
    display: grid;
    padding: 0 16px 14px;
}

.reservation-history-list a {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    padding: 8px 0;
    border-top: 1px solid var(--lux-line);
    color: var(--lux-muted);
    text-decoration: none;
}

.reservation-history-list span,
.reservation-history-list em {
    min-width: 0;
    font-size: .75rem;
    font-style: normal;
    font-weight: 800;
}

.reservation-history-list em {
    white-space: nowrap;
}

.reservation-lookup-layout {
    grid-template-columns: minmax(0, 720px);
}

.reservation-filter-bar {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 14px;
}

.reservation-filter-bar a {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 34px;
    padding: 6px 12px;
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-md);
    background: var(--lux-white);
    color: var(--lux-black);
    font-size: .82rem;
    font-weight: 800;
    text-decoration: none;
}

.reservation-filter-bar a.active {
    border-color: rgba(215, 25, 32, .26);
    background: #fff4f2;
    color: var(--lux-red);
}

.reservation-filter-bar .reservation-ui-icon {
    font-size: .94rem;
}

.reservation-admin-table th {
    white-space: nowrap;
}

.reservation-admin-prep-status {
    display: inline-grid;
    gap: 3px;
    min-width: 148px;
    padding: 8px 10px;
    border: 1px solid var(--lux-line);
    border-radius: var(--radius-sm);
    background: #fbfaf7;
}

.reservation-admin-prep-status strong,
.reservation-admin-prep-status small {
    display: block;
    line-height: 1.22;
}

.reservation-admin-prep-status strong {
    color: var(--lux-black);
    font-size: .78rem;
    font-weight: 850;
}

.reservation-admin-prep-status small {
    color: var(--lux-muted);
    font-size: .7rem;
    font-weight: 650;
}

.reservation-admin-prep-status.is-needed {
    border-color: rgba(215, 25, 32, .24);
    background: #fff5f3;
}

.reservation-admin-prep-status.is-needed strong {
    color: var(--lux-red);
}

.reservation-admin-prep-status.is-ready {
    border-color: rgba(24, 116, 71, .24);
    background: #f2fbf6;
}

.reservation-admin-prep-status.is-ready strong {
    color: #146735;
}

.reservation-admin-prep-status.is-muted {
    opacity: .74;
}

.reservation-admin-actions {
    min-width: 260px;
}

.reservation-admin-actions form {
    display: contents;
}

.reservation-admin-actions {
    display: grid;
    grid-template-columns: minmax(104px, .8fr) minmax(110px, 1fr) auto;
    gap: 8px;
    align-items: center;
}

.admin-reservation-map {
    max-width: 1180px;
    display: block;
    padding: 0;
}

.reservation-map-summary {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    cursor: pointer;
    list-style: none;
}

.reservation-map-summary::-webkit-details-marker {
    display: none;
}

.reservation-map-summary strong,
.reservation-map-summary small {
    display: block;
}

.reservation-map-summary strong {
    color: var(--lux-black);
    font-size: .98rem;
    font-weight: 900;
}

.reservation-map-summary small {
    margin-top: 2px;
    color: var(--lux-muted);
    font-size: .76rem;
    font-weight: 800;
}

.reservation-map-summary em {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 999px;
    background: #fff7e4;
    color: #9a6b00;
    font-style: normal;
    transition: transform .18s ease;
}

.admin-reservation-map[open] .reservation-map-summary em {
    transform: rotate(45deg);
}

.reservation-map-detail-body {
    display: grid;
    grid-template-columns: minmax(240px, 1fr) minmax(320px, 480px);
    align-items: center;
    gap: 18px;
    padding: 0 18px 16px;
}

.reservation-request-cell {
    display: grid;
    gap: 4px;
    min-width: 160px;
}

.reservation-request-cell strong,
.reservation-request-cell span,
.reservation-request-cell em,
.reservation-request-cell small {
    font-size: .78rem;
    line-height: 1.3;
}

.reservation-request-cell strong {
    color: var(--lux-black);
    font-weight: 900;
}

.reservation-request-cell span {
    color: var(--lux-muted);
    font-weight: 700;
}

.reservation-request-cell em {
    padding: 5px 7px;
    border-radius: var(--radius-sm);
    background: #fff7e7;
    color: #795200;
    font-style: normal;
    font-weight: 800;
}

.reservation-request-cell small {
    color: #a19a90;
    font-weight: 800;
}

.reservation-status-note {
    margin-top: 6px;
    padding: 7px 8px;
    border-radius: var(--radius-sm);
    background: #fff7e7;
    color: #795200;
    font-size: .78rem;
    font-weight: 700;
}

@media (max-width: 991.98px) {
    .reservation-layout {
        grid-template-columns: 1fr;
    }

    .reservation-booking-top {
        grid-template-columns: 1fr;
    }

    .reservation-map-preview.is-inline {
        justify-self: start;
        max-width: 520px;
    }

    .reservation-map-feature {
        grid-template-columns: 1fr;
    }

    .reservation-map-detail-body {
        grid-template-columns: 1fr;
    }

    .reservation-map-preview {
        justify-self: start;
    }

    .reservation-table-picker {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .reservation-side-panel {
        position: static;
    }
}

@media (max-width: 767.98px) {
    .reservation-page {
        padding: 18px 0 42px;
    }

    .reservation-hero,
    .reservation-section-head,
    .reservation-map-feature-head,
    .reservation-confirmation {
        align-items: stretch;
        flex-direction: column;
    }

    .reservation-hero h1 {
        font-size: 2.35rem;
    }

    .reservation-form-card {
        padding: 16px;
    }

    .reservation-map-feature {
        padding: 14px;
    }

    .reservation-map-preview::after {
        right: 9px;
        bottom: 9px;
    }

    .reservation-map-dialog {
        width: 98vw;
        max-width: 98vw;
        padding: 8px;
    }

    .reservation-form-grid,
    .reservation-table-picker,
    .reservation-availability-panel,
    .reservation-slot-list {
        grid-template-columns: 1fr;
    }

    .reservation-availability-metrics {
        justify-content: flex-start;
    }

    .reservation-admin-actions {
        grid-template-columns: 1fr;
    }
}

/* Premium customer reservation flow */
.reservation-page {
    padding: 22px 0 64px;
}

.reservation-page .container-xxl {
    max-width: 1240px;
}

.reservation-hero {
    padding: 10px 0 16px;
}

.reservation-hero h1 {
    font-size: clamp(2rem, 3vw, 3rem);
    letter-spacing: 0;
}

.reservation-hero .btn,
.reservation-summary-actions .btn,
.reservation-floor-map-head .btn {
    border-radius: 999px;
    font-size: .86rem;
    font-weight: 900;
}

.reservation-summary-card {
    display: grid;
    grid-template-columns: minmax(150px, .72fr) minmax(0, 2.4fr) auto;
    gap: 18px;
    align-items: center;
    margin-bottom: 18px;
    padding: 14px 16px;
    border: 1px solid rgba(16, 16, 16, .07);
    border-left: 4px solid var(--lux-gold);
    border-radius: 16px;
    background: rgba(255, 255, 255, .94);
    box-shadow: 0 10px 30px rgba(16, 16, 16, .045);
}

.reservation-summary-title {
    display: grid;
    gap: 3px;
}

.reservation-summary-title span,
.reservation-summary-grid dt {
    color: var(--lux-muted);
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.reservation-summary-title strong {
    color: var(--lux-black);
    font-size: 1.15rem;
    font-weight: 950;
}

.reservation-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin: 0;
}

.reservation-summary-grid div {
    min-width: 0;
}

.reservation-summary-grid dd {
    margin: 2px 0 0;
    overflow: hidden;
    color: var(--lux-black);
    font-size: .92rem;
    font-weight: 900;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.reservation-summary-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    white-space: nowrap;
}

.reservation-summary-status {
    color: #795200;
    font-size: .78rem;
    font-weight: 900;
}

.reservation-danger-link {
    border: 0;
    background: transparent;
    color: var(--lux-red) !important;
    font-size: .82rem;
    font-weight: 900;
    text-decoration: none;
}

.reservation-danger-link:hover,
.reservation-danger-link:focus {
    color: var(--lux-red-dark) !important;
    text-decoration: underline;
}

.reservation-danger-link:disabled {
    opacity: .55;
    text-decoration: none;
}

.reservation-help-strip {
    gap: 14px;
    margin-bottom: 24px;
}

.reservation-help-strip > div {
    min-height: 26px;
    padding: 0;
    border: 0;
    background: transparent;
}

.reservation-help-strip span {
    width: 20px;
    height: 20px;
    background: #eee8df;
    color: #766f66;
    font-size: .66rem;
}

.reservation-help-strip .is-complete span {
    background: #f2eadb;
    color: #8a6500;
}

.reservation-help-strip .is-current span {
    background: var(--lux-red);
    color: #fff;
}

.reservation-help-strip strong {
    color: #635d56;
    font-size: .78rem;
    font-weight: 850;
}

.reservation-help-strip .is-current strong {
    color: var(--lux-black);
}

.reservation-layout {
    grid-template-columns: minmax(0, 1fr) 286px;
    gap: 24px;
}

.reservation-form-card,
.reservation-mini-card,
.reservation-history-card {
    border: 1px solid rgba(16, 16, 16, .07);
    border-radius: 16px;
    box-shadow: 0 12px 34px rgba(16, 16, 16, .045);
}

.reservation-form-card {
    padding: 16px;
}

.reservation-section-head {
    margin-bottom: 16px;
}

.reservation-section-head h2,
.reservation-mini-card h2 {
    font-size: 1.28rem;
}

.reservation-section-head > span {
    min-height: auto;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--lux-red);
    font-size: .78rem;
}

.reservation-form-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.reservation-form-card .form-label {
    margin-bottom: 6px;
    font-size: .82rem;
}

.reservation-form-card .form-control,
.reservation-form-card .form-select {
    min-height: 46px;
    border-color: #e4ddd2;
    border-radius: 12px;
    font-size: .95rem;
    box-shadow: none;
}

.reservation-availability-panel {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 12px 0;
    border: 0;
    border-top: 1px solid var(--lux-line);
    border-bottom: 1px solid var(--lux-line);
    border-radius: 0;
    background: transparent;
}

.reservation-availability-panel h3 {
    font-size: 1rem;
}

.reservation-availability-metrics {
    justify-content: flex-end;
}

.reservation-availability-metrics span {
    min-height: auto;
    padding: 3px 7px;
    border: 0;
    border-radius: 999px;
    background: #f7f2ea !important;
    color: var(--lux-muted) !important;
    font-size: .78rem;
}

.reservation-floor-map {
    display: grid;
    gap: 12px;
    margin-top: 8px;
}

.reservation-floor-map-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.reservation-map-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 8px 12px;
}

.reservation-map-legend {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--lux-muted);
    font-size: .76rem;
    font-weight: 900;
}

.reservation-map-legend i {
    width: 10px;
    height: 10px;
    border-radius: 999px;
}

.reservation-map-legend i.is-available {
    background: #138a4b;
}

.reservation-map-legend i.is-booked {
    background: var(--lux-red);
}

.reservation-floor-map-head h3 {
    margin: 0;
    color: var(--lux-black);
    font-size: 1.15rem;
    font-weight: 950;
}

.reservation-map-preview.is-floor {
    justify-self: stretch;
    max-width: none;
    border-color: rgba(16, 16, 16, .08);
    border-radius: 14px;
    box-shadow: none;
}

.reservation-map-preview.is-floor::after {
    display: none;
}

.reservation-map-preview.is-floor img {
    width: 100%;
    max-height: 410px;
    object-fit: contain;
}

.reservation-map-stage {
    position: relative;
    width: min(100%, 980px);
    margin-inline: auto;
    border: 1px solid rgba(16, 16, 16, .08);
    border-radius: 14px;
    background: #fff;
    touch-action: manipulation;
}

.reservation-layout.is-single-column .reservation-map-stage.is-floor {
    width: min(100%, 1050px);
}

.reservation-map-stage img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 14px;
}

.reservation-map-hotspots {
    position: absolute;
    inset: 0;
    z-index: 2;
}

.reservation-map-hotspot {
    position: absolute;
    left: var(--x);
    top: var(--y);
    display: grid;
    place-items: center;
    width: clamp(36px, 5.8%, 58px);
    aspect-ratio: 1;
    padding: 0;
    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 12px;
    background: rgba(19, 138, 75, .12);
    color: #fff;
    cursor: pointer;
    transform: translate(-50%, -50%);
    box-sizing: border-box;
    backdrop-filter: blur(1.5px);
    transition: background-color .16s ease, border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.reservation-map-stage.is-dialog .reservation-map-hotspot {
    width: clamp(44px, 5.8%, 72px);
}

.reservation-map-hotspot::before {
    content: attr(data-table-number);
    display: grid;
    place-items: center;
    width: 68%;
    aspect-ratio: 1;
    border: 1px solid rgba(255, 255, 255, .48);
    border-radius: 9px;
    background: rgba(16, 16, 16, .58);
    color: #fff;
    font-size: clamp(.8rem, 1.25vw, 1.05rem);
    font-weight: 950;
    line-height: 1;
    text-shadow: 0 1px 8px rgba(0, 0, 0, .48);
    box-shadow: 0 4px 12px rgba(16, 16, 16, .16);
}

.reservation-map-hotspot:hover,
.reservation-map-hotspot:focus-visible {
    border-color: #138a4b;
    background: rgba(19, 138, 75, .18);
    box-shadow: 0 0 0 3px rgba(19, 138, 75, .16);
    transform: translate(-50%, -50%) scale(1.06);
    outline: 0;
}

.reservation-map-hotspot.is-available {
    border-color: rgba(19, 138, 75, .62);
    background: rgba(19, 138, 75, .18);
    box-shadow: 0 0 0 1px rgba(255, 255, 255, .72), 0 8px 18px rgba(19, 138, 75, .12);
}

.reservation-map-hotspot.is-selected {
    z-index: 5;
    border-color: var(--lux-red);
    background: rgba(215, 25, 32, .18);
    transform: translate(-50%, -50%) scale(1.14);
    box-shadow: 0 0 0 4px rgba(255, 255, 255, .86), 0 0 0 8px rgba(215, 25, 32, .38), 0 16px 30px rgba(215, 25, 32, .24);
}

.reservation-map-hotspot.is-selected::before {
    border-color: rgba(255, 255, 255, .9);
    background: var(--lux-red);
    box-shadow: 0 6px 16px rgba(215, 25, 32, .28);
}

.reservation-map-hotspot.is-disabled {
    border-color: rgba(96, 91, 84, .18);
    background: rgba(60, 55, 50, .12);
    box-shadow: none;
    cursor: not-allowed;
}

.reservation-map-hotspot.is-booked {
    border-color: rgba(215, 25, 32, .82);
    background: rgba(215, 25, 32, .22);
    box-shadow: 0 0 0 1px rgba(255, 255, 255, .58);
}

.reservation-map-hotspot.is-booked::before {
    background: rgba(105, 16, 20, .72);
}

.reservation-map-hotspot.is-too-small {
    border-color: rgba(185, 150, 80, .48);
    background: rgba(185, 150, 80, .14);
}

.reservation-map-hotspot.is-disabled:hover,
.reservation-map-hotspot.is-disabled:focus-visible {
    border-color: rgba(96, 91, 84, .28);
    background: rgba(60, 55, 50, .14);
    transform: translate(-50%, -50%);
}

.reservation-map-hotspot.is-booked:hover,
.reservation-map-hotspot.is-booked:focus-visible {
    border-color: var(--lux-red);
    background: rgba(215, 25, 32, .28);
    box-shadow: 0 0 0 3px rgba(215, 25, 32, .16);
    transform: translate(-50%, -50%);
}

.reservation-map-hotspot::after {
    content: attr(data-tooltip);
    position: absolute;
    left: 50%;
    bottom: calc(100% + 8px);
    z-index: 4;
    width: max-content;
    max-width: 210px;
    padding: 7px 9px;
    border: 1px solid rgba(16, 16, 16, .08);
    border-radius: 10px;
    background: rgba(16, 16, 16, .94);
    color: #fff;
    font-size: .73rem;
    font-weight: 850;
    line-height: 1.25;
    white-space: normal;
    opacity: 0;
    pointer-events: none;
    transform: translate(-50%, 4px);
    transition: opacity .14s ease, transform .14s ease;
}

.reservation-map-hotspot:hover::after,
.reservation-map-hotspot:focus-visible::after,
.reservation-map-hotspot.is-tooltip-pinned::after {
    opacity: 1;
    transform: translate(-50%, 0);
}

.reservation-map-hotspot.is-map-pulse,
.reservation-table-choice.is-map-synced {
    animation: reservationMapPulse .9s ease;
}

@keyframes reservationMapPulse {
    0% {
        box-shadow: 0 0 0 0 rgba(215, 25, 32, .3);
    }
    100% {
        box-shadow: 0 0 0 12px rgba(215, 25, 32, 0);
    }
}

.reservation-option-section {
    gap: 12px;
}

.reservation-option-section + .reservation-option-section {
    margin-top: 24px;
    padding-top: 18px;
}

.reservation-option-head h3 {
    font-size: 1.08rem;
}

.reservation-option-head span {
    font-size: .78rem;
}

.reservation-table-policy {
    margin: 0 0 14px;
    padding: 10px 0;
    border: 0;
    border-top: 1px solid var(--lux-line);
    border-bottom: 1px solid var(--lux-line);
    border-radius: 0;
    background: transparent;
    color: #705018;
    font-size: .88rem;
}

.reservation-table-picker {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 12px;
}

.reservation-table-choice {
    grid-template-columns: 18px minmax(0, 1fr) auto;
    gap: 10px 12px;
    min-height: 92px;
    padding: 14px;
    border-color: #e8e1d7;
    border-radius: 14px;
    background: #fff;
    box-shadow: none;
}

.reservation-table-choice:hover {
    border-color: rgba(185, 150, 80, .42);
}

.reservation-table-choice:has(input:checked) {
    border-color: var(--lux-red);
    background: #fffafa;
    box-shadow: inset 4px 0 0 var(--lux-red), 0 12px 26px rgba(215, 25, 32, .14);
}

.reservation-table-main {
    display: grid;
    gap: 3px;
}

.reservation-table-main strong {
    color: var(--lux-black);
    font-size: .98rem;
    font-weight: 950;
}

.reservation-table-main small,
.reservation-table-meta small,
.reservation-table-choice em {
    color: var(--lux-muted);
    font-size: .8rem;
    font-style: normal;
    font-weight: 800;
    line-height: 1.3;
}

.reservation-table-meta {
    display: flex;
    grid-column: 2 / -1;
    flex-wrap: wrap;
    gap: 7px 10px;
}

.reservation-table-tier {
    display: inline;
    width: auto;
    margin: 0;
    padding: 0;
    border-radius: 0;
    background: transparent !important;
    color: var(--lux-muted) !important;
    font-size: .8rem !important;
}

.reservation-table-choice em {
    grid-column: 3;
    grid-row: 1;
    align-self: start;
    color: #146735;
    white-space: nowrap;
}

.reservation-table-choice.is-tier-gold:not(.is-booked),
.reservation-table-choice.is-best-nearby {
    border-color: rgba(185, 150, 80, .42);
    background: #fffdf8;
    box-shadow: none;
}

.reservation-table-choice.is-tier-silver:not(.is-booked) {
    border-color: rgba(128, 136, 145, .24);
    background: #fff;
}

.reservation-table-choice.is-tier-gold:has(input:checked),
.reservation-table-choice.is-tier-silver:has(input:checked),
.reservation-table-choice.is-best-nearby:has(input:checked) {
    border-color: var(--lux-red);
    background: #fffafa;
    box-shadow: inset 4px 0 0 var(--lux-red), 0 12px 26px rgba(215, 25, 32, .14);
}

.reservation-submit {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-height: 48px !important;
    margin-top: 24px;
    font-size: .95rem;
    font-weight: 950;
}

.reservation-side-panel {
    gap: 14px;
    top: 84px;
}

.reservation-mini-card,
.reservation-history-card {
    padding: 16px;
}

.reservation-history-card {
    padding: 0;
}

.reservation-active-list {
    gap: 0;
    margin-top: 10px;
}

.reservation-active-list div {
    gap: 4px;
    padding: 12px 0;
}

.reservation-active-list strong {
    font-size: .88rem;
}

.reservation-active-list span,
.reservation-active-list em,
.reservation-active-list a {
    font-size: .78rem;
}

.reservation-booking-links {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 2px;
}

.reservation-booking-links form {
    display: inline-flex;
    margin: 0;
}

.reservation-active-table-chips {
    display: flex !important;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 3px;
}

.reservation-active-table-chips i,
.reservation-active-table-chips small {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 4px 8px;
    border: 1px solid rgba(185, 150, 80, .28);
    border-radius: 999px;
    background: #fffaf0;
    color: #705018;
    font-size: .72rem;
    font-style: normal;
    font-weight: 900;
    line-height: 1;
}

.reservation-active-table-chips small {
    border-color: rgba(16, 16, 16, .08);
    background: #f7f2ea;
    color: var(--lux-muted);
}

.reservation-booking-links a {
    color: var(--lux-black);
    font-weight: 900;
}

.reservation-history-card summary {
    padding: 13px 16px;
}

@media (min-width: 768px) and (max-width: 991.98px) {
    .reservation-layout:not(.is-single-column) {
        grid-template-columns: minmax(0, 1fr) 250px;
    }

    .reservation-form-grid,
    .reservation-table-picker {
        grid-template-columns: 1fr;
    }

    .reservation-summary-card {
        grid-template-columns: 1fr;
    }

    .reservation-summary-actions {
        justify-content: flex-start;
    }
}

@media (max-width: 767.98px) {
    .reservation-page {
        padding: 14px 0 86px;
    }

    .reservation-hero {
        padding-top: 4px;
    }

    .reservation-hero h1 {
        font-size: 2rem;
    }

    .reservation-summary-card,
    .reservation-layout,
    .reservation-form-grid,
    .reservation-availability-panel {
        grid-template-columns: 1fr;
    }

    .reservation-summary-card {
        gap: 12px;
        padding: 14px;
    }

    .reservation-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
    }

    .reservation-summary-actions {
        justify-content: flex-start;
        flex-wrap: wrap;
    }

    .reservation-help-strip {
        gap: 10px;
        margin-bottom: 18px;
    }

    .reservation-help-strip strong {
        font-size: .74rem;
    }

    .reservation-form-card {
        padding: 14px;
    }

    .reservation-section-head,
    .reservation-floor-map-head,
    .reservation-option-head {
        align-items: flex-start;
        flex-direction: column;
        gap: 8px;
    }

    .reservation-map-actions {
        justify-content: flex-start;
    }

    .reservation-map-preview.is-floor img {
        max-height: 260px;
    }

    .reservation-map-stage {
        width: 100%;
    }

    .reservation-map-stage.is-dialog {
        min-width: 760px;
    }

    .reservation-map-hotspot {
        width: clamp(30px, 6.5%, 42px);
        border-radius: 9px;
    }

    .reservation-map-hotspot::before {
        border-radius: 7px;
        font-size: .72rem;
    }

    .reservation-table-picker {
        grid-template-columns: 1fr;
    }

    .reservation-table-choice {
        grid-template-columns: 18px minmax(0, 1fr);
    }

    .reservation-table-choice em {
        grid-column: 2;
        grid-row: auto;
    }

    .reservation-submit {
        position: sticky;
        bottom: 12px;
        z-index: 20;
        box-shadow: 0 14px 34px rgba(215, 25, 32, .24);
    }
}

/* Customer-facing page heading scale, matched to the Order Food hero. */
.order-hero-copy h1,
.reservation-hero h1,
.checkout-heading h1,
.cart-page-heading h1,
.account-heading h1,
.auth-copy-panel h1,
.confirmation-hero-copy h1,
.tracking-hero h1,
.tracking-missing-card h1,
.payment-state h1,
.payment-hosted-header h1,
.page-heading h1 {
    margin-bottom: 6px !important;
    color: var(--lux-black);
    font-size: clamp(1.55rem, 2vw, 2.05rem) !important;
    font-weight: 800 !important;
    line-height: 1.06 !important;
    letter-spacing: 0 !important;
}

.order-hero-copy p:last-child,
.reservation-hero p:not(.eyebrow),
.checkout-heading p:not(.eyebrow),
.cart-page-heading p:not(.eyebrow),
.account-heading p:not(.eyebrow),
.auth-copy-panel > p:not(.eyebrow),
.confirmation-hero-copy p:not(.eyebrow):not(.confirmation-greeting),
.tracking-hero p:last-child,
.tracking-missing-card p:not(.eyebrow),
.payment-state p:not(.eyebrow),
.payment-hosted-header p:not(.eyebrow),
.page-heading p:not(.eyebrow) {
    margin-top: 6px !important;
    color: var(--lux-muted);
    font-size: .84rem !important;
    font-weight: 700;
    line-height: 1.35 !important;
}

@media (max-width: 767.98px) {
    .order-hero-copy h1,
    .reservation-hero h1,
    .checkout-heading h1,
    .cart-page-heading h1,
    .account-heading h1,
    .auth-copy-panel h1,
    .confirmation-hero-copy h1,
    .tracking-hero h1,
    .tracking-missing-card h1,
    .payment-state h1,
    .payment-hosted-header h1,
    .page-heading h1 {
        font-size: 1.55rem !important;
    }
}

/* Customer-facing box scale, matched to the compact Menu cards. */
.reservation-summary-card,
.reservation-form-card,
.reservation-mini-card,
.reservation-history-card,
.reservation-availability-panel,
.reservation-floor-map,
.reservation-table-choice,
.checkout-returning,
.checkout-panel,
.checkout-summary-card,
.cart-body .premium-cart-row,
.cart-body .premium-cart-note,
.cart-body .premium-cart-summary,
.account-card,
.auth-card,
.confirmation-card,
.confirmation-help-card,
.tracking-card,
.tracking-status-card,
.payment-state,
.payment-method-panel,
.payment-order-panel {
    border-radius: 14px !important;
    box-shadow: 0 12px 30px rgba(16, 16, 16, .045) !important;
}

.reservation-summary-card,
.reservation-form-card,
.reservation-mini-card,
.reservation-availability-panel,
.reservation-floor-map,
.checkout-panel,
.checkout-summary-card,
.cart-body .premium-cart-note,
.cart-body .premium-cart-summary,
.account-card,
.auth-card,
.confirmation-card,
.confirmation-help-card,
.tracking-card,
.tracking-status-card,
.payment-state,
.payment-method-panel,
.payment-order-panel {
    padding: 16px !important;
}

.reservation-section-head,
.reservation-floor-map-head,
.reservation-option-head,
.checkout-section-heading,
.checkout-summary-head,
.cart-summary-head,
.account-section-head,
.confirmation-section-head,
.tracking-section-head {
    gap: 10px !important;
    margin-bottom: 12px !important;
}

.reservation-section-head h2,
.reservation-mini-card h2,
.reservation-floor-map-head h3,
.reservation-option-head h3,
.checkout-section-heading h2,
.checkout-summary-head h2,
.cart-summary-head h2,
.account-section-head h2,
.auth-card h2,
.confirmation-section-head h2,
.tracking-section-head h2,
.payment-method-panel h2,
.payment-order-panel h2 {
    margin: 0 !important;
    color: var(--lux-black);
    font-size: .98rem !important;
    font-weight: 700 !important;
    line-height: 1.18 !important;
    letter-spacing: 0 !important;
}

.reservation-table-choice,
.checkout-saved-card,
.checkout-history-item,
.cart-body .premium-cart-row,
.account-active-order-card,
.reservation-active-list div,
.reservation-history-list a,
.tracking-summary-row {
    gap: 8px 10px !important;
}

.reservation-table-choice {
    min-height: 78px !important;
    padding: 11px !important;
}

.cart-body .premium-cart-row {
    padding: 12px !important;
}

.reservation-table-main strong,
.cart-body .premium-cart-row h2,
.checkout-summary-items strong,
.checkout-total-box strong,
.account-active-order-card > strong,
.reservation-active-list strong,
.reservation-history-card summary span,
.confirmation-details-list strong,
.tracking-summary-row strong {
    font-size: .82rem !important;
    font-weight: 700 !important;
    line-height: 1.22 !important;
}

.reservation-table-main small,
.reservation-table-meta small,
.reservation-table-choice em,
.reservation-active-list span,
.reservation-active-list em,
.reservation-active-list a,
.reservation-history-list span,
.reservation-history-list em,
.checkout-summary-items span,
.checkout-total-box span,
.checkout-timing div,
.cart-item-info span,
.cart-summary-lines > div,
.cart-summary-note,
.account-active-order-card > span,
.account-empty-active p,
.confirmation-details-list span,
.tracking-summary-row span,
.tracking-card p,
.payment-state p:not(.eyebrow) {
    font-size: .76rem !important;
    line-height: 1.32 !important;
}

.reservation-form-grid,
.checkout-form-grid,
.account-form-grid,
.reservation-active-list,
.reservation-history-list,
.cart-summary-lines,
.checkout-summary-items,
.tracking-grid {
    gap: 10px !important;
}

.reservation-form-card .form-label,
.checkout-page .form-label,
.account-card .form-label,
.auth-card .form-label {
    margin-bottom: 5px !important;
    font-size: .76rem !important;
}

.reservation-form-card .form-control,
.reservation-form-card .form-select,
.checkout-page .form-control,
.checkout-page .form-select,
.account-card .form-control,
.account-card .form-select,
.auth-card .form-control,
.auth-card .form-select {
    min-height: 40px !important;
    font-size: .86rem !important;
}

@media (max-width: 767.98px) {
    .reservation-summary-card,
    .reservation-form-card,
    .reservation-mini-card,
    .reservation-availability-panel,
    .reservation-floor-map,
    .checkout-panel,
    .checkout-summary-card,
    .cart-body .premium-cart-note,
    .cart-body .premium-cart-summary,
    .account-card,
    .auth-card,
    .confirmation-card,
    .confirmation-help-card,
    .tracking-card,
    .tracking-status-card,
    .payment-state,
    .payment-method-panel,
    .payment-order-panel {
        padding: 12px !important;
    }

    .reservation-section-head h2,
    .reservation-mini-card h2,
    .reservation-floor-map-head h3,
    .reservation-option-head h3,
    .checkout-section-heading h2,
    .checkout-summary-head h2,
    .cart-summary-head h2,
    .account-section-head h2,
    .auth-card h2,
    .confirmation-section-head h2,
    .tracking-section-head h2,
    .payment-method-panel h2,
    .payment-order-panel h2 {
        font-size: .94rem !important;
    }
}

/* Final customer layout unification: Menu page is the visual source of truth. */
.reservation-page .container-xxl,
.auth-page,
.tracking-shell,
.cart-page,
.checkout-page,
.account-page {
    width: min(1320px, calc(100% - 40px)) !important;
    max-width: 1320px !important;
    margin-inline: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.reservation-page,
.auth-page,
.tracking-page,
.cart-page,
.checkout-page,
.account-page {
    padding-top: 24px !important;
    padding-bottom: 56px !important;
}

.reservation-hero,
.tracking-hero,
.cart-page-heading,
.checkout-heading,
.account-heading {
    margin-bottom: 18px !important;
    padding: 0 !important;
}

.auth-shell {
    grid-template-columns: minmax(0, 1fr) 460px !important;
    gap: 24px !important;
    align-items: start !important;
}

.auth-copy-panel,
.auth-card {
    min-height: auto !important;
    justify-content: flex-start !important;
    border-radius: 14px !important;
    box-shadow: 0 12px 30px rgba(16, 16, 16, .045) !important;
}

.auth-copy-panel {
    padding: 18px !important;
    background: #fff !important;
}

.auth-benefits {
    gap: 6px !important;
    margin-top: 14px !important;
}

.auth-benefits li,
.auth-muted,
.auth-privacy-copy,
.auth-method-copy small {
    font-size: .76rem !important;
    line-height: 1.32 !important;
}

.auth-method-list {
    gap: 10px !important;
}

.auth-method-card {
    gap: 8px !important;
    padding: 10px 12px !important;
    border-radius: 12px !important;
    box-shadow: none !important;
}

.auth-method-card.is-ready {
    border-color: var(--lux-line) !important;
    background: #fff !important;
}

.auth-method-copy strong {
    font-size: .82rem !important;
    line-height: 1.22 !important;
}

.reservation-layout {
    grid-template-columns: minmax(0, 1fr) 318px !important;
    gap: 20px !important;
}

.reservation-summary-card {
    grid-template-columns: minmax(130px, .7fr) minmax(0, 2.4fr) auto !important;
    gap: 14px !important;
    margin-bottom: 16px !important;
    padding: 14px 16px !important;
}

.reservation-help-strip {
    gap: 12px !important;
    margin-bottom: 18px !important;
}

.reservation-summary-title strong,
.reservation-summary-grid dd,
.reservation-summary-status {
    font-size: .88rem !important;
    font-weight: 700 !important;
    line-height: 1.24 !important;
}

.reservation-summary-title span,
.reservation-summary-grid dt,
.eyebrow {
    font-size: .72rem !important;
    letter-spacing: .08em !important;
}

.reservation-availability-panel {
    min-height: auto !important;
    gap: 10px !important;
    padding: 12px !important;
}

.reservation-availability-panel.is-loading {
    opacity: .72;
    pointer-events: none;
}

.reservation-availability-panel h3 {
    font-size: .92rem !important;
    line-height: 1.22 !important;
}

.tracking-page {
    background: #fbfaf7 !important;
}

.tracking-hero {
    grid-template-columns: minmax(0, 1fr) 280px !important;
    gap: 18px !important;
    align-items: start !important;
}

.tracking-hero h1,
.auth-copy-panel h1,
.reservation-hero h1 {
    max-width: 760px;
}

.reservation-planner-card {
    display: grid;
    gap: 12px;
}

.reservation-type-switch {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.reservation-type-switch label,
.reservation-type-switch .reservation-type-option {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 7px;
    min-height: 72px;
    padding: 12px;
    border: 1px solid var(--lux-line);
    border-radius: 14px;
    background: #fffdf8;
    transition: border-color .18s ease, background .18s ease, box-shadow .18s ease;
}

.reservation-type-switch label {
    cursor: pointer;
}

.reservation-type-switch .reservation-type-option {
    cursor: default;
}

.reservation-type-switch label.is-selected,
.reservation-type-switch .reservation-type-option.is-selected {
    border-color: rgba(215, 25, 32, .42);
    background: #fff5f3;
    box-shadow: inset 4px 0 0 var(--lux-red);
}

.reservation-type-switch input {
    margin-top: 3px;
    accent-color: var(--lux-red);
}

.reservation-type-switch span {
    display: grid;
    gap: 3px;
}

.reservation-type-switch strong {
    color: var(--lux-black);
    font-size: .86rem;
    font-weight: 800;
    line-height: 1.2;
}

.reservation-type-switch small {
    color: var(--lux-muted);
    font-size: .74rem;
    font-weight: 700;
    line-height: 1.3;
}

.reservation-booking-head {
    align-items: flex-start !important;
    padding-bottom: 2px;
}

.reservation-booking-head h2 {
    font-size: 1.46rem !important;
    font-weight: 800 !important;
    letter-spacing: 0 !important;
}

.reservation-head-copy {
    margin: 5px 0 0;
    color: var(--lux-muted);
    font-size: .84rem;
    font-weight: 650;
    line-height: 1.35;
}

.reservation-section-head > .reservation-confirm-pill {
    display: inline-flex !important;
    align-items: center;
    gap: 9px;
    min-height: 50px !important;
    padding: 10px 14px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: #fff6f4 !important;
    color: var(--lux-black) !important;
    box-shadow: none !important;
    text-align: left;
}

.reservation-confirm-pill i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #fff;
    color: var(--lux-red);
    font-size: .86rem;
    font-style: normal;
}

.reservation-confirm-pill span {
    display: grid;
    gap: 1px;
}

.reservation-confirm-pill strong {
    color: var(--lux-red);
    font-size: .82rem;
    font-weight: 850;
    line-height: 1.1;
}

.reservation-confirm-pill small {
    color: var(--lux-muted);
    font-size: .74rem;
    font-weight: 650;
    line-height: 1.2;
}

.reservation-type-switch .reservation-type-option {
    grid-template-columns: 18px 44px minmax(0, 1fr) !important;
    align-items: center;
    gap: 11px !important;
    min-height: 76px !important;
    padding: 14px 16px !important;
    background: #fff !important;
    cursor: pointer;
}

.reservation-type-switch .reservation-type-option.is-selected {
    border-color: rgba(215, 25, 32, .64) !important;
    background: linear-gradient(135deg, #fff8f6 0%, #fff 100%) !important;
    box-shadow: inset 3px 0 0 var(--lux-red), 0 8px 20px rgba(215, 25, 32, .06) !important;
}

.reservation-type-radio {
    display: inline-flex;
    width: 14px;
    height: 14px;
    border: 2px solid #b7b0a6;
    border-radius: 50%;
    background: #fff;
    box-shadow: inset 0 0 0 3px #fff;
}

.reservation-type-option.is-selected .reservation-type-radio {
    border-color: var(--lux-red);
    background: var(--lux-red);
}

.reservation-type-switch .reservation-type-icon {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    font-size: 1.06rem;
}

.reservation-type-icon.is-red {
    background: #fff0ed;
    color: var(--lux-red);
}

.reservation-type-icon.is-gold {
    background: #f8efe0;
    color: #8f6500;
}

.reservation-type-switch .reservation-type-copy {
    display: grid !important;
    gap: 3px;
}

.reservation-field {
    display: grid;
    gap: 0;
}

.reservation-control-shell {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 42px;
    padding: 0 11px;
    border: 1px solid #e4ddd2;
    border-radius: 12px;
    background: #fff;
    transition: border-color .18s ease, box-shadow .18s ease;
}

.reservation-control-shell:focus-within {
    border-color: rgba(215, 25, 32, .52);
    box-shadow: 0 0 0 3px rgba(215, 25, 32, .08);
}

.reservation-control-shell[data-calendar-open] {
    cursor: pointer;
}

.reservation-control-shell[data-calendar-open]:focus-visible {
    border-color: rgba(215, 25, 32, .52);
    box-shadow: 0 0 0 3px rgba(215, 25, 32, .08);
    outline: 0;
}

.reservation-control-shell[data-calendar-open] .form-control {
    cursor: pointer;
}

.reservation-control-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    color: var(--lux-black);
    font-size: .95rem;
}

.reservation-control-shell .form-control,
.reservation-control-shell .form-select {
    min-height: 40px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background-color: transparent !important;
    box-shadow: none !important;
    color: var(--lux-black);
    font-weight: 700;
}

.reservation-special-card {
    gap: 10px !important;
    padding: 12px 14px !important;
    border-color: rgba(185, 150, 80, .22) !important;
    background: #fffdf8 !important;
}

.reservation-special-toggle {
    align-items: center !important;
}

.reservation-special-toggle input {
    order: 3;
    margin-left: auto;
}

.reservation-special-toggle .reservation-inline-icon {
    order: 1;
}

.reservation-special-toggle > span {
    order: 2;
}

.reservation-special-toggle strong {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 7px;
}

.reservation-special-card-head {
    display: flex;
    align-items: center;
    gap: 10px;
}

.reservation-special-card-head span {
    display: grid;
    gap: 2px;
}

.reservation-special-card-head strong {
    color: var(--lux-black);
    font-size: .86rem;
    font-weight: 750;
}

.reservation-special-card-head small {
    color: var(--lux-muted);
    font-size: .76rem;
    font-weight: 650;
}

.reservation-occasion-options {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
}

.reservation-occasion-option {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 46px;
    margin: 0;
    padding: 9px 10px;
    border: 1px solid rgba(185, 150, 80, .24);
    border-radius: 12px;
    background: #fff;
    color: var(--lux-black);
    cursor: pointer;
    transition: border-color .16s ease, background .16s ease, box-shadow .16s ease;
}

.reservation-occasion-option input {
    flex: 0 0 auto;
    margin: 0;
    accent-color: var(--lux-red);
}

.reservation-occasion-option .reservation-inline-icon {
    width: 27px;
    height: 27px;
    font-size: .78rem;
}

.reservation-occasion-option strong {
    min-width: 0;
    font-size: .82rem;
    font-weight: 700;
    line-height: 1.2;
}

.reservation-occasion-option:hover {
    border-color: rgba(224, 17, 31, .38);
}

.reservation-occasion-option:has(input:checked) {
    border-color: rgba(224, 17, 31, .7);
    background: #fff5f3;
    box-shadow: inset 0 0 0 1px rgba(224, 17, 31, .12);
}

.reservation-birthday-options {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px !important;
    padding: 10px !important;
}

.reservation-birthday-options small {
    grid-column: 1 / -1;
}

.reservation-availability-panel {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 14px 0 2px !important;
    border-width: 1px 0 0 !important;
    border-color: rgba(185, 150, 80, .28) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.reservation-availability-panel > div:first-of-type {
    display: grid;
    gap: 2px;
}

.reservation-availability-panel > div:first-of-type > strong {
    display: none;
}

.reservation-availability-panel > .reservation-inline-icon {
    width: 38px;
    height: 38px;
    background: #fff1ef;
    color: var(--lux-red);
    font-size: 1rem;
}

.reservation-availability-metrics {
    justify-content: flex-end;
}

.reservation-availability-metrics span {
    min-height: 31px;
    padding: 7px 13px;
    border: 1px solid rgba(185, 150, 80, .22);
    background: #f8f1e8;
    color: var(--lux-black);
    font-size: .76rem;
    font-weight: 800;
    line-height: 1;
}

.reservation-availability-panel h3 {
    font-size: 1rem !important;
    font-weight: 850 !important;
}

.reservation-group-notice {
    display: grid;
    grid-column: 1 / -1;
    gap: 4px;
    padding: 12px 14px;
    border-left: 4px solid #b88a20;
    border-radius: 12px;
    background: #fff8e6;
    color: #6f4a00;
}

.reservation-group-notice[hidden] {
    display: none !important;
}

.reservation-group-notice strong {
    color: #6f4a00;
    font-size: .84rem;
    font-weight: 900;
}

.reservation-group-notice span {
    font-size: .76rem;
    font-weight: 750;
    line-height: 1.35;
}

.reservation-special-card {
    display: grid;
    gap: 12px;
    padding: 14px;
    border: 1px solid rgba(185, 150, 80, .28);
    border-radius: 14px;
    background: linear-gradient(135deg, #fffdf8 0%, #fff7f5 100%);
}

.reservation-special-toggle,
.reservation-birthday-options label {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 0;
    color: var(--lux-black);
}

.reservation-special-toggle {
    cursor: pointer;
}

.reservation-special-toggle input,
.reservation-birthday-options input {
    margin-top: 4px;
    accent-color: var(--lux-red);
}

.reservation-special-toggle span {
    display: grid;
    gap: 3px;
}

.reservation-special-toggle strong {
    font-size: .95rem;
    font-weight: 900;
}

.reservation-special-toggle small,
.reservation-birthday-options small {
    color: var(--lux-muted);
    font-size: .78rem;
    font-weight: 700;
    line-height: 1.35;
}

.reservation-birthday-options {
    display: grid;
    gap: 9px;
    padding: 12px;
    border-radius: 12px;
    background: rgba(255, 255, 255, .72);
}

.reservation-birthday-options[hidden] {
    display: none !important;
}

.reservation-birthday-options label span {
    font-size: .86rem;
    font-weight: 800;
}

.reservation-birthday-options {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
    padding: 10px !important;
}

.reservation-birthday-options small {
    grid-column: 1 / -1;
}

.reservation-active-special-note {
    display: inline-flex;
    width: fit-content;
    padding: 5px 10px;
    border-radius: 999px;
    background: #fff5f3;
    color: var(--lux-red);
    font-size: .76rem;
    font-weight: 900;
}

.reservation-table-choice.is-group-tour {
    border-color: rgba(185, 150, 80, .32);
    background: #fffaf0;
}

.reservation-planner-head {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 12px;
}

.reservation-text-button {
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--lux-red);
    font: inherit;
    font-size: .76rem;
    font-weight: 800;
    line-height: 1.2;
    text-align: right;
    cursor: pointer;
}

.reservation-text-button:hover {
    color: #9d1117;
    text-decoration: underline;
}

.reservation-planner-selected {
    padding: 9px 0;
    border-top: 1px solid var(--lux-line);
    border-bottom: 1px solid var(--lux-line);
    color: var(--lux-black);
    font-size: .82rem;
    font-weight: 800;
}

.reservation-quick-dates,
.reservation-calendar-grid {
    display: grid;
    gap: 8px;
}

.reservation-quick-dates {
    grid-template-columns: repeat(7, minmax(0, 1fr));
}

.reservation-quick-dates button,
.reservation-calendar-grid button {
    display: grid;
    justify-items: center;
    gap: 2px;
    min-width: 0;
    min-height: 58px;
    padding: 7px 4px;
    border: 1px solid var(--lux-line);
    border-radius: 12px;
    background: #fffdf8;
    color: var(--lux-muted);
    cursor: pointer;
    transition: border-color .18s ease, background .18s ease, box-shadow .18s ease, color .18s ease;
}

.reservation-quick-dates button:hover,
.reservation-calendar-grid button:hover {
    border-color: rgba(215, 25, 32, .28);
    background: #fff7f4;
    color: var(--lux-black);
}

.reservation-quick-dates button.is-selected,
.reservation-calendar-grid button.is-selected {
    border-color: rgba(215, 25, 32, .48);
    background: #fff1ef;
    color: var(--lux-red);
    box-shadow: inset 0 0 0 1px rgba(215, 25, 32, .18);
}

.reservation-quick-dates span,
.reservation-calendar-grid span,
.reservation-quick-dates small,
.reservation-calendar-grid small {
    font-size: .64rem;
    font-weight: 800;
    line-height: 1;
}

.reservation-quick-dates strong,
.reservation-calendar-grid strong {
    color: var(--lux-black);
    font-size: .98rem;
    font-weight: 900;
    line-height: 1.05;
}

.reservation-calendar-dialog {
    width: min(560px, 94vw);
    max-width: 94vw;
    max-height: 86vh;
    padding: 16px;
    border: 0;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 28px 80px rgba(16, 16, 16, .28);
}

.reservation-calendar-dialog::backdrop {
    background: rgba(16, 16, 16, .45);
}

.reservation-calendar-toolbar {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) 38px;
    gap: 10px;
    align-items: center;
    margin-top: 16px;
}

.reservation-calendar-toolbar strong {
    color: var(--lux-black);
    font-size: 1rem;
    font-weight: 800;
    line-height: 1.2;
    text-align: center;
}

.reservation-calendar-toolbar button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border: 1px solid var(--lux-line);
    border-radius: 50%;
    background: #fffdf8;
    color: var(--lux-black);
    font-size: 1.35rem;
    font-weight: 800;
    line-height: 1;
    cursor: pointer;
}

.reservation-calendar-toolbar button:disabled {
    opacity: .35;
    cursor: not-allowed;
}

.reservation-calendar-weekdays {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 6px;
    margin-top: 14px;
}

.reservation-calendar-weekdays span {
    color: var(--lux-muted);
    font-size: .68rem;
    font-weight: 800;
    line-height: 1;
    text-align: center;
}

.reservation-calendar-grid {
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 6px;
    margin-top: 8px;
}

.reservation-calendar-grid button {
    min-height: 44px;
    border-radius: 10px;
    background: #fff;
}

.reservation-calendar-grid button:disabled {
    opacity: .35;
    cursor: not-allowed;
    background: #f6f3ee;
}

.reservation-calendar-grid .is-blank {
    display: block;
    min-height: 44px;
}

@media (max-width: 767.98px) {
    .reservation-section-head > .reservation-confirm-pill {
        width: 100%;
        justify-content: flex-start;
    }

    .reservation-type-switch {
        grid-template-columns: 1fr;
    }

    .reservation-type-switch .reservation-type-option {
        grid-template-columns: 18px 40px minmax(0, 1fr) !important;
    }

    .reservation-birthday-options,
    .reservation-occasion-options,
    .reservation-availability-panel {
        grid-template-columns: 1fr !important;
    }

    .reservation-quick-dates {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

.tracking-summary-row {
    padding: 14px 16px !important;
    border-radius: 14px !important;
    box-shadow: 0 12px 30px rgba(16, 16, 16, .045) !important;
}

.tracking-stepper {
    gap: 10px !important;
}

.tracking-step {
    min-height: 72px !important;
    padding: 10px !important;
    border-radius: 12px !important;
    box-shadow: none !important;
}

.tracking-step span {
    width: 24px !important;
    height: 24px !important;
    font-size: .78rem !important;
}

.tracking-step strong,
.tracking-items span,
.tracking-items strong,
.tracking-address span,
.tracking-status-card span,
.tracking-status-card small {
    font-size: .82rem !important;
    line-height: 1.24 !important;
}

.tracking-status-card strong {
    font-size: 1rem !important;
    line-height: 1.18 !important;
}

.tracking-address {
    padding: 12px !important;
    border-radius: 12px !important;
}

.tracking-items {
    gap: 8px !important;
}

.tracking-items > div {
    padding-bottom: 8px !important;
}

@media (max-width: 991.98px) {
    .auth-shell,
    .tracking-hero,
    .reservation-summary-card {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 767.98px) {
    .reservation-page .container-xxl,
    .auth-page,
    .tracking-shell,
    .cart-page,
    .checkout-page,
    .account-page {
        width: min(100% - 24px, 1320px) !important;
    }

    .reservation-page,
    .auth-page,
    .tracking-page,
    .cart-page,
    .checkout-page,
    .account-page {
        padding-top: 16px !important;
        padding-bottom: 36px !important;
    }
}

/* Single content rail: all customer pages match the Menu page width. */
:root {
    --tw-customer-rail: 1320px;
    --tw-customer-gutter: 40px;
    --tw-customer-gutter-mobile: 24px;
}

body:not(.admin-body):not(.manager-workspace-body):not(.rider-workspace-body) .site-navbar .container,
body:not(.admin-body):not(.manager-workspace-body):not(.rider-workspace-body) main > .container.py-2,
body:not(.admin-body):not(.manager-workspace-body):not(.rider-workspace-body) footer > .container,
.premium-order-page > .container-xxl,
.reservation-page > .container-xxl,
.auth-page,
.tracking-shell,
.cart-page,
.checkout-page,
.account-page,
.payment-hosted-shell,
.payment-hosted-page {
    width: min(var(--tw-customer-rail), calc(100% - var(--tw-customer-gutter))) !important;
    max-width: var(--tw-customer-rail) !important;
    margin-right: auto !important;
    margin-left: auto !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
}

.premium-order-page,
.reservation-page,
.auth-page,
.tracking-page,
.cart-page,
.checkout-page,
.account-page,
.payment-hosted-shell {
    padding-top: 24px !important;
}

.order-hero-copy h1,
.reservation-hero h1,
.checkout-heading h1,
.cart-page-heading h1,
.account-heading h1,
.auth-copy-panel h1,
.confirmation-hero-copy h1,
.tracking-hero h1,
.tracking-missing-card h1,
.payment-state h1,
.payment-hosted-header h1,
.page-heading h1 {
    font-size: clamp(1.55rem, 2vw, 2.05rem) !important;
    font-weight: 800 !important;
    line-height: 1.06 !important;
}

.premium-category-heading h2,
.menu-category-header h2,
.reservation-section-head h2,
.reservation-mini-card h2,
.reservation-floor-map-head h3,
.reservation-option-head h3,
.checkout-section-heading h2,
.checkout-summary-head h2,
.cart-summary-head h2,
.account-section-head h2,
.auth-card h2,
.confirmation-section-head h2,
.tracking-section-head h2 {
    font-size: .98rem !important;
    font-weight: 700 !important;
    line-height: 1.18 !important;
}

@media (max-width: 767.98px) {
    body:not(.admin-body):not(.manager-workspace-body):not(.rider-workspace-body) .site-navbar .container,
    body:not(.admin-body):not(.manager-workspace-body):not(.rider-workspace-body) main > .container.py-2,
    body:not(.admin-body):not(.manager-workspace-body):not(.rider-workspace-body) footer > .container,
    .premium-order-page > .container-xxl,
    .reservation-page > .container-xxl,
    .auth-page,
    .tracking-shell,
    .cart-page,
    .checkout-page,
    .account-page,
    .payment-hosted-shell,
    .payment-hosted-page {
        width: min(var(--tw-customer-rail), calc(100% - var(--tw-customer-gutter-mobile))) !important;
    }
}

/* Mobile reservation cleanup: keep actions visible, trim explanatory copy. */
@media (max-width: 767.98px) {
    .reservation-page {
        padding-top: 10px !important;
    }

    .reservation-layout {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }

    .reservation-form-card,
    .reservation-mini-card,
    .reservation-history-card {
        width: 100% !important;
        min-width: 0 !important;
    }

    .reservation-body .floating-actions {
        display: none !important;
    }

    .reservation-hero {
        margin-bottom: 10px !important;
    }

    .reservation-help-strip,
    .reservation-head-copy,
    .reservation-confirm-pill small,
    .reservation-type-copy small,
    .reservation-special-toggle small,
    .reservation-birthday-options small,
    .reservation-group-notice span,
    .reservation-floor-map-head .eyebrow,
    .reservation-option-head > span {
        display: none !important;
    }

    .reservation-section-head > .reservation-confirm-pill {
        width: fit-content !important;
        min-height: 34px !important;
        padding: 7px 10px !important;
        gap: 7px !important;
    }

    .reservation-confirm-pill i {
        width: 22px;
        height: 22px;
        font-size: .74rem;
    }

    .reservation-confirm-pill strong {
        font-size: .76rem;
    }

    .reservation-booking-head {
        gap: 8px !important;
        margin-bottom: 10px !important;
    }

    .reservation-booking-head .reservation-title-icon {
        width: 30px;
        height: 30px;
        font-size: .85rem;
    }

    .reservation-form-grid {
        gap: 8px !important;
    }

    .reservation-type-switch {
        gap: 8px !important;
    }

    .reservation-type-switch .reservation-type-option {
        grid-template-columns: 16px 34px minmax(0, 1fr) !important;
        min-height: 56px !important;
        padding: 9px 10px !important;
        border-radius: 12px !important;
    }

    .reservation-type-switch .reservation-type-icon {
        width: 34px;
        height: 34px;
        font-size: .9rem;
    }

    .reservation-type-copy::after {
        content: attr(data-mobile-copy);
        color: var(--lux-muted);
        font-size: .72rem;
        font-weight: 750;
        line-height: 1.2;
    }

    .reservation-group-notice {
        padding: 9px 10px !important;
        border-left-width: 3px !important;
    }

    .reservation-group-notice::after {
        content: "Daytime only - prepaid";
        color: #6f4a00;
        font-size: .72rem;
        font-weight: 750;
        line-height: 1.2;
    }

    .reservation-control-shell {
        min-height: 39px;
        border-radius: 11px;
    }

    .reservation-special-card {
        padding: 10px !important;
        border-radius: 12px !important;
    }

    .reservation-occasion-options {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .reservation-special-toggle .reservation-inline-icon {
        width: 28px;
        height: 28px;
        font-size: .82rem;
    }

    .reservation-birthday-options {
        grid-template-columns: 1fr !important;
        padding: 8px !important;
    }

    .reservation-availability-panel {
        grid-template-columns: auto minmax(0, 1fr) !important;
        gap: 8px !important;
        padding: 10px 0 0 !important;
    }

    .reservation-availability-panel > .reservation-inline-icon {
        width: 32px;
        height: 32px;
        font-size: .86rem;
    }

    .reservation-availability-panel h3 {
        font-size: .9rem !important;
    }

    .reservation-availability-metrics {
        display: none !important;
    }

    .reservation-floor-map {
        margin-top: 4px !important;
        gap: 8px !important;
    }

    .reservation-floor-map-head,
    .reservation-option-head {
        gap: 6px !important;
        margin-bottom: 8px !important;
    }

    .reservation-map-actions {
        gap: 6px 8px !important;
    }

    .reservation-map-legend {
        font-size: .72rem;
    }

    .reservation-table-policy {
        margin-bottom: 8px !important;
        padding: 8px 0 !important;
        font-size: 0 !important;
    }

    .reservation-table-policy::before {
        content: "Fixed layout - 2h + cleaning";
        color: #6a5840;
        font-size: .74rem;
        font-weight: 800;
        line-height: 1.2;
    }

    .reservation-stay-notice {
        margin: 0 0 8px !important;
        padding: 8px 10px !important;
        font-size: .74rem !important;
        line-height: 1.3 !important;
    }
}

/* Reservation standard: clean corporate scale, aligned with the Menu page. */
.reservation-page .reservation-hero {
    margin-bottom: 14px !important;
}

.reservation-page .reservation-hero h1 {
    font-size: clamp(1.45rem, 1.8vw, 1.85rem) !important;
    font-weight: 800 !important;
}

.reservation-form-card,
.reservation-mini-card,
.reservation-history-card {
    border-color: #ebe3d8 !important;
    box-shadow: 0 10px 26px rgba(16, 16, 16, .035) !important;
}

.reservation-form-card {
    padding: 14px !important;
}

.reservation-booking-head {
    align-items: center !important;
    margin-bottom: 10px !important;
    padding-bottom: 10px !important;
    border-bottom: 1px solid #eee7dd;
}

.reservation-booking-head .eyebrow,
.reservation-head-copy {
    display: none !important;
}

.reservation-booking-head .reservation-title-icon {
    width: 28px;
    height: 28px;
    font-size: .78rem;
    background: #fff3f2;
}

.reservation-booking-head h2 {
    font-size: .98rem !important;
    font-weight: 750 !important;
}

.reservation-section-head > .reservation-confirm-pill {
    min-height: 30px !important;
    padding: 6px 10px !important;
    border: 1px solid #f0ded9 !important;
    background: #fffaf8 !important;
}

.reservation-confirm-pill i {
    width: 20px;
    height: 20px;
    background: transparent;
    font-size: .72rem;
}

.reservation-confirm-pill strong {
    font-size: .74rem;
    font-weight: 800;
}

.reservation-confirm-pill small {
    display: none;
}

.reservation-type-switch {
    gap: 8px !important;
}

.reservation-type-switch .reservation-type-option {
    min-height: 56px !important;
    padding: 9px 10px !important;
    border-radius: 12px !important;
    border-color: #e6ded3 !important;
    background: #fff !important;
    box-shadow: none !important;
}

.reservation-type-switch .reservation-type-option.is-selected {
    border-color: rgba(215, 25, 32, .7) !important;
    background: #fff !important;
    box-shadow: inset 3px 0 0 var(--lux-red) !important;
}

.reservation-type-switch .reservation-type-icon {
    width: 30px !important;
    height: 30px !important;
    font-size: .82rem !important;
    background: #faf3eb !important;
}

.reservation-type-switch strong {
    font-size: .82rem !important;
    font-weight: 750 !important;
}

.reservation-type-switch small {
    font-size: .7rem !important;
    font-weight: 700 !important;
}

.reservation-form-card .form-label {
    margin-bottom: 4px !important;
    color: var(--lux-black);
    font-size: .72rem !important;
    font-weight: 800 !important;
}

.reservation-control-shell {
    min-height: 38px !important;
    border-color: #e3dbd0 !important;
    border-radius: 11px !important;
}

.reservation-control-shell .form-control,
.reservation-control-shell .form-select {
    min-height: 36px !important;
    font-size: .84rem !important;
    font-weight: 750 !important;
}

.reservation-special-card {
    border-color: #ebe3d8 !important;
    background: #fff !important;
    box-shadow: none !important;
}

.reservation-special-toggle strong {
    font-size: .84rem !important;
    font-weight: 750 !important;
}

.reservation-availability-panel {
    border-color: #eee7dd !important;
}

.reservation-availability-panel > .reservation-inline-icon,
.reservation-floor-map-head .reservation-title-icon,
.reservation-option-head .reservation-inline-icon {
    width: 28px !important;
    height: 28px !important;
    background: #fff4ec !important;
    font-size: .78rem !important;
}

.reservation-availability-panel h3,
.reservation-floor-map-head h3,
.reservation-option-head h3 {
    font-size: .92rem !important;
    font-weight: 750 !important;
}

.reservation-floor-map {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.reservation-map-stage {
    border-color: #eee7dd !important;
    box-shadow: none !important;
}

.reservation-table-policy {
    color: #6a5840;
    font-size: .76rem !important;
    font-weight: 750 !important;
}

.reservation-table-choice {
    min-height: 68px !important;
    border-color: #e8dfd3 !important;
    box-shadow: none !important;
}

.reservation-table-choice.is-selected,
.reservation-table-choice:has(input:checked) {
    border-color: var(--lux-red) !important;
    background: #fffafa !important;
}

.reservation-table-main strong {
    font-size: .82rem !important;
    font-weight: 750 !important;
}

.reservation-table-main small,
.reservation-table-meta small,
.reservation-table-choice em {
    font-size: .72rem !important;
}

@media (max-width: 767.98px) {
    .reservation-page {
        padding-top: 8px !important;
    }

    .reservation-page .reservation-hero {
        margin-bottom: 10px !important;
    }

    .reservation-page .reservation-hero .reservation-title-icon {
        display: none !important;
    }

    .reservation-page .reservation-hero h1 {
        font-size: 1.42rem !important;
    }

    .reservation-booking-head {
        display: none !important;
    }

    .reservation-form-card {
        padding: 12px !important;
    }

    .reservation-form-card .reservation-form-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 9px !important;
    }

    .reservation-form-card .reservation-wide-field {
        grid-column: 1 / -1;
    }

    .reservation-type-switch {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
    }

    .reservation-type-switch .reservation-type-option {
        grid-template-columns: 14px minmax(0, 1fr) !important;
        min-height: 50px !important;
        padding: 8px 9px !important;
    }

    .reservation-type-switch .reservation-type-icon {
        display: none !important;
    }

    .reservation-type-radio {
        width: 12px;
        height: 12px;
    }

    .reservation-type-switch strong {
        font-size: .78rem !important;
    }

    .reservation-type-copy::after {
        font-size: .66rem !important;
    }

    .reservation-control-shell {
        min-height: 38px !important;
        padding: 0 9px !important;
        gap: 6px !important;
    }

    .reservation-control-icon {
        font-size: .82rem !important;
    }

    .reservation-control-shell .form-control,
    .reservation-control-shell .form-select {
        min-width: 0;
        font-size: .8rem !important;
    }

    .reservation-special-card {
        padding: 9px !important;
    }

    .reservation-special-toggle .reservation-inline-icon {
        width: 24px !important;
        height: 24px !important;
    }

    .reservation-occasion-options {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .reservation-availability-panel {
        padding-top: 8px !important;
    }

    .reservation-floor-map {
        margin-top: 0 !important;
    }

    .reservation-floor-map-head,
    .reservation-option-head {
        flex-direction: row !important;
        align-items: center !important;
        justify-content: space-between !important;
    }

    .reservation-floor-map-head .reservation-heading-with-icon {
        flex: 0 0 auto;
    }

    .reservation-floor-map-head h3 {
        white-space: nowrap;
    }

    .reservation-map-actions {
        width: 100%;
        justify-content: space-between !important;
    }

    .reservation-map-legend {
        font-size: .68rem !important;
    }

    .reservation-table-choice {
        min-height: 62px !important;
        padding: 9px !important;
    }

    .reservation-table-policy {
        font-size: 0 !important;
        line-height: 0 !important;
    }

    .reservation-table-policy::before {
        content: "Fixed layout - 2h + cleaning";
        display: block;
        color: #6a5840;
        font-size: .72rem;
        font-weight: 800;
        line-height: 1.25;
    }

.reservation-email-field {
    grid-column: 1 / -1;
}
}

/* Selected reservation states: red fill with white text for stronger clarity. */
.reservation-type-switch .reservation-type-option.is-selected {
    border-color: var(--lux-red) !important;
    background: var(--lux-red) !important;
    color: #fff !important;
    box-shadow: 0 10px 22px rgba(215, 25, 32, .16) !important;
}

.reservation-type-switch .reservation-type-option.is-selected strong,
.reservation-type-switch .reservation-type-option.is-selected small,
.reservation-type-switch .reservation-type-option.is-selected .reservation-type-copy::after {
    color: #fff !important;
}

.reservation-type-switch .reservation-type-option.is-selected .reservation-type-radio {
    border-color: #fff !important;
    background: #fff !important;
    box-shadow: inset 0 0 0 3px var(--lux-red) !important;
}

.reservation-type-switch .reservation-type-option.is-selected .reservation-type-icon {
    background: rgba(255, 255, 255, .16) !important;
    color: #fff !important;
}

.reservation-table-choice.is-selected,
.reservation-table-choice:has(input:checked) {
    border-color: var(--lux-red) !important;
    background: var(--lux-red) !important;
    color: #fff !important;
    box-shadow: 0 12px 26px rgba(215, 25, 32, .18) !important;
}

.reservation-table-choice.is-selected .reservation-table-main strong,
.reservation-table-choice:has(input:checked) .reservation-table-main strong,
.reservation-table-choice.is-selected .reservation-table-main small,
.reservation-table-choice:has(input:checked) .reservation-table-main small,
.reservation-table-choice.is-selected .reservation-table-meta small,
.reservation-table-choice:has(input:checked) .reservation-table-meta small,
.reservation-table-choice.is-selected em,
.reservation-table-choice:has(input:checked) em {
    color: #fff !important;
}

.reservation-table-choice.is-selected input[type="radio"],
.reservation-table-choice:has(input:checked) input[type="radio"] {
    accent-color: #fff;
}

/* Reservation highlight requests. */
.reservation-type-switch .reservation-type-option[data-booking-type-option="standard"] {
    border-color: var(--lux-gold) !important;
    background: var(--lux-gold) !important;
    color: #fff !important;
    box-shadow: 0 10px 22px rgba(185, 150, 80, .16) !important;
}

.reservation-type-switch .reservation-type-option[data-booking-type-option="standard"] strong,
.reservation-type-switch .reservation-type-option[data-booking-type-option="standard"] small,
.reservation-type-switch .reservation-type-option[data-booking-type-option="standard"] .reservation-type-copy::after {
    color: #fff !important;
}

.reservation-type-switch .reservation-type-option[data-booking-type-option="standard"] .reservation-type-radio {
    border-color: #fff !important;
    background: transparent !important;
    box-shadow: none !important;
}

.reservation-type-switch .reservation-type-option[data-booking-type-option="standard"].is-selected .reservation-type-radio {
    background: #fff !important;
    box-shadow: inset 0 0 0 3px var(--lux-gold) !important;
}

.reservation-type-switch .reservation-type-option[data-booking-type-option="standard"] .reservation-type-icon {
    background: rgba(255, 255, 255, .16) !important;
    color: #fff !important;
}

.reservation-mini-card.has-active-bookings {
    border-color: var(--lux-red) !important;
    background: var(--lux-red) !important;
    color: #fff !important;
    box-shadow: 0 14px 32px rgba(215, 25, 32, .2) !important;
}

.reservation-mini-card.has-active-bookings .reservation-card-heading .reservation-title-icon {
    background: rgba(255, 255, 255, .16) !important;
    color: #fff !important;
}

.reservation-mini-card.has-active-bookings .eyebrow,
.reservation-mini-card.has-active-bookings h2,
.reservation-mini-card.has-active-bookings .reservation-active-list strong,
.reservation-mini-card.has-active-bookings .reservation-active-list span,
.reservation-mini-card.has-active-bookings .reservation-active-list em,
.reservation-mini-card.has-active-bookings .reservation-active-list a,
.reservation-mini-card.has-active-bookings .reservation-danger-link,
.reservation-mini-card.has-active-bookings .reservation-active-group-note,
.reservation-mini-card.has-active-bookings .reservation-active-special-note {
    color: #fff !important;
}

.reservation-mini-card.has-active-bookings .reservation-active-list div {
    border-color: rgba(255, 255, 255, .24) !important;
}

.reservation-mini-card.has-active-bookings .reservation-active-table-chips i,
.reservation-mini-card.has-active-bookings .reservation-active-table-chips small {
    border-color: rgba(255, 255, 255, .28) !important;
    background: rgba(255, 255, 255, .14) !important;
    color: #fff !important;
}

.reservation-mini-card.has-active-bookings .reservation-booking-links {
    border-top-color: rgba(255, 255, 255, .24) !important;
}

.reservation-mini-card.has-active-bookings .reservation-active-list {
    gap: 8px !important;
}

.reservation-mini-card.has-active-bookings .reservation-active-list div {
    gap: 6px !important;
    padding: 11px 0 !important;
}

.reservation-mini-card.has-active-bookings .reservation-active-meta {
    color: rgba(255, 255, 255, .84) !important;
    font-size: .74rem !important;
    line-height: 1.35 !important;
}

.reservation-mini-card.has-active-bookings .reservation-active-list em,
.reservation-mini-card.has-active-bookings .reservation-active-group-note,
.reservation-mini-card.has-active-bookings .reservation-active-special-note {
    display: none !important;
}

.reservation-mini-card.has-active-bookings .reservation-active-table-chips {
    gap: 5px !important;
    margin-top: 2px !important;
}

.reservation-mini-card.has-active-bookings .reservation-active-table-chips i,
.reservation-mini-card.has-active-bookings .reservation-active-table-chips small {
    min-height: 22px !important;
    padding: 4px 7px !important;
    border-color: rgba(255, 255, 255, .3) !important;
    background: rgba(255, 255, 255, .14) !important;
    color: #fff !important;
    font-size: .68rem !important;
}

.reservation-mini-card.has-active-bookings .reservation-booking-links {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px !important;
    margin-top: 8px !important;
    padding: 10px 0 0 !important;
    border-top: 1px solid rgba(255, 255, 255, .24) !important;
}

.reservation-mini-card.has-active-bookings .reservation-booking-links form {
    display: flex !important;
    margin: 0 !important;
}

.reservation-mini-card.has-active-bookings .reservation-booking-links a,
.reservation-mini-card.has-active-bookings .reservation-booking-links > button,
.reservation-mini-card.has-active-bookings .reservation-danger-link {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 34px;
    padding: 0 12px !important;
    border: 1px solid rgba(255, 255, 255, .74) !important;
    border-radius: 999px;
    background: #fff !important;
    color: var(--lux-black) !important;
    font-size: .76rem !important;
    font-weight: 850 !important;
    line-height: 1;
    text-decoration: none !important;
}

.reservation-mini-card.has-active-bookings .reservation-danger-link:hover,
.reservation-mini-card.has-active-bookings .reservation-booking-links > button:hover,
.reservation-mini-card.has-active-bookings .reservation-booking-links a:hover {
    border-color: #fff !important;
    background: #fff8f3 !important;
}

.reservation-inline-edit {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
    margin-top: 10px;
    padding: 10px;
    border: 1px solid rgba(255, 255, 255, .28);
    border-radius: 12px;
    background: rgba(255, 255, 255, .12);
}

.reservation-inline-edit[hidden] {
    display: none !important;
}

.reservation-inline-edit label {
    display: block;
    margin-bottom: 4px;
    color: rgba(255, 255, 255, .78);
    font-size: .68rem;
    font-weight: 500;
}

.reservation-inline-edit input,
.reservation-inline-edit select {
    width: 100%;
    min-height: 34px;
    padding: 6px 9px;
    border: 1px solid rgba(255, 255, 255, .56);
    border-radius: 9px;
    background: #fff;
    color: var(--lux-black);
    font-size: .78rem;
    font-weight: 500;
}

.reservation-inline-edit-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin-top: 2px;
}

.reservation-inline-edit-actions button {
    min-height: 34px;
    border: 1px solid rgba(255, 255, 255, .72);
    border-radius: 999px;
    background: #fff;
    color: var(--lux-black);
    font-size: .76rem;
    font-weight: 650;
}

.reservation-inline-edit-actions button[type="submit"] {
    background: #101010;
    border-color: #101010;
    color: #fff;
}

/* Reservation typography: keep hierarchy calm and premium. */
.reservation-body .reservation-page .eyebrow,
.reservation-body .reservation-page .reservation-head-copy,
.reservation-body .reservation-page .reservation-confirm-pill strong,
.reservation-body .reservation-page .reservation-confirm-pill small,
.reservation-body .reservation-page .reservation-type-switch strong,
.reservation-body .reservation-page .reservation-type-switch small,
.reservation-body .reservation-page .reservation-type-copy::after,
.reservation-body .reservation-page .form-label,
.reservation-body .reservation-page .form-control,
.reservation-body .reservation-page .form-select,
.reservation-body .reservation-page .reservation-special-toggle strong,
.reservation-body .reservation-page .reservation-special-toggle small,
.reservation-body .reservation-page .reservation-availability-panel strong,
.reservation-body .reservation-page .reservation-table-policy,
.reservation-body .reservation-page .reservation-map-legend,
.reservation-body .reservation-page .reservation-option-head > span,
.reservation-body .reservation-page .reservation-table-main strong,
.reservation-body .reservation-page .reservation-table-main small,
.reservation-body .reservation-page .reservation-table-meta small,
.reservation-body .reservation-page .reservation-table-choice em,
.reservation-body .reservation-page .reservation-hours-row span,
.reservation-body .reservation-page .reservation-hours-row strong,
.reservation-body .reservation-page .reservation-hours-card small,
.reservation-body .reservation-page .reservation-active-list strong,
.reservation-body .reservation-page .reservation-active-list span,
.reservation-body .reservation-page .reservation-active-table-chips i,
.reservation-body .reservation-page .reservation-active-table-chips small,
.reservation-body .reservation-page .reservation-empty-bookings strong,
.reservation-body .reservation-page .reservation-empty-bookings span,
.reservation-body .reservation-page .reservation-history-card summary span,
.reservation-body .reservation-page .reservation-history-list span,
.reservation-body .reservation-page .reservation-history-list em {
    font-weight: 500 !important;
}

.reservation-body .reservation-page h1,
.reservation-body .reservation-page .reservation-section-head h2,
.reservation-body .reservation-page .reservation-mini-card h2,
.reservation-body .reservation-page .reservation-floor-map-head h3,
.reservation-body .reservation-page .reservation-option-head h3 {
    font-weight: 750 !important;
}

.reservation-body .reservation-page .reservation-availability-panel h3 {
    font-weight: 600 !important;
}

.reservation-body .reservation-page .btn,
.reservation-body .reservation-page .reservation-submit,
.reservation-body .reservation-page .reservation-booking-links a,
.reservation-body .reservation-page .reservation-danger-link {
    font-weight: 650 !important;
}

.reservation-body .reservation-page .reservation-type-option.is-selected strong,
.reservation-body .reservation-page .reservation-table-choice:has(input:checked) .reservation-table-main strong,
.reservation-body .reservation-page .reservation-mini-card.has-active-bookings h2,
.reservation-body .reservation-page .reservation-mini-card.has-active-bookings .reservation-active-list strong {
    font-weight: 650 !important;
}

/* Customer header: clear active page state without adding visual clutter. */
body:not(.admin-body):not(.manager-workspace-body):not(.rider-workspace-body) .desktop-header-actions > .nav-link,
body:not(.admin-body):not(.manager-workspace-body):not(.rider-workspace-body) .desktop-header-actions .track-order-nav,
body:not(.admin-body):not(.manager-workspace-body):not(.rider-workspace-body) .desktop-header-actions .logged-in-pill,
body:not(.admin-body):not(.manager-workspace-body):not(.rider-workspace-body) .desktop-header-actions .header-signup-btn {
    position: relative;
    transition: color .18s ease, border-color .18s ease, background-color .18s ease, box-shadow .18s ease;
}

body:not(.admin-body):not(.manager-workspace-body):not(.rider-workspace-body) .desktop-header-actions > .nav-link:not(.track-order-nav) {
    padding-right: 0;
    padding-left: 0;
}

body:not(.admin-body):not(.manager-workspace-body):not(.rider-workspace-body) .desktop-header-actions > .nav-link:not(.track-order-nav)::after,
body:not(.admin-body):not(.manager-workspace-body):not(.rider-workspace-body) .desktop-header-actions .track-order-nav.is-current::after,
body:not(.admin-body):not(.manager-workspace-body):not(.rider-workspace-body) .desktop-header-actions .logged-in-pill.is-current::after,
body:not(.admin-body):not(.manager-workspace-body):not(.rider-workspace-body) .desktop-header-actions .header-signup-btn.is-current::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: -12px;
    left: 0;
    height: 2px;
    border-radius: 999px;
    background: var(--lux-red);
    opacity: 0;
    transform: scaleX(.38);
    transform-origin: center;
    transition: opacity .18s ease, transform .18s ease;
}

body:not(.admin-body):not(.manager-workspace-body):not(.rider-workspace-body) .desktop-header-actions > .nav-link:not(.track-order-nav):hover::after,
body:not(.admin-body):not(.manager-workspace-body):not(.rider-workspace-body) .desktop-header-actions > .nav-link:not(.track-order-nav):focus-visible::after,
body:not(.admin-body):not(.manager-workspace-body):not(.rider-workspace-body) .desktop-header-actions > .nav-link.is-current::after,
body:not(.admin-body):not(.manager-workspace-body):not(.rider-workspace-body) .desktop-header-actions .track-order-nav.is-current::after,
body:not(.admin-body):not(.manager-workspace-body):not(.rider-workspace-body) .desktop-header-actions .logged-in-pill.is-current::after,
body:not(.admin-body):not(.manager-workspace-body):not(.rider-workspace-body) .desktop-header-actions .header-signup-btn.is-current::after {
    opacity: 1;
    transform: scaleX(1);
}

body:not(.admin-body):not(.manager-workspace-body):not(.rider-workspace-body) .desktop-header-actions .nav-link.is-current,
body:not(.admin-body):not(.manager-workspace-body):not(.rider-workspace-body) .desktop-header-actions .logged-in-pill.is-current,
body:not(.admin-body):not(.manager-workspace-body):not(.rider-workspace-body) .desktop-header-actions .header-signup-btn.is-current {
    color: var(--lux-red) !important;
}

body:not(.admin-body):not(.manager-workspace-body):not(.rider-workspace-body) .desktop-header-actions .auth-nav-login.is-current {
    color: var(--lux-red) !important;
}

body:not(.admin-body):not(.manager-workspace-body):not(.rider-workspace-body) .desktop-header-actions .header-signup-btn.is-current,
body:not(.admin-body):not(.manager-workspace-body):not(.rider-workspace-body) .desktop-header-actions .logged-in-pill.is-current {
    border-color: rgba(215, 25, 32, .24);
    background: #fff8f6;
}

body:not(.admin-body):not(.manager-workspace-body):not(.rider-workspace-body) .desktop-header-actions .track-order-nav.is-current {
    border-color: rgba(215, 25, 32, .26);
    box-shadow: 0 10px 22px rgba(215, 25, 32, .08);
}

@media (max-width: 991.98px) {
    body:not(.admin-body):not(.manager-workspace-body):not(.rider-workspace-body) .mobile-nav-item.active {
        border-color: rgba(215, 25, 32, .34);
        background: #fff6f4;
        color: var(--lux-red);
        box-shadow: inset 3px 0 0 var(--lux-red);
    }
}

/* Admin shell: compact left navigation with icons. */
.admin-shell-body {
    --admin-side-width: 236px;
    background:
        radial-gradient(circle at 0 0, rgba(201, 154, 46, .08), transparent 280px),
        linear-gradient(180deg, #fff 0, #fbfaf7 260px, var(--lux-soft) 100%);
}

.admin-shell {
    min-height: 100vh;
}

.admin-sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    z-index: 1030;
    display: flex;
    width: var(--admin-side-width);
    padding: 14px 12px;
    flex-direction: column;
    border-right: 1px solid rgba(16, 16, 16, .08);
    background: rgba(255, 255, 255, .96);
    box-shadow: 18px 0 46px rgba(20, 14, 8, .05);
}

.admin-sidebar-brand {
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 44px;
    padding: 4px 7px 12px;
    color: var(--lux-black);
    text-decoration: none;
}

.admin-sidebar-brand .admin-brand-logo {
    width: 154px;
    max-width: 154px;
}

.admin-sidebar-brand span,
.admin-mobile-brand span {
    display: inline-flex;
    align-items: center;
    min-height: 22px;
    padding: 0 7px;
    border: 1px solid rgba(201, 154, 46, .28);
    border-radius: 999px;
    background: #fffaf0;
    color: #7b612b;
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.admin-side-nav {
    display: grid;
    gap: 4px;
    padding-top: 8px;
}

.admin-side-link,
.admin-mobile-nav a {
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
    color: #514b43;
    font-size: .84rem;
    font-weight: 720;
    line-height: 1;
    text-decoration: none;
    transition: color .16s ease, background-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.admin-side-link {
    min-height: 40px;
    padding: 0 10px;
    border-radius: 8px;
}

.admin-side-link:hover,
.admin-side-link:focus-visible {
    color: var(--lux-black);
    background: #f6f1e9;
}

.admin-side-link.active {
    color: #fff;
    background: var(--lux-red);
    box-shadow: 0 12px 24px rgba(215, 25, 32, .16);
}

.admin-side-link.active::before {
    content: "";
    position: absolute;
    left: -12px;
    top: 9px;
    bottom: 9px;
    width: 3px;
    border-radius: 0 999px 999px 0;
    background: var(--lux-red);
}

.admin-nav-icon {
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.admin-sidebar-footer {
    display: grid;
    gap: 10px;
    margin-top: auto;
    padding-top: 12px;
    border-top: 1px solid rgba(16, 16, 16, .08);
}

.admin-sidebar-user {
    display: grid;
    grid-template-columns: 36px 1fr;
    gap: 9px;
    align-items: center;
    min-width: 0;
    padding: 8px;
    border-radius: 10px;
    background: #fbfaf7;
}

.admin-sidebar-user > span {
    display: grid;
    width: 36px;
    height: 36px;
    place-items: center;
    border-radius: 999px;
    background: #111;
    color: #fff;
    font-size: .82rem;
    font-weight: 800;
}

.admin-sidebar-user strong,
.admin-sidebar-user small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-sidebar-user strong {
    color: var(--lux-black);
    font-size: .8rem;
    line-height: 1.2;
}

.admin-sidebar-user small {
    color: var(--lux-muted);
    font-size: .7rem;
    font-weight: 650;
}

.admin-sidebar-logout,
.admin-mobile-logout {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    border: 1px solid rgba(16, 16, 16, .2);
    border-radius: 999px;
    background: #fff;
    color: var(--lux-black);
    font-size: .78rem;
    font-weight: 800;
    text-decoration: none;
}

.admin-sidebar-logout:hover,
.admin-sidebar-logout:focus-visible,
.admin-mobile-logout:hover,
.admin-mobile-logout:focus-visible {
    border-color: rgba(215, 25, 32, .36);
    color: var(--lux-red);
    background: #fff8f6;
}

.admin-content-shell {
    min-width: 0;
    margin-left: var(--admin-side-width);
}

.admin-shell-body .admin-main {
    width: 100%;
    max-width: 1320px;
    margin: 0 auto;
    padding: 22px 24px 54px !important;
}

.admin-mobile-topbar,
.admin-mobile-nav {
    display: none;
}

@media (max-width: 991.98px) {
    .admin-shell-body {
        --admin-side-width: 0px;
        padding-top: 108px;
    }

    .admin-sidebar {
        display: none;
    }

    .admin-content-shell {
        margin-left: 0;
    }

    .admin-mobile-topbar {
        position: fixed;
        top: 0;
        right: 0;
        left: 0;
        z-index: 1035;
        display: flex;
        align-items: center;
        justify-content: space-between;
        min-height: 56px;
        padding: 8px 14px;
        border-bottom: 1px solid rgba(16, 16, 16, .08);
        background: rgba(255, 255, 255, .97);
        backdrop-filter: blur(12px);
    }

    .admin-mobile-brand {
        display: flex;
        align-items: center;
        gap: 8px;
        color: var(--lux-black);
        text-decoration: none;
    }

    .admin-mobile-brand img {
        width: min(150px, 46vw);
        height: auto;
    }

    .admin-mobile-nav {
        position: fixed;
        top: 56px;
        right: 0;
        left: 0;
        z-index: 1034;
        display: flex;
        gap: 6px;
        overflow-x: auto;
        padding: 8px 12px 10px;
        border-bottom: 1px solid rgba(16, 16, 16, .07);
        background: rgba(255, 255, 255, .95);
        scrollbar-width: none;
    }

    .admin-mobile-nav::-webkit-scrollbar {
        display: none;
    }

    .admin-mobile-nav a {
        min-height: 34px;
        padding: 0 10px;
        flex: 0 0 auto;
        border: 1px solid rgba(16, 16, 16, .09);
        border-radius: 999px;
        background: #fff;
        white-space: nowrap;
    }

    .admin-mobile-nav a.active {
        border-color: transparent;
        background: var(--lux-red);
        color: #fff;
        box-shadow: 0 8px 18px rgba(215, 25, 32, .12);
    }

    .admin-shell-body .admin-main {
        padding: 16px 12px 42px !important;
    }
}

@media (max-width: 575.98px) {
    .admin-mobile-nav a {
        gap: 7px;
        padding-inline: 9px;
        font-size: .78rem;
    }

    .admin-mobile-nav .admin-nav-icon {
        width: 16px;
        height: 16px;
        flex-basis: 16px;
    }
}

/* Reservation cancel confirmation: replaces the browser default alert. */
.reservation-modal-open {
    overflow: hidden;
}

.reservation-cancel-modal {
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: grid;
    place-items: center;
    padding: 24px;
}

.reservation-cancel-modal[hidden] {
    display: none !important;
}

.reservation-cancel-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(16, 16, 16, .46);
    backdrop-filter: blur(5px);
    opacity: 0;
    transition: opacity .18s ease;
}

.reservation-cancel-modal-panel {
    position: relative;
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    gap: 14px;
    width: min(440px, 100%);
    padding: 20px;
    border: 1px solid rgba(217, 199, 166, .64);
    border-radius: 18px;
    background: #fffdf9;
    box-shadow: 0 28px 80px rgba(16, 16, 16, .26);
    opacity: 0;
    outline: 0;
    transform: translateY(10px) scale(.98);
    transition: opacity .18s ease, transform .18s ease;
}

.reservation-cancel-modal.is-open .reservation-cancel-modal-backdrop,
.reservation-cancel-modal.is-open .reservation-cancel-modal-panel {
    opacity: 1;
}

.reservation-cancel-modal.is-open .reservation-cancel-modal-panel {
    transform: translateY(0) scale(1);
}

.reservation-cancel-modal-icon {
    display: grid;
    width: 44px;
    height: 44px;
    place-items: center;
    border-radius: 50%;
    background: #fff1ef;
    color: var(--lux-red);
    font-size: 1.15rem;
    font-weight: 800;
    box-shadow: inset 0 0 0 1px rgba(215, 25, 32, .14);
}

.reservation-cancel-modal-copy {
    min-width: 0;
}

.reservation-cancel-modal-copy .eyebrow {
    margin: 0 0 4px;
    color: var(--lux-red);
    font-size: .72rem;
    letter-spacing: .12em;
}

.reservation-cancel-modal-copy h2 {
    margin: 0;
    color: var(--lux-black);
    font-size: 1.18rem;
    line-height: 1.15;
    font-weight: 750;
}

.reservation-cancel-modal-copy p:not(.eyebrow) {
    margin: 8px 0 0;
    color: var(--lux-muted);
    font-size: .9rem;
    line-height: 1.45;
}

.reservation-cancel-modal-summary {
    margin-top: 12px;
    padding: 10px 12px;
    border: 1px solid var(--lux-line);
    border-radius: 12px;
    background: #faf7f1;
    color: var(--lux-black);
    font-size: .82rem;
    line-height: 1.35;
}

.reservation-cancel-modal-actions {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-top: 6px;
}

.reservation-cancel-modal-actions button {
    min-height: 42px;
    border-radius: 999px;
    font-size: .9rem;
    font-weight: 700;
    transition: transform .16s ease, border-color .16s ease, background-color .16s ease, color .16s ease;
}

.reservation-cancel-modal-actions button:hover {
    transform: translateY(-1px);
}

.reservation-cancel-secondary {
    border: 1px solid var(--lux-line-strong);
    background: #fff;
    color: var(--lux-black);
}

.reservation-cancel-primary {
    border: 1px solid var(--lux-red);
    background: var(--lux-red);
    color: #fff;
}

.reservation-cancel-primary:hover,
.reservation-cancel-primary:focus-visible {
    border-color: var(--lux-red-dark);
    background: var(--lux-red-dark);
}

.reservation-manager-body .staff-reservation-cancel-modal .reservation-cancel-modal-panel {
    border-color: rgba(255, 255, 255, .16);
    background: #16181d;
    box-shadow: 0 28px 80px rgba(0, 0, 0, .55);
}

.reservation-manager-body .staff-reservation-cancel-modal .reservation-cancel-modal-copy h2,
.reservation-manager-body .staff-reservation-cancel-modal .reservation-cancel-modal-summary {
    color: var(--rm-text);
}

.reservation-manager-body .staff-reservation-cancel-modal .reservation-cancel-modal-copy p:not(.eyebrow) {
    color: var(--rm-muted);
}

.reservation-manager-body .staff-reservation-cancel-modal .reservation-cancel-modal-summary {
    border-color: rgba(255, 255, 255, .12);
    background: rgba(255, 255, 255, .06);
}

.reservation-manager-body .staff-reservation-cancel-modal .reservation-cancel-secondary {
    border-color: rgba(255, 255, 255, .18);
    background: rgba(255, 255, 255, .08);
    color: var(--rm-text);
}

@media (max-width: 575.98px) {
    .reservation-cancel-modal {
        align-items: end;
        padding: 14px;
    }

    .reservation-cancel-modal-panel {
        grid-template-columns: 38px minmax(0, 1fr);
        gap: 12px;
        padding: 16px;
        border-radius: 16px;
    }

    .reservation-cancel-modal-icon {
        width: 38px;
        height: 38px;
    }

    .reservation-cancel-modal-actions {
        grid-template-columns: 1fr;
    }

    .reservation-cancel-primary {
        order: -1;
    }
}

/* Booking type cards: calm default state, no red/gold filled panels. */
.reservation-body .reservation-type-switch .reservation-type-option,
.reservation-body .reservation-type-switch .reservation-type-option[data-booking-type-option="standard"],
.reservation-body .reservation-type-switch .reservation-type-option[data-booking-type-option="group"] {
    border-color: #e6ded3 !important;
    background: #fff !important;
    color: var(--lux-black) !important;
    box-shadow: none !important;
}

.reservation-body .reservation-type-switch .reservation-type-option:hover,
.reservation-body .reservation-type-switch .reservation-type-option:focus-within {
    border-color: rgba(215, 25, 32, .26) !important;
    background: #fffaf8 !important;
}

.reservation-body .reservation-type-switch .reservation-type-option.is-selected,
.reservation-body .reservation-type-switch .reservation-type-option[data-booking-type-option="standard"].is-selected,
.reservation-body .reservation-type-switch .reservation-type-option[data-booking-type-option="group"].is-selected {
    border-color: rgba(215, 25, 32, .7) !important;
    background: #fff !important;
    color: var(--lux-black) !important;
    box-shadow: inset 3px 0 0 var(--lux-red), 0 8px 18px rgba(215, 25, 32, .06) !important;
}

.reservation-body .reservation-type-switch .reservation-type-option strong,
.reservation-body .reservation-type-switch .reservation-type-option[data-booking-type-option="standard"] strong,
.reservation-body .reservation-type-switch .reservation-type-option[data-booking-type-option="group"] strong,
.reservation-body .reservation-type-switch .reservation-type-option.is-selected strong,
.reservation-body .reservation-type-switch .reservation-type-option[data-booking-type-option="standard"].is-selected strong,
.reservation-body .reservation-type-switch .reservation-type-option[data-booking-type-option="group"].is-selected strong {
    color: var(--lux-black) !important;
}

.reservation-body .reservation-type-switch .reservation-type-option small,
.reservation-body .reservation-type-switch .reservation-type-option[data-booking-type-option="standard"] small,
.reservation-body .reservation-type-switch .reservation-type-option[data-booking-type-option="group"] small,
.reservation-body .reservation-type-switch .reservation-type-option.is-selected small,
.reservation-body .reservation-type-switch .reservation-type-option[data-booking-type-option="standard"].is-selected small,
.reservation-body .reservation-type-switch .reservation-type-option[data-booking-type-option="group"].is-selected small,
.reservation-body .reservation-type-switch .reservation-type-option .reservation-type-copy::after,
.reservation-body .reservation-type-switch .reservation-type-option.is-selected .reservation-type-copy::after {
    color: var(--lux-muted) !important;
}

.reservation-body .reservation-type-switch .reservation-type-radio,
.reservation-body .reservation-type-switch .reservation-type-option[data-booking-type-option="standard"] .reservation-type-radio {
    border-color: #b7b0a6 !important;
    background: #fff !important;
    box-shadow: inset 0 0 0 3px #fff !important;
}

.reservation-body .reservation-type-switch .reservation-type-option.is-selected .reservation-type-radio,
.reservation-body .reservation-type-switch .reservation-type-option[data-booking-type-option="standard"].is-selected .reservation-type-radio,
.reservation-body .reservation-type-switch .reservation-type-option[data-booking-type-option="group"].is-selected .reservation-type-radio {
    border-color: var(--lux-red) !important;
    background: var(--lux-red) !important;
    box-shadow: inset 0 0 0 3px #fff !important;
}

.reservation-body .reservation-type-switch .reservation-type-icon,
.reservation-body .reservation-type-switch .reservation-type-option[data-booking-type-option="standard"] .reservation-type-icon {
    background: #faf3eb !important;
    color: #8f6500 !important;
}

.reservation-body .reservation-type-switch .reservation-type-icon.is-red,
.reservation-body .reservation-type-switch .reservation-type-option[data-booking-type-option="group"] .reservation-type-icon {
    background: #fff1ef !important;
    color: var(--lux-red) !important;
}

/* Admin and manager reservation operations. */
.reservation-admin-contact {
    display: grid;
    gap: 4px;
    min-width: 180px;
}

.reservation-admin-toolbar-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: flex-end;
}

.reservation-admin-contact > strong {
    color: var(--lux-black);
    font-size: .92rem;
    line-height: 1.2;
}

.reservation-admin-contact a,
.reservation-admin-contact small {
    display: inline-flex;
    gap: 6px;
    align-items: center;
    color: var(--lux-muted);
    font-size: .78rem;
    font-weight: 650;
    text-decoration: none;
}

.reservation-admin-contact a:hover,
.reservation-admin-contact a:focus {
    color: var(--lux-red);
}

.reservation-admin-contact span {
    color: var(--lux-red);
    font-size: .66rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.reservation-admin-actions:has(.reservation-admin-fixed-actions) {
    display: block;
    min-width: 260px;
}

.reservation-admin-fixed-actions {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 8px;
    align-items: start;
}

.reservation-admin-change-box {
    min-width: 0;
}

.reservation-admin-change-box summary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 32px;
    width: 100%;
    border: 1px solid var(--lux-line-strong);
    border-radius: 999px;
    background: #fff;
    color: var(--lux-black);
    cursor: pointer;
    font-size: .78rem;
    font-weight: 800;
    list-style: none;
}

.reservation-admin-change-box summary::-webkit-details-marker {
    display: none;
}

.reservation-admin-change-form {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
    margin-top: 8px;
    padding: 9px;
    border: 1px solid var(--lux-line);
    border-radius: 12px;
    background: #fffaf6;
}

.reservation-admin-change-form button {
    grid-column: 1 / -1;
}

.reservation-admin-cancel-form {
    display: block !important;
}

.reservation-manager-page {
    display: grid;
    gap: 12px;
}

.reservation-manager-topbar {
    grid-template-columns: minmax(230px, .9fr) auto minmax(280px, 1fr) auto minmax(420px, auto);
}

.reservation-manager-workbench {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 12px;
    align-items: start;
}

.reservation-manager-create-card,
.reservation-manager-monitor-card {
    border: 1px solid rgba(16, 16, 16, .08);
    border-radius: 16px;
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 14px 34px rgba(16, 16, 16, .06);
}

.reservation-manager-create-card {
    display: grid;
    gap: 14px;
    padding: 16px;
}

.reservation-manager-monitor-card {
    display: grid;
    gap: 12px;
    padding: 14px;
}

.reservation-manager-section-head {
    display: flex;
    gap: 10px;
    align-items: center;
    min-width: 0;
}

.reservation-manager-section-head > span {
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    flex: 0 0 38px;
    border-radius: 999px;
    background: #fff4f1;
    color: var(--lux-red);
}

.reservation-manager-section-head h1,
.reservation-manager-section-head h2 {
    margin: 0;
    color: var(--lux-black);
    font-size: 1.08rem;
    font-weight: 850;
    line-height: 1.15;
}

.reservation-manager-create-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 10px;
}

.reservation-manager-create-grid label {
    display: grid;
    gap: 5px;
    min-width: 0;
}

.reservation-manager-create-grid label > span,
.reservation-manager-check span {
    color: var(--lux-black);
    font-size: .76rem;
    font-weight: 800;
}

.reservation-manager-create-grid .form-control,
.reservation-manager-create-grid .form-select {
    min-height: 38px;
    border-color: rgba(16, 16, 16, .14);
    border-radius: 10px;
    font-size: .86rem;
}

.reservation-manager-wide-field {
    grid-column: span 2;
}

.reservation-manager-check {
    align-content: end;
    grid-template-columns: auto 1fr;
    gap: 8px !important;
    align-items: center;
    min-height: 63px;
    padding: 0 10px;
    border: 1px solid rgba(201, 154, 46, .22);
    border-radius: 10px;
    background: #fffaf0;
}

.reservation-manager-create-actions {
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
    padding-top: 2px;
}

.reservation-manager-create-actions span {
    color: var(--lux-muted);
    font-size: .82rem;
    font-weight: 700;
}

.reservation-manager-monitor-list {
    display: grid;
    gap: 8px;
}

.reservation-manager-monitor-list > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 38px;
    padding: 8px 10px;
    border: 1px solid rgba(16, 16, 16, .06);
    border-radius: 10px;
    background: #fbfaf7;
}

.reservation-manager-monitor-list span {
    color: var(--lux-muted);
    font-size: .78rem;
    font-weight: 750;
}

.reservation-manager-monitor-list strong {
    color: var(--lux-black);
    font-size: .9rem;
    font-weight: 850;
}

.reservation-manager-next-note {
    margin: 0;
    padding: 10px;
    border-left: 3px solid var(--lux-gold);
    border-radius: 10px;
    background: #fffaf0;
    color: var(--lux-ink);
    font-size: .82rem;
    font-weight: 700;
}

.reservation-manager-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.reservation-manager-tabs a {
    display: inline-flex;
    align-items: center;
    min-height: 38px;
    padding: 0 14px;
    border: 1px solid var(--lux-line);
    border-radius: 999px;
    background: #fff;
    color: var(--lux-black);
    font-size: .84rem;
    font-weight: 800;
    text-decoration: none;
}

.reservation-manager-tabs a.active {
    border-color: rgba(215, 25, 32, .3);
    background: #fff5f3;
    color: var(--lux-red);
}

.reservation-manager-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.reservation-manager-card,
.reservation-manager-empty {
    border: 1px solid rgba(16, 16, 16, .08);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 14px 34px rgba(16, 16, 16, .07);
}

.reservation-manager-card {
    display: grid;
    gap: 12px;
    align-content: start;
    padding: 14px;
}

.reservation-manager-card[hidden] {
    display: none !important;
}

.reservation-manager-card-top,
.reservation-manager-actions {
    display: flex;
    gap: 8px;
    align-items: flex-start;
    justify-content: space-between;
}

.reservation-manager-card-top h2 {
    margin: 3px 0 0;
    color: var(--lux-black);
    font-size: 1rem;
    font-weight: 800;
    line-height: 1.2;
}

.reservation-manager-reference {
    color: var(--lux-red);
    font-size: .72rem;
    font-weight: 850;
    letter-spacing: .06em;
}

.reservation-manager-details {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    padding: 10px;
    border-radius: 12px;
    background: #faf8f4;
}

.reservation-manager-details span,
.reservation-manager-details strong {
    min-width: 0;
    overflow: hidden;
    font-size: .84rem;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.reservation-manager-details span {
    color: var(--lux-muted);
    font-weight: 650;
}

.reservation-manager-details strong {
    color: var(--lux-black);
    font-weight: 800;
}

.reservation-manager-contact,
.reservation-manager-request {
    display: grid;
    gap: 6px;
}

.reservation-manager-contact a {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    color: var(--lux-muted);
    font-size: .8rem;
    font-weight: 700;
    text-decoration: none;
}

.reservation-manager-contact strong {
    color: var(--lux-black);
    font-weight: 750;
}

.reservation-manager-request {
    padding: 10px;
    border-left: 3px solid var(--lux-gold);
    border-radius: 10px;
    background: #fffaf0;
    color: var(--lux-black);
    font-size: .82rem;
    line-height: 1.35;
}

.reservation-manager-actions {
    flex-wrap: wrap;
    align-items: stretch;
    padding-top: 2px;
}

.reservation-manager-actions form,
.reservation-manager-actions details {
    flex: 1 1 110px;
}

.reservation-manager-actions .btn {
    width: 100%;
}

.reservation-manager-change {
    flex-basis: 100% !important;
}

.reservation-manager-empty {
    display: grid;
    justify-items: center;
    gap: 8px;
    padding: 48px 20px;
    color: var(--lux-muted);
    text-align: center;
}

.reservation-manager-empty span {
    display: grid;
    width: 44px;
    height: 44px;
    place-items: center;
    border-radius: 50%;
    background: #fff1ef;
    color: var(--lux-red);
}

.reservation-manager-empty h1 {
    margin: 0;
    color: var(--lux-black);
    font-size: 1.25rem;
}

.reservation-manager-empty p {
    margin: 0;
}

@media (max-width: 1240px) {
    .reservation-manager-topbar {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .reservation-manager-workbench {
        grid-template-columns: 1fr;
    }

    .reservation-manager-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 720px) {
    .reservation-admin-fixed-actions,
    .reservation-admin-change-form,
    .reservation-manager-create-grid,
    .reservation-manager-grid,
    .reservation-manager-topbar {
        grid-template-columns: 1fr;
    }

    .reservation-manager-wide-field {
        grid-column: auto;
    }

    .reservation-manager-create-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .reservation-manager-create-actions .btn {
        width: 100%;
    }
}

/* Reservation Manager: dark staff app concept. */
.reservation-manager-body {
    --rm-bg: #050506;
    --rm-panel: rgba(20, 22, 25, .92);
    --rm-panel-soft: rgba(27, 29, 33, .9);
    --rm-line: rgba(255, 255, 255, .18);
    --rm-line-strong: rgba(255, 255, 255, .28);
    --rm-text: #f8f8f8;
    --rm-muted: rgba(255, 255, 255, .68);
    --rm-red: #ed1b2f;
    --rm-red-bright: #ff3145;
    min-height: 100vh;
    background: var(--rm-bg);
    color: var(--rm-text);
}

.reservation-manager-body .manager-main {
    max-width: 980px;
    padding: 22px 20px 28px !important;
}

.reservation-manager-body .reservation-manager-page {
    gap: 14px;
}

.reservation-manager-body .reservation-manager-topbar {
    position: static;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 14px;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.reservation-manager-body .manager-ops-brand {
    gap: 18px;
    flex-wrap: nowrap;
}

.reservation-manager-body .manager-ops-brand img {
    display: none;
}

.reservation-manager-body .manager-ops-brand::before {
    content: "TW";
    order: 1;
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    flex: 0 0 46px;
    border-radius: 7px;
    background: var(--rm-red);
    color: #fff;
    font-size: 1.08rem;
    font-weight: 900;
    letter-spacing: -.04em;
}

.reservation-manager-body .manager-ops-brand::after {
    content: "TONY WONG";
    order: 2;
    color: #fff;
    font-size: 1.42rem;
    font-weight: 900;
    letter-spacing: .06em;
    white-space: nowrap;
}

.reservation-manager-body .manager-ops-brand span {
    order: 3;
    min-height: 36px;
    padding-left: 18px;
    border-left: 1px solid var(--rm-line-strong);
    color: var(--rm-red-bright);
    font-size: 1.08rem;
    font-weight: 900;
    letter-spacing: .04em;
}

.reservation-manager-body .manager-ops-status {
    justify-content: end;
}

.reservation-manager-body .manager-ops-status .live-clock {
    position: relative;
    gap: 12px;
    min-height: 50px;
    padding: 0 18px 0 42px;
    border: 1px solid var(--rm-line-strong);
    border-radius: 14px;
    background: rgba(20, 22, 25, .82);
    color: var(--rm-text);
    font-size: 1.45rem !important;
    font-weight: 800;
}

.reservation-manager-body .manager-ops-status .live-clock::before {
    content: "";
    position: absolute;
    left: 18px;
    top: 50%;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--rm-red-bright);
    transform: translateY(-50%);
    box-shadow: 0 0 0 5px rgba(237, 27, 47, .18);
}

.reservation-manager-body .manager-ops-search,
.reservation-manager-body .manager-ops-metrics,
.reservation-manager-body .manager-ops-actions {
    grid-column: 1 / -1;
}

.reservation-manager-body .manager-ops-search {
    position: relative;
}

.reservation-manager-body .manager-ops-search::before {
    content: "";
    position: absolute;
    left: 24px;
    top: 50%;
    z-index: 1;
    width: 23px;
    height: 23px;
    border: 3px solid #fff;
    border-radius: 50%;
    transform: translateY(-50%);
    opacity: .92;
}

.reservation-manager-body .manager-ops-search::after {
    content: "";
    position: absolute;
    left: 45px;
    top: calc(50% + 14px);
    z-index: 1;
    width: 13px;
    height: 3px;
    border-radius: 999px;
    background: #fff;
    transform: rotate(45deg);
    opacity: .92;
}

.reservation-manager-body .manager-ops-search .form-control {
    min-height: 76px;
    padding-left: 76px;
    border: 1px solid var(--rm-line-strong);
    border-radius: 14px;
    background: linear-gradient(135deg, rgba(255, 255, 255, .09), rgba(255, 255, 255, .035));
    color: var(--rm-text);
    font-size: 1.22rem;
    font-weight: 700;
}

.reservation-manager-body .manager-ops-search .form-control::placeholder {
    color: rgba(255, 255, 255, .62);
}

.reservation-manager-body .manager-ops-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.reservation-manager-body .manager-ops-metrics span {
    display: grid;
    grid-template-columns: 58px 1fr;
    grid-template-rows: auto auto;
    column-gap: 18px;
    min-height: 112px;
    padding: 16px 18px;
    border: 1px solid var(--rm-line-strong);
    border-radius: 14px;
    background: linear-gradient(145deg, rgba(255, 255, 255, .11), rgba(255, 255, 255, .035));
    color: var(--rm-text);
}

.reservation-manager-body .manager-ops-metrics .reservation-ui-icon {
    grid-row: 1 / 3;
    width: 58px;
    height: 58px;
    padding: 13px;
    border-radius: 18px;
    background: rgba(237, 27, 47, .16);
    color: var(--rm-red-bright);
}

.reservation-manager-body .manager-ops-metrics em {
    align-self: end;
    color: var(--rm-text);
    font-size: 1.06rem;
    font-style: normal;
    font-weight: 800;
}

.reservation-manager-body .manager-ops-metrics strong {
    align-self: start;
    color: var(--rm-text);
    font-size: 1.85rem;
    font-weight: 900;
    line-height: 1;
}

.reservation-manager-body .manager-ops-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.reservation-manager-body .manager-ops-actions .btn {
    min-height: 38px;
    border-color: var(--rm-line-strong);
    border-radius: 999px;
    background: rgba(255, 255, 255, .06);
    color: var(--rm-text);
}

.reservation-manager-body .reservation-manager-create-card,
.reservation-manager-body .reservation-manager-monitor-card,
.reservation-manager-body .reservation-manager-card,
.reservation-manager-body .reservation-manager-empty {
    border: 1px solid var(--rm-line-strong);
    border-radius: 14px;
    background:
        linear-gradient(140deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, .025)),
        var(--rm-panel);
    box-shadow: 0 22px 44px rgba(0, 0, 0, .28);
}

.reservation-manager-body .reservation-manager-workbench {
    grid-template-columns: 1fr;
}

.reservation-manager-body .reservation-manager-create-card {
    gap: 14px;
    padding: 18px 20px;
}

.reservation-manager-body .reservation-manager-section-head > span {
    width: 50px;
    height: 50px;
    border: 1px solid rgba(237, 27, 47, .45);
    border-radius: 14px;
    background: rgba(237, 27, 47, .08);
    color: var(--rm-red-bright);
}

.reservation-manager-body .reservation-manager-section-head .reservation-ui-icon {
    width: 28px;
    height: 28px;
}

.reservation-manager-body .reservation-manager-section-head h1,
.reservation-manager-body .reservation-manager-section-head h2 {
    color: var(--rm-text);
    font-size: clamp(1.45rem, 4vw, 2.2rem);
    font-weight: 900;
}

.reservation-manager-body .eyebrow {
    color: var(--rm-red-bright);
}

.reservation-manager-body .reservation-manager-create-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
}

.reservation-manager-body .reservation-manager-field {
    display: grid;
    grid-template-columns: 34px minmax(84px, 190px) minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    min-height: 58px;
    padding: 0 14px;
    border: 1px solid var(--rm-line);
    border-radius: 12px;
    background: rgba(255, 255, 255, .045);
}

.reservation-manager-body .reservation-manager-field i,
.reservation-manager-body .reservation-manager-check i {
    display: grid;
    place-items: center;
    color: #fff;
    font-style: normal;
}

.reservation-manager-body .reservation-manager-field .reservation-ui-icon,
.reservation-manager-body .reservation-manager-check .reservation-ui-icon {
    width: 26px;
    height: 26px;
}

.reservation-manager-body .reservation-manager-create-grid label > span,
.reservation-manager-body .reservation-manager-check span {
    color: var(--rm-text);
    font-size: 1rem;
    font-weight: 850;
}

.reservation-manager-body .reservation-manager-create-grid .form-control,
.reservation-manager-body .reservation-manager-create-grid .form-select {
    min-width: 0;
    width: 100%;
    min-height: 48px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--rm-text);
    font-size: 1rem;
    font-weight: 700;
    box-shadow: none;
    text-overflow: ellipsis;
}

.reservation-manager-body .reservation-manager-create-grid textarea.form-control {
    min-height: 56px;
    padding-top: 15px;
}

.reservation-manager-body .reservation-manager-specials,
.reservation-manager-body .reservation-manager-inline-flags {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
}

.reservation-manager-body .reservation-manager-specials label,
.reservation-manager-body .reservation-manager-inline-flags label {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 40px;
    padding: 7px 10px;
    border: 1px solid var(--rm-line);
    border-radius: 12px;
    background: rgba(255, 255, 255, .05);
    color: var(--rm-text);
    font-size: .82rem;
    font-weight: 800;
}

.reservation-manager-body .reservation-manager-specials i,
.reservation-manager-body .reservation-manager-inline-flags i {
    display: grid;
    place-items: center;
    color: var(--rm-red-bright);
    font-style: normal;
}

.reservation-manager-body .reservation-manager-specials .reservation-ui-icon,
.reservation-manager-body .reservation-manager-inline-flags .reservation-ui-icon {
    width: 18px;
    height: 18px;
}

.reservation-manager-body .reservation-manager-specials input,
.reservation-manager-body .reservation-manager-inline-flags input {
    accent-color: var(--rm-red);
}

.reservation-manager-body .reservation-manager-specials label:has(input:checked),
.reservation-manager-body .reservation-manager-inline-flags label:has(input:checked) {
    border-color: rgba(255, 45, 64, .72);
    background: rgba(237, 27, 47, .18);
}

.reservation-manager-body .reservation-manager-create-grid .form-control::placeholder {
    color: var(--rm-muted);
}

.reservation-manager-body .reservation-manager-create-grid .form-select option {
    color: #111;
}

.reservation-manager-body .reservation-manager-check {
    display: grid;
    grid-template-columns: 34px 1fr auto;
    min-height: 58px;
    padding: 0 14px;
    border-color: var(--rm-line);
    border-radius: 12px;
    background: rgba(255, 255, 255, .045);
}

.reservation-manager-body .reservation-manager-check input {
    grid-column: 3;
    width: 38px;
    height: 24px;
    border-radius: 999px;
    border-color: var(--rm-line-strong);
    background-color: rgba(255, 255, 255, .12);
}

.reservation-manager-body .reservation-manager-check input:checked {
    border-color: var(--rm-red-bright);
    background-color: var(--rm-red);
}

.reservation-manager-body .reservation-manager-create-actions {
    display: grid;
    gap: 12px;
}

.reservation-manager-body .reservation-manager-create-actions span {
    color: var(--rm-muted);
    font-size: .86rem;
    font-weight: 750;
}

.reservation-manager-body .reservation-manager-create-actions .btn {
    display: inline-flex;
    gap: 12px;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 68px;
    border: 0;
    border-radius: 12px;
    background: linear-gradient(90deg, #ed0018, var(--rm-red));
    color: #fff;
    font-size: 1.32rem !important;
    font-weight: 900 !important;
    box-shadow: 0 18px 40px rgba(237, 27, 47, .28);
}

.reservation-manager-body .reservation-manager-create-actions .reservation-ui-icon {
    width: 30px;
    height: 30px;
}

.reservation-manager-body .reservation-manager-map-card {
    display: grid;
    gap: 12px;
    padding: 12px;
    border: 1px solid var(--rm-line);
    border-radius: 14px;
    background: rgba(255, 255, 255, .035);
}

.reservation-manager-body .reservation-manager-map-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.reservation-manager-body .reservation-manager-map-head h2 {
    margin: 0;
    color: var(--rm-text);
    font-size: 1.05rem;
    font-weight: 900;
}

.reservation-manager-body .reservation-manager-map-card .reservation-map-stage {
    width: 100%;
    max-width: none;
    border-color: var(--rm-line);
    background: #fff;
    overflow: visible;
}

.reservation-map-stage.is-manager .reservation-map-hotspot {
    width: clamp(24px, 4.2%, 42px);
    border-width: 1.5px;
    border-radius: 8px;
}

.reservation-map-stage.is-manager .reservation-map-hotspot::before {
    width: 78%;
    border-radius: 6px;
    font-size: clamp(.68rem, 1vw, .9rem);
}

.reservation-map-stage.is-dialog.is-manager {
    min-width: 860px;
}

.reservation-map-stage.is-dialog.is-manager .reservation-map-hotspot {
    width: clamp(32px, 4.4%, 52px);
}

.reservation-manager-body .reservation-map-dialog {
    background: #111216;
    color: var(--rm-text);
}

.reservation-manager-body .reservation-map-dialog-head strong {
    color: var(--rm-text);
}

.reservation-manager-body .reservation-map-dialog-head > div > span {
    color: var(--rm-muted);
}

.reservation-manager-body.is-manager-busy .reservation-manager-page {
    opacity: .68;
    pointer-events: none;
    transition: opacity .12s ease;
}

.reservation-manager-body .reservation-manager-monitor-card {
    padding: 14px 18px 18px;
}

.reservation-manager-body .reservation-manager-monitor-list {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.reservation-manager-body .reservation-manager-monitor-list > div {
    display: grid;
    justify-items: center;
    min-height: 88px;
    border-color: var(--rm-line);
    background: rgba(255, 255, 255, .04);
}

.reservation-manager-body .reservation-manager-monitor-list span {
    color: var(--rm-text);
    font-size: .86rem;
}

.reservation-manager-body .reservation-manager-monitor-list strong {
    color: var(--rm-text);
    font-size: 1.4rem;
}

.reservation-manager-body .reservation-manager-next-note {
    border-left-color: var(--rm-red);
    background: rgba(237, 27, 47, .08);
    color: var(--rm-text);
}

.reservation-manager-body .reservation-manager-tabs {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    overflow: hidden;
    border: 1px solid var(--rm-line);
    border-radius: 12px;
    background: rgba(255, 255, 255, .04);
}

.reservation-manager-body .reservation-manager-tabs a {
    justify-content: center;
    min-height: 46px;
    border: 0;
    border-right: 1px solid var(--rm-line);
    border-radius: 0;
    background: transparent;
    color: var(--rm-text);
}

.reservation-manager-body .reservation-manager-tabs a:last-child {
    border-right: 0;
}

.reservation-manager-body .reservation-manager-tabs a.active {
    background: var(--rm-red);
    color: #fff;
}

.reservation-manager-body .reservation-manager-grid {
    grid-template-columns: 1fr;
}

.reservation-manager-body .reservation-manager-card {
    gap: 12px;
    padding: 16px 18px;
}

.reservation-manager-body .reservation-manager-reference {
    color: var(--rm-red-bright);
    font-size: 1.08rem;
}

.reservation-manager-body .reservation-manager-card-top h2 {
    color: var(--rm-text);
    font-size: 1.62rem;
    font-weight: 900;
    text-shadow: 0 8px 18px rgba(0, 0, 0, .5);
}

.reservation-manager-body .reservation-badge {
    border-color: rgba(237, 27, 47, .42);
    background: rgba(237, 27, 47, .16);
    color: var(--rm-red-bright);
}

.reservation-manager-body .reservation-badge-confirmed {
    border-color: rgba(46, 213, 115, .32);
    background: rgba(46, 213, 115, .1);
    color: #58e08b;
}

.reservation-manager-body .reservation-manager-details {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    padding: 12px 0;
    border-radius: 0;
    border-top: 1px solid var(--rm-line);
    border-bottom: 1px solid var(--rm-line);
    background: transparent;
}

.reservation-manager-body .reservation-manager-details span {
    display: inline-flex;
    gap: 10px;
    align-items: center;
    justify-content: center;
    min-height: 32px;
    padding-inline: 12px;
    border-right: 1px solid var(--rm-line);
    color: var(--rm-text);
    font-size: 1rem;
    font-weight: 800;
    white-space: normal;
}

.reservation-manager-body .reservation-manager-details span:last-child {
    border-right: 0;
}

.reservation-manager-body .reservation-manager-details .reservation-ui-icon {
    width: 24px;
    height: 24px;
    color: #fff;
}

.reservation-manager-body .reservation-manager-contact {
    display: flex;
    gap: 18px;
    align-items: center;
    flex-wrap: wrap;
}

.reservation-manager-body .reservation-manager-contact a,
.reservation-manager-body .reservation-manager-contact span {
    display: inline-flex;
    gap: 9px;
    align-items: center;
    color: var(--rm-text);
    font-size: .98rem;
    font-weight: 780;
}

.reservation-manager-body .reservation-manager-contact .reservation-ui-icon {
    width: 22px;
    height: 22px;
}

.reservation-manager-body .reservation-manager-request {
    border-left-color: var(--rm-red);
    background: rgba(255, 255, 255, .055);
    color: var(--rm-text);
}

.reservation-manager-body .reservation-manager-prep {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    padding: 11px 12px;
    border: 1px solid var(--rm-line);
    border-radius: 13px;
    background: rgba(255, 255, 255, .04);
}

.reservation-manager-body .reservation-manager-prep.is-ready {
    border-color: rgba(34, 197, 94, .42);
    background: rgba(34, 197, 94, .1);
}

.reservation-manager-body .reservation-manager-prep.is-needed {
    border-color: rgba(237, 27, 47, .42);
    background: rgba(237, 27, 47, .1);
}

.reservation-manager-body .reservation-manager-prep strong,
.reservation-manager-body .reservation-manager-prep span {
    display: block;
}

.reservation-manager-body .reservation-manager-prep strong {
    color: var(--rm-text);
    font-size: .94rem;
    font-weight: 900;
}

.reservation-manager-body .reservation-manager-prep span {
    color: var(--rm-muted);
    font-size: .8rem;
    font-weight: 750;
}

.reservation-manager-body .reservation-manager-actions .btn,
.reservation-manager-body .reservation-admin-change-box summary {
    border-color: var(--rm-line-strong);
    background: rgba(255, 255, 255, .08);
    color: var(--rm-text);
}

.reservation-manager-body .reservation-manager-actions .btn-brand {
    border-color: var(--rm-red);
    background: var(--rm-red);
    color: #fff;
}

.reservation-manager-body .reservation-manager-actions .btn-outline-danger {
    border-color: rgba(237, 27, 47, .48);
    color: var(--rm-red-bright);
}

.reservation-manager-body .reservation-admin-change-form {
    border-color: var(--rm-line);
    background: rgba(255, 255, 255, .06);
}

.reservation-manager-body .reservation-admin-change-form .form-control,
.reservation-manager-body .reservation-admin-change-form .form-select {
    border-color: var(--rm-line);
    background: rgba(255, 255, 255, .08);
    color: var(--rm-text);
}

.reservation-manager-body .reservation-admin-change-form .form-select option {
    color: #111;
}

.reservation-manager-body input[type="date"]::-webkit-calendar-picker-indicator {
    filter: invert(1);
    opacity: .85;
}

.reservation-manager-bottom-nav {
    position: relative;
    z-index: 80;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: min(380px, calc(100% - 40px));
    min-height: 66px;
    margin: 18px auto 0;
    padding: 8px 12px;
    border: 1px solid var(--rm-line);
    border-radius: 18px;
    background: rgba(7, 8, 10, .92);
    backdrop-filter: blur(16px);
}

.reservation-manager-bottom-nav a,
.reservation-manager-bottom-nav summary {
    display: grid;
    justify-items: center;
    gap: 4px;
    color: var(--rm-muted);
    font-size: .78rem;
    font-weight: 750;
    text-decoration: none;
    cursor: pointer;
    list-style: none;
}

.reservation-manager-bottom-nav summary::-webkit-details-marker {
    display: none;
}

.reservation-manager-bottom-nav .reservation-ui-icon {
    width: 25px;
    height: 25px;
}

.reservation-manager-bottom-nav a.active {
    color: var(--rm-red-bright);
}

.reservation-manager-more {
    position: relative;
    display: grid;
}

.reservation-manager-more-menu {
    position: absolute;
    right: 0;
    bottom: calc(100% + 10px);
    display: none;
    min-width: 150px;
    padding: 8px;
    border: 1px solid var(--rm-line-strong);
    border-radius: 14px;
    background: rgba(14, 15, 18, .98);
    box-shadow: 0 18px 42px rgba(0, 0, 0, .45);
}

.reservation-manager-more[open] .reservation-manager-more-menu {
    display: grid;
}

.reservation-manager-more-menu a {
    grid-template-columns: 24px 1fr;
    align-items: center;
    justify-items: start;
    padding: 10px 12px;
    border-radius: 10px;
    color: var(--rm-text);
}

.reservation-manager-more-menu a:hover {
    background: rgba(237, 27, 47, .14);
    color: var(--rm-red-bright);
}

@media (max-width: 720px) {
    .reservation-manager-bottom-nav {
        position: fixed;
        right: 50%;
        bottom: 0;
        width: 100%;
        min-height: 72px;
        margin: 0;
        padding: 8px 12px max(8px, env(safe-area-inset-bottom));
        border-width: 1px 0 0;
        border-radius: 0;
        transform: translateX(50%);
    }

    .reservation-manager-body .manager-main {
        padding: 18px 14px 96px !important;
    }

    .reservation-manager-body .reservation-manager-topbar {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .reservation-manager-body .manager-ops-brand {
        gap: 10px;
        align-items: center;
        flex-wrap: nowrap;
    }

    .reservation-manager-body .reservation-manager-specials,
    .reservation-manager-body .reservation-manager-inline-flags {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .reservation-manager-body .manager-ops-brand::before {
        width: 36px;
        height: 36px;
        flex-basis: 36px;
        font-size: .86rem;
    }

    .reservation-manager-body .manager-ops-brand::after {
        display: none;
    }

    .reservation-manager-body .manager-ops-brand span {
        min-height: 28px;
        padding-left: 10px;
        font-size: .72rem;
    }

    .reservation-manager-body .manager-ops-status {
        position: static;
        grid-column: auto;
    }

    .reservation-manager-body .manager-ops-status .live-clock {
        min-height: 38px;
        padding: 0 12px 0 30px;
        font-size: 1rem !important;
    }

    .reservation-manager-body .manager-ops-status .live-clock::before {
        left: 13px;
        width: 8px;
        height: 8px;
    }

    .reservation-manager-body .manager-ops-search .form-control {
        min-height: 64px;
        font-size: 1rem;
    }

    .reservation-manager-body .manager-ops-metrics {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 8px;
    }

    .reservation-manager-body .manager-ops-metrics span {
        grid-template-columns: 1fr;
        justify-items: start;
        min-height: 104px;
        padding: 11px;
    }

    .reservation-manager-body .manager-ops-metrics .reservation-ui-icon {
        width: 46px;
        height: 46px;
        padding: 10px;
    }

    .reservation-manager-body .manager-ops-metrics em {
        font-size: .9rem;
    }

    .reservation-manager-body .manager-ops-metrics strong {
        font-size: 1.55rem;
    }

    .reservation-manager-body .manager-ops-actions {
        display: none;
    }

    .reservation-manager-body .reservation-manager-create-card {
        padding: 14px;
    }

    .reservation-manager-body .reservation-manager-field {
        grid-template-columns: 30px minmax(58px, 82px) minmax(0, 1fr);
        gap: 9px;
        padding-inline: 10px;
    }

    .reservation-manager-body .reservation-manager-create-grid label > span,
    .reservation-manager-body .reservation-manager-check span {
        font-size: .9rem;
    }

    .reservation-manager-body .reservation-manager-create-grid .form-control,
    .reservation-manager-body .reservation-manager-create-grid .form-select {
        font-size: .86rem;
    }

    .reservation-manager-body .reservation-manager-map-head,
    .reservation-manager-body .reservation-manager-prep {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    .reservation-manager-body .reservation-manager-map-head {
        display: grid;
    }

    .reservation-manager-body .reservation-manager-map-card .reservation-map-stage {
        width: 100%;
    }

    .reservation-manager-body .reservation-manager-monitor-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .reservation-manager-body .reservation-manager-details {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .reservation-manager-body .reservation-manager-details span {
        justify-content: flex-start;
        border-right: 0;
        padding-inline: 0;
    }

    .reservation-manager-body .reservation-manager-card-top {
        align-items: flex-start;
    }

    .reservation-manager-body .reservation-manager-card-top h2 {
        font-size: 1.35rem;
    }
}

/* Final V1.1 reservation skin. Keep at file end so customer booking stays dark and step-based. */
body.reservation-body {
    background: #080706 !important;
    color: #f7efe6 !important;
}

body.reservation-body main {
    background:
        radial-gradient(circle at 18% 0%, rgba(176, 18, 28, .2), transparent 34%),
        linear-gradient(180deg, #100f0d 0%, #080706 42%, #070604 100%) !important;
}

.reservation-body .reservation-page {
    min-height: calc(100vh - 68px);
    padding: 26px 0 70px !important;
    color: #f7efe6 !important;
}

.reservation-body .reservation-page > .container-xxl {
    max-width: 1180px !important;
}

.reservation-body .reservation-hero .eyebrow,
.reservation-body .reservation-booking-head .eyebrow {
    color: rgba(247, 239, 230, .58) !important;
    letter-spacing: .12em !important;
}

.reservation-body .reservation-hero h1,
.reservation-body .reservation-booking-head h2,
.reservation-body .reservation-step-heading h2 {
    color: #fff9f0 !important;
    letter-spacing: 0 !important;
}

.reservation-body .reservation-layout {
    grid-template-columns: minmax(0, 1fr) 286px !important;
    gap: 18px !important;
    align-items: flex-start;
}

.reservation-body .reservation-form-card,
.reservation-body .reservation-mini-card,
.reservation-body .reservation-history-card {
    border: 1px solid rgba(255, 255, 255, .1) !important;
    background: rgba(18, 17, 16, .92) !important;
    color: #f7efe6 !important;
    box-shadow: 0 22px 60px rgba(0, 0, 0, .32) !important;
    backdrop-filter: none !important;
}

.reservation-body .reservation-form-card {
    padding: 18px !important;
    border-radius: 24px !important;
}

.reservation-body .reservation-booking-head {
    margin-bottom: 16px !important;
    padding: 0 !important;
    border: 0 !important;
}

.reservation-body .reservation-confirm-pill {
    min-height: 36px !important;
    padding: 8px 12px !important;
    border: 1px solid rgba(227, 27, 47, .28) !important;
    background: rgba(227, 27, 47, .1) !important;
    color: #ffced4 !important;
    box-shadow: none !important;
}

.reservation-body .reservation-confirm-pill i {
    color: #ff3347 !important;
}

.reservation-body .reservation-lux-progress {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 14px;
}

.reservation-body .reservation-lux-progress button {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 42px;
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 999px;
    background: rgba(255, 255, 255, .045);
    color: rgba(247, 239, 230, .64);
    font-size: .84rem;
    font-weight: 650;
}

.reservation-body .reservation-lux-progress i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .08);
    font-style: normal;
    font-size: .76rem;
}

.reservation-body .reservation-lux-progress button.is-active {
    border-color: rgba(227, 27, 47, .72);
    background: #df1727;
    color: #fff;
}

.reservation-body .reservation-lux-progress button.is-complete {
    color: #fff5e8;
}

.reservation-body .reservation-lux-progress button.is-complete i {
    font-size: 0;
}

.reservation-body .reservation-lux-progress button.is-complete i::before {
    content: "✓";
    font-size: .8rem;
}

.reservation-body .reservation-step-heading {
    display: none;
    margin-bottom: 14px;
}

.reservation-body .reservation-step-heading.is-active {
    display: block;
}

.reservation-body .reservation-form-card[data-current-step="1"] [data-step-panel]:not([data-step-panel="1"]),
.reservation-body .reservation-form-card[data-current-step="2"] [data-step-panel]:not([data-step-panel="2"]),
.reservation-body .reservation-form-card[data-current-step="3"] [data-step-panel]:not([data-step-panel="3"]) {
    display: none !important;
}

.reservation-body .reservation-form-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 14px !important;
}

.reservation-body .reservation-wide-field,
.reservation-body .reservation-step-actions,
.reservation-body .reservation-final-summary {
    grid-column: 1 / -1;
}

.reservation-body .reservation-step-logic,
.reservation-body .reservation-compact-utility {
    display: none !important;
}

.reservation-body .reservation-form-card .form-label {
    color: rgba(247, 239, 230, .78) !important;
    font-size: .84rem !important;
    font-weight: 550 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
}

.reservation-body .reservation-control-shell,
.reservation-body .reservation-form-card .form-control,
.reservation-body .reservation-form-card .form-select {
    min-height: 58px !important;
    border: 1px solid rgba(255, 255, 255, .14) !important;
    border-radius: 16px !important;
    background-color: rgba(255, 255, 255, .07) !important;
    color: #fff9f0 !important;
    font-size: 1rem !important;
    box-shadow: none !important;
}

.reservation-body .reservation-control-shell .form-control,
.reservation-body .reservation-control-shell .form-select {
    border: 0 !important;
    background-color: transparent !important;
}

.reservation-body .reservation-control-icon {
    color: rgba(255, 255, 255, .76) !important;
}

.reservation-body .reservation-form-card .form-control:focus,
.reservation-body .reservation-form-card .form-select:focus,
.reservation-body .reservation-control-shell:focus-within {
    border-color: rgba(227, 27, 47, .74) !important;
    box-shadow: 0 0 0 4px rgba(227, 27, 47, .13) !important;
}

.reservation-body .reservation-flow-primary,
.reservation-body .reservation-submit,
.reservation-body .reservation-sticky-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 54px;
    border: 0;
    border-radius: 999px;
    background: #df1727 !important;
    color: #fff !important;
    font-size: 1rem;
    font-weight: 750 !important;
    box-shadow: 0 16px 34px rgba(223, 23, 39, .28);
}

.reservation-body .reservation-flow-secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 54px;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 999px;
    background: rgba(255, 255, 255, .06);
    color: #fff9f0;
    font-size: 1rem;
    font-weight: 650;
}

.reservation-body .reservation-step-actions {
    display: grid;
    grid-template-columns: 140px minmax(0, 1fr);
    gap: 10px;
}

.reservation-body .reservation-form-card[data-current-step="1"] .reservation-step-actions {
    grid-template-columns: 1fr;
}

.reservation-body .reservation-availability-panel,
.reservation-body .reservation-final-summary,
.reservation-body .reservation-special-card,
.reservation-body .reservation-table-policy {
    border: 1px solid rgba(255, 255, 255, .1) !important;
    border-radius: 18px !important;
    background: rgba(255, 255, 255, .045) !important;
    box-shadow: none !important;
}

.reservation-body .reservation-availability-panel h3,
.reservation-body .reservation-floor-map-head h3,
.reservation-body .reservation-option-head h3 {
    color: #fff9f0 !important;
}

.reservation-body .reservation-availability-panel strong,
.reservation-body .reservation-option-head > span,
.reservation-body .reservation-floor-map-head .reservation-title-icon {
    display: none !important;
}

.reservation-body .reservation-floor-map {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.reservation-body .reservation-floor-map-head .btn,
.reservation-body .reservation-map-actions .btn {
    border-color: rgba(255, 255, 255, .18) !important;
    background: rgba(255, 255, 255, .06) !important;
    color: #fff9f0 !important;
}

.reservation-body .reservation-map-stage {
    border: 1px solid rgba(255, 255, 255, .1) !important;
    border-radius: 18px !important;
    background: #0c0b0a !important;
    box-shadow: none !important;
}

.reservation-body .reservation-map-stage.is-floor {
    width: min(100%, 860px) !important;
}

.reservation-body .reservation-map-hotspot.is-selected {
    box-shadow: 0 0 0 3px #df1727, 0 0 28px rgba(223, 23, 39, .58) !important;
}

.reservation-body .reservation-table-picker {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px !important;
}

.reservation-body .reservation-table-choice {
    min-height: 92px !important;
    padding: 14px !important;
    border: 1px solid rgba(255, 255, 255, .12) !important;
    border-radius: 18px !important;
    background: rgba(255, 255, 255, .055) !important;
    color: #fff9f0 !important;
    box-shadow: none !important;
}

.reservation-body .reservation-table-choice:has(input:checked) {
    border-color: #df1727 !important;
    background: rgba(223, 23, 39, .16) !important;
    box-shadow: inset 0 0 0 1px rgba(223, 23, 39, .46) !important;
}

.reservation-body .reservation-table-choice.is-booked,
.reservation-body .reservation-table-choice.is-too-small {
    opacity: .42;
}

.reservation-body .reservation-table-main strong {
    color: #fff9f0 !important;
}

.reservation-body .reservation-table-main small,
.reservation-body .reservation-table-meta small,
.reservation-body .reservation-table-choice em,
.reservation-body .reservation-table-policy,
.reservation-body .reservation-map-legend {
    color: rgba(247, 239, 230, .66) !important;
}

.reservation-body .reservation-final-summary dl {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin: 0;
}

.reservation-body .reservation-final-summary > span,
.reservation-body .reservation-final-summary dt {
    color: rgba(247, 239, 230, .54) !important;
}

.reservation-body .reservation-final-summary dd {
    margin: 2px 0 0;
    color: #fff9f0;
    font-weight: 650;
}

.reservation-body .reservation-side-panel {
    position: sticky;
    top: 82px;
    display: grid;
    gap: 14px;
}

.reservation-body .reservation-mini-card .eyebrow,
.reservation-body .reservation-history-card summary span {
    color: rgba(247, 239, 230, .54) !important;
}

.reservation-body .reservation-mini-card h2,
.reservation-body .reservation-empty-bookings strong,
.reservation-body .reservation-active-list strong {
    color: #fff9f0 !important;
}

.reservation-body .reservation-hours-row span,
.reservation-body .reservation-hours-row strong,
.reservation-body .reservation-hours-card small,
.reservation-body .reservation-active-list span,
.reservation-body .reservation-empty-bookings span,
.reservation-body .reservation-history-list span,
.reservation-body .reservation-history-list em {
    color: rgba(247, 239, 230, .66) !important;
}

.reservation-body .reservation-sticky-cta {
    display: none;
}

@media (max-width: 991.98px) {
    .reservation-body .reservation-layout {
        grid-template-columns: 1fr !important;
    }

    .reservation-body .reservation-side-panel {
        position: static;
    }
}

@media (max-width: 767.98px) {
    body.reservation-body main {
        padding-bottom: 86px;
    }

    .reservation-body .reservation-page {
        padding: 14px 0 36px !important;
    }

    .reservation-body .reservation-page > .container-xxl {
        padding-inline: 12px !important;
    }

    .reservation-body .reservation-hero .reservation-title-icon,
    .reservation-body .reservation-booking-head .reservation-title-icon,
    .reservation-body .reservation-confirm-pill,
    .reservation-body .reservation-map-legend,
    .reservation-body .reservation-hours-card,
    .reservation-body .reservation-history-card {
        display: none !important;
    }

    .reservation-body .reservation-form-card {
        padding: 14px !important;
        border-radius: 22px !important;
    }

    .reservation-body .reservation-lux-progress button {
        min-height: 38px;
        font-size: .78rem;
    }

    .reservation-body .reservation-form-grid,
    .reservation-body .reservation-table-picker {
        grid-template-columns: 1fr !important;
    }

    .reservation-body .reservation-control-shell,
    .reservation-body .reservation-form-card .form-control,
    .reservation-body .reservation-form-card .form-select {
        min-height: 56px !important;
    }

    .reservation-body .reservation-step-actions {
        grid-template-columns: 1fr;
    }

    .reservation-body .reservation-step-actions [data-reservation-next],
    .reservation-body .reservation-submit-row .reservation-submit,
    .reservation-body .reservation-form-card[data-current-step="1"] .reservation-step-actions {
        display: none !important;
    }

    .reservation-body .reservation-step-actions .reservation-flow-secondary {
        order: 2;
    }

    .reservation-body .reservation-table-policy,
    .reservation-body .reservation-stay-notice {
        padding: 10px 12px !important;
        line-height: 1.38 !important;
        white-space: normal !important;
        overflow: visible !important;
    }

    .reservation-body .reservation-final-summary dl {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .reservation-body .reservation-sticky-cta {
        position: fixed;
        z-index: 1040;
        left: 12px;
        right: 12px;
        bottom: 14px;
        display: inline-flex;
        width: calc(100% - 24px);
    }
}

@media (max-width: 430px) {
    .reservation-body .reservation-lux-progress button span {
        display: none;
    }

    .reservation-body .reservation-final-summary dl {
        grid-template-columns: 1fr;
    }
}

/* Reservation customer page: align with the MENU page visual template. */
body.reservation-body {
    background:
        linear-gradient(180deg, #fff 0, #fbfaf7 280px, var(--lux-soft) 100%) !important;
    color: var(--lux-ink) !important;
}

body.reservation-body main {
    background:
        linear-gradient(180deg, #fff 0, #fbfaf7 280px, var(--lux-soft) 100%) !important;
    color: var(--lux-ink) !important;
}

.reservation-body .reservation-page {
    padding: 22px 0 56px !important;
    color: var(--lux-ink) !important;
}

.reservation-body .reservation-page > .container-xxl {
    max-width: 1280px !important;
}

.reservation-body .reservation-hero {
    margin-bottom: 14px !important;
}

.reservation-body .reservation-hero .reservation-title-icon {
    display: none !important;
}

.reservation-body .reservation-hero .eyebrow,
.reservation-body .reservation-booking-head .eyebrow {
    color: var(--lux-muted) !important;
    font-size: .78rem !important;
    letter-spacing: .08em !important;
}

.reservation-body .reservation-hero h1 {
    color: #000 !important;
    font-size: clamp(1.9rem, 3vw, 2.35rem) !important;
    line-height: 1.08 !important;
    font-weight: 800 !important;
}

.reservation-body .reservation-layout {
    grid-template-columns: minmax(0, 1fr) 300px !important;
    gap: 20px !important;
}

.reservation-body .reservation-form-card,
.reservation-body .reservation-mini-card,
.reservation-body .reservation-history-card {
    border: 1px solid var(--lux-line) !important;
    background: rgba(255, 255, 255, .94) !important;
    color: var(--lux-ink) !important;
    box-shadow: var(--lux-shadow-card) !important;
}

.reservation-body .reservation-form-card {
    padding: 16px !important;
    border-radius: 16px !important;
}

.reservation-body .reservation-booking-head {
    margin-bottom: 14px !important;
}

.reservation-body .reservation-booking-head .reservation-title-icon {
    width: 34px !important;
    height: 34px !important;
    background: #fff1ef !important;
    color: var(--lux-red) !important;
}

.reservation-body .reservation-booking-head h2,
.reservation-body .reservation-step-heading h2 {
    color: #000 !important;
    font-size: 1.42rem !important;
    line-height: 1.12 !important;
    font-weight: 800 !important;
}

.reservation-body .reservation-confirm-pill {
    min-height: 34px !important;
    padding: 7px 12px !important;
    border-color: rgba(215, 25, 32, .18) !important;
    background: #fff7f5 !important;
    color: var(--lux-red) !important;
    box-shadow: none !important;
}

.reservation-body .reservation-confirm-pill i {
    color: var(--lux-red) !important;
}

.reservation-body .reservation-lux-progress {
    gap: 8px !important;
    margin-bottom: 14px !important;
}

.reservation-body .reservation-lux-progress button {
    min-height: 42px !important;
    border: 1px solid var(--lux-line) !important;
    background: #fff !important;
    color: var(--lux-muted) !important;
    box-shadow: none !important;
}

.reservation-body .reservation-lux-progress i {
    background: #f0ebe4 !important;
    color: var(--lux-muted) !important;
}

.reservation-body .reservation-lux-progress button.is-active {
    border-color: var(--lux-red) !important;
    background: var(--lux-red) !important;
    color: #fff !important;
}

.reservation-body .reservation-lux-progress button.is-active i {
    background: rgba(255, 255, 255, .18) !important;
    color: #fff !important;
}

.reservation-body .reservation-lux-progress button.is-complete {
    border-color: rgba(185, 150, 80, .34) !important;
    background: #fffaf1 !important;
    color: #8f6500 !important;
}

.reservation-body .reservation-form-grid {
    gap: 14px !important;
}

.reservation-body .reservation-form-card .form-label {
    color: #000 !important;
    font-size: .84rem !important;
    font-weight: 650 !important;
}

.reservation-body .reservation-control-shell,
.reservation-body .reservation-form-card .form-control,
.reservation-body .reservation-form-card .form-select {
    min-height: 48px !important;
    border: 1px solid var(--lux-line-strong) !important;
    border-radius: 12px !important;
    background-color: #fff !important;
    color: #000 !important;
    font-size: .96rem !important;
    box-shadow: none !important;
}

.reservation-body .reservation-control-shell .form-control,
.reservation-body .reservation-control-shell .form-select {
    border: 0 !important;
    background-color: transparent !important;
}

.reservation-body .reservation-control-icon {
    color: var(--lux-muted) !important;
}

.reservation-body .reservation-form-card .form-control:focus,
.reservation-body .reservation-form-card .form-select:focus,
.reservation-body .reservation-control-shell:focus-within {
    border-color: rgba(215, 25, 32, .46) !important;
    box-shadow: 0 0 0 4px rgba(215, 25, 32, .08) !important;
}

.reservation-body .reservation-form-card .form-control.is-invalid {
    border-color: var(--lux-red) !important;
    background-color: #fff7f5 !important;
}

.reservation-body .reservation-field-hint {
    display: block;
    margin-top: 6px;
    font-size: .78rem;
    line-height: 1.25;
}

.reservation-body .reservation-field-hint.is-error {
    color: var(--lux-red);
}

.reservation-body .reservation-field-hint[hidden] {
    display: none !important;
}

.reservation-body .reservation-flow-primary,
.reservation-body .reservation-submit,
.reservation-body .reservation-sticky-cta {
    min-height: 48px !important;
    border-radius: 999px !important;
    background: var(--lux-red) !important;
    color: #fff !important;
    box-shadow: 0 12px 28px rgba(215, 25, 32, .18) !important;
}

.reservation-body .reservation-flow-secondary {
    min-height: 48px !important;
    border: 1px solid var(--lux-line-strong) !important;
    border-radius: 999px !important;
    background: #fff !important;
    color: #000 !important;
    box-shadow: none !important;
}

.reservation-body .reservation-availability-panel,
.reservation-body .reservation-final-summary,
.reservation-body .reservation-special-card,
.reservation-body .reservation-table-policy {
    border: 1px solid var(--lux-line) !important;
    border-radius: 14px !important;
    background: #fff !important;
    box-shadow: none !important;
}

.reservation-body .reservation-availability-panel {
    padding: 13px 14px !important;
}

.reservation-body .reservation-availability-panel > .reservation-inline-icon {
    background: #fff1ef !important;
    color: var(--lux-red) !important;
}

.reservation-body .reservation-availability-panel h3,
.reservation-body .reservation-floor-map-head h3,
.reservation-body .reservation-option-head h3,
.reservation-body .reservation-special-card-head strong {
    color: #000 !important;
}

.reservation-body .reservation-floor-map {
    background: transparent !important;
}

.reservation-body .reservation-floor-map-head {
    margin-bottom: 10px !important;
}

.reservation-body .reservation-floor-map-head .btn,
.reservation-body .reservation-map-actions .btn {
    border-color: #000 !important;
    background: #fff !important;
    color: #000 !important;
}

.reservation-body .reservation-map-legend,
.reservation-body .reservation-table-policy,
.reservation-body .reservation-table-main small,
.reservation-body .reservation-table-meta small,
.reservation-body .reservation-table-choice em,
.reservation-body .reservation-special-card-head small {
    color: var(--lux-muted) !important;
}

.reservation-body .reservation-map-stage {
    border: 1px solid var(--lux-line) !important;
    border-radius: 14px !important;
    background: #fff !important;
    box-shadow: none !important;
}

.reservation-body .reservation-table-picker {
    gap: 10px !important;
}

.reservation-body .reservation-table-choice {
    min-height: 86px !important;
    padding: 12px !important;
    border: 1px solid var(--lux-line) !important;
    border-radius: 14px !important;
    background: #fff !important;
    color: #000 !important;
    box-shadow: none !important;
}

.reservation-body .reservation-table-choice:hover {
    border-color: rgba(185, 150, 80, .4) !important;
    background: #fffdf8 !important;
}

.reservation-body .reservation-table-choice:has(input:checked) {
    border-color: var(--lux-red) !important;
    background: #fff7f5 !important;
    box-shadow: inset 0 0 0 1px rgba(215, 25, 32, .28) !important;
}

.reservation-body .reservation-table-main strong {
    color: #000 !important;
    font-size: .98rem !important;
}

.reservation-body .reservation-table-tier,
.reservation-body .reservation-table-meta small {
    background: #fbf5ea !important;
    color: #8f6500 !important;
}

.reservation-body .reservation-stay-notice {
    border-color: rgba(185, 150, 80, .25) !important;
    background: #fff8e8 !important;
    color: #7b5700 !important;
}

.reservation-body .reservation-final-summary > span,
.reservation-body .reservation-final-summary dt {
    color: var(--lux-muted) !important;
}

.reservation-body .reservation-final-summary dd {
    color: #000 !important;
}

.reservation-body .reservation-occasion-option {
    border-color: var(--lux-line) !important;
    background: #fff !important;
    color: #000 !important;
}

.reservation-body .reservation-occasion-option:has(input:checked) {
    border-color: rgba(215, 25, 32, .44) !important;
    background: #fff7f5 !important;
}

.reservation-body .reservation-side-panel {
    top: 82px !important;
}

.reservation-body .reservation-mini-card,
.reservation-body .reservation-history-card {
    padding: 16px !important;
    border-radius: 16px !important;
}

.reservation-body .reservation-card-heading .reservation-title-icon {
    background: #fbf5ea !important;
    color: #8f6500 !important;
}

.reservation-body .reservation-mini-card .eyebrow,
.reservation-body .reservation-history-card summary span,
.reservation-body .reservation-hours-row span,
.reservation-body .reservation-hours-card small,
.reservation-body .reservation-active-list span,
.reservation-body .reservation-empty-bookings span,
.reservation-body .reservation-history-list span,
.reservation-body .reservation-history-list em {
    color: var(--lux-muted) !important;
}

.reservation-body .reservation-mini-card h2,
.reservation-body .reservation-empty-bookings strong,
.reservation-body .reservation-active-list strong,
.reservation-body .reservation-hours-row strong {
    color: #000 !important;
}

.reservation-body .reservation-hours-row,
.reservation-body .reservation-active-list div {
    border-color: var(--lux-line) !important;
}

.reservation-body .reservation-active-table-chips i,
.reservation-body .reservation-active-table-chips small {
    border-color: #eadbb8 !important;
    background: #fffaf1 !important;
    color: #7b5700 !important;
}

.reservation-body .reservation-booking-links a,
.reservation-body .reservation-danger-link {
    border: 1px solid var(--lux-line-strong) !important;
    background: #fff !important;
    color: #000 !important;
}

.reservation-body .reservation-danger-link {
    color: var(--lux-red) !important;
}

@media (max-width: 767.98px) {
    body.reservation-body main {
        padding-bottom: 82px !important;
    }

    .reservation-body .reservation-page {
        padding: 12px 0 28px !important;
    }

    .reservation-body .reservation-hero h1 {
        font-size: 1.5rem !important;
    }

    .reservation-body .reservation-booking-head h2,
    .reservation-body .reservation-step-heading h2 {
        font-size: 1.24rem !important;
    }

    .reservation-body .reservation-form-card,
    .reservation-body .reservation-mini-card,
    .reservation-body .reservation-history-card {
        border-radius: 16px !important;
    }

    .reservation-body .reservation-control-shell,
    .reservation-body .reservation-form-card .form-control,
    .reservation-body .reservation-form-card .form-select {
        min-height: 50px !important;
    }

.reservation-body .reservation-sticky-cta {
    box-shadow: 0 12px 30px rgba(215, 25, 32, .22) !important;
}
}

@media (max-width: 991.98px) {
    .reservation-body .reservation-layout {
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 14px !important;
    }

    .reservation-body .reservation-form-card,
    .reservation-body .reservation-side-panel {
        width: 100% !important;
        min-width: 0 !important;
    }

    .reservation-body .reservation-side-panel {
        position: static !important;
    }
}

/* Keep selected reservation table text readable on the light MENU-aligned theme. */
.reservation-body .reservation-page .reservation-table-choice.is-selected,
.reservation-body .reservation-page .reservation-table-choice:has(input:checked) {
    border-color: var(--lux-red) !important;
    background: #fff7f5 !important;
}

.reservation-body .reservation-page .reservation-table-choice.is-selected .reservation-table-main strong,
.reservation-body .reservation-page .reservation-table-choice:has(input:checked) .reservation-table-main strong {
    color: #000 !important;
}

.reservation-body .reservation-page .reservation-table-choice.is-selected .reservation-table-main small,
.reservation-body .reservation-page .reservation-table-choice:has(input:checked) .reservation-table-main small,
.reservation-body .reservation-page .reservation-table-choice.is-selected em,
.reservation-body .reservation-page .reservation-table-choice:has(input:checked) em {
    color: var(--lux-muted) !important;
}

.reservation-body .reservation-page .reservation-table-choice.is-selected .reservation-table-meta small,
.reservation-body .reservation-page .reservation-table-choice:has(input:checked) .reservation-table-meta small {
    background: #fbf5ea !important;
    color: #8f6500 !important;
}

.reservation-body .reservation-page .reservation-table-choice.is-selected input[type="radio"],
.reservation-body .reservation-page .reservation-table-choice:has(input:checked) input[type="radio"] {
    accent-color: var(--lux-red) !important;
}

/* Active booking card contrast: the reservation page now uses the light MENU-aligned theme. */
.reservation-body .reservation-page .reservation-mini-card.has-active-bookings {
    border-color: var(--lux-line) !important;
    background: rgba(255, 255, 255, .94) !important;
    color: var(--lux-ink) !important;
    box-shadow: var(--lux-shadow-card) !important;
}

.reservation-body .reservation-page .reservation-mini-card.has-active-bookings .reservation-card-heading .reservation-title-icon {
    background: #fbf5ea !important;
    color: #8f6500 !important;
}

.reservation-body .reservation-page .reservation-mini-card.has-active-bookings .eyebrow,
.reservation-body .reservation-page .reservation-mini-card.has-active-bookings .reservation-active-list span,
.reservation-body .reservation-page .reservation-mini-card.has-active-bookings .reservation-active-list em,
.reservation-body .reservation-page .reservation-mini-card.has-active-bookings .reservation-active-group-note,
.reservation-body .reservation-page .reservation-mini-card.has-active-bookings .reservation-active-special-note,
.reservation-body .reservation-page .reservation-mini-card.has-active-bookings .reservation-active-meta {
    color: var(--lux-muted) !important;
}

.reservation-body .reservation-page .reservation-mini-card.has-active-bookings h2,
.reservation-body .reservation-page .reservation-mini-card.has-active-bookings .reservation-active-list strong {
    color: #000 !important;
}

.reservation-body .reservation-page .reservation-mini-card.has-active-bookings .reservation-active-list div {
    border-color: var(--lux-line) !important;
}

.reservation-body .reservation-page .reservation-mini-card.has-active-bookings .reservation-active-table-chips i,
.reservation-body .reservation-page .reservation-mini-card.has-active-bookings .reservation-active-table-chips small {
    border-color: #eadbb8 !important;
    background: #fffaf1 !important;
    color: #7b5700 !important;
}

.reservation-body .reservation-page .reservation-mini-card.has-active-bookings .reservation-booking-links {
    border-top-color: var(--lux-line) !important;
}

.reservation-body .reservation-page .reservation-mini-card.has-active-bookings .reservation-booking-links a,
.reservation-body .reservation-page .reservation-mini-card.has-active-bookings .reservation-booking-links > button,
.reservation-body .reservation-page .reservation-mini-card.has-active-bookings .reservation-danger-link {
    border-color: var(--lux-line-strong) !important;
    background: #fff !important;
    color: #000 !important;
}

.reservation-body .reservation-page .reservation-mini-card.has-active-bookings .reservation-danger-link {
    color: var(--lux-red) !important;
}

.reservation-body .reservation-page .reservation-mini-card.has-active-bookings .reservation-inline-edit {
    border-color: var(--lux-line) !important;
    background: #fffaf5 !important;
}

.reservation-body .reservation-page .reservation-mini-card.has-active-bookings .reservation-inline-edit label {
    color: var(--lux-muted) !important;
}

.reservation-body .reservation-page .reservation-mini-card.has-active-bookings .reservation-inline-edit input,
.reservation-body .reservation-page .reservation-mini-card.has-active-bookings .reservation-inline-edit select {
    border-color: var(--lux-line-strong) !important;
    background: #fff !important;
    color: #000 !important;
}
