/*
 * Component: Breadcrumbs (unico)
 *
 * Requisiti:
 * - sotto header, consistente
 * - scroll orizzontale su mobile se lungo (no JS)
 * - minimale, accessibile, no CLS
 */

.bpc-breadcrumb-shell{
  background: var(--bspc-bg-white, #fff);
  /* Bordi minimali: linea sottilissima quasi impercettibile */
  /* Bordo quasi impercettibile per separare il breadcrumb dal contenuto */
  border-bottom: 0.5px solid rgba(0,0,0,0.05);
}

.bpc-breadcrumb{
  max-width: var(--content-width, 1200px);
  margin: 0 auto;
  /* Riduce l'altezza e il padding del breadcrumb del 50% circa */
  padding: .3rem .6rem;
  min-height: 20px;
  display: flex;
  align-items: center;

  /* Font più compatto per occupare meno spazio */
  font-size: .75rem;
  line-height: 1.35;
  color: var(--bspc-text-secondary, #333);

  /* Necessario per posizionare la dissolvenza (::after) sul lato destro */
  position: relative;

  overflow-x: auto;
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none; /* IE/Edge legacy */
}

/* Indicatore di scroll: crea una dissolvenza a destra quando il breadcrumb è più lungo dello schermo. */
.bpc-breadcrumb::after{
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  width: 40px;
  pointer-events: none;
  /* Gradiente delicato: usa un bianco molto chiaro (#fafafa) che sfuma in trasparente.
     Questo rende più evidente la possibilità di scorrimento senza introdurre linee visibili. */
  background: linear-gradient(to left, rgba(0,0,0,0.05), rgba(0,0,0,0));
}

.bpc-breadcrumb::-webkit-scrollbar{ display:none; }

.bpc-breadcrumb-list{
  list-style: none;
  margin: 0;
  padding: 0;

  display: inline-flex;
  align-items: center;
  gap: 0;
}

.bpc-breadcrumb-item{
  display: inline-flex;
  align-items: center;
}

.bpc-breadcrumb-item + .bpc-breadcrumb-item::before{
  content: "›";
  opacity: .55;
  /* Riduce lo spazio tra gli elementi del breadcrumb */
  margin: 0 .35rem;
}

.bpc-breadcrumb a{
  color: inherit;
  text-decoration: none;
}

.bpc-breadcrumb a:hover,
.bpc-breadcrumb a:focus-visible{
  color: var(--bspc-blue-primary, #0071e3);
  text-decoration: underline;
}

.bpc-breadcrumb [aria-current="page"]{
  color: var(--bspc-text-primary, #1d1d1f);
  font-weight: 600;
}