/* ═══════════════════════════════════════════════════════
   SEMENY — Design System v3  (front.css)
   Light · Clean · High-contrast · Premium
   ═══════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap');

/* ── DESIGN TOKENS ──────────────────────────────────────
   ONE source of truth. Every colour references a token.
   ─────────────────────────────────────────────────────── */
:root {
    /* Backgrounds */
    --bg:        #F7F6F3;   /* page */
    --surface:   #FFFFFF;   /* cards, panels */
    --surface2:  #F0EEE9;   /* nav hover, secondary sections */
    --surface3:  #E8E6E0;   /* tags, chips, sunken inputs */

    /* Borders */
    --border:    rgba(28,27,25,.09);
    --border2:   rgba(28,27,25,.16);

    /* Text */
    --txt:       #1C1B18;   /* primary — always on light bg */
    --txt-2:     #5C5A55;   /* secondary — comfortable reading */
    --txt-3:     #9B9890;   /* tertiary — placeholders, captions */

    /* Accent */
    --red:       #cc3b38;
    --red-dark:  #b03330;
    --red-bg:    rgba(204,59,56,.08);
    --red-ring:  rgba(204,59,56,.15);

    /* Status */
    --green:     #16A34A;
    --green-bg:  rgba(22,163,74,.1);
    --amber:     #D97706;
    --amber-bg:  rgba(217,119,6,.1);

    /* Inverted (for hero/CTA sections on dark bg) */
    --inv-bg:    #1C1B18;
    --inv-surf:  #282725;
    --inv-txt:   #F7F6F3;
    --inv-muted: rgba(247,246,243,.65);

    /* Shadows */
    --shadow-sm: 0 1px 3px rgba(0,0,0,.06), 0 1px 2px rgba(0,0,0,.04);
    --shadow-md: 0 4px 16px rgba(0,0,0,.08);
    --shadow-lg: 0 12px 36px rgba(0,0,0,.1);

    /* Shape */
    --r:     12px;
    --r-sm:   8px;
    --r-lg:  18px;
    --r-xl:  24px;
    --r-pill: 100px;

    /* Motion */
    --ease: cubic-bezier(.22,1,.36,1);
    --t:    .2s;
}

/* ── RESET & BASE ───────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }

body {
    background: var(--bg) !important;
    color: var(--txt) !important;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
    font-size: 15px;
    line-height: 1.65;
    -webkit-font-smoothing: antialiased;
}

h1,h2,h3,h4,h5,h6 {
    font-family: 'Inter', sans-serif !important;
    color: var(--txt) !important;
    font-weight: 700 !important;
    letter-spacing: -.025em;
    line-height: 1.2;
    margin-bottom: 0;
}

a {
    color: var(--txt) !important;
    text-decoration: none !important;
    font-family: 'Inter', sans-serif !important;
    transition: color var(--t) var(--ease);
}
a:hover { color: var(--red) !important; }

p {
    color: var(--txt-2) !important;
    font-size: .9rem;
    line-height: 1.75;
    margin-bottom: 0;
}

img { max-width: 100%; display: block; }
hr { border: none; border-top: 1px solid var(--border) !important; margin: 24px 0 !important; }

/* ── NAVBAR ─────────────────────────────────────────────── */
#navbar-main.navbar {
    background: #ffffff !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border-bottom: 1px solid var(--border) !important;
    box-shadow: none !important;
    padding: 8px 28px !important;
    transition: none !important;
}
#navbar-main.navbar.scrolled,
#navbar-main.navbar.bg-white {
    background: #ffffff !important;
}
.navbar-brand img { height: 68px !important; width: auto !important; }
.navbar-toggler {
    border: 1px solid var(--border2) !important;
    padding: 6px 10px !important;
    border-radius: var(--r-sm) !important;
}
.navbar-toggler-icon { filter: none; }

.navbar .nav-link,
.navbar .nav-link:not(.smny-nav-owner-cta) {
    color: var(--txt-2) !important;
    font-size: .83rem !important;
    font-weight: 600 !important;
    padding: 7px 12px !important;
    border-radius: var(--r-sm) !important;
    transition: color var(--t), background var(--t) !important;
    font-family: 'Inter', sans-serif !important;
}
.navbar .nav-link:hover {
    color: var(--txt) !important;
    background: var(--surface2) !important;
}

/* Cart button */
a.btn.btn-neutral.btn-icon.btn-cart,
button.btn.btn-neutral.btn-icon.btn-cart {
    background: transparent !important;
    border: 1.5px solid var(--border2) !important;
    color: var(--txt-2) !important;
    border-radius: var(--r-sm) !important;
    font-size: .8rem !important;
    font-weight: 600 !important;
    padding: 7px 14px !important;
    transition: all var(--t) var(--ease) !important;
    font-family: 'Inter', sans-serif !important;
}
a.btn.btn-neutral.btn-icon.btn-cart:hover,
button.btn.btn-neutral.btn-icon.btn-cart:hover {
    background: var(--surface2) !important;
    color: var(--txt) !important;
}

.badge-primary {
    background: var(--red) !important;
    color: #fff !important;
    border-radius: var(--r-pill) !important;
    font-size: .65rem !important;
    font-weight: 700 !important;
    padding: 2px 6px !important;
}

/* Dropdown */
.dropdown-menu {
    background: var(--surface) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--r) !important;
    padding: 6px !important;
    box-shadow: var(--shadow-lg) !important;
}
.dropdown-item {
    color: var(--txt-2) !important;
    border-radius: var(--r-sm) !important;
    font-size: .83rem !important;
    font-weight: 500 !important;
    padding: 8px 12px !important;
    transition: background var(--t) !important;
}
.dropdown-item:hover {
    background: var(--surface2) !important;
    color: var(--txt) !important;
}

.navbar-collapse { background: var(--surface) !important; }
@media (max-width: 991px) {
    .navbar-collapse {
        border-top: 1px solid var(--border) !important;
        padding: 12px 0 !important;
        margin-top: 8px !important;
        box-shadow: var(--shadow-md) !important;
    }
}

/* ── HERO / SEARCH SECTION ──────────────────────────────── */
.section-profile-cover.section-shaped { display: none !important; }

section.section {
    background: var(--bg) !important;
    padding-top: 96px !important;
    padding-bottom: 24px !important;
}
.container.mt--350,
.container.mt--300,
.container.mt--200,
.container.mt--150,
.container.mt--100 { margin-top: 0 !important; }
.section-shaped.my-0.skew-separator { display: none !important; }

section.section h1 {
    font-size: clamp(1.9rem,4vw,3rem) !important;
    font-weight: 900 !important;
    letter-spacing: -.04em !important;
    color: var(--txt) !important;
    margin-bottom: 10px !important;
}
section.section > .container > p {
    color: var(--txt-2) !important;
    font-size: 1rem !important;
    margin-bottom: 28px !important;
}

/* Search box */
.card.shadow.mt-5.mb-5 {
    background: var(--surface) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--r) !important;
    box-shadow: var(--shadow-md) !important;
    max-width: 640px !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}
.card.shadow.mt-5.mb-5 .card-body {
    padding: 8px 14px !important;
    background: transparent !important;
}
.card.shadow.mt-5.mb-5 .form-control {
    background: transparent !important;
    border: none !important;
    color: var(--txt) !important;
    font-size: .95rem !important;
    font-weight: 500 !important;
    font-family: 'Inter', sans-serif !important;
    box-shadow: none !important;
    padding: 12px 4px !important;
}
.card.shadow.mt-5.mb-5 .form-control::placeholder { color: var(--txt-3) !important; }
.card.shadow.mt-5.mb-5 .form-control.is-valid {
    border: none !important;
    background-image: none !important;
    padding-right: 4px !important;
}
.card.shadow.mt-5.mb-5 .search-icon { color: var(--txt-3) !important; }
.card.shadow.mt-5.mb-5 a span.search {
    background: var(--red) !important;
    color: #fff !important;
    padding: 10px 18px !important;
    border-radius: var(--r-sm) !important;
    font-size: .8rem !important;
    font-weight: 700 !important;
    letter-spacing: .04em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    display: block !important;
    transition: background var(--t) !important;
}
.card.shadow.mt-5.mb-5 a:hover span.search { background: var(--red-dark) !important; }

/* ── FORMS ──────────────────────────────────────────────── */
.form-control {
    background: var(--surface) !important;
    border: 1px solid var(--border2) !important;
    color: var(--txt) !important;
    border-radius: var(--r-sm) !important;
    font-family: 'Inter', sans-serif !important;
    transition: border-color var(--t) !important;
}
.form-control:focus {
    background: var(--surface) !important;
    border-color: var(--red) !important;
    color: var(--txt) !important;
    box-shadow: 0 0 0 3px var(--red-ring) !important;
    outline: none !important;
}
.form-control::placeholder { color: var(--txt-3) !important; }
.input-group-text {
    background: var(--surface2) !important;
    border-color: var(--border2) !important;
    color: var(--txt-2) !important;
    font-family: 'Inter', sans-serif !important;
}
label, .form-label, .form-control-label {
    color: var(--txt-2) !important;
    font-size: .8rem !important;
    font-weight: 600 !important;
    font-family: 'Inter', sans-serif !important;
}
.custom-control-label { color: var(--txt-2) !important; font-family: 'Inter', sans-serif !important; }
.custom-control-input:checked ~ .custom-control-label::before {
    background: var(--red) !important;
    border-color: var(--red) !important;
}

/* ── BUTTONS ────────────────────────────────────────────── */
.btn {
    font-family: 'Inter', sans-serif !important;
    font-weight: 700 !important;
    letter-spacing: .01em !important;
    border-radius: var(--r-sm) !important;
    transition: all var(--t) var(--ease) !important;
}

/* Primary CTA — red */
.btn-danger,
.btn_delivery_pickup {
    background: var(--red) !important;
    border-color: var(--red) !important;
    color: #fff !important;
    border-radius: var(--r-pill) !important;
    font-size: .83rem !important;
    padding: 10px 22px !important;
}
.btn-danger:hover,
.btn_delivery_pickup:hover {
    background: var(--red-dark) !important;
    border-color: var(--red-dark) !important;
    transform: translateY(-1px) !important;
    box-shadow: var(--shadow-md) !important;
    color: #fff !important;
}

/* Secondary — outlined */
.btn-primary {
    background: transparent !important;
    border: 1.5px solid var(--border2) !important;
    color: var(--txt) !important;
    font-weight: 600 !important;
    border-radius: var(--r-pill) !important;
}
.btn-primary:hover {
    background: var(--surface2) !important;
    color: var(--txt) !important;
    box-shadow: none !important;
}

/* Neutral */
.btn-neutral {
    background: var(--surface2) !important;
    border: 1px solid var(--border) !important;
    color: var(--txt-2) !important;
    font-weight: 600 !important;
    border-radius: var(--r-sm) !important;
}
.btn-neutral:hover {
    background: var(--surface3) !important;
    color: var(--txt) !important;
}

/* Small outline — "See all" etc */
a.btn.btn-outline-primary.btn-sm {
    background: transparent !important;
    border: 1.5px solid var(--border2) !important;
    color: var(--txt-2) !important;
    font-size: .78rem !important;
    border-radius: var(--r-pill) !important;
    padding: 6px 16px !important;
    font-weight: 600 !important;
}
a.btn.btn-outline-primary.btn-sm:hover {
    background: var(--surface2) !important;
    color: var(--txt) !important;
}

/* ── CARDS (generic) ────────────────────────────────────── */
.card {
    background: var(--surface) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--r) !important;
    box-shadow: var(--shadow-sm) !important;
}
.card-body { background: transparent !important; color: var(--txt) !important; }
.card-header { background: var(--surface2) !important; border-color: var(--border) !important; color: var(--txt) !important; }
.card-footer { background: var(--surface2) !important; border-color: var(--border) !important; }
.card-title { color: var(--txt) !important; font-family: 'Inter', sans-serif !important; }
.card-text { color: var(--txt-2) !important; font-family: 'Inter', sans-serif !important; }

/* ── RESTAURANT CARDS (homepage grid) ───────────────────── */
.smny-rcard {
    background: var(--surface) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--r-lg) !important;
    overflow: hidden !important;
    box-shadow: var(--shadow-sm) !important;
    transition: transform var(--t) var(--ease), box-shadow var(--t) !important;
}
.smny-rcard:hover {
    transform: translateY(-4px) !important;
    box-shadow: var(--shadow-lg) !important;
    border-color: var(--border2) !important;
    color: inherit !important;
}
.smny-rcard__img-wrap { background: var(--surface2) !important; }
.smny-rcard__body { background: var(--surface) !important; padding: 14px 16px 16px !important; }
.smny-rcard__name {
    color: var(--txt) !important;
    font-weight: 700 !important;
    font-size: .92rem !important;
    font-family: 'Inter', sans-serif !important;
}
.smny-rcard__desc {
    color: var(--txt-2) !important;
    font-size: .77rem !important;
    font-family: 'Inter', sans-serif !important;
}
.smny-rcard__rating { color: var(--red) !important; font-weight: 700 !important; }

/* Strip cards */
.strip, .strip_city {
    background: var(--surface) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--r) !important;
    box-shadow: var(--shadow-sm) !important;
    overflow: hidden !important;
    transition: transform var(--t), box-shadow var(--t) !important;
}
.strip:hover, .strip_city:hover {
    transform: translateY(-3px) !important;
    box-shadow: var(--shadow-lg) !important;
}
.res_title, .res_title b, .res_title a { color: var(--txt) !important; font-family: 'Inter', sans-serif !important; font-weight: 700 !important; }
.res_description { color: var(--txt-2) !important; font-size: .8rem !important; }
.res_mimimum { color: var(--red) !important; font-weight: 700 !important; font-size: .88rem !important; }

/* Section headings */
h2.display-2 {
    font-size: clamp(1.3rem,2.5vw,1.9rem) !important;
    font-weight: 800 !important;
    color: var(--txt) !important;
    letter-spacing: -.03em !important;
    font-family: 'Inter', sans-serif !important;
}
.font-weight-300.mb-5 { color: var(--txt-2) !important; }
span.h3 { color: var(--txt) !important; font-weight: 700 !important; font-family: 'Inter', sans-serif !important; }

/* ── BADGES ─────────────────────────────────────────────── */
.badge { font-family: 'Inter', sans-serif !important; font-weight: 700 !important; border-radius: 6px !important; }
span.timeline-step.badge-success { background: var(--green-bg) !important; color: var(--green) !important; }
.badge-success { background: var(--green-bg) !important; color: var(--green) !important; }
.badge-warning { background: var(--amber-bg) !important; color: var(--amber) !important; }
.badge-danger, .badge-primary { background: var(--red) !important; color: #fff !important; }

/* ── MODALS ─────────────────────────────────────────────── */
.modal-content {
    background: var(--surface) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--r-xl) !important;
    box-shadow: var(--shadow-lg) !important;
    color: var(--txt) !important;
}
.modal-header {
    border-bottom: 1px solid var(--border) !important;
    padding: 20px 24px 16px !important;
    background: transparent !important;
}
.modal-footer { border-top: 1px solid var(--border) !important; background: transparent !important; }
.modal-title {
    color: var(--txt) !important;
    font-size: 1.05rem !important;
    font-weight: 700 !important;
    font-family: 'Inter', sans-serif !important;
}
.close > span:not(.sr-only) {
    color: var(--txt-2) !important;
    background: var(--surface2) !important;
    border-radius: 50% !important;
    width: 28px !important; height: 28px !important;
    font-size: 1.2rem !important; line-height: 28px !important;
    display: flex !important;
    align-items: center !important; justify-content: center !important;
}
.close > span:not(.sr-only):hover { color: var(--txt) !important; background: var(--surface3) !important; }
img#modalImg { border-radius: var(--r) !important; width: 100% !important; object-fit: cover !important; }
span#modalPrice { color: var(--txt) !important; font-size: 1.2rem !important; font-weight: 800 !important; font-family: 'Inter', sans-serif !important; }
p#modalDescription { color: var(--txt-2) !important; font-size: .88rem !important; font-family: 'Inter', sans-serif !important; line-height: 1.7 !important; }
.custom-control-label { color: var(--txt-2) !important; }

/* ── ALERTS ─────────────────────────────────────────────── */
.alert { border-radius: var(--r-sm) !important; font-family: 'Inter', sans-serif !important; color: var(--txt) !important; }
.alert-primary, .alert-danger { background: var(--red-bg) !important; border-color: rgba(192,57,43,.2) !important; color: var(--red-dark) !important; }
.alert-success { background: var(--green-bg) !important; border-color: rgba(22,163,74,.2) !important; color: var(--green) !important; }
.alert-warning { background: var(--amber-bg) !important; border-color: rgba(217,119,6,.2) !important; color: var(--amber) !important; }

/* ── FOOTER ─────────────────────────────────────────────── */
footer.footer {
    background: var(--surface2) !important;
    border-top: 1px solid var(--border) !important;
    padding: 28px 0 !important;
}
footer.footer .copyright,
footer.footer .nav-link,
footer.footer .nav-item a {
    color: var(--txt-2) !important;
    font-size: .78rem !important;
    font-family: 'Inter', sans-serif !important;
}
footer.footer .nav-link:hover { color: var(--txt) !important; }

/* ── SELECT2 ────────────────────────────────────────────── */
.select2-container--default .select2-selection--single {
    background: var(--surface) !important;
    border-color: var(--border2) !important;
    border-radius: var(--r-sm) !important;
    color: var(--txt) !important;
    height: 42px !important;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: var(--txt) !important;
    line-height: 40px !important;
    padding-left: 14px !important;
    font-family: 'Inter', sans-serif !important;
    font-size: .85rem !important;
}
.select2-dropdown {
    background: var(--surface) !important;
    border-color: var(--border) !important;
    border-radius: var(--r-sm) !important;
    box-shadow: var(--shadow-lg) !important;
}
.select2-results__option { color: var(--txt-2) !important; font-family: 'Inter', sans-serif !important; font-size: .85rem !important; padding: 10px 14px !important; }
.select2-results__option--highlighted { background: var(--surface2) !important; color: var(--txt) !important; }
.select2-search--dropdown input { background: var(--surface2) !important; border-color: var(--border) !important; color: var(--txt) !important; }

/* ── MISC ───────────────────────────────────────────────── */
.bg-white { background: var(--surface) !important; }
.bg-light, .bg-gradient-primary, .bg-gradient-default, .bg-default, .bg-secondary { background: var(--bg) !important; }
.bg-gradient-primary { height: 0 !important; padding: 0 !important; display: none !important; }
.section-shaped.my-0.skew-separator { display: none !important; }
.shadow { box-shadow: var(--shadow-md) !important; }
.text-muted { color: var(--txt-2) !important; }
.text-dark { color: var(--txt) !important; }
.text-white { color: var(--txt) !important; }   /* on light pages white text = dark text */
.ni, .fa { color: inherit !important; }
i.ni.ni-cart { color: var(--txt-2) !important; }
.navbar-brand img { height: 68px !important; }

/* ── SWAL ───────────────────────────────────────────────── */
.swal2-popup { background: var(--surface) !important; border-radius: var(--r-xl) !important; color: var(--txt) !important; font-family: 'Inter', sans-serif !important; }
.swal2-title, .swal2-content { color: var(--txt) !important; }

/* ── CART SIDE PANEL ────────────────────────────────────── */
.sidenav-cart {
    background: var(--surface) !important;
    border-left: 1px solid var(--border) !important;
    box-shadow: var(--shadow-lg) !important;
}
.minicart-content .minicart-heading > h4 {
    color: var(--txt) !important;
    font-family: 'Inter', sans-serif !important;
    font-weight: 700 !important;
    border-bottom: 1px solid var(--border) !important;
    padding-bottom: 14px !important;
    margin-bottom: 0 !important;
}
.offcanvas-menu-inner { background: transparent !important; padding: 20px !important; }
#cartList .info-block {
    background: var(--surface2) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--r-sm) !important;
    padding: 12px !important;
    margin-bottom: 8px !important;
}
#cartList .product-item_title { color: var(--txt) !important; font-size: .88rem !important; font-weight: 700 !important; font-family: 'Inter', sans-serif !important; }
#cartList .product-item_quantity { color: var(--txt-2) !important; font-size: .78rem !important; font-family: 'Inter', sans-serif !important; }
.btn-cart-radius { background: var(--surface2) !important; border: 1px solid var(--border2) !important; color: var(--txt) !important; border-radius: 6px !important; }

/* ── ORDER PAGES ────────────────────────────────────────── */
.card.bg-secondary.shadow { background: var(--surface) !important; box-shadow: var(--shadow-sm) !important; border-radius: var(--r) !important; }
.timeline-step { border-radius: 50% !important; }

/* ── TOGGLES ────────────────────────────────────────────── */
.custom-toggle-slider { background: var(--surface3) !important; border-color: var(--border2) !important; }
.custom-control-input:checked ~ .custom-toggle-slider { background: var(--red) !important; }

/* ══════════════════════════════════════════════════════════
   CHECKOUT PAGE
══════════════════════════════════════════════════════════ */

/* Page background */
section.section.bg-secondary {
    background: var(--bg) !important;
    padding-top: 40px !important;
}
section.section-profile-cover { display: none !important; }

/* All checkout cards — flat, clean */
.card.card-profile {
    background: var(--surface) !important;
    border: 1px solid var(--border) !important;
    border-radius: 16px !important;
    box-shadow: none !important;
    margin-bottom: 16px !important;
    padding: 0 !important;
}
.card.card-profile .px-4 {
    padding: 28px 28px 24px !important;
}
.card.card-profile .mt-5 { margin-top: 0 !important; }
.card.card-profile .mt--300 { margin-top: 0 !important; }

/* Section headings inside cards */
.card.card-profile h3 {
    font-family: 'Inter', sans-serif !important;
    font-size: 1rem !important;
    font-weight: 800 !important;
    color: var(--txt) !important;
    letter-spacing: -.025em !important;
    margin: 0 0 20px !important;
    padding: 0 !important;
}

/* Divider under heading */
.card-content.border-top,
.card.card-profile .border-top {
    border-top: 1px solid var(--border) !important;
    padding-top: 20px !important;
}

/* Radio buttons */
.custom-control.custom-radio { margin-bottom: 12px !important; }
.custom-control-label {
    font-family: 'Inter', sans-serif !important;
    font-size: .9rem !important;
    font-weight: 500 !important;
    color: var(--txt) !important;
    cursor: pointer !important;
    padding-left: 4px !important;
}
.custom-control-input:checked ~ .custom-control-label::before {
    background: var(--red) !important;
    border-color: var(--red) !important;
}
.custom-control-label::before {
    border-color: var(--border2) !important;
    background: var(--surface) !important;
}

/* Inputs on checkout */
.card.card-profile .form-control,
.card.card-profile select,
.card.card-profile input[type="text"],
.card.card-profile input[type="tel"],
.card.card-profile textarea {
    background: var(--bg) !important;
    border: 1px solid var(--border) !important;
    border-radius: 10px !important;
    font-family: 'Inter', sans-serif !important;
    font-size: .88rem !important;
    color: var(--txt) !important;
    padding: 10px 14px !important;
    box-shadow: none !important;
    transition: border-color .15s !important;
}
.card.card-profile .form-control:focus,
.card.card-profile select:focus,
.card.card-profile input:focus,
.card.card-profile textarea:focus {
    border-color: var(--red) !important;
    background: var(--surface) !important;
    box-shadow: 0 0 0 3px rgba(169,33,35,.1) !important;
}
.card.card-profile textarea {
    min-height: 90px !important;
    resize: vertical !important;
}
.card.card-profile .form-group label,
.card.card-profile label {
    font-family: 'Inter', sans-serif !important;
    font-size: .78rem !important;
    font-weight: 600 !important;
    color: var(--txt-2) !important;
    text-transform: uppercase !important;
    letter-spacing: .05em !important;
    margin-bottom: 6px !important;
}

/* Flatpickr date/time pickers */
.card.card-profile .flatpickr-input,
.card.card-profile .form-control.flatpickr-input {
    background: var(--bg) !important;
    border: 1px solid var(--border) !important;
    border-radius: 10px !important;
    font-family: 'Inter', sans-serif !important;
    font-size: .88rem !important;
    color: var(--txt) !important;
}

/* Price summary card */
#totalPrices .card.card-stats {
    background: var(--bg) !important;
    border: none !important;
    border-radius: 12px !important;
    box-shadow: none !important;
    margin-bottom: 12px !important;
}
#totalPrices .card-body {
    padding: 16px !important;
    background: transparent !important;
}
#totalPrices strong {
    font-family: 'Inter', sans-serif !important;
    font-weight: 600 !important;
    color: var(--txt) !important;
    font-size: .88rem !important;
}
#totalPrices .ammount {
    font-weight: 800 !important;
    color: var(--txt) !important;
}

/* Coupon input row */
.card.card-profile .input-group > .form-control {
    border-radius: 10px 0 0 10px !important;
    border-right: none !important;
}
.card.card-profile .input-group > .input-group-append > .btn {
    border-radius: 0 10px 10px 0 !important;
    background: var(--txt) !important;
    border-color: var(--txt) !important;
    color: #fff !important;
    font-family: 'Inter', sans-serif !important;
    font-weight: 700 !important;
    font-size: .78rem !important;
    letter-spacing: .04em !important;
}

/* Payment method radio block */
.cards .card-body { padding: 0 !important; background: transparent !important; }

/* Submit buttons */
#totalSubmit .btn-success,
#totalSubmit .btn-primary,
#totalSubmitVipps .btn-success,
.paymentbutton.btn-success,
.paymentbutton.btn-primary,
form#order-form .btn-success {
    background: var(--red) !important;
    border-color: var(--red) !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    font-family: 'Inter', sans-serif !important;
    font-weight: 700 !important;
    font-size: .9rem !important;
    letter-spacing: .03em !important;
    text-transform: uppercase !important;
    border-radius: 12px !important;
    padding: 14px 24px !important;
    width: 100% !important;
    box-shadow: 0 4px 16px rgba(169,33,35,.25) !important;
    transition: background .15s, transform .1s, box-shadow .15s !important;
}
#totalSubmit .btn-success:hover,
#totalSubmit .btn-primary:hover,
.paymentbutton.btn-success:hover,
.paymentbutton.btn-primary:hover {
    background: #8c1b1d !important;
    border-color: #8c1b1d !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 6px 20px rgba(169,33,35,.35) !important;
}

/* Vipps button */
#totalSubmitVipps .btn-success {
    background: #ff5b24 !important;
    border-color: #ff5b24 !important;
    box-shadow: 0 4px 16px rgba(255,91,36,.25) !important;
}

/* Privacy checkbox */
.custom-control.custom-checkbox .custom-control-label {
    font-size: .78rem !important;
    text-transform: none !important;
    font-weight: 400 !important;
    color: var(--txt-2) !important;
}
.custom-control.custom-checkbox a { color: var(--red) !important; }

/* Cart items list */
.card.card-profile .table td,
.card.card-profile .table th {
    font-family: 'Inter', sans-serif !important;
    font-size: .85rem !important;
    color: var(--txt) !important;
    border-color: var(--border) !important;
}

/* Phone flag selector */
.iti { width: 100% !important; }
.iti__flag-container { border-radius: 10px 0 0 10px !important; }

/* Alert errors */
.card.card-profile .alert-danger {
    border-radius: 10px !important;
    font-family: 'Inter', sans-serif !important;
    font-size: .82rem !important;
}

/* Outline secondary buttons (Cancel tip etc.) */
.card.card-profile .btn-outline-primary {
    border-color: var(--border2) !important;
    color: var(--txt-2) !important;
    border-radius: 8px !important;
    font-family: 'Inter', sans-serif !important;
    font-weight: 600 !important;
    font-size: .82rem !important;
}
.card.card-profile .btn-outline-primary:hover {
    background: var(--surface2) !important;
    color: var(--txt) !important;
}

/* ── CITY CARDS ─────────────────────────────────────────── */
.smny-city-card {
    display: block !important;
    position: relative !important;
    border-radius: var(--r-lg) !important;
    overflow: hidden !important;
    aspect-ratio: 4 / 3 !important;
    background: var(--surface2) !important;
    box-shadow: var(--shadow-sm) !important;
    text-decoration: none !important;
    transition: transform var(--t) var(--ease), box-shadow var(--t) !important;
}
.smny-city-card:hover {
    transform: translateY(-5px) !important;
    box-shadow: var(--shadow-lg) !important;
    color: inherit !important;
}
.smny-city-card__img-wrap {
    position: absolute !important;
    inset: 0 !important;
}
.smny-city-card__img {
    width: 100% !important;
    height: 100% !important;
    max-width: unset !important;
    object-fit: cover !important;
    display: block !important;
    transition: transform 0.5s var(--ease) !important;
}
.smny-city-card:hover .smny-city-card__img {
    transform: scale(1.06) !important;
}
.smny-city-card__overlay {
    position: absolute !important;
    inset: 0 !important;
    background: linear-gradient(
        to bottom,
        rgba(0,0,0,0) 35%,
        rgba(0,0,0,.55) 100%
    ) !important;
    display: flex !important;
    align-items: flex-end !important;
    padding: 18px 20px !important;
}
.smny-city-card__name {
    color: #ffffff !important;
    font-size: 1.15rem !important;
    font-weight: 800 !important;
    font-family: 'Inter', sans-serif !important;
    letter-spacing: -.025em !important;
    text-shadow: 0 1px 6px rgba(0,0,0,.45) !important;
    line-height: 1.2 !important;
}

/* Neutralise the old broken strip_city layout */
.strip_city { display: none !important; }

/* ── HERO SEARCH IMPROVEMENTS ───────────────────────────── */
section.section:first-of-type {
    padding-top: 72px !important;
    padding-bottom: 40px !important;
}
section.section:first-of-type h1 {
    font-size: clamp(2rem, 5vw, 3.2rem) !important;
    font-weight: 900 !important;
    letter-spacing: -.05em !important;
    margin-bottom: 10px !important;
    line-height: 1.1 !important;
}
section.section:first-of-type > .container > p {
    font-size: 1.05rem !important;
    color: var(--txt-2) !important;
    max-width: 480px !important;
    margin-bottom: 32px !important;
}

/* ── SECTION TITLE IMPROVEMENTS ────────────────────────── */
section.section h2:not(.super_title) {
    font-size: 1.2rem !important;
    font-weight: 800 !important;
    color: var(--txt) !important;
    letter-spacing: -.03em !important;
    margin-bottom: 4px !important;
}

/* ── RESTAURANT CARD — rating star fix ──────────────────── */
.smny-rcard__rating svg { color: var(--red) !important; }

/* ── SMNY RCARD IMAGE ASPECT RATIO ─────────────────────── */
.smny-rcard { display: block !important; }
.smny-rcard__img-wrap {
    aspect-ratio: 16 / 9 !important;
    overflow: hidden !important;
}
.smny-rcard__img {
    width: 100% !important;
    height: 100% !important;
    max-width: unset !important;
    object-fit: cover !important;
    display: block !important;
    transition: transform 0.4s var(--ease) !important;
}
.smny-rcard:hover .smny-rcard__img { transform: scale(1.04) !important; }

/* ── FOOTER IMPROVEMENTS ────────────────────────────────── */
footer.footer {
    background: #fff !important;
    border-top: 1px solid var(--border) !important;
    padding: 36px 0 24px !important;
}
footer.footer .copyright {
    font-size: .78rem !important;
    color: var(--txt-3) !important;
}

/* ── PAGE-LEVEL CONSISTENCY ─────────────────────────────── */
/* Ensure section bg stays consistent */
section.section { background: var(--bg) !important; }

/* ── MOBILE CITY CARD ───────────────────────────────────── */
@media (max-width: 576px) {
    .smny-city-card { aspect-ratio: 3 / 2 !important; }
    .smny-city-card__name { font-size: 1rem !important; }
}