@use "uswds-core" as *;
@use "text-theme";

@each $font-size-name in text-theme.$font-size-names {
  .text--header-#{$font-size-name} {
    font-family: family(text-theme.$header-font-family-name);
    font-size: size(text-theme.$header-font-family-name, $font-size-name);
  }

  .text--#{$font-size-name} {
    font-family: family(text-theme.$default-font-family-name);
    font-size: size(text-theme.$default-font-family-name, $font-size-name);
  }
}

.text {
  &--bold {
    font-weight: font-weight("bold");
  }

  &--semibold {
    font-weight: 500;
  }

  &--normal {
    font-weight: text-theme.$default-font-weight;
  }

  &--capitalize {
    text-transform: capitalize;
  }

  &--indented {
    @include at_media("tablet") {
      padding-left: units(3);
    }
  }

  &--large {
    font-size: units(3);

    @include at_media("tablet") {
      font-size: units(4);
    }
  }

  &--left {
    text-align: left;
  }

  &--lowercase {
    text-transform: lowercase;
  }

  &--medium {
    font-size: units(2);
  }

  &--xl {
    font-size: 4em;

    @include at_media("tablet") {
      font-size: 8em;
    }
  }

  &--overflow-ellipsis {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  &--overflow-wrap {
    overflow: visible;
    text-overflow: initial;
    white-space: normal;
  }

  &--align-right {
    text-align: right;
  }
}
