/* =========================================================
   Breadcrumb — sorgente unica per la trail di navigazione.
   Caricato sempre perché ora la breadcrumb compare su ogni
   contesto (page templates, ricerche, shop, account, auth).
   Le regole erano in components/shop-head.css ma quel modulo
   è gated a manzo_uses_shop_head: spostate qui in un modulo
   no-condition per garantire copertura globale.
   ========================================================= */

/* Page bar — striscia compatta in cima alle page-*.php prive di shop-head.
   Ospita solo la breadcrumb e mantiene il rhythm verticale tra header e hero.
   Niente border-bottom: la breadcrumb mono uppercase è già una linea visiva,
   l'hairline raddoppiava il segnale segmentando la pagina. Se una specifica
   hero ha bisogno di un appiglio, aggiunga lei un border-top. */
.mz-page-bar {
  padding: var(--s-5) 0 var(--s-4);
}
.mz-page-bar .mz-breadcrumb { margin: 0; }

/* Breadcrumb base */
.mz-breadcrumb {
  font: 500 var(--t-xs)/1.4 var(--ff-mono);
  letter-spacing: var(--tr-label);
  text-transform: uppercase;
  color: var(--ink-3);
  /* WC concatena <a>/<span>/<a> senza whitespace: forziamo break opportunities
     così su mobile la trail non sfora il container. */
  overflow-wrap: anywhere;
  word-break: break-word;
}
.mz-breadcrumb a { color: var(--ink-3); border-bottom: 0; }
.mz-breadcrumb a:hover { color: var(--ink-1); }
.mz-breadcrumb__sep { padding: 0 var(--s-2); color: var(--ink-4); }

/* =========================================================
   Breadcrumb-as-header — la breadcrumb È l'header di pagina.
   Estratto da .mz-account__head (area clienti): il crumb
   corrente (aria-current) fa da titolo (ink-1, grassetto),
   una regola hairline lo stacca dal contenuto, una lede
   opzionale descrive la sezione. L'H1 grande resta solo in
   .screen-reader-text. Riusato su carrello, checkout,
   thankyou, archivio bare e — via .mz-account__head — area
   clienti. Modulo no-condition: caricato ovunque serva.
   ========================================================= */
.mz-bc-head {
  display: flex;
  flex-direction: column;
  gap: var(--s-4);
}
/* La regola vive sulla riga breadcrumb-titolo, non sull'header: il separatore
   sta SEMPRE subito sotto la breadcrumb, ci sia o meno la lede. La lede, quando
   presente, scende sotto la regola alla stessa distanza (--s-4) che separa
   breadcrumb e regola: ritmo simmetrico. */
.mz-bc-head__bar {
  padding-bottom: var(--s-4);
  border-bottom: 1px solid var(--ink-1);
}
.mz-bc-head__bar .mz-breadcrumb { margin: 0; }
/* Il crumb corrente è il titolo della pagina: ink-1 grassetto. Gli antenati
   restano ink-3 come back-nav. Scoped al bar per non toccare le breadcrumb
   quiete del resto del sito (page-bar, single product, ricerche). */
.mz-bc-head__bar .mz-breadcrumb [aria-current="page"] {
  color: var(--ink-1);
  font-weight: 600;
}
.mz-bc-head__lede {
  margin: 0;
  font-size: var(--t-md);
  color: var(--ink-2);
  max-width: 60ch;
}
/* Stacco uniforme breadcrumb-as-header → contenuto. L'header (.mz-shop-head--bc)
   chiude su una regola, quindi alla sezione che segue basta un top --s-4: stesso
   gap su shop, carrello e checkout (le sezioni hanno top --s-7 di default).
   Selettore adiacente (0,2,0) per battere il padding shorthand delle sezioni.
   No-condition: caricato ovunque, ogni selettore matcha solo la sua pagina. */
.mz-shop-head--bc + .mz-shop,
.mz-shop-head--bc + .mz-cart,
.mz-shop-head--bc + .mz-checkout {
  padding-top: var(--s-4);
}