@import "common/var";
@import "mixins/mixins";
@import "mixins/utils";


@mixin font-base{
  color: $--breadcrumb-color;
  font-size: $--font-size-base;
}

@include b(breadcrumb) {
  @include font-base;
  overflow: hidden;
  @include e(item){
    @include font-base;
    float: left;
    a{
      @include font-base;
    }
    .xb-breadcrumb__icon{
      margin-right: 8px;
      font-size: $--font-size-base + 4px;
    }
    .xb-breadcrumb__separator{
      margin: 0 8px;
    }
    @include e(inner) {
      line-height: 28px;
      &.is-link, & a {
        transition: $--color-transition-base;

        &:hover {
          cursor: pointer;
        }
      }
    }
    &:last-child{
      color: $--breadcrumb-light-color;
      .xb-breadcrumb__separator{
        display: none;
      }
    }
  }
}