@import (reference) "../../variables/neptune-tokens.less";
@import (reference) "../mixins/_logical-properties.less";
@import (reference) "../mixins/_links.less";
@import "../mixins/_text-emphasis.less";

// Deprecated classes in next iterations.

//.text-danger (Replaced by .text-negative)
//.text-success( Replaced by .text-positive)

.text-xs-left {
  .text-align(left);
}

.text-xs-right {
  .text-align(right);
}

.text-xs-center {
  text-align: center;
}

.text-xs-justify {
  text-align: justify;
}

.text-xs-nowrap {
  white-space: nowrap;
}

@media (--screen-sm) {
  .text-sm-left {
    .text-align(left);
  }

  .text-sm-right {
    .text-align(right);
  }

  .text-sm-center {
    text-align: center;
  }

  .text-sm-justify {
    text-align: justify;
  }

  .text-sm-nowrap {
    white-space: nowrap;
  }
}

@media (--screen-md) {
  .text-md-left {
    .text-align(left);
  }

  .text-md-right {
    .text-align(right);
  }

  .text-md-center {
    text-align: center;
  }

  .text-md-justify {
    text-align: justify;
  }

  .text-md-nowrap {
    white-space: nowrap;
  }
}

@media (--screen-lg) {
  .text-lg-left {
    .text-align(left);
  }

  .text-lg-right {
    .text-align(right);
  }

  .text-lg-center {
    text-align: center;
  }

  .text-lg-justify {
    text-align: justify;
  }

  .text-lg-nowrap {
    white-space: nowrap;
  }
}

@media (--screen-xl) {
  .text-xl-left {
    .text-align(left);
  }

  .text-xl-right {
    .text-align(right);
  }

  .text-xl-center {
    text-align: center;
  }

  .text-xl-justify {
    text-align: justify;
  }

  .text-xl-nowrap {
    white-space: nowrap;
  }
}

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

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

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

.text-underline {
  .link-underline(true);
}

.text-no-decoration {
  text-decoration: none !important;
}

.text-ellipsis,
.text-ellipses {
  display: block;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.text-max-width {
  max-width: 600px;
}

.text-word-break {
  word-break: break-all;
}

.text-overflow-wrap {
  overflow-wrap: anywhere;
}

.font-weight-bold {
  font-weight: var(--font-weight-bold) !important;
}

.font-weight-semi-bold {
  font-weight: var(--font-weight-semi-bold) !important;
}

.font-weight-normal {
  font-weight: var(--font-weight-regular) !important;
}

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

// Contextual colors `.text-*`

.text-primary {
  .text-emphasis-variant(var(--color-content-primary), var(--color-content-primary), var(--color-content-primary));

  // @DEPRECATED: .bg-primary use .bg-elevated or ThemeProvider with theme="forest-green" instead
  .bg-primary & {
    color: @color-navy-content-primary !important;
  }
}

.text-secondary {
  color: var(--color-content-secondary) !important;
}

.text-positive,
.text-success {
  .text-emphasis-variant(
    var(--color-content-positive),
    var(--color-content-positive),
    var(--color-content-positive-hover)
  );

  // @DEPRECATED: .bg-primary use .bg-elevated or ThemeProvider with theme="forest-green" instead
  .bg-primary & {
    color: @color-navy-content-positive !important;
  }
}

.text-accent,
.text-info {
  .text-emphasis-variant(var(--color-content-accent), var(--color-content-accent), var(--color-content-accent-hover));
  color: var(--color-interactive-primary) !important;

  // @DEPRECATED: .bg-primary use .bg-elevated or ThemeProvider with theme="forest-green" instead
  .bg-primary & {
    color: @color-navy-content-accent !important;
  }
}

.text-warning {
  .text-emphasis-variant(
    var(--color-content-warning),
    var(--color-content-warning),
    var(--color-content-warning-hover),
  );

  // @DEPRECATED: .bg-primary use .bg-elevated or ThemeProvider with theme="forest-green" instead
  .bg-primary & {
    color: @color-navy-content-warning !important;
  }
}

.text-negative,
.text-danger {
  .text-emphasis-variant(
    var(--color-sentiment-negative),
    var(--color-sentiment-negative),
    var(--color-sentiment-negative-hover)
  );

  // @DEPRECATED: .bg-primary use .bg-elevated or ThemeProvider with theme="forest-green" instead
  .bg-primary & {
    color: @color-navy-content-negative !important;
  }
}

.text-inverse {
  .text-emphasis-variant(@color-navy-content-primary, @color-navy-content-primary, @color-navy-content-secondary);
}

.text-muted {
  color: var(--color-content-tertiary) !important;
}

// @deprecated: we no longer have "colored dot" design feature in new brand
.colored-dot {
  &::after {
    content: none;
  }
}