@import '../index.less';
@btri-anchor: ~'@{ant-prefix}-btri-anchor';

.generate-levels(@count) when (@count > 0) {
  .btri-anchor-level-@{count} {
    .@{ant-prefix}-anchor-link {
      padding-left: calc(
        var(--anchor-link-left) * @count - var(--anchor-link-left) / 2
      );
    }
  }
  .generate-levels(@count - 1);
}

.@{btri-anchor} {
  .@{ant-prefix}-anchor {
    &-ink {
      &::before {
        width: 1px;
      }
      &-ball {
        width: 1px;
        height: 20px;
        background-color: var(--primary-6);
        transform: translateY(-25%);
        border: 0;
        left: 0;
      }
    }
    &-link {
      line-height: 1.67;
      padding-top: 0;
      padding-bottom: 0;
      margin-bottom: 8px;
      .@{ant-prefix}-anchor-link {
        padding-bottom: 0;
        padding-top: 0;
      }
    }
    &-link-title {
      font-size: var(--font-size-sm);
      margin-bottom: 8px;
    }
  }
  &-hide-line {
    .@{ant-prefix}-anchor {
      .generate-levels(10);
      &-ink {
        display: none;
      }
      .btri-anchor-level {
        .@{ant-prefix}-anchor-link {
          padding-top: 4px;
          padding-bottom: 4px;
          padding-right: 8px;
          margin-bottom: 0;
        }
      }

      &-link-active {
        background-color: var(--gray-blue-2);
        border-radius: var(--border-radius-sm);
        transition: all 0.5s;
      }
    }
  }
}