/* ─── Sabbiadoro "Nero e Oro" 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 bar, same logo scale,
   same letterspaced links, same serif voice. Keep the selectors in sync with
   the shared BrandNavbar / shop menu markup. */

/* No SR/EN utility strip - same client ruling as on the marketing site. */
div:has(+ nav[data-scroll-offset]) {
  display: none;
}

/* Bar + lockup at the exact client-site sizes (64px bar, 104px logo). */
nav[data-scroll-offset] .h-14 {
  height: 64px;
}
nav[data-scroll-offset] a[aria-label='Sabbiadoro'] {
  width: 72px;
}
@media (min-width: 1024px) {
  nav[data-scroll-offset] a[aria-label='Sabbiadoro'] {
    width: 104px;
  }
}

/* Letterspaced caps links + the gold active underline. */
nav[data-scroll-offset] a.body-sm {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.14em;
}
nav[data-scroll-offset] a.body-sm.text-foreground {
  color: var(--primary);
  text-decoration: underline;
  text-decoration-color: var(--primary);
  text-decoration-thickness: 2px;
  text-underline-offset: 8px;
}

/* The sign-in pill speaks the gold CTA language of the client navbar. */
nav[data-scroll-offset] button.body-xs.rounded-full {
  border-color: color-mix(in srgb, var(--primary) 45%, transparent);
  color: var(--primary);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
nav[data-scroll-offset] button.body-xs.rounded-full:hover {
  background: color-mix(in srgb, var(--primary) 12%, transparent);
  color: var(--primary);
}

/* Category titles in the client's serif voice instead of giant sans caps. */
h4.heading-h4 {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(24px, 2.6vw, 34px);
  letter-spacing: 0.02em;
}

/* Product cards: gold hairline, and the white catalog shots warmed + ringed
   so they sit on the dark card like plates, not stickers. */
button.rounded-2xl.bg-card {
  border-color: rgba(201, 161, 92, 0.16);
}
button.rounded-2xl.bg-card:hover {
  border-color: rgba(201, 161, 92, 0.45);
}
button.rounded-2xl.bg-card .rounded-xl {
  box-shadow: inset 0 0 0 1px rgba(201, 161, 92, 0.22);
}
button.rounded-2xl.bg-card .rounded-xl img {
  filter: brightness(0.94) saturate(1.04) sepia(0.06);
}