.breadcrumb {
  padding-top: $spacing-sm;
  padding-bottom: $spacing-sm;
  background-color: $color-white;

  &__nav {
    @include grid-container;

    &-list {
      display: flex;
      flex-wrap: wrap;
      gap: $spacing-base;
    }
  }

  &__item {
    display: flex;
    font-size: 14px;
    color: $color-black80;
    gap: $spacing-base;

    &-link {
      @include link-decoration;
      @include btn-focus-visible(4px);
    }

    &-separator {
      color: $color-accent;
      font-weight: 800;
    }

    &--current {
      color: $color-black;
      font-weight: 500;
    }
  }
}