/* ─── Bata Pežo "Domaća kuhinja" shop-chrome overrides ──────────────────────
   Loaded by the marketplace shop via the tenant config's chromeCssUrls, ON
   TOP of the injected CSS-var theme map. Everything here exists to make the
   client-site → shop crossing pixel-invisible: same solid cream bar, same
   compact logo, same Oswald heading voice at sushi-fresh's compact sizes.
   Keep the selectors AND values in sync with the site's unlayered chrome
   overrides in src/design/index.css. */

/* Solid bar surface, exactly like the site (`surface="solid"`): no frosted
   tint, no hairline - the cream page runs straight into the bar. */
nav[data-scroll-offset] {
  background: var(--background);
  border-bottom-color: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

/* No SR/EN utility strip (owner ruling), and no language row in the mobile
   dropdown - same as the client site. */
div:has(+ nav[data-scroll-offset]) {
  display: none;
}
nav[data-scroll-offset] ~ div .border-t.pt-3.mt-2 {
  display: none;
}

/* Chef-lion lockup sizing; desktop bar matches sushi's md:h-16 (64px). */
nav[data-scroll-offset] .h-14 {
  height: 64px;
}
nav[data-scroll-offset] a[aria-label='Bata Pežo'] {
  width: 74px;
}
@media (min-width: 1024px) {
  nav[data-scroll-offset] a[aria-label='Bata Pežo'] {
    width: 100px;
  }
}
footer img[alt='Bata Pežo'] {
  height: 46px;
  width: auto;
}

/* Category titles in the site's condensed-caps display voice, at
   sushi-fresh's compact menu-heading size (16-18px there; caps read a touch
   smaller, so 17-19px here). */
h4.heading-h4 {
  font-family: var(--font-display);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  font-size: clamp(17px, 1.3vw, 19px);
  line-height: 1.3;
}

/* CTA silhouette: the site's soft rounded rectangle (radius 0.5rem). */
.cta-shape {
  border-radius: 0.5rem;
}

/* Nav link + account-pill type pinned to the SITE's compact scale (the shop's
   own body-sm/body-xs grow to 16/14px on wide screens; the site caps at
   14/13px) - the header must read identically across the domain hop. */
@media (min-width: 1024px) {
  nav[data-scroll-offset] .body-sm { font-size: 13px; }
  nav[data-scroll-offset] .body-xs { font-size: 12px; }
}
@media (min-width: 1280px) {
  nav[data-scroll-offset] .body-sm { font-size: 14px; }
  nav[data-scroll-offset] .body-xs { font-size: 13px; }
}