@charset "UTF-8";
@import "mixins/mixins";
@import "common/var";

@include b(anchor) {
  position: relative;
  overflow: auto;

  &-wrapper {
    position: relative;
    line-height: 20px;
    font-size: $--font-size-body-1;
    color: $--color-info-semi;
  }

  &-link {
    padding: 2px 8px 2px 16px;
    border-left: $--border-1 solid $--color-border-1;
    // transition: border .2s cubic-bezier(.24,.41,.51,.9);
    a {
      color: $--color-info-semi;
      font-weight: $--font-weight-400;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
      display:block;
      width:calc(100% - 24px)
    }
    &-active {
      border-left: $--border-1 solid $--primary-6;
      a {
        color: $--color-text-regular;
        font-family: PingFangSC-Medium, PingFang SC;
        font-weight: $--font-weight-500;
      }
    }
  }

  &-lineless {
    .el-anchor-link {
      border-left: none;
      &-active {
        border-left: none;
      }
    }
  }

  @include m(large) {
    width: 320px;
  }
  @include m(medium) {
    width: 200px;
  }
  @include m(small) {
    width: 120px;
  }
}