@import './token.less';
@import '../../../theme/variables.less';

@statistic-prefix-cls: ~'@{prefix}-statistic';

.@{statistic-prefix-cls} {
  display: inline-block;
  line-height: @line-height-base;
  color: @statistic-color-text;

  &-title {
    font-size: @statistic-font-title-size;
    margin-bottom: @statistic-margin-title-bottom;
    color: @statistic-color-title-text;
  }

  &-content {
    .@{statistic-prefix-cls}-value {
      white-space: nowrap;
      font-size: @statistic-font-int-size;
      font-weight: @statistic-font-value-weight;
      color: @statistic-color-value-text;

      &-int {
        white-space: nowrap;
      }

      &-decimal {
        font-size: @statistic-font-decimal-size;
        display: inline-block;
      }

      &-suffix {
        font-size: @statistic-font-suffix-size;
        margin-left: @statistic-margin-suffix-left;
      }

      &-prefix {
        font-size: @statistic-size-value-icon;
        margin-right: @statistic-margin-prefix-right;
      }
    }
  }

  &-extra {
    margin-top: @statistic-margin-extra-top;
    color: @statistic-color-extra-text;
  }
}

.@{statistic-prefix-cls}-rtl {
  .@{statistic-prefix-cls} {
    &-content {
      .@{statistic-prefix-cls}-value {
        &-suffix {
          margin-right: @statistic-margin-suffix-left;
          margin-left: 0;
        }

        &-prefix {
          margin-right: 0;
          margin-left: @statistic-margin-prefix-right;
        }
      }
    }
  }
}