/**
 * Sitewide mobile breadcrumb truncate-middle.
 * Collapsed: Home / … / current. Tap … to expand.
 */
.mala-crumb__item,
.mala-crumb__sep {
  display: inline-flex;
  align-items: center;
  min-width: 0;
}

.mala-crumb__ellipsis,
.mala-crumb__sep--ellipsis {
  display: none;
}

.mala-crumb__ellipsis {
  appearance: none;
  border: 0;
  background: transparent;
  color: #9a94a0;
  font: 500 11px/1.35 Manrope, system-ui, sans-serif;
  border-radius: 0;
  padding: 0 1px;
  margin: 0;
  cursor: pointer;
  letter-spacing: 0.02em;
  min-height: 0;
}

.mala-crumb__ellipsis:hover,
.mala-crumb__ellipsis:focus-visible {
  color: #b80f26;
  outline: 0;
}

/* Ensure truncate navs are flex even on legacy templates */
nav.mala-crumb--trunc {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px;
  max-width: 100%;
}

@media (max-width: 760px) {
  nav.mala-crumb--trunc:not(.is-expanded) {
    flex-wrap: nowrap;
    overflow: hidden;
  }

  nav.mala-crumb--trunc:not(.is-expanded) .mala-crumb__item--mid,
  nav.mala-crumb--trunc:not(.is-expanded) .mala-crumb__sep--mid {
    display: none;
  }

  nav.mala-crumb--trunc:not(.is-expanded) .mala-crumb__ellipsis,
  nav.mala-crumb--trunc:not(.is-expanded) .mala-crumb__sep--ellipsis {
    display: inline-flex;
  }

  nav.mala-crumb--trunc.is-expanded {
    flex-wrap: wrap;
  }

  nav.mala-crumb--trunc.is-expanded .mala-crumb__ellipsis,
  nav.mala-crumb--trunc.is-expanded .mala-crumb__sep--ellipsis {
    display: none;
  }

  nav.mala-crumb--trunc .mala-crumb__item--current > span {
    display: block;
    max-width: min(52vw, 220px);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}