/* =========================================================================
   Mathaqat design system — ONE token vocabulary, base, header and footer.
   Every page loads this first. Page files (storefront / buffet / flow) only
   add layout for their own content and must use these tokens.
   ========================================================================= */
:root{
  /* Light green for content banners; approved deep green for the shared header/footer. */
  --mq-banner-green:#e0eaca;--mq-banner-border:#cbd7b9;
  /* Exact dominant colour sampled from the approved Mathaqat reference screenshot: RGB 33,69,46 */
  --mq-shell-green:#21452e;--mq-shell-border:#ffffff2b;--mq-shell-text:#faf9ee;--mq-shell-muted:#e1eadb;
  --mq-forest:#173b26;--mq-forest-2:#264d31;--mq-ink:#183b25;
  --mq-sage:var(--mq-banner-green);--mq-sage-line:var(--mq-banner-border);--mq-mint:#e7efd1;--mq-lime:#cfe58a;
  --mq-paper:#f8f8f2;--mq-ivory:#fcfbf7;--mq-cream:#f6f7ed;--mq-line:#e0e6d7;
  --mq-muted:#5f6d5c;--mq-gold:#c5a867;
  --mq-accent:#bf4c07;--mq-accent-2:#a64106;                 /* AA contrast with white text (4.9:1) */
  --mq-radius:18px;--mq-shadow:0 18px 44px rgba(32,65,36,.07);
  --mq-font:Outfit,Cairo,system-ui,sans-serif;--mq-font-ar:Cairo,Outfit,system-ui,sans-serif;
  --d:1;                                                      /* direction multiplier used by sliding panels */
  /* Legacy names used by older rules, mapped onto the unified values. */
  --ink:var(--mq-ink);--lime:var(--mq-lime);--lime2:#d6e99a;--olive:#c3cc8f;--olive2:#a3aa73;--org:var(--mq-accent);--org2:var(--mq-accent-2);
  --paper:var(--mq-paper);--line:var(--mq-line);--mq-header:var(--mq-forest);
  --green:var(--mq-forest);--sage:var(--mq-sage);--border:var(--mq-line);--gold:var(--mq-gold);--orange:var(--mq-accent);
  --pine:var(--mq-forest);--pine2:var(--mq-forest-2);--sageLight:#f3f6e9;--ivory:var(--mq-ivory);--cream:var(--mq-cream);--muted:var(--mq-muted);--radius:var(--mq-radius);--shadow:var(--mq-shadow);
  --forest:var(--mq-forest);--forest-light:var(--mq-forest-2);--mint:var(--mq-mint);--text:var(--mq-ink);
  --mq-nav-sage:var(--mq-sage);--mq-nav-border:var(--mq-sage-line);--mq-deep:var(--mq-forest);
}
html[dir=rtl]{--d:-1}
html{scroll-behavior:smooth;scroll-padding-top:96px}
body{margin:0;min-height:100vh;background:var(--mq-paper);color:var(--mq-ink);font-family:var(--mq-font);line-height:1.6;overflow-x:hidden}
body.ar,html[dir=rtl] body{font-family:var(--mq-font-ar)}
:where(a,button,input,select,textarea,summary):focus-visible{outline:3px solid var(--mq-forest);outline-offset:2px}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* ---------- Header ---------- */
.site-header,.site-header *,.site-footer,.site-footer *{box-sizing:border-box}
.site-header{position:sticky;top:0;z-index:50;background:var(--mq-shell-green);color:var(--mq-shell-text);border-bottom:1px solid var(--mq-shell-border)}
.site-header__inner{max-width:1280px;margin:0 auto;padding:10px clamp(16px,3vw,32px);display:flex;align-items:center;gap:clamp(12px,2vw,28px)}
.site-brand{display:flex;flex:none;border-radius:10px}
.site-brand img{height:44px;width:auto;display:block}
.site-nav{display:flex;gap:4px;margin-inline:auto}
.site-nav a{padding:8px 14px;border-radius:999px;color:var(--mq-shell-text);font-weight:600;font-size:.95rem;text-decoration:none;white-space:nowrap;transition:background .15s,color .15s}
.site-nav a:hover{background:rgba(255,255,255,.13)}
.site-nav a[aria-current=page]{background:rgba(255,255,255,.18);color:#fff}
.site-actions{display:flex;align-items:center;gap:8px;flex:none}
.site-pill{display:inline-flex;align-items:center;border:1px solid var(--mq-shell-border);background:#fff;color:var(--mq-ink);padding:9px 15px;border-radius:999px;font:600 .88rem/1 var(--mq-font);text-decoration:none;cursor:pointer;transition:background .15s,color .15s}
body.ar .site-pill{font-family:var(--mq-font-ar)}
.site-pill:hover{background:var(--mq-forest);color:#fff;border-color:var(--mq-forest)}
.site-pill[hidden]{display:none}
.site-cart{position:relative;width:44px;height:44px;border-radius:50%;background:#fff;border:1px solid var(--mq-shell-border);display:grid;place-items:center;color:var(--mq-ink);text-decoration:none;transition:background .15s,color .15s}
.site-cart:hover{background:var(--mq-forest);color:#fff}
.site-cart b{position:absolute;top:-5px;inset-inline-end:-5px;min-width:20px;height:20px;padding:0 5px;border-radius:10px;background:var(--mq-accent);color:#fff;font:700 .72rem/20px var(--mq-font);text-align:center}
.site-cart b[data-n="0"]{display:none}
.site-cta{background:var(--mq-accent);color:#fff;padding:11px 20px;border-radius:999px;font-weight:700;font-size:.95rem;text-decoration:none;white-space:nowrap;transition:background .15s}
.site-cta:hover{background:var(--mq-accent-2)}
@media(max-width:960px){
  .site-header__inner{flex-wrap:wrap;row-gap:8px}
  .site-brand img{height:38px}
  .site-nav{order:3;flex:1 0 100%;margin:0;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}
  .site-nav::-webkit-scrollbar{display:none}
  .site-actions{margin-inline-start:auto}
  .site-cta{display:none}
}

/* ---------- Footer ---------- */
.site-footer{background:var(--mq-shell-green);color:var(--mq-shell-text);margin-top:clamp(32px,6vw,72px);padding:clamp(28px,4vw,48px) 0 24px}
.site-footer__inner{max-width:1280px;margin:0 auto;padding:0 clamp(16px,3vw,32px);display:grid;grid-template-columns:1.3fr 1fr;gap:20px 32px;align-items:start}
.site-footer__brand img{height:44px;width:auto;display:block;filter:none}
.site-footer__brand p{margin:10px 0 0;color:var(--mq-shell-muted);max-width:34ch}
.site-footer__links{display:flex;flex-wrap:wrap;gap:8px 20px;justify-content:flex-end}
.site-footer__links a{color:var(--mq-shell-text);text-decoration:underline;text-underline-offset:4px;text-decoration-color:#ffffff69}
.site-footer__links a:hover{text-decoration-color:currentColor}
.site-footer__note{grid-column:1/-1;margin:0;padding-top:16px;border-top:1px solid var(--mq-shell-border);color:var(--mq-shell-muted);font-size:.9rem}
.site-footer__copy{grid-column:1/-1;margin:0;color:var(--mq-shell-muted);font-size:.82rem}
@media(max-width:700px){.site-footer__inner{grid-template-columns:1fr}.site-footer__links{justify-content:flex-start}}

/* Event-first ordering, shared Cart/Checkout layout */
.cart-event-note{margin:0 auto 22px;padding:15px 20px;border:1px solid #d4e0c5;background:#e3ebce;border-radius:18px;display:flex;align-items:center;justify-content:space-between;gap:16px;color:#21452e}
.cart-event-note p{margin:4px 0 0}.cart-event-note a{font-weight:700;color:#21452e}
.checkout-event-summary{border:1px solid #d2dfbf;background:#e8f0d8;border-radius:16px;padding:18px 20px;margin-bottom:18px;color:#21452e;line-height:1.8}
.checkout-event-summary p{margin:5px 0}.checkout-event-summary a{color:#21452e;text-decoration:underline;font-weight:700}
.page-checkout .checkout-previous-event{display:none!important}
.site-footer__copy{margin-inline-start:auto;align-self:end}
@media(max-width:650px){.cart-event-note{align-items:flex-start;flex-direction:column}}

/* Shared CTA for reopening event details on Buffet and Canape pages */
.event-edit-banner{max-width:1250px;margin:20px auto 12px;padding:14px 22px;background:#e5edcf;border:1px solid #d3dfc1;border-radius:18px;display:flex;align-items:center;justify-content:space-between;gap:16px;color:#21452e;font:600 14px Cairo,Outfit,sans-serif}
.event-edit-banner a{border-radius:24px;padding:9px 17px;background:#21452e;color:#fff;text-decoration:none;font-weight:700;white-space:nowrap}
@media(max-width:680px){.event-edit-banner{flex-direction:column;text-align:center;margin:12px 14px}}