.breadcrumb {
  font-size: var(--fs--1);
  font-weight: bold;
}

.breadcrumb__list {
  list-style: none;
  white-space: nowrap;
  overflow-x: auto;
  padding-inline: unset;
  padding-block: 0.4em 0.48em;
  display: flex;
}

.breadcrumb__item:nth-child(n+2)::before {
  display: inline-block;
  width: 0.5em;
  aspect-ratio: 1;
  margin-inline: 1em;
  content: "";
  transform: rotate(45deg);
}
[dir=rtl] .breadcrumb__item:nth-child(n+2)::before {
  transform: rotate(-45deg);
}
.breadcrumb__item:nth-child(n+2)::before {
  border-block-start: 2px solid var(--color--gray-45);
  border-inline-end: 2px solid var(--color--gray-45);
}

.breadcrumb__link {
  text-decoration: none;
}
.breadcrumb__link:is(:hover, :focus) {
  text-decoration: underline;
}