// Minimal set of global utility classes.
@use "design";

.text-grey {
  color: design.$text-grey;
}

.text-light-grey {
  color: design.$neutral-70;
}

.text-color-primary {
  color: design.$color-primary;
}

.text-color-brand-primary {
  color: design.$color-brand-primary;
}

.text-color-success {
  color: design.$color-success;
}

.text-color-caution {
  color: design.$color-caution;
}

.text-color-error {
  color: design.$color-error;
}

.text-highlight {
  background-color: design.$yellow-90;
}

.bg-success {
  background-color: design.$color-success-surface;
}

.bg-caution {
  background-color: design.$color-caution-surface;
}

.text-left {
  text-align: left;
}
.text-center {
  text-align: center;
}
.text-right {
  text-align: right;
}

.font-small {
  @include design.font-small;
}

.font-smaller {
  @include design.font-smaller;
}

.font-smallest {
  @include design.font-smallest;
}

.font-weight-light {
  font-weight: design.$weight-display-light;
}

.font-weight-bold {
  font-weight: design.$weight-display-bold;
}

.monospace {
  font-family: design.$font-monospace;
  letter-spacing: 0.01em;
}

// Exceedingly lazy, to fix
.monospaceInput {
  font-family: design.$font-monospace !important;
  font-weight: 500 !important;
  font-size: 1.1rem !important;
  letter-spacing: 0.01em !important;
}

.nowrap {
  white-space: nowrap;
}

.break-words {
  word-break: break-word;
}