/*!
@file   GWIS website style sheet.
@author Joseph Vrabel, U.S. Geological Survey <jvrabel@usgs.gov>
*/

/*
.............................................
Fonts
.............................................
*/

/* Default. */
@font-face {
    font-display: swap;
    font-family: _font-default;
    src: url('./font/Mulish-VariableFont_wght.woff2') format('woff2 supports variations'),
        url('./font/Mulish-VariableFont_wght.woff2') format('woff2-variations');
}

/* Heading. */
@font-face {
    font-display: swap;
    font-family: _font-heading;
    font-weight: 600;
    src: url('./font/Bitter-VariableFont_wght.woff2') format('woff2 supports variations'),
        url('./font/Bitter-VariableFont_wght.woff2') format('woff2-variations');
}

/* Plain. */
@font-face {
    font-display: swap;
    font-family: _font-plain;
    src: url('./font/Heebo-VariableFont_wght.woff2') format('woff2 supports variations'),
        url('./font/Heebo-VariableFont_wght.woff2') format('woff2-variations');
}

/*
.............................................
Helpers
.............................................
*/

/* Collapsible header icons. */
._collapse-header>.btn .fas {
    transform: scale(0);
    transition: transform 0.5s;
}
._collapse-header.collapsed>.btn .fas {
    transform: scale(1);
}

/* Text columns. */
._columns {
    column-gap: 2rem;
    column-rule: 1px solid var(--bs-border-color);
    columns: 30rem;
    text-align: justify;
}

/* Documentation tables. */
._doc-table {
    font-family: _font-plain, sans-serif;
}
._doc-table tbody {
    background-color: rgba(255, 255, 255, 0.02);
    font-size: 95%;
}

/* Fonts. */
._font-heading {
    font-family: _font-heading, serif;
}
._font-plain {
    font-family: _font-plain, sans-serif;
}

/*
.............................................
Elements and Layout
.............................................
*/

/* Instant jumps to anchors, not smooth scrolling. */
:root {
    scroll-behavior: auto;
}

/* REM-based page scaling. */
html {
    font-size: 100%;
}

/* Default font. */
body {
    font-family: _font-default, sans-serif;
}

/* Header and footer. */
body header,
body footer {
    background-color: #00264c;
    color: white;
}
body footer a {
    color: white;
}
body footer a:not(:hover) {
    text-decoration: none;
}

/* Headings. */
h1,
h2,
h3,
h4 {
    font-family: _font-heading, serif;
}
h1 {
    margin-bottom: 3rem;
    margin-top: 0;
    opacity: 0.8;
}
h2 {
    margin-bottom: 1.5rem;
    margin-top: 2.5rem;
    opacity: 0.9;
}

/* Code. */
code {
    user-select: text;
}
