/* =============================================================================
   Ordering Redesign — Desktop layout + cookie card (Batch 8)
   -----------------------------------------------------------------------------
   The Claude Design prototype ("Bella Napoli") defines TWO layouts of the SAME
   screens/data: the mobile layout (Batches 1–6) and a desktop layout with a
   top-nav site header, a per-screen title bar (title + hint + view switcher),
   2-col item grids (single) / 3-col text category cards (guided) and a
   persistent right order sidebar «Deine Bestellung». This file adds the desktop
   layer at ≥1024px — below that, everything keeps the shipped mobile layout
   (tablet 820 = mobile layout, matching the prototype's two-device model).
   Also here: the redesign-scoped cookie notice card (all widths) that replaces
   the platform's shared dark banner ON REDESIGN PAGES ONLY.
   RTL via logical properties; tokens from ordering_redesign.css (Batch 1).
   ========================================================================== */

/* ==== Cookie notice card (all widths — Claude Design mobile spec) ========= */
/* Fixed above the mobile bottom-nav; on desktop (no bottom nav) it docks to
   the end-inline corner. Replaces the shared dark strip which had no
   position rules on these pages (= the "appears only after scroll" bug). */
.gz-order .gzo-cookie {
  position: fixed;
  inset-inline: 12px;
  inset-block-end: calc(69px + env(safe-area-inset-bottom, 0px));
  z-index: 45;
  background: var(--gzo-card);
  border: 1px solid var(--gzo-border-3);
  border-radius: 16px;
  padding: 14px;
  box-shadow: 0 12px 30px -10px rgba(34, 31, 27, .25);
  animation: gzo-rise .3s ease;
  max-width: 480px;
  margin-inline: auto;
}
.gz-order .gzo-cookie__title {
  font-family: var(--gzo-font-body);
  font-weight: 700; font-size: 13.5px;
  color: var(--gzo-ink);
  margin: 0 0 3px;
}
.gz-order .gzo-cookie__body {
  font-family: var(--gzo-font-body);
  font-weight: 400; font-size: 12px; line-height: 1.45;
  color: var(--gzo-text-2);
  margin: 0;
}
.gz-order .gzo-cookie__link {
  color: var(--gzo-primary);
  font-weight: 600;
  text-decoration: none;
}
.gz-order .gzo-cookie__link:hover { text-decoration: underline; }
.gz-order .gzo-cookie__cta {
  margin-top: 11px;
  width: 100%;
  background: var(--gzo-ink);
  color: #fff;
  border: none;
  border-radius: 11px;
  padding: 11px;
  font-family: var(--gzo-font-body);
  font-weight: 600; font-size: 14px;
  cursor: pointer;
  min-height: var(--gzo-tap);
}

/* ==== Chrome pieces that exist in the shell but are mobile-hidden ========= */
.gz-order .gzo-topnav { display: none; }
.gz-order .gzo-titlebar { display: none; }
.gz-order .gzo-sidebar { display: none; }

/* Mobile RTL: the WhatsApp FAB mirrors to the start edge (prototype AR).
   Scoped to redesign pages only — the shared component keeps its default
   physical-right position everywhere else. Custom drag positions (inline
   left/top set by whatsapp-button.js) still win over this rule. */
@media (max-width: 1023.98px) {
  html[dir="rtl"] body.gz-order .js-whatsapp-fab:not(.whatsapp-fab--custom-position) {
    right: auto;
    left: 16px;
  }
  /* While the cookie card is up, lift the FAB above it. The shared
     whatsapp-button.js offset assumes a bottom-docked banner (height+16);
     our card floats above the bottom nav (bottom ≈69px + 12px gap), so track
     the REAL measured card height (--ui-cookie-banner-height, published by
     redesign_cookie.js — longer KU/AR copy wraps taller) instead of a magic
     number. !important beats the inline --whatsapp-offset the script sets. */
  body.gz-order.cookie-info-banner-visible .js-whatsapp-fab:not(.whatsapp-fab--custom-position) {
    --whatsapp-offset: calc(var(--ui-cookie-banner-height, 150px) + 81px) !important;
  }
}

/* whatsapp-button.js treats "mobile" as ≤960px — between 961 and 1023px the
   bottom nav is still shown but the script computes offset 0 (it removes the
   inline var there, so this plain rule applies). Keep the FAB above the bar. */
@media (min-width: 960.02px) and (max-width: 1023.98px) {
  body.gz-order .js-whatsapp-fab:not(.whatsapp-fab--custom-position) {
    --whatsapp-offset: 90px;
  }
}

/* =============================================================================
   DESKTOP ≥1024px
   ========================================================================== */
@media (min-width: 1024px) {

  /* ---- framed app window (README §5: Desktop-Rahmen-BG #E5DDD0) ---------- */
  html:has(body.gz-order) { background: var(--gzo-frame, #E5DDD0); }
  body.gz-order { background: #E5DDD0; }
  .gz-order .gzo-app {
    max-width: 1080px;
    margin: 28px auto;
    border-radius: 14px;
    border: 1px solid #E2DACC;
    box-shadow: 0 40px 90px -34px rgba(34, 31, 27, .5);
    min-height: calc(100vh - 56px);
    min-height: calc(100dvh - 56px);
    /* NO overflow:hidden — it would break the sidebar's position:sticky */
  }

  /* ---- (أ) site header with top nav; bottom nav = mobile only ------------ */
  .gz-order .gzo-header {
    background: var(--gzo-card);
    padding: 12px 30px;
    gap: 16px;
    border-start-start-radius: 14px;
    border-start-end-radius: 14px;
  }
  .gz-order .gzo-header__name { font-size: 17px; }
  .gz-order .gzo-header__status { font-size: 12px; }
  /* Batch 9: the in-header back button is mobile chrome (top nav navigates) */
  .gz-order .gzo-header__back { display: none; }
  .gz-order .gzo-topnav {
    display: flex; align-items: center; gap: 3px;
    margin-inline-start: 22px;
  }
  .gz-order .gzo-topnav__item {
    display: flex; align-items: center; gap: 7px;
    height: 38px; padding: 0 14px;
    border: none; border-radius: 10px;
    background: transparent; color: var(--gzo-text);
    font-family: var(--gzo-font-body); font-weight: 700; font-size: 13.5px;
    cursor: pointer; position: relative; white-space: nowrap;
  }
  .gz-order .gzo-topnav__item:hover { background: #F4EEE3; }
  .gz-order .gzo-topnav__item--active { background: #FBEAE3; color: var(--gzo-primary); }
  .gz-order .gzo-topnav__item svg { width: 17px; height: 17px; flex: none; }
  .gz-order .gzo-topnav__badge {
    min-width: 18px; height: 18px; padding: 0 5px;
    border-radius: 9px; background: var(--gzo-primary); color: #fff;
    font-weight: 700; font-size: 10.5px;
    display: flex; align-items: center; justify-content: center;
  }
  .gz-order .gzo-topnav__badge[hidden] { display: none; }
  .gz-order .gzo-bottomnav { display: none; }

  /* ---- (ب) title bar: per-screen title/hint + view switcher -------------- */
  .gz-order .gzo-titlebar {
    display: flex; align-items: flex-end; justify-content: space-between; gap: 22px;
    padding: 22px 30px;
    background: var(--gzo-titlebar);
    border-bottom: 1px solid var(--gzo-border);
  }
  .gz-order .gzo-titlebar[hidden] { display: none; }
  .gz-order .gzo-titlebar__title {
    font-family: var(--gzo-font-display);
    font-weight: 700; font-size: 26px; letter-spacing: -.01em;
    margin: 0; line-height: 1.15;
  }
  .gz-order .gzo-titlebar__hint {
    font-family: var(--gzo-font-body);
    font-weight: 400; font-size: 13.5px; color: var(--gzo-text-2);
    margin: 4px 0 0;
  }
  .gz-order .gzo-titlebar__hint:empty { display: none; }
  /* title-bar view switcher (prototype: width 308, darker track) */
  .gz-order .gzo-titlebar .gzo-viewswitch {
    width: 308px; flex: none;
    background: #E4DBCB; border-color: #D8CEBC;
  }

  /* ---- content row: left column + (د) sticky order sidebar --------------- */
  .gz-order .gzo-main-row {
    display: flex; gap: 28px; align-items: flex-start;
    padding: 26px 30px 36px;
  }
  .gz-order .gzo-approot { flex: 1; min-width: 0; min-height: 40vh; }
  .gz-order .gzo-content { padding-bottom: 0; }

  /* sidebar visible only on the prototype's sidebar screens */
  html[data-order-view="menu"] .gz-order .gzo-sidebar,
  html[data-order-view="items"] .gz-order .gzo-sidebar,
  html[data-order-view="detail"] .gz-order .gzo-sidebar,
  html[data-order-view="checkout"] .gz-order .gzo-sidebar { display: block; }
  .gz-order .gzo-sidebar {
    width: 330px; flex: none;
    position: sticky; top: 18px;
  }
  /* sidebar top alignment with the first left-column container is DYNAMIC —
     measured per view/language by alignSidebar() in redesign_desktop.js
     (owner rule 2026-07-02: always flush with the adjacent containers) */
  .gz-order .gzo-sidebar__card {
    background: var(--gzo-card);
    border: 1px solid var(--gzo-border);
    border-radius: 16px;
    overflow: hidden;
  }
  .gz-order .gzo-sidebar__head {
    padding: 16px 18px;
    border-bottom: 1px solid var(--gzo-border);
    font-family: var(--gzo-font-display);
    font-weight: 700; font-size: 16px;
  }
  .gz-order .gzo-sidebar__lines {
    padding: 14px 18px;
    display: flex; flex-direction: column; gap: 12px;
    max-height: 300px; overflow: auto;
  }
  .gz-order .gzo-sidebar__line { border-bottom: 1px solid #F4EFE5; padding-bottom: 11px; }
  .gz-order .gzo-sidebar__line:last-child { border-bottom: none; padding-bottom: 0; }
  .gz-order .gzo-sidebar__line-top { display: flex; gap: 10px; align-items: flex-start; }
  .gz-order .gzo-sidebar__qty {
    font-family: var(--gzo-font-mono);
    font-weight: 700; font-size: 12.5px; color: var(--gzo-primary);
    flex: none; direction: ltr; unicode-bidi: isolate;
  }
  .gz-order .gzo-sidebar__name {
    font-family: var(--gzo-font-body);
    font-weight: 600; font-size: 13px; line-height: 1.3;
  }
  .gz-order .gzo-sidebar__opts {
    font-family: var(--gzo-font-body);
    font-weight: 400; font-size: 11px; line-height: 1.4;
    color: var(--gzo-muted); margin-top: 1px;
  }
  /* AR: German fallback names/opts (dir=auto→LTR) anchor to the reading edge —
     same rule the item cards got (F6) */
  [dir="rtl"] .gz-order .gzo-sidebar__name,
  .gz-order[dir="rtl"] .gzo-sidebar__name,
  [dir="rtl"] .gz-order .gzo-sidebar__opts,
  .gz-order[dir="rtl"] .gzo-sidebar__opts { text-align: right; }
  .gz-order .gzo-sidebar__linetotal {
    font-family: var(--gzo-font-body);
    font-weight: 700; font-size: 12.5px; white-space: nowrap;
  }
  .gz-order .gzo-sidebar__line-info { flex: 1; min-width: 0; }
  .gz-order .gzo-sidebar__controls {
    display: flex; align-items: center; gap: 7px;
    margin-top: 8px; padding-inline-start: 26px;
  }
  .gz-order .gzo-sidebar__stepper {
    display: flex; align-items: center;
    border: 1.5px solid var(--gzo-border-2); border-radius: 8px; overflow: hidden;
  }
  .gz-order .gzo-sidebar__stepper button {
    width: 26px; height: 28px; border: none; background: var(--gzo-card);
    font-size: 15px; cursor: pointer; color: var(--gzo-ink);
    display: flex; align-items: center; justify-content: center;
  }
  .gz-order .gzo-sidebar__stepper button svg { width: 12px; height: 12px; }
  .gz-order .gzo-sidebar__stepper span {
    min-width: 20px; text-align: center;
    font-family: var(--gzo-font-body); font-weight: 700; font-size: 12px;
  }
  .gz-order .gzo-sidebar__edit {
    height: 28px; padding: 0 10px;
    border: 1.5px solid var(--gzo-border-2); background: var(--gzo-card);
    border-radius: 8px; cursor: pointer;
    font-family: var(--gzo-font-body); font-weight: 600; font-size: 11.5px;
    color: var(--gzo-text);
  }
  .gz-order .gzo-sidebar__spacer { flex: 1; }
  .gz-order .gzo-sidebar__del {
    width: 28px; height: 28px;
    border: 1.5px solid #F2D9D3; background: var(--gzo-card);
    border-radius: 8px; cursor: pointer; color: var(--gzo-error);
    display: flex; align-items: center; justify-content: center;
  }
  .gz-order .gzo-sidebar__del svg { width: 13px; height: 13px; }
  .gz-order .gzo-sidebar__empty {
    padding: 6px 0 2px; text-align: center; color: var(--gzo-muted);
  }
  .gz-order .gzo-sidebar__empty svg { width: 22px; height: 22px; color: #B6AC9D; }
  .gz-order .gzo-sidebar__empty-txt {
    font-family: var(--gzo-font-body); font-weight: 500; font-size: 12.5px; margin-top: 5px;
  }
  .gz-order .gzo-sidebar__totals { padding: 14px 18px; border-top: 1px solid var(--gzo-border); }
  .gz-order .gzo-sidebar__lines + .gzo-sidebar__totals { border-top: 1px solid var(--gzo-border); }
  .gz-order .gzo-sidebar__row { display: flex; justify-content: space-between; gap: 10px; margin-bottom: 8px; }
  .gz-order .gzo-sidebar__row-label { font-family: var(--gzo-font-body); font-weight: 500; font-size: 13px; color: var(--gzo-text); }
  .gz-order .gzo-sidebar__row-val { font-family: var(--gzo-font-body); font-weight: 600; font-size: 13px; white-space: nowrap; }
  .gz-order .gzo-sidebar__row-val.is-good { color: var(--gzo-success); }
  .gz-order .gzo-sidebar__grand {
    display: flex; justify-content: space-between; align-items: baseline;
    margin-top: 6px; padding-top: 10px; border-top: 1px solid var(--gzo-border);
  }
  .gz-order .gzo-sidebar__grand-label { font-family: var(--gzo-font-display); font-weight: 700; font-size: 15px; }
  .gz-order .gzo-sidebar__grand-val { font-family: var(--gzo-font-body); font-weight: 700; font-size: 17px; }
  .gz-order .gzo-sidebar__tax {
    font-family: var(--gzo-font-body); font-weight: 400; font-size: 10.5px; line-height: 1.4;
    color: var(--gzo-muted); margin-top: 5px;
  }
  .gz-order .gzo-sidebar__minwarn {
    display: flex; gap: 7px; align-items: flex-start;
    background: var(--gzo-warning-bg); border: 1px solid #EAD9BE;
    border-radius: 11px; padding: 9px 11px; margin-top: 12px;
    font-family: var(--gzo-font-body); font-weight: 600; font-size: 11px; line-height: 1.4;
    color: var(--gzo-warning);
  }
  .gz-order .gzo-sidebar__minwarn svg { width: 14px; height: 14px; flex: none; margin-top: 1px; }
  .gz-order .gzo-sidebar__cta {
    width: 100%; height: 48px;
    border: none; border-radius: 12px;
    background: var(--gzo-primary); color: #fff;
    font-family: var(--gzo-font-body); font-weight: 700; font-size: 14.5px;
    cursor: pointer; margin-top: 13px;
  }
  .gz-order .gzo-sidebar__cta:hover { background: var(--gzo-primary-dark); }
  .gz-order .gzo-sidebar__cta[disabled] { opacity: .5; cursor: not-allowed; }
  /* Batch 9: § 312g note directly under the order button (checkout view) */
  .gz-order .gzo-sidebar__widerruf {
    font-family: var(--gzo-font-body); font-weight: 400; font-size: 10.5px; line-height: 1.5;
    color: var(--gzo-muted); margin-top: 9px; text-align: start;
  }
  .gz-order .gzo-sidebar__brand {
    font-family: var(--gzo-font-body); font-weight: 400; font-size: 11px;
    color: var(--gzo-muted); text-align: center; margin-top: 12px;
  }

  /* ---- (ج) menu grids ----------------------------------------------------- */
  /* single mode: no search, no chip bar, no in-content switcher on desktop —
     the prototype's desktop single page is title bar + sections directly.
     Batch 9: the intro block is mobile-only too (the title bar replaces it). */
  html[data-order-view="menu"] .gz-order .gzo-single__top,
  html[data-order-view="menu"] .gz-order .gzo-intro,
  html[data-order-view="menu"] .gz-order .gzo-chipbar { display: none; }
  .gz-order .gzo-sections { padding: 0; gap: 28px; }
  .gz-order .gzo-section__title { font-size: 18px; margin: 0 0 13px; }
  .gz-order .gzo-itemlist {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px;
  }
  /* ItemCard spec: desktop = padding 16 + equal-height rows; media stays 92px */
  .gz-order .gzo-item-card { padding: 16px; height: 100%; }

  /* guided root: 3-col text category cards (prototype: no images on desktop) */
  .gz-order .gzo-guided { padding: 0; }
  .gz-order .gzo-guided__head,
  .gz-order .gzo-guided .gzo-viewswitch,
  .gz-order .gzo-guided__eyebrow { display: none; }
  .gz-order .gzo-guided .gzo-mehrweg { margin: 0 0 18px; }
  .gz-order .gzo-catgrid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
  .gz-order .gzo-cat-card {
    display: flex; flex-direction: column; justify-content: space-between; gap: 18px;
    min-height: 98px;
    border: 1px solid #E9E1D3;
    border-radius: 16px;
    padding: 17px 18px;
  }
  .gz-order .gzo-cat-card:hover { border-color: #D8CEBC; }
  .gz-order .gzo-cat-card__media { display: none; }
  .gz-order .gzo-cat-card__foot { padding: 0; }
  .gz-order .gzo-cat-card__name {
    font-family: var(--gzo-font-display); font-weight: 700; font-size: 17px;
  }
  .gz-order .gzo-cat-card__chevron { display: none; }
  .gz-order .gzo-cat-card__deskrow {
    display: flex; align-items: center; justify-content: space-between; gap: 8px;
  }
  .gz-order .gzo-cat-card__count {
    font-family: var(--gzo-font-body); font-weight: 500; font-size: 12px; color: var(--gzo-muted);
  }
  .gz-order .gzo-cat-card__arrow {
    width: 28px; height: 28px; border-radius: 50%;
    background: #FBEAE3; color: var(--gzo-primary);
    display: flex; align-items: center; justify-content: center; flex: none;
  }
  .gz-order .gzo-cat-card__arrow svg { width: 15px; height: 15px; }
  [dir="rtl"] .gz-order .gzo-cat-card__arrow svg,
  .gz-order[dir="rtl"] .gzo-cat-card__arrow svg { transform: scaleX(-1); }
  .gz-order .gzo-cat-card--scheduled { opacity: .55; }
  /* skeleton cat cards lose the image block too */
  .gz-order .gzo-skel-cat__img { aspect-ratio: auto; height: 56px; }

  /* guided items: 2-col grid + prototype header row (no dish count on desktop) */
  .gz-order .gzo-guided-items { padding: 0; }
  .gz-order .gzo-guided-items__title { font-size: 21px; line-height: 32px; }
  .gz-order .gzo-guided-items__count { display: none; }
  /* deterministic back-link height across fonts (Cairo renders taller than
     Hanken at auto line-height) — keeps DE/AR headers the same height.
     display re-shows the breadcrumb here: Batch 10 (M20) hides it on mobile
     (header back button), while the prototype DESKTOP keeps «‹ Kategorien». */
  .gz-order .gzo-guided-items .gzo-backlink { display: inline-flex; line-height: 18px; }
  /* (sidebar offset on this view is measured dynamically — see alignSidebar) */

  /* ---- detail: card + intro row + 2-col option grids ---------------------- */
  .gz-order .gzo-detail {
    background: var(--gzo-card);
    border: 1px solid var(--gzo-border);
    border-radius: 16px;
    padding: 24px;
    max-width: 680px;
  }
  .gz-order .gzo-detail__back { display: none; }
  .gz-order .gzo-detail__intro { display: flex; gap: 18px; align-items: flex-start; }
  .gz-order .gzo-detail__hero {
    width: 140px; height: 140px; flex: none;
    border-radius: 14px;
  }
  .gz-order .gzo-detail__intro-text { flex: 1; min-width: 0; }
  .gz-order .gzo-detail__body { padding: 18px 0 0; }
  .gz-order .gzo-detail__title { font-size: 22px; }
  .gz-order .gzo-optrows { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  .gz-order .gzo-detail__footer {
    position: static;
    border-top: 1px solid var(--gzo-border);
    padding: 16px 0 0; margin-top: 22px;
    box-shadow: none; background: none;
  }

  /* ---- cart page: capped column, static CTA, no sidebar ------------------- */
  /* Owner decision (2026-07-06, PM1): sidebar-less columns are CENTERED —
     overrides the B8 prototype extrapolation («desktop cart column is
     start-aligned»). hist/od/res already center; the cart joins them. */
  .gz-order .gzo-cart { max-width: 680px; margin-inline: auto; padding-block: 0 32px; }
  .gz-order .gzo-cart__head { display: none; }
  .gz-order .gzo-cart__eyebrow { display: none; } /* prototype desktop cart has no eyebrow row */

  /* Batch 9 (D14): desktop line anatomy — no thumbnail; red «N×» prefix; the
     duplicate button moves NEXT TO Bearbeiten (flex order; DOM stays mobile) */
  .gz-order .gzo-cart-line { padding: 15px 16px; border-radius: 14px; }
  .gz-order .gzo-cart-line__media { display: none; }
  .gz-order .gzo-cart-line__qtypfx { display: inline; }
  .gz-order .gzo-cart-line__name { font-size: 14.5px; }
  .gz-order .gzo-cart-line__controls .gzo-cart-line__stepper { order: 0; }
  .gz-order .gzo-cart-line__controls .gzo-cart-line__edit { order: 1; height: 32px; }
  .gz-order .gzo-cart-line__controls .gzo-cart-line__dup { order: 2; }
  .gz-order .gzo-cart-line__controls .gzo-cart-line__spacer { order: 3; }
  .gz-order .gzo-cart-line__controls .gzo-cart-line__del { order: 4; }
  .gz-order .gzo-cart-line__controls .gzo-cart-line__act { width: 32px; height: 32px; border-radius: 9px; }
  .gz-order .gzo-cart-line__stepper .gzo-stepper__btn { width: 32px; height: 32px; }

  /* Batch 9 (D16): in-flow centered «Zur Kasse» CTA without the price */
  .gz-order .gzo-cart-bar {
    position: static; background: none; border: none; box-shadow: none; padding: 0;
  }
  .gz-order .gzo-cart-bar__cta { border-radius: 13px; justify-content: center; box-shadow: none; }
  .gz-order .gzo-cart-bar__cta-label { display: none; }
  .gz-order .gzo-cart-bar__cta-label--desk { display: inline; }
  .gz-order .gzo-cart-bar__cta-total { display: none; }

  /* ---- checkout: card column; totals + CTA live in the sidebar ------------ */
  .gz-order .gzo-co { max-width: 680px; }
  .gz-order .gzo-co__head { display: none; }
  .gz-order .gzo-co__stack {
    background: var(--gzo-card);
    border: 1px solid var(--gzo-border);
    border-radius: 16px;
    padding: 24px;
  }
  html[data-order-view="checkout"] .gz-order .gzo-co__stack > .gzo-co-totals { display: none; }
  /* Batch 9: the inline item summary is the MOBILE Bestellübersicht — on
     desktop the sidebar «Deine Bestellung» is the adjacent summary (§ 312j),
     so hide the in-column block (the age gate + Widerruf stay visible). */
  html[data-order-view="checkout"] .gz-order .gzo-co__stack > .gzo-co-summary { display: none; }
  .gz-order .gzo-co-bar { display: none; }
  /* prototype desktop: compact service segmented, 2-col payment grid.
     B8 hid the seg icons here to match the prototype; owner taste decision
     (2026-07-06) overrides that extrapolation — Lieferung/Abholung keep
     their icons on desktop too (parity with mobile). */
  .gz-order .gzo-co-seg { max-width: 380px; }
  .gz-order .gzo-co-pay { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; max-width: 560px; align-items: stretch; }
  /* Batch 10 (D19): prototype desktop labels the schedule section just «ZEIT»
     (uppercase eyebrow) and its asap/Vorbestellen pills drop the sub-lines
     («Standard» / «Datum & Zeit») — single 13px line, row capped at 520px. */
  .gz-order .gzo-co__eyebrow-mob { display: none; }
  .gz-order .gzo-co__eyebrow-desk { display: inline; }
  .gz-order .gzo-co-when { max-width: 520px; }
  .gz-order .gzo-co-when__t1 { font-size: 13px; }
  .gz-order .gzo-co-when__t2 { display: none; }
  .gz-order .gzo-co-when__fields { max-width: 520px; }

  /* ---- history / order detail / result / system: capped columns ----------- */
  /* Batch 10 (C21): prototype DESKTOP timeline renders the ✓ in every dot —
     pending steps show it faint (currentColor = the dot's muted color). */
  .gz-order .gzo-od-step__dot:not(.is-done) .gzo-od-step__check { display: block; }
  .gz-order .gzo-hist { max-width: 680px; }
  /* Batch 9 (C17): the title bar carries title+hint on desktop — the whole
     in-list head (incl. the small header clear button) is mobile chrome; the
     standalone «Verlauf löschen» below the list takes over. Cards drop the
     divider + «Details ›» link (whole card stays the click target). */
  .gz-order .gzo-hist__head { display: none; }
  .gz-order .gzo-hist__clear--below {
    display: block; align-self: flex-start; width: fit-content;
    min-height: 40px; padding: 0 16px; margin-top: 12px;
    border: 1.5px solid var(--gzo-border-2); border-radius: 11px;
    font-size: 12.5px; color: var(--gzo-text-2);
  }
  .gz-order .gzo-hist-card { padding: 16px 18px; border-radius: 14px; }
  .gz-order .gzo-hist-card:hover { border-color: #D8CEBC; }
  .gz-order .gzo-hist-card__foot { border-top: none; padding-top: 0; margin-top: 8px; }
  .gz-order .gzo-hist-card__more { display: none; }
  .gz-order .gzo-hist-card__total { font-weight: 700; font-size: 15px; }

  .gz-order .gzo-od { max-width: 620px; }
  /* Batch 9 (C20): ETA banner above the timeline card on desktop; the in-card
     pill is the mobile placement */
  .gz-order .gzo-od-eta-desk { display: block; }
  .gz-order .gzo-od-eta { display: none; }
  .gz-order .gzo-od-track { padding: 20px; }
  .gz-order .gzo-res--pass { max-width: 480px; margin-inline: auto; }
  .gz-order .gzo-res--pay, .gz-order .gzo-res--confirm { max-width: 560px; margin-inline: auto; }
  .gz-order .gzo-sys__card { max-width: 560px; margin-inline: auto; }

  /* ---- toasts: top-center on desktop (prototype) --------------------------- */
  body.gz-order .gzo-toasts { bottom: auto; top: 52px; }

  /* ---- WhatsApp FAB: the prototype desktop has no FAB ---------------------- */
  body.gz-order .js-whatsapp-fab { display: none !important; }

  /* ---- cookie card docks end-inline (extrapolated, same tokens) ------------ */
  .gz-order .gzo-cookie {
    inset-inline: auto 24px;
    inset-block-end: 24px;
    width: 360px;
    margin-inline: 0;
  }
}