@import '~antd/es/steps/style/index.less';
@import '../variable.less';

@steps-prefix-cls: ~'@{ant-prefix}-steps';

.@{steps-prefix-cls} {
  line-height: inherit;
}

.@{steps-prefix-cls}-item {
  &-finish &-icon {
    border-color: transparent !important;
    background-color: @primary-color-tag-border;
  }

  &-error &-icon {
    border-color: transparent !important;
    background-color: @error-color-tag-bg;
  }

  &-icon {
    border-width: @steps-icon-border-width;
    border-radius: 0;

    > .@{steps-prefix-cls}-icon {
      display: flex;
      align-items: center;
      justify-content: center;
      height: @steps-icon-size;
      width: @steps-icon-size - @steps-icon-border-width -
        @steps-icon-border-width;
    }
  }

  &-title {
    padding: @steps-title-padding;
    font-size: @font-size-lg;
    line-height: @line-height-lg;

    &::after {
      top: @steps-icon-size / 2;
    }
  }

  &-description {
    color: @text-color-tertiary !important;
  }
}

.@{steps-prefix-cls}-horizontal:not(.@{steps-prefix-cls}-label-vertical) {
  .@{steps-prefix-cls}-item-description {
    max-width: none;
  }
}

.@{steps-prefix-cls}-vertical {
  .@{steps-prefix-cls}-item {
    padding: @steps-vertical-item-padding;

    &-content {
      min-height: @steps-vertical-content-min-height;
    }

    &-title {
      line-height: @line-height-lg;
    }

    &-description {
      padding: @steps-vertical-description-padding;
    }

    .@{steps-prefix-cls}-item-container > .@{steps-prefix-cls}-item-tail {
      left: @steps-icon-size / 2;
    }
  }
}

.@{steps-prefix-cls}-item-finish
  > .@{steps-prefix-cls}-item-container
  > .@{steps-prefix-cls}-item-content
  > .@{steps-prefix-cls}-item-title {
  color: @text-color-title;
  font-weight: @font-weight-medium;
}

.@{steps-prefix-cls}-navigation {
  padding-top: @steps-navigation-padding-top;
  padding-bottom: @steps-navigation-padding-bottom;

  .@{steps-prefix-cls}-item {
    &::after {
      width: 6px;
      height: 6px;
    }
    &::before {
      top: -@steps-navigation-padding-top;
      height: 4px;
    }
  }
  .@{steps-prefix-cls}-item-finish::before {
    left: 0;
    width: 100%;
  }
}

.@{steps-prefix-cls}-item-wait
  > .@{steps-prefix-cls}-item-container
  > .@{steps-prefix-cls}-item-content
  > .@{steps-prefix-cls}-item-title {
  color: @text-color-tertiary;
}