@mixin breadcrumb---alter() {
}

@mixin breadcrumb() {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  line-height: $breadcrumb-line-height;
  padding: $breadcrumb-padding-y $breadcrumb-padding-x;
  margin-bottom: $breadcrumb-margin-bottom;
  background-color: $breadcrumb-bg;
  border-radius: $breadcrumb-border-radius;
  @include breadcrumb---alter;
}

@mixin breadcrumb__item---alter() {
}

@mixin breadcrumb__item() {
  display: flex;
  align-items: center;
  &,
  a {
    color: $breadcrumb-item-color;
  }
  a:hover,
  a:focus {
    color: $breadcrumb-item-hover-color;
  }
  & + & {
    &::before {
      display: block;
      padding-right: $breadcrumb-item-padding;
      padding-left: $breadcrumb-item-padding;
      color: $breadcrumb-divider-color;
      content: "#{$breadcrumb-divider}";
    }
  }
  @include breadcrumb__item---alter;
}

@mixin breadcrumb__item--active---alter() {
}

@mixin breadcrumb__item--active() {
  &,
  a,
  a:hover,
  a:focus {
    color: $breadcrumb-item-active-color;
  }
  @include breadcrumb__item--active---alter();
}