$font-weight-thin: var(
  --wds-text-button-font-weight-thin,
  var(--wds-font-weight-medium, var(--wsr-font-weight-regular, 400))
);
$font-weight-normal: var(
  --wds-text-button-font-weight-normal,
  var(--wds-font-weight-semi-bold, var(--wsr-font-weight-medium, 530))
);
$gap-tiny: var(--wds-button-gap-tiny, var(--wds-space-100, 3px));

.text-button {
  &--size-medium {
    font-weight: $font-weight-thin;
    height: var(--wds-text-button-size-medium, var(--wds-space-600, 24px));
  }

  &--size-small {
    font-weight: $font-weight-thin;
    height: var(--wds-text-button-size-small, var(--wds-space-475, 18px));
  }

  &--size-tiny {
    font-weight: $font-weight-thin;
    height: var(--wds-text-button-size-tiny, var(--wds-space-475, 18px));
  }

  &--weight-normal {
    font-weight: $font-weight-normal;
  }

  &--weight-bold {
    font-weight: var(--wds-font-weight-bold, var(--wsr-font-weight-bold, 700));
  }

  &--size-tiny .button-core__prefix {
    padding-right: $gap-tiny;
  }

  &--size-tiny .button-core__suffix {
    padding-inline-start: $gap-tiny;
  }
}