/* GW Breadcrumbs — sections/gw-breadcrumbs.liquid
   Figma 30:7460 (desktop) / 30:10852 (mobile), page frames 30:10668 / 30:10023.

   A BARE TEXT RUN. Figma draws no bar, no background, no border, no icon and
   no container node — four spans in one paragraph. Everything below is
   therefore type, colour and the page gutter; there is no box to style.

   GUTTERS AND RHYTHM come from the page frames, not from this node:
     desktop  p-64 all sides, content 1312 wide (1440 - 64 - 64)
     mobile   pt-16 px-16, content 361 wide (393 - 16 - 16)
   The crumb's own offsets inside that: desktop y 22.148 with the gallery
   starting at y 64 (ends 40.148, so 23.85 clear); mobile y 16 with the gallery
   at y 66 (ends 34, so 32 clear). Rounded to 22/24 and 16/32 below.

   1025px is the theme's desktop breakpoint — the boundary used by
   assets/template-product.min.css and every other section-gw-*.min.css.

   The colour carries the Figma literal as its var() fallback, so a blank
   colour setting keeps the design rather than voiding the property. */

.gw-breadcrumbs {
  padding: 16px 16px 32px;
}

.gw-breadcrumbs__trail {
  margin: 0;
  padding: 0;
  max-width: 1312px;
  font-family: var(--header-font-stack, "EB Garamond", serif);
  font-size: 14px;
  font-weight: 400;
  /* Figma emits leading-[normal] on every span; the type token's
     lineHeight: 100 is not reproducible as 1.0 (a 14px span occupies an 18px
     node = 1.286, which is EB Garamond's own normal). Left as normal. */
  line-height: normal;
  letter-spacing: 0;
  text-transform: none;
  color: var(--gw-bc-text-color, #111111);
  word-break: break-word;
}

/* Ancestor crumbs are underlined in the design; the current page is not.
   text-underline-position: from-font matches the frame's
   text-decoration-style: solid / text-underline-position: from-font. */
.gw-breadcrumbs__link {
  color: inherit;
  text-decoration: underline;
  text-decoration-style: solid;
  text-decoration-color: currentColor;
  text-underline-position: from-font;
}

.gw-breadcrumbs__link:hover,
.gw-breadcrumbs__link:focus-visible {
  text-decoration: underline;
  opacity: 0.7;
}

/* The separator is a literal " / " in the design — space, slash, space — and
   is written that way in the markup, so no generated content is used here. */
.gw-breadcrumbs__sep,
.gw-breadcrumbs__current {
  text-decoration: none;
}

@media (min-width: 1025px) {
  .gw-breadcrumbs {
    padding: 22px 64px 24px;
  }

  /* Desktop hugs at 392 wide with no whitespace-nowrap, so it is allowed to
     wrap if constrained; mobile carries whitespace-nowrap at 204 wide. */
  .gw-breadcrumbs__trail {
    margin-inline: auto;
  }
}

@media (max-width: 1024px) {
  .gw-breadcrumbs__trail {
    white-space: nowrap;
  }
}
