//
// Breadcrumbs
// --------------------------------------------------

.breadcrumb {
  padding: $breadcrumb-padding-vertical $breadcrumb-padding-horizontal;
  margin-bottom: $line-height-computed;
  list-style: none;
  background-color: $breadcrumb-bg;
  border-radius: $border-radius-base;
  font-size: $font-size-base;
  font-weight: $font-weight-medium;
  line-height: $breadcrumb-line-height;

  > li {
    display: inline-block;

    + li:before {
      content: "#{$breadcrumb-separator}";
      font-family: $font-family-awesome;
      font-weight: $font-family-awesome-weight;
      font-size: $font-size-extra-small;
      vertical-align: top;
      padding: 0 7px;

      @include themes(color, color-new-body-light);
    }

    &.no-chevron {
      + li {
        padding-left: $grid-unit-x;

        &:before {
          content: none;
        }
      }
    }

    &.active {
      @include themes(color, color-new-heading);

      .label {
        border-color: $brand-primary;
      }
    }

    > a,
    a.breadcrumb-link {
      @include themes(color, color-new-body-light);

      &:hover,
      &:focus {
        color: $breadcrumb-color-hover;
        text-decoration: none;
      }
    }
  }
}