@use '../utils/font_variables';
@use '../utils/size_variables';

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: BUSL-1.1
 */

.stat-text-container {
  line-height: normal;
  max-height: 100%;
  display: flex;
  flex-direction: column;

  &.l,
  &.m {
    .stat-label {
      font-size: size_variables.$size-6;
      font-weight: font_variables.$font-weight-semibold;
      margin-bottom: size_variables.$spacing-4;
      line-height: inherit;
    }
    .stat-text {
      font-size: size_variables.$size-8;
      font-weight: font_variables.$font-weight-normal;
      color: var(--token-color-palette-neutral-500);
      line-height: inherit;
    }
    .stat-value {
      font-size: size_variables.$size-3;
      font-weight: font_variables.$font-weight-normal;
      margin-top: size_variables.$spacing-12;
    }
  }

  &.s {
    .stat-label {
      font-size: size_variables.$size-5;
      font-weight: font_variables.$font-weight-semibold;
      line-height: inherit;
    }
    .stat-text {
      font-size: size_variables.$size-8;
      font-weight: font_variables.$font-weight-normal;
      color: var(--token-color-palette-neutral-500);
      line-height: inherit;
    }
    .stat-value {
      font-size: size_variables.$size-5;
      font-weight: font_variables.$font-weight-normal;
      margin-top: size_variables.$spacing-12;
    }
  }

  &.l-no-subText {
    .stat-label {
      font-size: size_variables.$size-5;
      font-weight: font_variables.$font-weight-semibold;
      line-height: inherit;
    }
    .stat-text {
      font-size: size_variables.$size-8;
      font-weight: font_variables.$font-weight-normal;
      color: var(--token-color-palette-neutral-500);
      line-height: inherit;
    }
    .stat-value {
      font-size: size_variables.$size-3;
      font-weight: font_variables.$font-weight-normal;
      margin-top: size_variables.$spacing-4;
    }
  }

  &.m-no-subText {
    .stat-label {
      font-size: size_variables.$size-8;
      font-weight: font_variables.$font-weight-bold;
      line-height: inherit;
    }
    .stat-text {
      font-size: size_variables.$size-8;
      font-weight: font_variables.$font-weight-normal;
      color: var(--token-color-palette-neutral-500);
      line-height: inherit;
    }
    .stat-value {
      font-size: size_variables.$size-5;
      font-weight: font_variables.$font-weight-normal;
      margin-top: size_variables.$spacing-4;
    }
  }

  &.s-no-subText {
    .stat-label {
      font-size: size_variables.$size-8;
      font-weight: font_variables.$font-weight-normal;
      color: var(--token-color-palette-neutral-400);
      line-height: inherit;
    }
    .stat-text {
      font-size: size_variables.$size-8;
      font-weight: font_variables.$font-weight-normal;
      color: var(--token-color-palette-neutral-500);
      line-height: inherit;
    }
    .stat-value {
      font-size: size_variables.$size-8;
      font-weight: font_variables.$font-weight-normal;
      color: var(--token-color-palette-neutral-600);
      line-height: inherit;
    }
  }
}