// Base text styles
body {
    font-family: $pri-font, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial,
        sans-serif;
    font-weight: $font-weight-normal;
    font-size: $font-size;
    line-height: 1.8;
    color: $grayDark3Color;
}

// Reset font-size and margins on all text elements, these will be adjusted with classes
h1,
h2,
h3,
h4,
h5,
h6,
p,
ul,
ol,
li,
small {
    margin: 0;
    font-size: $font-size;
    font-weight: $font-weight-light;
}

pre {
    white-space: pre-wrap;
}

input,
textarea,
select {
    font-family: $pri-font-regular;
    font-weight: $font-weight-light;
}

// Text styles
.gds-text--uppercase {
    text-transform: uppercase;
}

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

// Header text
.gds-text--header-xxl {
    font-size: ($unit * 5);
    line-height: 0.7;
}

.gds-text--header-xl {
    font-size: ($unit * 3.5);
    line-height: 1.1;
}

.gds-text--header-lg {
    font-size: ($unit * 2.5);
    line-height: 1.2;
}

.gds-text--header-md {
    font-size: ($unit * 1.8);
    line-height: 1.3;
}

.gds-text--header-sm {
    font-size: ($unit * 1.5);
    line-height: 1.4;
}
.gds-text--header-xs {
    font-size: ($unit * 1.3);
    line-height: 1.4;
}

// Body text
.gds-text--body-md {
    font-size: $font-size;
}

.gds-text--body-sm {
    font-size: $font-size-minus-2;
}

.gds-text--body-xs {
    font-size: $font-size-minus-3;
}

// Lists
.gds-text__list-item--disc {
    &:before {
        content: '';
        display: inline-block;
        margin-right: $unit;
        height: $unit * 0.25;
        width: $unit * 0.25;
        border-radius: 50%;
        background-color: transparent;
        border: 1px solid $primaryColor;
        vertical-align: middle;
    }
}

.gds-text__list-item--number {
    counter-increment: step-counter;
    margin-bottom: $unit * 0.5;
    &:before {
        content: counter(step-counter);
        margin-right: $unit;
        font-size: 80%;
        height: $unit * 1.5;
        width: $unit * 1.5;
        border-radius: 50%;
        border: 1px solid $primaryColor;
        text-align: center;
        display: inline-block;
        vertical-align: top;
        margin-top: 1px;
        color: $primaryColor;
    }
}

// Block quotes
.gds-text--blockquote {
    padding-left: ($unit * 2);
    border-left: 6px solid $trans-black-x-light;
}

.gds-text--blockquote--footer {
    display: block;
    padding-top: ($unit * 0.5);
    font-style: normal;

    &:before {
        content: '- ';
    }
}

.gds-text--code,
.gds-text--keyboard,
.gds-keyboard-shortcuts__trigger {
    font-family: Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;
    border-radius: $border-radius;
    font-size: 80%;
    padding: 0.2rem 0.4rem;
}

.gds-text--code {
    color: $dangerDark2Color;
    background-color: #f7f7f9;
    overflow-wrap: break-word;
    word-wrap: break-word;
}

.gds-text--keyboard,
.gds-keyboard-shortcuts__trigger {
    color: #fff;
    background-color: $gg-dark-2;
}

.gds-text--regular {
    font-family: $pri-font-regular;
}

.gds-text--bold {
    font-family: $pri-font-semibold;
    font-weight: $font-weight-bold;
}

.gds-text--hero {
    font-family: $pri-font-bold;
    font-weight: $font-weight-bolder;
}

.gds-text--italic {
    font-style: italic;
}

.gds-text--success {
    color: $successColor !important;
}

.gds-text--warning {
    color: $warningColor !important;
}

.gds-text--danger {
    color: $dangerColor !important;
}

.gds-text--info {
    color: $infoColor !important;
}

.gds-text--primary {
    color: $primaryColor !important;
}

.gds-text--secondary {
    color: $secondaryColor !important;
}

.gds-text--highlight {
    background-color: rgba($gg-gold, 0.4);
}

*::selection {
    background-color: $primaryColor;
    color: white;
}