main div.breadcrumbs-wrapper .spectrum-Breadcrumbs {
  display: flex;
  justify-content: flex-start;
  list-style-type: none;
  flex-wrap: wrap;
  flex-grow: 1;
  flex-shrink: 0;
  flex-basis: 0%;
  gap: 8px;

  margin: 0;
  padding: 0;
}

main div.breadcrumbs-wrapper .spectrum-Breadcrumbs-itemSeparator {
  position: relative;

  /* Fix alignment, it's not quite centered */
  inset-block-start: 1px;
}

main div.breadcrumbs-wrapper .spectrum-Breadcrumbs-item {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;

  box-sizing: border-box;
  block-size: 32px;

  position: relative;
  white-space: nowrap;

  &:last-of-type {
    font-weight: 700;

    .spectrum-Breadcrumbs-itemSeparator {
      display: none;
    }
  }
}

main div.breadcrumbs-wrapper .spectrum-Breadcrumbs-itemLink {
  color: inherit;
  cursor: default;
  position: relative;

  display: inline-flex;
  align-items: center;
  justify-content: flex-start;

  padding-block: 0;
  padding-inline: 8px;
  block-size: 32px;

  margin-inline-end: 1px;

  border-radius: 4px;

  outline: none;

  text-decoration: none;

  white-space: normal;
  overflow-wrap: break-word;
  word-break: break-word;

  &[href] {
    cursor: pointer;

    &:hover,
    &:focus-visible {
      text-decoration: underline;
    }
  }
}

main div.breadcrumbs-wrapper .spectrum-Breadcrumbs-itemLink:focus-visible:before {
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;

  box-sizing: border-box;
  display: block;
  inline-size: 100%;
  block-size: 100%;

  border-width: 2px;
  border-style: solid;
  border-radius: 4px;

  content: "";
  pointer-events: none;
}

main div.breadcrumbs-wrapper .spectrum-UIIcon-ChevronRight75 {
  height: 10px;
  width: 10px;
}