@import (reference) './variable.less';

.ant-progress {
  &-line {
    display: flex;
    flex-direction: row;
    align-items: center;
    .ant-progress-outer {
      background-color: @progress-trail-color;
      border-radius: @corner-radius-circle;
      height: 16 * @rpx;
      overflow: hidden;
      flex: 1;
    }
    .ant-progress-inner {
      border-radius: @corner-radius-circle;
      transition: width 0.3s;
      height: 100%;
      position: relative;
      background-color: @progress-stroke-color;
      &-success {
        background-color: @progress-success-color;
      }
      &-exception {
        background-color: @progress-exception-color;
      }
    }
    .ant-progress-indicator {
      margin-left: 16 * @rpx;
      color: @progress-assist-color;
      font-size: 26 * @rpx;
      height: 37 * @rpx;
      display: flex;
      align-items: center;
    }
    .ant-progress-status-icon {
      &-success {
        color: @progress-success-color;
      }
      &-exception {
        color: @progress-exception-color;
      }
    }
  }
  &-circle {
    position: relative;
    > .ant-progress-canvas {
      width: 100%;
      height: 100%;
    }
    .ant-progress-indicator {
      font-size: 40 * @rpx;
      color: @progress-indicator-color;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate3d(-50%, -50%, 0);
      z-index: 10;
    }
  }
}