/*
Theme Name: Kailaba Restaurant
Theme URI: https://kailaba.com
Template: astra
Author: Kailaba
Author URI: https://kailaba.com
Description: Astra child theme — the home for all Kailaba Restaurant Kit custom CSS/PHP. Keeps customizations upgrade-safe: the parent Astra theme can update freely without ever overwriting this.
Version: 0.31.0
License: GPL-2.0-or-later
Text Domain: kailaba
*/

/* Global colours/typography are set via the Astra Customizer (stored in the DB).
   This file holds tweaks Astra can't express — colours reference Astra's global palette
   vars so they follow any per-client recolour. */

:root {
  --k-crimson: var(--ast-global-color-0, #9E1B32);
  --k-indigo:  var(--ast-global-color-7, #2B2D5B);
  --k-saffron: var(--ast-global-color-8, #E8A33D);
  --k-text:    var(--ast-global-color-3, #4A423B);
  --k-surface: var(--ast-global-color-6, #F3EBDD);
  --k-line: color-mix(in srgb, var(--k-text) 25%, transparent);
}

/* ---- Dine-in menu ([kailaba_menu]) ---- */
.kailaba-menu { max-width: 820px; margin-inline: auto; }
/* Hide the redundant page title on the menu page (the shortcode has its own category headings),
   so the centred list does not float away from a left-aligned "Menu" heading. */
.kailaba-has-menu .entry-header { display: none; }
/* Sticky category nav on the dine-in menu — jump to / focus a category on a long menu. */
.kailaba-menu__filters { position: sticky; top: var(--kailaba-header-h, 0px); z-index: 30; background: var(--k-base); padding: .7rem 0; margin: 0 0 1.5rem; box-shadow: 0 10px 14px -14px rgba(0,0,0,.55); }
.kailaba-menu__tabs { display: flex; flex-wrap: wrap; gap: .5rem; justify-content: center; }
.kailaba-menu__tab { background: transparent; border: 1px solid var(--k-line); color: var(--k-text); border-radius: 999px; padding: .4rem 1.1rem; cursor: pointer; font: inherit; line-height: 1.2; transition: background .15s, color .15s, border-color .15s; }
.kailaba-menu__tab:hover { border-color: var(--k-crimson); color: var(--k-crimson); }
.kailaba-menu__tab.is-active { background: var(--k-crimson); color: #fff; border-color: var(--k-crimson); }
.kailaba-menu__tab span { opacity: .6; font-size: .8em; margin-left: .15em; }
.kailaba-menu__tab.is-active span { opacity: .85; }
@media (max-width: 600px) {
  .kailaba-menu__tabs { flex-wrap: nowrap; overflow-x: auto; justify-content: flex-start; -webkit-overflow-scrolling: touch; scrollbar-width: none; padding-bottom: .25rem; }
  .kailaba-menu__tabs::-webkit-scrollbar { display: none; }
  .kailaba-menu__tab { flex: 0 0 auto; }
}
.kailaba-menu__group { margin-block: clamp(2rem, 5vw, 3.25rem); }
.kailaba-menu__cat {
  font-family: var(--headings-font-family, serif);
  color: var(--k-crimson); font-size: clamp(1.4rem, 3vw, 1.9rem);
  margin: 0 0 .25rem; display: flex; align-items: center; gap: .75rem;
}
.kailaba-menu__cat::after { content: ""; flex: 1; height: 1px; background: var(--k-line); }
.kailaba-menu__cat-desc { color: var(--k-text); opacity: .8; font-style: italic; margin: 0 0 1.25rem; }
.kailaba-menu__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 1.3rem; }
.kailaba-menu__head { display: flex; align-items: baseline; gap: .5rem; }
.kailaba-menu__name { font-weight: 600; }
.kailaba-menu__head::after { content: ""; flex: 1; border-bottom: 1px dotted var(--k-line); transform: translateY(-.2em); }
.kailaba-menu__price { font-variant-numeric: tabular-nums; color: var(--k-crimson); font-weight: 600; white-space: nowrap; }
.kailaba-menu__price del { opacity: .5; margin-right: .25rem; font-weight: 400; }
.kailaba-menu__desc { margin: .2rem 0 .4rem; color: var(--k-text); opacity: .85; font-size: .95rem; }
.kailaba-menu__tags { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; }
.kailaba-menu__diet {
  font-size: .7rem; letter-spacing: .03em; text-transform: uppercase; color: var(--k-indigo);
  border: 1px solid var(--k-line); padding: .1rem .5rem; border-radius: 999px;
}
.kailaba-menu__online {
  font-size: .7rem; font-weight: 600; letter-spacing: .02em;
  background: var(--k-saffron); color: #22201e; padding: .12rem .55rem; border-radius: 999px;
}
.kailaba-menu__inhouse {
  font-size: .7rem; letter-spacing: .03em; text-transform: uppercase;
  color: var(--k-text); opacity: .7; border: 1px dashed var(--k-line); padding: .1rem .5rem; border-radius: 999px;
}
/* Dine-in-only note where an Add-to-Cart button would be (shop loop) */
.kailaba-inhouse { display: inline-block; font-style: italic; color: var(--k-text); opacity: .75; }

/* ---- Order Online: category tabs + grid ---- */
/* Sticky filter bar (search + category tabs) on the order page — stays in reach while scrolling a
   long menu, so it never gets overwhelming. Sits just below the sticky site header (its measured
   height is in --kailaba-header-h; falls back to 0 when the header is not sticky). */
.kailaba-order__filters { position: sticky; top: var(--kailaba-header-h, 0px); z-index: 30; background: var(--k-base); padding: .85rem 0 .75rem; margin: 0 0 1.75rem; box-shadow: 0 10px 14px -14px rgba(0,0,0,.55); }
.kailaba-order__search { position: relative; max-width: 440px; margin: 0 auto .8rem; }
.kailaba-order__search-input { width: 100%; padding: .6rem 2.4rem .6rem 1.1rem; border: 1px solid var(--k-line); border-radius: 999px; font: inherit; background: #fff; box-sizing: border-box; }
.kailaba-order__search-input:focus { outline: none; border-color: var(--k-crimson); box-shadow: 0 0 0 3px rgba(158,27,50,.12); }
.kailaba-order__search-clear { position: absolute; right: .55rem; top: 50%; transform: translateY(-50%); border: 0; background: transparent; font-size: 1.35rem; line-height: 1; cursor: pointer; color: var(--k-text); opacity: .55; padding: 0 .3rem; }
.kailaba-order__search-clear:hover { opacity: 1; }
.kailaba-order__empty { text-align: center; opacity: .7; padding: 2.5rem 0; }
.kailaba-order__tabs { display: flex; flex-wrap: wrap; gap: .5rem; justify-content: center; margin: 0 auto; }
.kailaba-order__tab {
  background: transparent; border: 1px solid var(--k-line); color: var(--k-text);
  border-radius: 999px; padding: .4rem 1.1rem; cursor: pointer; font: inherit; line-height: 1.2;
  transition: background .15s, color .15s, border-color .15s;
}
.kailaba-order__tab:hover { border-color: var(--k-crimson); color: var(--k-crimson); }
.kailaba-order__tab.is-active { background: var(--k-crimson); color: #fff; border-color: var(--k-crimson); }
.kailaba-order__tab span { opacity: .6; font-size: .8em; margin-left: .15em; }
.kailaba-order__tab.is-active span { opacity: .85; }
/* On phones the chips scroll horizontally instead of wrapping into many rows. */
@media (max-width: 600px) {
  .kailaba-order__tabs { flex-wrap: nowrap; overflow-x: auto; justify-content: flex-start; -webkit-overflow-scrolling: touch; scrollbar-width: none; padding-bottom: .25rem; }
  .kailaba-order__tabs::-webkit-scrollbar { display: none; }
  .kailaba-order__tab { flex: 0 0 auto; }
}
/* Responsive grid (override WooCommerce's default float/one-per-row layout) */
.kailaba-order__grid.products { display: grid !important; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; margin: 0; }
.kailaba-order__grid.products::before, .kailaba-order__grid.products::after { display: none !important; }
.kailaba-order__grid.products li.product { width: auto !important; float: none !important; margin: 0 !important; clear: none !important; }
@media (max-width: 1024px) { .kailaba-order__grid.products { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 640px)  { .kailaba-order__grid.products { grid-template-columns: repeat(2, 1fr); gap: 1rem; } }
.kailaba-order__card { text-align: left; display: flex; flex-direction: column; height: 100%; border: 1px solid var(--k-line); border-radius: 14px; padding: .8rem; background: #fff; }
.kailaba-order__thumb { display: block; position: relative; }
.kailaba-order__thumb img { border-radius: 10px; aspect-ratio: 4 / 3; object-fit: cover; width: 100%; }
/* Allergen badges overlaid on the photo (2-letter codes; full name on hover / for screen readers). */
.kailaba-order__alg-ov { position: absolute; left: .4rem; bottom: .4rem; display: flex; flex-wrap: wrap; gap: .25rem; max-width: calc(100% - .8rem); }
.kailaba-order__alg { display: inline-flex; align-items: center; justify-content: center; min-width: 1.4rem; height: 1.4rem; padding: 0 .3rem; border-radius: 999px; background: rgba(20,20,25,.66); color: #fff; font-size: .62rem; font-weight: 700; line-height: 1; text-decoration: none; border: 0; cursor: help; }
.kailaba-order__info { display: flex; flex-direction: column; flex: 1; padding-top: .6rem; }
.kailaba-order__head { display: flex; align-items: baseline; justify-content: space-between; gap: .5rem; }
.kailaba-order__name { font-size: 1.02rem; margin: 0; line-height: 1.25; }
.kailaba-order__price { color: var(--k-crimson); font-weight: 600; white-space: nowrap; }
.kailaba-order__desc { font-size: .86rem; line-height: 1.45; color: var(--k-text); opacity: .8; margin: .35rem 0 .5rem; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.kailaba-order__tags { display: flex; flex-wrap: wrap; gap: .35rem; margin-bottom: .5rem; }
.kailaba-order__actions { margin-top: auto; padding-top: .4rem; display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }
.kailaba-order__actions .kailaba-order__qty { margin: 0; }
.kailaba-order__card .button { border-radius: 999px; }

/* City select spacing on classic checkout */
.kailaba-city-select { height: auto; }

/* ---- Quantity stepper [-] [input] [+] ---- */
.quantity { display: inline-flex; align-items: stretch; }
.kailaba-qty-btn {
  width: 2.2rem; border: 1px solid var(--k-line); background: transparent; color: var(--k-text);
  cursor: pointer; font-size: 1.15rem; line-height: 1; padding: 0;
}
.kailaba-qty-btn:hover { border-color: var(--k-crimson); color: var(--k-crimson); }
.kailaba-qty-minus { border-radius: 8px 0 0 8px; }
.kailaba-qty-plus { border-radius: 0 8px 8px 0; }
.quantity input.qty {
  width: 3rem; text-align: center; border-left: 0; border-right: 0; border-radius: 0;
  -moz-appearance: textfield; appearance: textfield;
}
.quantity input.qty::-webkit-outer-spin-button,
.quantity input.qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

/* ---- Allergens (EU) ---- */
.kailaba-allergens { margin-top: .35rem; font-size: .82rem; color: var(--k-text); }
.kailaba-allergens__label { font-weight: 600; text-transform: uppercase; letter-spacing: .03em; font-size: .72rem; }
.kailaba-allergen {
  display: inline-block; background: var(--k-surface); border: 1px solid var(--k-line);
  color: var(--k-text); padding: .05rem .45rem; border-radius: 4px; margin: 0 .1rem .1rem 0; font-size: .75rem;
}
.kailaba-allergen-notice { font-size: .82rem; font-style: italic; color: var(--k-text); opacity: .8; margin: 0 0 1.5rem; }

/* ===================== Homepage ===================== */
.kailaba-kicker { letter-spacing: 3px; text-transform: uppercase; font-size: .8rem; color: var(--k-saffron); margin-bottom: .4rem; }
.kailaba-kicker--dark { color: var(--k-crimson); }
.kailaba-hero__title { font-size: clamp(2.6rem, 7vw, 5rem); font-weight: 500; color: #fff; margin: 0; line-height: 1.05; }
.kailaba-hero__sub { font-size: 1.2rem; color: #fff; max-width: 620px; margin: 1rem auto 0; }
.kailaba-hero .wp-block-buttons { margin-top: 1.6rem; }
.kailaba-btn-primary .wp-block-button__link { background: var(--k-crimson); color: #fff; border-radius: 999px; padding: .75em 1.9em; }
.kailaba-btn-saffron .wp-block-button__link { background: var(--k-saffron); color: #22201e; border-radius: 999px; padding: .75em 1.9em; }
.kailaba-btn-ghost .wp-block-button__link { border: 2px solid #fff !important; color: #fff !important; border-radius: 999px; padding: .7em 1.8em; background: transparent !important; }
.kailaba-btn-ghost .wp-block-button__link:hover { background: #fff !important; color: var(--k-crimson) !important; }
.kailaba-btn-ghost-dark .wp-block-button__link { border: 2px solid var(--k-crimson) !important; color: var(--k-crimson) !important; border-radius: 999px; padding: .6em 1.6em; background: transparent !important; }
.kailaba-btn-ghost-dark .wp-block-button__link:hover { background: var(--k-crimson) !important; color: #fff !important; }

.kailaba-intro { padding: clamp(3rem,7vw,5rem) 1rem 2rem; }
.kailaba-muted { color: var(--k-text); opacity: .85; }
.kailaba-divider img { opacity: .9; }

.kailaba-dishes { padding: 2rem 1rem clamp(3rem,7vw,5rem); }
.kailaba-dish__img img { border-radius: 12px; aspect-ratio: 1; object-fit: cover; width: 100%; }
.kailaba-dishes h3 { margin: .7rem 0 .2rem; }

.kailaba-cta { background: var(--k-crimson); padding: clamp(2.5rem,6vw,3.75rem) 1rem; }
.kailaba-cta h2, .kailaba-cta p { color: #fff; }
.kailaba-cta p { opacity: .92; margin-top: .3rem; }

.kailaba-story { background: var(--k-surface); padding: clamp(3rem,7vw,5rem) 1rem; }
.kailaba-story__img img { border-radius: 14px; width: 100%; }
.kailaba-story h2 { margin-top: .1rem; }

.kailaba-reviews { padding: clamp(3rem,7vw,5rem) 1rem; }
.kailaba-reviews__row { margin-top: 2rem; }
.kailaba-review { background: #fff; border: 1px solid var(--k-line); border-radius: 12px; padding: 1.6rem; height: 100%; }
.kailaba-review__quote { font-family: var(--headings-font-family, serif); font-size: 1.05rem; line-height: 1.5; margin: 0 0 .8rem; }
.kailaba-review__quote::before { content: "\201C"; color: var(--k-saffron); font-size: 1.6em; line-height: 0; vertical-align: -.35em; margin-right: .05em; }
.kailaba-review__cite { color: var(--k-crimson); font-weight: 600; margin: 0; font-size: .9rem; }
@media (max-width: 781px) { .kailaba-hero__title { font-size: 2.4rem; } .kailaba-hero__sub { font-size: 1.05rem; } }

/* ===== Hero image slider ([kailaba_hero]) ===== */
/* Full-bleed: break out of Elementor's boxed container to span the whole viewport. */
.kailaba-hero { position: relative; width: 100vw; max-width: 100vw; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); min-height: 100vh; min-height: 100svh; display: flex; align-items: center; justify-content: center; text-align: center; overflow: hidden; }
.kailaba-hero__slides, .kailaba-hero__overlay { position: absolute; inset: 0; }
.kailaba-hero__slide { position: absolute; inset: 0; background-size: cover; background-position: center; opacity: 0; transition: opacity 1.4s ease; }
.kailaba-hero__slide.is-active { opacity: 1; }
.kailaba-hero__overlay { background: linear-gradient(180deg, rgba(18,16,26,.4) 0%, rgba(18,16,26,.62) 100%); }
.kailaba-hero__content { position: relative; z-index: 2; max-width: 760px; padding: 2rem 1.2rem; }
.kailaba-hero__kicker { letter-spacing: 3px; text-transform: uppercase; font-size: .8rem; color: var(--k-saffron); margin: 0 0 .5rem; }
.kailaba-hero .kailaba-hero__title { font-family: var(--headings-font-family, serif); font-size: clamp(2.6rem, 7vw, 5rem); font-weight: 500; color: #fff; margin: 0 0 .6rem; line-height: 1.05; }
.kailaba-hero__sub { font-size: 1.2rem; color: #fff; opacity: .95; max-width: 600px; margin: 0 auto 1.7rem; }
.kailaba-hero__actions { display: flex; gap: .8rem; justify-content: center; flex-wrap: wrap; }
.kailaba-hero__btn { display: inline-block; padding: .85em 2em; border-radius: 999px; font-weight: 600; text-decoration: none; transition: background .15s, color .15s; }
.kailaba-hero__btn--primary { background: var(--k-crimson); color: #fff; }
.kailaba-hero__btn--primary:hover { background: #7a1526; color: #fff; }
.kailaba-hero__btn--ghost { border: 2px solid #fff; color: #fff; }
.kailaba-hero__btn--ghost:hover { background: #fff; color: var(--k-crimson); }
@media (max-width: 781px) { .kailaba-hero { min-height: 92vh; min-height: 92svh; } .kailaba-hero__sub { font-size: 1.05rem; } }

/* ===================== Layered base (client brand colour) =====================
   The page base is ONE colour — the client's brand colour — painted on a FIXED
   layer, so all content scrolls over a static base (the Helm-style depth effect).
   To rebrand a client: change Astra global colour 5 (--ast-global-color-4) and the
   whole site base follows. Sections without their own background stay transparent
   so the brand base shows through; panels/bands layer on top. */
:root { --k-base: var(--ast-global-color-4, #FBF7F0); }

html, body { background-color: var(--k-base) !important; }

/* Static base layer — content moves over this. */
body::before {
  content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background:
    radial-gradient(1100px 620px at 12% -5%, rgba(255,255,255,.55), transparent 62%),
    radial-gradient(900px 520px at 88% 105%, rgba(255,255,255,.32), transparent 62%),
    var(--k-base);
}

/* Let the base show through the theme wrappers. */
#page, #content, .site, .site-content, .ast-container, .entry-content,
.elementor, .elementor-section-wrap { background: transparent !important; }

/* ===================== Guest review cards ([kailaba_reviews]) ================= */
/* Reviews as a horizontal, swipeable strip (5-7 cards) — scroll-snap + optional prev/next. */
.kailaba-reviews-wrap { margin-top: 2.2rem; }
.kailaba-reviews { display: flex; gap: 1.25rem; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; padding: .3rem .2rem 1.1rem; margin: 0; -webkit-overflow-scrolling: touch; scrollbar-width: thin; }
.kailaba-review-card { flex: 0 0 clamp(255px, 78vw, 330px); scroll-snap-align: start; margin: 0; display: flex; flex-direction: column; gap: .7rem; background: #fff; border: 1px solid var(--k-line); border-radius: 14px; padding: 1.7rem 1.5rem; }
.kailaba-review-card__stars { color: var(--k-saffron); letter-spacing: 2px; font-size: 1rem; line-height: 1; }
.kailaba-review-card__stars-off { color: var(--k-line); }
.kailaba-review-card__quote { margin: 0; font-family: var(--headings-font-family, serif); font-size: 1.05rem; line-height: 1.5; color: var(--k-text); flex: 1 0 auto; }
.kailaba-review-card__meta { display: flex; align-items: baseline; gap: .6rem; flex-wrap: wrap; }
.kailaba-review-card__name { font-weight: 700; color: var(--k-text); }
.kailaba-review-card__source { font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; color: var(--k-crimson); font-weight: 700; }
.kailaba-review-card__link { align-self: flex-start; margin-top: .1rem; color: var(--k-crimson); font-weight: 600; font-size: .88rem; text-decoration: none; }
.kailaba-review-card__link::after { content: " \2192"; }
.kailaba-review-card__link:hover { text-decoration: underline; }
.kailaba-reviews__nav { display: flex; gap: .5rem; justify-content: flex-end; margin-top: .2rem; }
.kailaba-reviews__btn { width: 2.4rem; height: 2.4rem; border-radius: 999px; border: 1px solid var(--k-line); background: #fff; cursor: pointer; font-size: 1.3rem; line-height: 1; color: var(--k-text); }
.kailaba-reviews__btn:hover { border-color: var(--k-crimson); color: var(--k-crimson); }
.kailaba-reviews__all { display: inline-block; margin-top: .9rem; color: var(--k-crimson); font-weight: 600; text-decoration: none; }
.kailaba-reviews__all::after { content: " \2192"; }
.kailaba-reviews__all:hover { text-decoration: underline; }
@media (hover: none) { .kailaba-reviews__nav { display: none; } }

/* ===================== Section rhythm =====================
   Elementor does not reliably apply section padding / min-height (or section CSS
   classes) on programmatically generated documents, so the theme owns vertical
   spacing. Sections are selected by the content they contain via :has(). */
.elementor-top-section { padding-block: clamp(3.5rem, 7vw, 6rem); }

/* Hero is full-bleed and sets its own 100vh height. */
.elementor-top-section:has(.kailaba-hero) { padding: 0; }

/* "From our kitchen" + Signature dishes own a full screen. */
.elementor-top-section:has(.elementor-widget-image-box) {
  min-height: 100vh; display: flex; align-items: center;
}
.elementor-top-section:has(.elementor-widget-image-box) > .elementor-container { width: 100%; }

/* Extra breathing room around the social-proof bands (the missing Press → Reviews gap). */
.elementor-top-section:has(.kailaba-press) { padding-block: clamp(4rem, 8vw, 6.5rem); }
.elementor-top-section:has(.kailaba-reviews) { padding-block: clamp(5rem, 9vw, 8rem); }

/* ===================== Header navigation contrast =====================
   The imported template left the nav links white, which is invisible on inner pages
   (light header). Nav is dark by default and only goes light where the header sits
   transparently over the hero (front page). */
.main-header-menu > .menu-item > a,
.ast-header-navigation-wrap .main-header-menu > .menu-item > a { color: var(--k-text) !important; }
.main-header-menu > .menu-item > a:hover,
.main-header-menu > .current-menu-item > a,
.main-header-menu > .current_page_item > a { color: var(--k-crimson) !important; }

body.home .main-header-menu > .menu-item > a,
body.ast-theme-transparent-header .main-header-menu > .menu-item > a { color: #fff !important; }

/* Site title sits over the dark hero on the front page — keep it legible (esp. mobile). */
body.home .site-title a,
body.ast-theme-transparent-header .site-title a { color: #fff !important; }
body.home .main-header-menu > .menu-item > a:hover,
body.home .main-header-menu > .current-menu-item > a,
body.ast-theme-transparent-header .main-header-menu > .menu-item > a:hover { color: var(--k-saffron) !important; }

/* MOBILE menu: the drawer is a light panel, so the transparent-header white rule above (meant for
   the desktop hero) made its links invisible. Astra sets body.ast-header-break-point when the mobile
   header is active — force dark, readable links there (this rule comes later at equal specificity,
   so it wins on mobile without touching the desktop-over-hero look). Site title is left white: on
   mobile it sits on the dark header bar. */
body.ast-header-break-point .main-header-menu > .menu-item > a,
body.ast-header-break-point .ast-mobile-header-content .menu-item > a,
body.ast-header-break-point #ast-hf-mobile-menu .menu-item > a,
body.ast-header-break-point .ast-mobile-popup-drawer .menu-item > a { color: var(--k-text) !important; }
body.ast-header-break-point .main-header-menu > .menu-item > a:hover,
body.ast-header-break-point .main-header-menu .current-menu-item > a,
body.ast-header-break-point #ast-hf-mobile-menu .current-menu-item > a,
body.ast-header-break-point .ast-mobile-popup-drawer .current-menu-item > a { color: var(--k-crimson) !important; }

/* ── Sticky header — opt-in per client via the kailaba_sticky_header filter (body.kailaba-sticky).
   Astra's transparent header is position:absolute and an overflow ancestor can break position:sticky,
   so instead we REVEAL a solid FIXED bar once the page scrolls (body.kailaba-scrolled, toggled by
   kailaba-header.php). At rest the header keeps Astra's own transparent-over-hero positioning. */
body.kailaba-sticky.kailaba-scrolled .site-header {
	position: fixed !important;
	top: 0; left: 0; right: 0; width: 100%;
	z-index: 999;
	background: var(--k-base) !important;
	box-shadow: 0 2px 14px rgba(0,0,0,.10);
	animation: kailaba-header-down .28s ease;
}
@keyframes kailaba-header-down { from { transform: translateY(-100%); } to { transform: translateY(0); } }
/* Keep clear of the WP admin bar when logged in. */
body.kailaba-sticky.kailaba-scrolled.admin-bar .site-header { top: 32px; }
@media (max-width: 782px) { body.kailaba-sticky.kailaba-scrolled.admin-bar .site-header { top: 46px; } }
/* Inner (non-transparent) pages: the header was in normal flow, so reserve its height when it goes
   fixed, to avoid a jump. Home / transparent header was absolute (out of flow) → no reserve. */
body.kailaba-sticky.kailaba-scrolled:not(.home):not(.ast-theme-transparent-header) { padding-top: var(--kailaba-header-h, 0px); }
/* Scrolled = solid bar → dark, readable links + title (incl. over the home hero). */
body.kailaba-sticky.kailaba-scrolled .main-header-menu > .menu-item > a { color: var(--k-text) !important; }
body.kailaba-sticky.kailaba-scrolled .main-header-menu > .menu-item > a:hover,
body.kailaba-sticky.kailaba-scrolled .main-header-menu > .current-menu-item > a { color: var(--k-crimson) !important; }
body.kailaba-sticky.kailaba-scrolled .site-title a { color: var(--k-crimson) !important; }

/* ── Mobile menu as a slide-in DRAWER (from the left), instead of a flat full-width white panel.
   Astra keeps the closed menu hidden (display:none / max-height:0), so these box-model rules only
   take effect while it is open; the keyframe plays the slide on open. If a client's Astra uses a
   different mobile markup, the menu still works — it just falls back to the plain panel. */
@media (max-width: 921px) {
	body.ast-header-break-point .ast-mobile-header-content {
		position: fixed;
		top: 0; left: 0; bottom: 0;
		width: min(82vw, 340px);
		max-width: 100%;
		height: 100vh; height: 100dvh;
		background: #fff !important;
		box-shadow: 0 0 40px rgba(0,0,0,.35);
		overflow-y: auto;
		z-index: 9999;
		padding: 4.75rem 0 2rem;
		animation: kailaba-drawer-in .28s ease both;
	}
	@keyframes kailaba-drawer-in { from { transform: translateX(-100%); } to { transform: translateX(0); } }
	/* Keep the header bar (logo + close X) tappable above the drawer. */
	body.ast-header-break-point .ast-mobile-header-bar,
	body.ast-header-break-point .ast-mobile-header-wrap { position: relative; z-index: 10000; }
	body.ast-header-break-point .ast-mobile-header-content .menu-item > a { padding-left: 1.5rem; padding-right: 1.5rem; }
}

/* ===================== Gallery ([kailaba_gallery]) ===================== */
.kailaba-gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; margin-top: 2.5rem; }
.kailaba-gallery__item { padding: 0; border: 0; background: none; cursor: zoom-in; border-radius: 12px; overflow: hidden; line-height: 0; }
.kailaba-gallery__item img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; transition: transform .35s ease; }
.kailaba-gallery__item:hover img { transform: scale(1.05); }
@media (max-width: 900px) { .kailaba-gallery { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .kailaba-gallery { grid-template-columns: 1fr; } }

.kailaba-lightbox { position: fixed; inset: 0; z-index: 9999; background: rgba(18,16,26,.9); display: flex; align-items: center; justify-content: center; padding: 4vmin; cursor: zoom-out; }
.kailaba-lightbox[hidden] { display: none; }
.kailaba-lightbox__img { max-width: 100%; max-height: 90vh; border-radius: 10px; }
.kailaba-lightbox__close { position: absolute; top: 1.2rem; right: 1.6rem; background: none; border: 0; color: #fff; font-size: 2.4rem; line-height: 1; cursor: pointer; }

/* ===================== Contact / Visit blocks ===================== */
.kailaba-hours { margin: 0 0 1.5rem; max-width: 420px; }
.kailaba-hours__row { display: flex; justify-content: space-between; gap: 1rem; padding: .45rem 0; border-bottom: 1px solid var(--k-line); }
.kailaba-hours__row.is-today { color: var(--k-crimson); font-weight: 700; }
.kailaba-hours dt, .kailaba-hours dd { margin: 0; }
.kailaba-hours .is-closed { opacity: .65; font-style: italic; }

.kailaba-contact-card { margin-bottom: 1.8rem; }
.kailaba-contact-card address { font-style: normal; margin: 0 0 .7rem; }
.kailaba-contact-card ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .35rem; }
.kailaba-contact-card__wa { color: var(--k-crimson); font-weight: 700; }

/* Product image fallback (kailaba-shop.php): the site logo stands in for a missing product image.
   Contain + pad it on a soft surface so a wide logo is not stretched or cropped. */
img.woocommerce-placeholder { object-fit: contain !important; background: var(--k-surface); padding: 12%; box-sizing: border-box; }

/* Click-to-load map: no third-party request until the visitor clicks (GDPR-friendly). */
.kailaba-map { position: relative; border-radius: 14px; overflow: hidden; background: var(--k-surface); min-height: 340px; display: grid; }
.kailaba-map__load { border: 1px dashed var(--k-line); background: var(--k-surface); border-radius: 14px; cursor: pointer; display: grid; gap: .35rem; align-content: center; justify-items: center; text-align: center; padding: 2.5rem 1.6rem; min-height: 340px; font: inherit; color: inherit; width: 100%; }
.kailaba-map__load:hover { border-color: var(--k-crimson); }
.kailaba-map__pin { font-size: 2rem; }
.kailaba-map__label { font-weight: 700; font-size: 1.05rem; }
.kailaba-map__hint { font-size: .85rem; opacity: .7; }
.kailaba-map__directions { position: absolute; left: 12px; top: 12px; z-index: 2; background: #fff; color: var(--k-crimson); font-weight: 600; font-size: .85rem; padding: .4rem .8rem; border-radius: 999px; box-shadow: 0 2px 8px rgba(0,0,0,.18); }
.kailaba-map.is-loaded { min-height: 340px; }
.kailaba-map.is-loaded iframe { display: block; min-height: 340px; }

/* Enquiry form ([kailaba_enquiry]) — self-contained, no form plugin. */
.kailaba-enquiry { max-width: 720px; margin: 0 auto; }
.kailaba-enquiry__title { margin: 0 0 .6rem; }
.kailaba-enquiry__intro { margin: 0 0 1.6rem; opacity: .85; }
.kailaba-enquiry__notice { padding: .9rem 1.1rem; border-radius: 10px; margin: 0 0 1.4rem; font-weight: 600; }
.kailaba-enquiry__notice.is-ok { background: #E7F3E9; color: #1E5B2A; border: 1px solid #B7DCC0; }
.kailaba-enquiry__notice.is-error { background: #FBE9E7; color: #8A2A1B; border: 1px solid #E8B4AC; }
.kailaba-enquiry__form { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem 1.2rem; }
.kailaba-enquiry__row { display: grid; gap: .35rem; }
.kailaba-enquiry__row--wide { grid-column: 1 / -1; }
.kailaba-enquiry__row label { font-weight: 600; font-size: .9rem; }
.kailaba-enquiry__req { color: var(--k-crimson); }
.kailaba-enquiry__row input, .kailaba-enquiry__row textarea { width: 100%; padding: .7rem .85rem; border: 1px solid var(--k-line); border-radius: 10px; font: inherit; background: #fff; }
.kailaba-enquiry__row input:focus, .kailaba-enquiry__row textarea:focus { outline: none; border-color: var(--k-crimson); box-shadow: 0 0 0 3px rgba(158,27,50,.12); }
.kailaba-enquiry__hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.kailaba-enquiry__submit { grid-column: 1 / -1; justify-self: start; margin-top: .3rem; padding: .8em 2em; border: 0; border-radius: 999px; background: var(--k-crimson); color: #fff; font-weight: 700; font-size: 1rem; cursor: pointer; }
.kailaba-enquiry__submit:hover { background: var(--k-indigo, #2B2D5B); }
@media (max-width: 560px) { .kailaba-enquiry__form { grid-template-columns: 1fr; } }

/* WPForms — match the kit's look */
.kailaba-form .wpforms-field-label { font-weight: 600; }
.kailaba-form input[type=text], .kailaba-form input[type=email], .kailaba-form input[type=number],
.kailaba-form input[type=tel], .kailaba-form textarea, .kailaba-form select { border-radius: 8px !important; border: 1px solid var(--k-line) !important; }
.kailaba-form button[type=submit] { border-radius: 999px !important; background: var(--k-crimson) !important; border-color: var(--k-crimson) !important; color: #fff !important; padding: .8em 2.2em !important; }
.kailaba-form button[type=submit]:hover { background: #7a1526 !important; }

/* ===================== Global footer ([kailaba_footer]) ===================== */
.kailaba-footer { background: var(--k-indigo, #2B2D5B); color: #fff; }
.kailaba-footer a { color: #fff; text-decoration: none; }
.kailaba-footer a:hover { color: var(--k-saffron); }

.kailaba-footer__cta { display: flex; flex-wrap: wrap; gap: 1rem 1.5rem; align-items: center; justify-content: space-between; max-width: 1200px; margin: 0 auto; padding: 2.2rem 1.5rem; border-bottom: 1px solid rgba(255,255,255,.14); }
.kailaba-footer__cta-text { margin: 0; font-family: var(--headings-font-family, serif); font-size: 1.3rem; }
.kailaba-footer__cta-actions { display: flex; gap: .7rem; flex-wrap: wrap; }
.kailaba-footer__btn { display: inline-block; padding: .72em 1.7em; border-radius: 999px; font-weight: 600; font-size: .95rem; }
.kailaba-footer__btn--primary { background: var(--k-saffron); color: #22201e !important; }
.kailaba-footer__btn--primary:hover { background: #fff; color: #22201e !important; }
.kailaba-footer__btn--ghost { border: 2px solid rgba(255,255,255,.5); }
.kailaba-footer__btn--ghost:hover { background: #fff; color: var(--k-indigo) !important; }

.kailaba-footer__grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 2.2rem; max-width: 1200px; margin: 0 auto; padding: 3.2rem 1.5rem; }
.kailaba-footer__brand { font-family: var(--headings-font-family, serif); font-size: 1.55rem; margin: 0 0 .5rem; color: #fff; }
.kailaba-footer__logo { margin: 0 0 1rem; }
.kailaba-footer__logo img { max-height: 56px; width: auto; }
.kailaba-footer__blurb { margin: 0 0 1.1rem; opacity: .75; font-size: .92rem; line-height: 1.6; }
.kailaba-footer__story-link { color: var(--k-saffron) !important; font-weight: 600; white-space: nowrap; }
.kailaba-footer__story-link::after { content: " \2192"; }
.kailaba-footer__title { font-size: .78rem; text-transform: uppercase; letter-spacing: .08em; color: var(--k-saffron); margin: 0 0 .9rem; }
.kailaba-footer__social { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 1rem; font-size: .9rem; }

.kailaba-footer__hours { margin: 0; font-size: .9rem; }
.kailaba-footer__hours-row { display: flex; justify-content: space-between; gap: 1rem; padding: .28rem 0; }
.kailaba-footer__hours-row.is-today { color: var(--k-saffron); font-weight: 600; }
.kailaba-footer__hours dt, .kailaba-footer__hours dd { margin: 0; }
.kailaba-footer__hours .is-closed { opacity: .6; font-style: italic; }

.kailaba-footer__address { font-style: normal; opacity: .85; font-size: .92rem; margin: 0 0 .85rem; }
.kailaba-footer__contact, .kailaba-footer__links { list-style: none; margin: 0; padding: 0; display: grid; gap: .45rem; font-size: .92rem; }
.kailaba-footer__wa { color: var(--k-saffron) !important; font-weight: 600; }

.kailaba-footer__map { margin-top: 1.3rem; display: grid; gap: .25rem; font-size: .8rem; border: 1px dashed rgba(255,255,255,.3); border-radius: 10px; padding: .9rem; opacity: .9; }
.kailaba-footer__map a { text-decoration: underline; }

/* "We accept" — in-store payment methods advertised in the footer. */
.kailaba-footer__pay { margin-top: 1.4rem; }
.kailaba-footer__pay-label { display: block; font-size: .72rem; text-transform: uppercase; letter-spacing: .08em; color: var(--k-saffron); margin-bottom: .55rem; }
.kailaba-pay { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem; }
.kailaba-pay__chip { background: #fff; border-radius: 5px; height: 26px; min-width: 40px; padding: 3px 6px; display: flex; align-items: center; justify-content: center; box-shadow: 0 1px 2px rgba(0,0,0,.25); }
.kailaba-pay__chip svg { height: 18px; width: auto; display: block; }
.kailaba-pay__chip--text span { font-size: .7rem; font-weight: 700; color: var(--k-indigo, #2B2D5B); white-space: nowrap; padding: 0 2px; }

.kailaba-footer__bottom { border-top: 1px solid rgba(255,255,255,.14); font-size: .82rem; opacity: .8; display: flex; flex-wrap: wrap; gap: .6rem 1.2rem; justify-content: space-between; max-width: 1200px; margin: 0 auto; padding: 1.3rem 1.5rem; }
.kailaba-footer__legal { display: flex; gap: 1.2rem; }

@media (max-width: 900px) { .kailaba-footer__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .kailaba-footer__grid { grid-template-columns: 1fr; } .kailaba-footer__cta { flex-direction: column; align-items: flex-start; } }

/* Signature dishes — larger, uniform square tiles (image-box is only used here) */
.elementor-widget-image-box .elementor-image-box-img { margin: 0 auto 1.1rem !important; width: auto !important; }
.elementor-widget-image-box .elementor-image-box-img img {
  width: 260px !important; max-width: 100% !important; height: 260px !important;
  object-fit: cover !important; border-radius: 14px;
}
.elementor-widget-image-box .elementor-image-box-title { margin-bottom: .4rem; }
.elementor-widget-image-box { margin-bottom: 1rem; }

/* Disable parallax fixed background on smaller screens (jank / mobile support) */
@media (max-width: 1024px) { .elementor-section[data-settings*="background_background"] { background-attachment: scroll !important; } }

/* Overlay bands (e.g. Events & Catering) keep a DARK base colour so white copy stays
   legible even when the background image can't render. Elementor paints the fixed/parallax
   image on a JS-injected .elementor-motion-effects-layer, which is dropped by full-page
   screenshot capture and by some mobile browsers — leaving the white text on the light
   page. We target the section by its server-rendered .elementor-background-overlay (the
   only band that has one), so the fallback applies on first paint, no JS required; the
   solid-colour bands (Our Story, Order CTA) have no overlay and are unaffected. When the
   image does render it covers this colour entirely. */
.elementor-top-section:has(.elementor-background-overlay) { background-color: #221a12; }

/* Press cards ([kailaba_press]) — image + title + excerpt + source, whole card linked */
.kailaba-press { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.6rem; margin-top: 2.2rem; }
.kailaba-press__card { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--k-line); border-radius: 14px; overflow: hidden; text-decoration: none; color: inherit; transition: transform .15s ease, box-shadow .15s ease; }
.kailaba-press__card:hover { transform: translateY(-4px); box-shadow: 0 12px 28px rgba(34,32,30,.12); }
.kailaba-press__img { display: block; aspect-ratio: 16 / 10; background-size: cover; background-position: center; }
.kailaba-press__body { display: flex; flex-direction: column; gap: .5rem; padding: 1.4rem; }
.kailaba-press__title { font-family: var(--headings-font-family, serif); font-size: 1.2rem; line-height: 1.25; color: var(--k-text); }
.kailaba-press__excerpt { color: var(--k-text); opacity: .82; font-size: .92rem; line-height: 1.5; }
.kailaba-press__source { margin-top: .2rem; font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; color: var(--k-crimson); font-weight: 700; }
@media (max-width: 781px) { .kailaba-press { grid-template-columns: 1fr; } }

/* ── Online order: nav cart icon (kailaba-cart.php) + pickup/delivery toggle (kailaba-order.php) ── */
.kailaba-cart { position: relative; display: inline-flex; align-items: center; gap: .3rem; line-height: 1; text-decoration: none; color: var(--k-text); }
.kailaba-cart__icon { font-size: 1.15rem; }
.kailaba-cart__count { min-width: 1.2em; height: 1.2em; padding: 0 .35em; display: inline-flex; align-items: center; justify-content: center; border-radius: 1em; background: var(--k-crimson); color: #fff; font-size: .7rem; font-weight: 700; }
.kailaba-cart__count.is-empty { display: none; }
.kailaba-cart__item { display: flex; align-items: center; }

.kailaba-mode { margin: 0 0 1.2rem; }
.kailaba-mode__buttons { display: inline-flex; border: 1px solid var(--k-line, #ddd); border-radius: 999px; overflow: hidden; background: var(--k-surface, #fff); }
.kailaba-mode__btn { appearance: none; -webkit-appearance: none; border: 0; background: transparent; padding: .5rem 1.25rem; font: inherit; font-weight: 600; color: var(--k-text); cursor: pointer; transition: background .15s ease, color .15s ease; }
.kailaba-mode__btn.is-active { background: var(--k-crimson); color: #fff; }
.kailaba-mode__termsbox { margin: .5rem 0 0; }
.kailaba-mode__terms { list-style: none; margin: 0; padding: .6rem .9rem; border: 1px solid var(--k-line, #e6e0d8); border-radius: 10px; background: var(--k-surface, #fff); display: grid; gap: .3rem; max-width: 640px; }
.kailaba-mode__terms li { position: relative; padding-left: 1.3rem; font-size: .92rem; line-height: 1.45; color: var(--k-text); }
.kailaba-mode__terms li::before { content: "✓"; position: absolute; left: 0; color: var(--k-crimson); font-weight: 700; }
.kailaba-proceed--disabled { opacity: .45; pointer-events: none; cursor: not-allowed; }

/* Order page: 2-column layout + sticky order summary + quantity stepper */
.kailaba-order { max-width: min(1340px, 94vw); margin-inline: auto; }   /* self-constrain on full-width (page-builder) pages */
.kailaba-order__layout { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 2rem; align-items: start; }
.kailaba-order__main { min-width: 0; }
/* Own the product grid so it stays inside the main column (never under the summary). */
.kailaba-order__grid.products { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 1.25rem; margin: 0 !important; width: 100% !important; }
/* Category groups on the order page (heading like "Starter" + optional category note). */
.kailaba-order__group + .kailaba-order__group { margin-top: 2.6rem; }
.kailaba-order__group-title { font-family: var(--headings-font-family, serif); font-size: 1.5rem; margin: 0 0 .3rem; display: flex; align-items: center; gap: .9rem; }
.kailaba-order__group-title::after { content: ""; flex: 1; height: 1px; background: var(--k-line); }
.kailaba-order__group-desc { margin: 0 0 1.1rem; color: var(--k-text); opacity: .8; font-size: .92rem; max-width: 620px; }
.kailaba-order__grid.products::before, .kailaba-order__grid.products::after { content: none !important; display: none !important; }
.kailaba-order__grid.products li.product { width: auto !important; margin: 0 !important; float: none !important; clear: none !important; box-sizing: border-box; min-width: 0; }
/* The per-product "View cart" link WC injects after add-to-cart is redundant here (we have the
   order summary / mobile bar) and breaks the card grid — hide it. */
.kailaba-order .added_to_cart { display: none !important; }
/* Stick the order summary BELOW the sticky header + sticky filter bar, so its top rows are not
   hidden behind them (both are measured into --kailaba-header-h / --kailaba-filters-h). */
.kailaba-order-summary { position: sticky; top: calc(var(--kailaba-header-h, 0px) + var(--kailaba-filters-h, 0px) + 1rem); border: 1px solid var(--k-line, #e6e0d8); border-radius: 12px; background: var(--k-surface, #fff); padding: 1.1rem 1.2rem; }
.kailaba-summary__title { margin: 0 0 .6rem; font-size: 1.05rem; }
.kailaba-summary__empty { color: var(--k-text); opacity: .7; font-size: .9rem; }
.kailaba-summary__items { list-style: none; margin: 0 0 .8rem; padding: 0; display: grid; gap: .4rem; }
.kailaba-summary__items li { display: grid; grid-template-columns: auto 1fr auto; gap: .5rem; font-size: .88rem; align-items: baseline; }
.kailaba-summary__q { color: var(--k-crimson); font-weight: 700; }
.kailaba-summary__p { white-space: nowrap; }
.kailaba-summary__totals { border-top: 1px solid var(--k-line, #eee); padding-top: .6rem; display: grid; gap: .3rem; font-size: .9rem; }
.kailaba-summary__totals > div { display: flex; justify-content: space-between; }
.kailaba-summary__total { font-weight: 700; font-size: 1rem; }
.kailaba-summary__nudge { margin: .6rem 0 0; font-size: .82rem; color: var(--k-crimson); }
.kailaba-summary__nudge.is-warn { font-weight: 600; }
.kailaba-summary__actions { margin-top: .9rem; display: grid; gap: .5rem; }
.kailaba-summary__actions .button { width: 100%; text-align: center; }
.kailaba-summary__viewcart { text-align: center; font-size: .82rem; text-decoration: underline; color: var(--k-text); opacity: .8; }

.kailaba-order__qty { display: flex; align-items: center; width: fit-content; margin: 0 auto .5rem; border: 1px solid var(--k-line, #ddd); border-radius: 999px; overflow: hidden; }
.kailaba-qty__btn { flex: none; appearance: none; -webkit-appearance: none; border: 0; background: transparent; width: 2.6rem; height: 2.6rem; font-size: 1.2rem; line-height: 1; cursor: pointer; color: var(--k-text); }
.kailaba-qty__input { flex: none; width: 2.8rem; text-align: center; border: 0; background: transparent; font: inherit; -moz-appearance: textfield; }
.kailaba-qty__input::-webkit-outer-spin-button, .kailaba-qty__input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

/* Mobile order bar — fixed bottom CTA: [Cart] · items/total · [Checkout]. Hidden on desktop and
   when the cart is empty. */
.kailaba-order-bar { display: none; }
.kailaba-order-bar__inner { display: flex; align-items: center; gap: .6rem; max-width: 720px; margin: 0 auto; }
.kailaba-order-bar__meta { flex: 1 1 auto; text-align: center; font-size: .9rem; color: var(--k-text); }
.kailaba-order-bar .button { white-space: nowrap; margin: 0; padding: .55rem .9rem; }
.kailaba-order-bar__cart { background: transparent; border: 1px solid var(--k-crimson); color: var(--k-crimson); }

/* Preferred-time select at checkout (kailaba-order.php scheduling) */
.kailaba-order-time { margin: 1.2rem 0; }
.kailaba-order-time h3 { margin: 0 0 .35rem; font-size: 1rem; }
.kailaba-order-time__note { margin: 0 0 .45rem; font-size: .85rem; font-weight: 600; color: var(--k-crimson); }
.kailaba-order-time__select { width: 100%; max-width: 440px; padding: .55rem .7rem; }

@media (max-width: 900px) {
  .kailaba-order__layout { grid-template-columns: 1fr; }
  .kailaba-order__grid.products { grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); }
  .kailaba-order-summary { display: none; }                 /* the bottom bar is the mobile order UI */
  .kailaba-order-bar:has(.kailaba-order-bar__inner) {
    display: block; position: fixed; left: 0; right: 0; bottom: 0; z-index: 999;
    background: var(--k-surface, #fff); border-top: 1px solid var(--k-line, #e6e0d8);
    box-shadow: 0 -4px 16px rgba(0,0,0,.08);
    padding: .6rem .9rem; padding-bottom: calc(.6rem + env(safe-area-inset-bottom));
  }
  .kailaba-order { padding-bottom: 4.5rem; }                /* room so the bar never hides content */
}
@media (max-width: 560px) {
  .kailaba-order__grid.products { grid-template-columns: 1fr; }   /* one clean column on phones */
}