root {
--bs-tertiary-color: rgba(45, 58, 71, 0.5);
}


.breadcrumb {
  --bs-breadcrumb-padding-x: 0;
  --bs-breadcrumb-padding-y: 0;
  --bs-breadcrumb-margin-bottom: 1rem;
  --bs-breadcrumb-bg: ;
  --bs-breadcrumb-border-radius: ;
  --bs-breadcrumb-divider-color: var(--bs-secondary-color);
  --bs-breadcrumb-item-padding-x: 0.5rem;
  --bs-breadcrumb-item-active-color: var(--bs-secondary-color);
  display: flex;
  flex-wrap: wrap;
  padding: var(--bs-breadcrumb-padding-y) var(--bs-breadcrumb-padding-x);
  margin-bottom: var(--bs-breadcrumb-margin-bottom);
  font-size: var(--bs-breadcrumb-font-size);
  list-style: none;
  background-color: var(--bs-breadcrumb-bg);
  border-radius: var(--bs-breadcrumb-border-radius);
}

.breadcrumb-item + .breadcrumb-item {
  padding-left: var(--bs-breadcrumb-item-padding-x);
}
.breadcrumb-item + .breadcrumb-item::before {
  float: left;
  padding-right: var(--bs-breadcrumb-item-padding-x);
  color: var(--bs-breadcrumb-divider-color);
  content: var(--bs-breadcrumb-divider, "/") /* rtl: var(--bs-breadcrumb-divider, "/") */;
}
.breadcrumb-item.active {
  color: var(--bs-breadcrumb-item-active-color);
}


.block-system-breadcrumb-block {
  background: #ebf8ff;
}


.breadcrumb-wrap {
  padding: 0.5rem 1rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

/* Breadcrumb en una línea; recorte cuando colapsado */
.breadcrumb {
  font-size: clamp(0.875rem, 0.4vw + 0.8rem, 1rem);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex: 1 1 auto;
  margin-bottom: 0;
}

/* Separador */
.breadcrumb .breadcrumb-item + .breadcrumb-item::before {
  content: "/";
  margin: 0;
  color: var(--bs-secondary-color);
}

/* Links y actual */
.breadcrumb a {
  text-decoration: underline;
  text-underline-offset: 2px;
}

.breadcrumb [aria-current=page] {
  color: #2D3A47;
}

/* Botones de control (ocultos por defecto; se muestran vía JS) */
.breadcrumb-start, .breadcrumb-end {
  color: #065094;
  border: 0;
  line-height: 1;
}

.breadcrumb-start:focus-visible, .breadcrumb-end:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 2px;
  border-radius: 0.25rem;
}

/* Estados */
.breadcrumb.is-collapsed .breadcrumb-item {
  display: none;
}

.breadcrumb.is-collapsed .breadcrumb-item:nth-last-child(2),
.breadcrumb.is-collapsed .breadcrumb-item:last-child {
  display: inline-flex;
}

/* Ocultar scrollbars pero permitir scroll */
.breadcrumb.is-expanded {
  overflow-x: auto;
  text-overflow: clip;
  -webkit-overflow-scrolling: touch;
  /* Chrome, Safari, Edge */
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none; /* IE y Edge antiguo */
}

.breadcrumb.is-expanded::-webkit-scrollbar {
  display: none; /* Chrome/Safari/WebKit */
}

/* Mostrar/ocultar controles según overflow/posición */
.breadcrumb-wrap.has-overflow .breadcrumb-start[hidden],
.breadcrumb-wrap.has-overflow .breadcrumb-end[hidden] {
  display: none;
}

.breadcrumb-wrap.has-overflow .breadcrumb-start:not([hidden]),
.breadcrumb-wrap.has-overflow .breadcrumb-end:not([hidden]) {
  display: inline-flex;
}

.breadcrumb-start[aria-disabled=true],
.breadcrumb-end[aria-disabled=true] {
  opacity: 0.4;
  pointer-events: none;
}