/* Visible breadcrumb — shared across the nested public pages
   (potentiel CEL, per-GRD tariffs, per-commune profiles, aide/*).

   The markup is generated server-side by
   src/i18n/html-processor.js#buildBreadcrumbNav from the same items that
   feed the BreadcrumbList JSON-LD, so the two can't drift — Google wants
   marked-up breadcrumbs to match what the reader actually sees.

   Colours are derived from `currentColor` on purpose: the component sits
   on the light GRD/commune heroes (dark text on #fafaf9) and on the dark
   potentiel-CEL hero (white text on green) without either page needing a
   variant. Only the opacity changes between the trail and the current
   page. */

.wm-breadcrumb {
  font-size: 0.82rem;
  line-height: 1.4;
  color: inherit;
}

.wm-breadcrumb ol {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 0.5rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.wm-breadcrumb li {
  display: flex;
  align-items: center;
  gap: 0.35rem 0.5rem;
  margin: 0;
}

/* Separator sits on the item rather than between elements so a wrapped
   line never starts with a dangling chevron. aria-hidden equivalent:
   generated content is not exposed to assistive tech. */
.wm-breadcrumb li + li::before {
  content: '›';
  opacity: 0.45;
}

.wm-breadcrumb a {
  color: currentColor;
  opacity: 0.7;
  text-decoration: none;
  border-bottom: 1px solid transparent;
}

.wm-breadcrumb a:hover,
.wm-breadcrumb a:focus-visible {
  opacity: 1;
  border-bottom-color: currentColor;
}

/* Current page: same colour, full opacity, not a link. */
.wm-breadcrumb [aria-current='page'] {
  opacity: 1;
  font-weight: 600;
}