.Text {
  composes: antialiased sansSerif from "./Typography.css";
}

.TextBody {
  composes: antialiased from "./Typography.css";
}

.Text svg,
.TextBody svg {
  vertical-align: unset;
}

.lg {
  font-family: var(--sema-font-family-body-lg);
  font-size: var(--sema-font-size-body-lg);
  letter-spacing: var(--sema-font-letterspacing-body-lg);
  line-height: var(--sema-font-lineheight-body-lg);
}

.lgDefault {
  font-weight: var(--sema-font-weight-body-lg-default);
  text-decoration: var(--sema-font-textdecoration-body-lg-default);
}

.lgEmphasis {
  font-weight: var(--sema-font-weight-body-lg-emphasis);
  text-decoration: var(--sema-font-textdecoration-body-lg-emphasis);
}

.md {
  font-family: var(--sema-font-family-body-md);
  font-size: var(--sema-font-size-body-md);
  letter-spacing: var(--sema-font-letterspacing-body-md);
  line-height: var(--sema-font-lineheight-body-md);
}

.mdDefault {
  font-weight: var(--sema-font-weight-body-md-default);
  text-decoration: var(--sema-font-textdecoration-body-md-default);
}

.mdEmphasis {
  font-weight: var(--sema-font-weight-body-md-emphasis);
  text-decoration: var(--sema-font-textdecoration-body-md-emphasis);
}

.sm {
  font-family: var(--sema-font-family-body-sm);
  font-size: var(--sema-font-size-body-sm);
  letter-spacing: var(--sema-font-letterspacing-body-sm);
  line-height: var(--sema-font-lineheight-body-sm);
}

.smDefault {
  font-weight: var(--sema-font-weight-body-sm-default);
  text-decoration: var(--sema-font-textdecoration-body-sm-default);
}

.smEmphasis {
  font-weight: var(--sema-font-weight-body-sm-emphasis);
  text-decoration: var(--sema-font-textdecoration-body-sm-emphasis);
}

.xs {
  font-family: var(--sema-font-family-body-xs);
  font-size: var(--sema-font-size-body-xs);
  letter-spacing: var(--sema-font-letterspacing-body-xs);
  line-height: var(--sema-font-lineheight-body-xs);
}

.xsDefault {
  font-weight: var(--sema-font-weight-body-xs-default);
  text-decoration: var(--sema-font-textdecoration-body-xs-default);
}

.xsEmphasis {
  font-weight: var(--sema-font-weight-body-xs-emphasis);
  text-decoration: var(--sema-font-textdecoration-body-xs-emphasis);
}

/* Link management */

.noOutline {
  outline: none;
}

.hoverNoUnderline:hover,
.hoverNoUnderline:focus {
  text-decoration: none;
}

.hoverUnderline:hover,
.hoverUnderline:focus {
  text-decoration: underline;
}

.outlineFocus:focus {
  outline: 4px solid var(--color-border-focus);
  outline-offset: 0;
}

.outlineFocusVR:focus {
  border-radius: var(--rounding-100);
  outline: 2px solid var(--color-border-focus);
  outline-offset: 2px;
}

/* Link color management */

.inheritColor {
  color: inherit; /* Links should have the correct underline color */
}

/* .standalone is so we can select base on class */

.standalone {
  color: inherit;
}

a.standalone {
  color: var(--sema-color-text-link);
}

a.standalone:hover {
  color: var(--sema-color-hover-text-link);
}

a.standalone:active {
  color: var(--sema-color-pressed-text-link);
}

/* .vrInheritColor is so we can select base on class */

.vrInheritColor {
  color: inherit;
}

.dark a.vrInheritColor:hover {
  color: var(--sema-color-hover-text-dark);
}

.dark a.vrInheritColor:active {
  color: var(--sema-color-pressed-text-dark);
}

.default a.vrInheritColor:hover {
  color: var(--sema-color-hover-text-default);
}

.default a.vrInheritColor:active {
  color: var(--sema-color-pressed-text-default);
}

.inverse a.vrInheritColor:hover {
  color: var(--sema-color-hover-text-inverse);
}

.inverse a.vrInheritColor:active {
  color: var(--sema-color-pressed-text-inverse);
}

.error a.vrInheritColor:hover {
  color: var(--sema-color-hover-text-error);
}

.error a.vrInheritColor:active {
  color: var(--sema-color-pressed-text-error);
}

.light a.vrInheritColor:hover {
  color: var(--sema-color-hover-text-light);
}

.light a.vrInheritColor:active {
  color: var(--sema-color-pressed-text-light);
}

.link a.vrInheritColor:hover {
  color: var(--sema-color-hover-text-link);
}

.link a.vrInheritColor:active {
  color: var(--sema-color-pressed-text-link);
}

.recommendation a.vrInheritColor:hover {
  color: var(--sema-color-hover-text-recommendation);
}

.recommendation a.vrInheritColor:active {
  color: var(--sema-color-pressed-text-recommendation);
}

.shopping a.vrInheritColor:hover {
  color: var(--sema-color-hover-text-link);
}

.shopping a.vrInheritColor:active {
  color: var(--sema-color-pressed-text-link);
}

.subtle a.vrInheritColor:hover {
  color: var(--sema-color-hover-text-subtle);
}

.subtle a.vrInheritColor:active {
  color: var(--sema-color-pressed-text-subtle);
}

.success a.vrInheritColor:hover {
  color: var(--sema-color-hover-text-success);
}

.success a.vrInheritColor:active {
  color: var(--sema-color-pressed-text-success);
}

.warning a.vrInheritColor:hover {
  color: var(--sema-color-hover-text-warning);
}

.warning a.vrInheritColor:active {
  color: var(--sema-color-pressed-text-warning);
}

/* Decoration */

.underline {
  text-decoration: underline;
}

.noUnderline {
  text-decoration: none;
}

/* Text color */

.dark {
  color: var(--color-text-dark);
}

.textColorOverrideDark * {
  /* stylelint-disable-next-line declaration-no-important */
  color: var(--color-text-dark) !important;
}

.default {
  color: var(--color-text-default);
}

.disabled {
  color: var(--color-text-disabled);
}

.error {
  color: var(--color-text-error);
}

/* Used for error messaging in Toast */

.textColorOverrideError * {
  /* stylelint-disable-next-line declaration-no-important */
  color: var(--color-text-light) !important;
  /* stylelint-disable-next-line declaration-no-important */
  font-weight: var(--font-weight-semibold) !important;
}

.inverse {
  color: var(--color-text-inverse);
}

.light {
  color: var(--color-text-light);
}

.textColorOverrideLight * {
  /* stylelint-disable-next-line declaration-no-important */
  color: var(--color-text-light) !important;
}

.link {
  color: var(--color-text-link);
}

.recommendation {
  color: var(--color-icon-recommendation);
}

.shopping {
  color: var(--color-text-shopping);
}

.subtle {
  color: var(--color-text-subtle);
}

.success {
  color: var(--color-text-success);
}

.warning {
  color: var(--color-text-warning);
}

.textColorOverrideErrorVr * {
  /* stylelint-disable-next-line declaration-no-important */
  color: var(--color-text-light) !important;
}
