.breadcrumb {
  padding-block: var(--dcc-breadcrumb-padding);
  font-size: var(--dcc-font-size-100);
}

.breadcrumb > .visually-hidden {
  padding: 0;
}

.theme--dcc_reference .breadcrumb::after {
  border-bottom: var(--dcc-breadcrumb-border-bottom);
  content: "";
  display: block;
  height: 0;
  margin-inline: auto;
  position: relative;
  top: var(--dcc-breadcrumb-padding);
  /* width: var(--dcc-content-width-500); */
}

.theme--dcc_reference .breadcrumb ol {
  margin-bottom: 0;
  padding-block: 0;
  /* Override parent theme which is somehow more specific. */
  list-style: none;
}

.breadcrumb a {
  color: var(--dcc-breadcrumb-link-color);
  text-underline-offset: 7px;
  text-decoration: underline;

  &:hover {
    text-decoration-thickness: 2px;
  }
}

.breadcrumb li {
  display: inline-block;
}

.breadcrumb li:not(:last-of-type)::after {
  display: inline-block;
  width: 10px;
  height: 13px;
  margin: .25em;
  content: "";
  vertical-align: middle;
  background: var(--dcc-breadcrumb-divider-color);
  mask: url(../../../assets/icons/svg/greater-than-grey--darkest.svg) no-repeat center center;
}