@import "../../globals/scss/prefix";
@import "../../globals/scss/assert";
@import "../../globals/scss/breakpoint";
@import "../../globals/scss/color";
@import "../../globals/scss/color-dark";
@import "../../globals/scss/typography";
@import "../../globals/scss/util";
// stylelint-disable declaration-no-important

// CSS image replacement
@mixin text-hide($ignore-warning: false) {
  color: transparent;
  // stylelint-disable-next-line font-family-no-missing-generic-family-keyword
  font: 0/0 a;
  text-shadow: none;
  background-color: transparent;
  border: 0;

  @if ($ignore-warning != true) {
    @warn "The `text-hide()` mixin has been deprecated as of v4.1.0. It will be removed entirely in v5.";
  }
}

// Text

.text-monospace {
  font-family: $font-family-monospace;
}

// Alignment

.text-justify {
  text-align: justify !important;
}

.text-nowrap {
  white-space: nowrap !important;
}

.text-truncate {
  @include text-truncate;
}

// Responsive alignment

@each $breakpoint in map-keys($breakpoints) {
  @include media-breakpoint-up($breakpoint) {
    $infix: breakpoint-infix($breakpoint, $breakpoints);

    .text#{$infix}-left {
      text-align: left !important;
    }
    .text#{$infix}-right {
      text-align: right !important;
    }
    .text#{$infix}-center {
      text-align: center !important;
    }
  }
}

// Decoration

.text-decoration-none {
  text-decoration: none;
}

.text-decoration-underline {
  text-decoration: underline;
}

// Transformation

.text-lowercase {
  text-transform: lowercase !important;
}

.text-uppercase {
  text-transform: uppercase !important;
}

.text-capitalize {
  text-transform: capitalize !important;
}

// Weight and italics

.font-weight-light {
  font-weight: $font-weight-light !important;
}

.font-weight-normal {
  font-weight: $font-weight-normal !important;
}

.font-weight-bold {
  font-weight: $font-weight-bold !important;
}

.font-weight-black {
  font-weight: $font-weight-black !important;
}

.font-italic {
  font-style: italic !important;
}

//Dark mode reactive colors
.text-on-gradient-primary {
  color: var(--nj-deprecated-color-text-background-gradient-primary);
}

// Contextual colors
@each $color in map-keys($colors) {
  @include text-emphasis-variant(".text-#{$color}", css-var(color-base, $color));
}

//text on color
@each $color in map-keys($colors) {
  @include text-emphasis-variant(".text-on-#{$color}", css-var(color-text-background, $color));
}

// theme colors
@each $color in map-keys($theme-colors) {
  @include text-emphasis-variant(".text-#{$color}", css-var(color-base, $color));
}

// theme contrast colors
@each $color, $value in $theme-colors-contrast {
  @include text-emphasis-variant(".text-#{$color}", $value);
}

// Grays colors
@each $gray in map-keys($grays) {
  @include text-emphasis-variant(".text-gray-#{$gray}", css-var(color-base-gray, $gray));
}

// text on Grays colors
@each $gray in map-keys($grays) {
  @include text-emphasis-variant(".text-on-gray-#{$gray}", css-var(color-text-background-gray, $gray));
}

//Dark mode non reactive colors
@each $color, $value in $grays {
  @include text-emphasis-variant(".text-gray-light-#{$color}", $value);
}

@each $color, $value in $grays-dark {
  @include text-emphasis-variant(".text-gray-dark-#{$color}", $value);
}

// Gradient Classes
@each $gradient, $value in $gradients {
  @include text-gradient(".text-gradient-#{$gradient}", $value, map-get($gradients-fallback, $gradient));
}

.text-body {
  color: $gray-900 !important;
}

.text-black-50 {
  color: rgba($black, .5) !important;
}

.text-white-50 {
  color: rgba($white, .5) !important;
}

// Misc

.text-hide {
  @include text-hide($ignore-warning: true);
}

@each $size, $value in $fs-map {
  .t-#{$size} {
    font-size: $value;
  }
}