/* LM Sans 10 */
@font-face {
    font-family: 'LM Sans 10';
    src: local('LM Sans 10 Regular'),
        local('LMSans10-Regular'),
        url("../fonts/latinmodern/LMSans10-Regular.f2fb4e720ff6.woff2") format('woff2'),
        url("../fonts/latinmodern/LMSans10-Regular.bd2c2b507927.woff") format('woff');
    font-weight: 400; /* normal */
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'LM Sans 10';
    src: local('LM Sans 10 Oblique'),
        local('LMSans10-Oblique'),
        url("../fonts/latinmodern/LMSans10-Oblique.632fc581ecee.woff2") format('woff2'),
        url("../fonts/latinmodern/LMSans10-Oblique.3392e4ba8e63.woff") format('woff');
    font-weight: 400; /* normal */
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'LM Sans 10';
    src: local('LM Sans 10 Bold'),
        local('LMSans10-Bold'),
        url("../fonts/latinmodern/LMSans10-Bold.63aa092ca0f8.woff2") format('woff2'),
        url("../fonts/latinmodern/LMSans10-Bold.bd3c96cf3ef8.woff") format('woff');
    font-weight: 700; /* bold */
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'LM Sans 10';
    src: local('LM Sans 10 Bold Oblique'),
        local('LMSans10-BoldOblique'),
        url("../fonts/latinmodern/LMSans10-BoldOblique.4a9d686b347d.woff2") format('woff2'),
        url("../fonts/latinmodern/LMSans10-BoldOblique.18ac87a8658d.woff") format('woff');
    font-weight: 700; /* bold */
    font-style: italic;
    font-display: swap;
}

/* LM Roman 10 */
@font-face {
    font-family: 'LM Roman 10';
    src: local('LM Roman 10 Regular'),
        local('LMRoman10-Regular'),
        url("../fonts/latinmodern/LMRoman10-Regular.2798de28c1e0.woff2") format('woff2'),
        url("../fonts/latinmodern/LMRoman10-Regular.9440e7a59f81.woff") format('woff');
    font-weight: 400; /* normal */
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'LM Roman 10';
    src: local('LM Roman 10 Italic'),
        local('LMRoman10-Italic'),
        url("../fonts/latinmodern/LMRoman10-Italic.99321bde96eb.woff2") format('woff2'),
        url("../fonts/latinmodern/LMRoman10-Italic.49beb9562d45.woff") format('woff');
    font-weight: 400; /* normal */
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'LM Roman 10';
    src: local('LM Roman 10 Bold'),
        local('LMRoman10-Bold'),
        url("../fonts/latinmodern/LMRoman10-Bold.77f7b84d49e4.woff2") format('woff2'),
        url("../fonts/latinmodern/LMRoman10-Bold.e464270b53a8.woff") format('woff');
    font-weight: 700; /* bold */
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'LM Roman 10';
    src: local('LM Roman 10 Bold Italic'),
        local('LMRoman10-BoldItalic'),
        url("../fonts/latinmodern/LMRoman10-BoldItalic.2d6c371ce28f.woff2") format('woff2'),
        url("../fonts/latinmodern/LMRoman10-BoldItalic.d6e34050dc84.woff") format('woff');
    font-weight: 700; /* bold */
    font-style: italic;
    font-display: swap;
}

/* Red Hat Mono */
@font-face {
    font-family: 'Red Hat Mono';
    src: local('Red Hat Mono'),
        local('RedHatMono-Regular'),
        url("../fonts/redhatmono/RedHatMono-Regular.af8ba07918c4.woff2") format('woff2'),
        url("../fonts/redhatmono/RedHatMono-Regular.8bfd47e8f52a.woff") format('woff');
    font-style: normal;
    font-display: swap;
}

/* Sketch Serif */
@font-face {
    font-family: "Sketch Serif";
    src: url("../fonts/sketchserif/SketchSerif-latin.bc69c69fff3b.woff2") format("woff2"),
         url("../fonts/sketchserif/SketchSerif-latin.eff048b6d691.woff") format("woff");
    unicode-range: U+0020-007F, U+2019;
    font-weight: 400; /* normal */
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Sketch Serif';
    src: url("../fonts/sketchserif/SketchSerif.55755f7496a0.woff2") format('woff2'),
         url("../fonts/sketchserif/SketchSerif.a446269e6986.woff") format('woff');
    font-weight: 400; /* normal */
    font-style: normal;
    font-display: swap;
}

.noscript-notice {
    text-align: center;
}

.navbar-brand {
    font-family: "Sketch Serif", Georgia, "Times New Roman", Times, serif;
    font-weight: 400;
    font-size: 1.38em;
}

.navbar-brand picture {
    height: 2rem;
    width: auto;
}

.discord-server-link {
    column-gap: 0.5rem;
}

body {
    font-family: "LM Sans 10", Arial, Helvetica, sans-serif;
}

code,
pre,
tt,
kbd,
samp {
    font-family: "Red Hat Mono", monospace, monospace;
}

.answer {
    font-family: "Red Hat Mono", monospace, monospace;
    font-weight: 600;
}

/* Override Bulma colors */
:root {
    /* white: #ededed */
    --white-h: 0deg;
    --white-s: 0%;
    --white-l: 93%;
    --white-l-invert: 7%;
    --white: hsl(var(--white-h), var(--white-s), var(--white-l));

    /* gray: #69748c */
    --gray-h: 221deg;
    --gray-s: 14%;
    --gray-l: 48%;
    --gray: hsl(var(--gray-h), var(--gray-s), var(--gray-l));

    /* black: #121212 */
    --black-h: 0deg;
    --black-s: 0%;
    --black-l: 7%;
    --black-l-invert: 93%;
    --black: hsl(var(--black-h), var(--black-s), var(--black-l));

    --rosy-brown: hsla(10, 47%, 72%, 1);
    --teal: hsla(190, 47%, 36%, 1);

    /* persian-orange: #d5915d */
    --persian-orange-h: 26deg;
    --persian-orange-s: 59%;
    --persian-orange-l: 60%;
    --persian-orange-l-invert: 7%;
    --persian-orange: hsl(var(--persian-orange-h), var(--persian-orange-s), var(--persian-orange-l));

    /* air-superiority-blue: #6799bb */
    --air-superiority-blue-h: 204deg;
    --air-superiority-blue-s: 38%;
    --air-superiority-blue-l: 57%;
    --air-superiority-blue-l-invert: 7%;
    --air-superiority-blue: hsl(var(--air-superiority-blue-h), var(--air-superiority-blue-s), var(--air-superiority-blue-l));

    /* anti-flash-white: #eff1f3 */
    --anti-flash-white-h: 210deg;
    --anti-flash-white-s: 14%;
    --anti-flash-white-l: 95%;
    --anti-flash-white-l-invert: 7%;
    --anti-flash-white: hsl(var(--anti-flash-white-h), var(--anti-flash-white-s), var(--anti-flash-white-l));

    /* sky-blue: #9DD0E6 */
    --sky-blue-h: 198deg;
    --sky-blue-s: 59%;
    --sky-blue-l: 76%;
    --sky-blue-l-invert: 7%;
    --sky-blue: hsl(var(--sky-blue-h), var(--sky-blue-s), var(--sky-blue-l));

    /* night: #151516 */
    --night-h: 240deg;
    --night-s: 2%;
    --night-l: 8%;
    --night-l-invert: 93%;
    --night: hsl(var(--night-h), var(--night-s), var(--night-l));

    /* gunmetal: #253237 */
    --gunmetal-h: 197deg;
    --gunmetal-s: 20%;
    --gunmetal-l: 18%;
    --gunmetal-l-invert: 93%;
    --gunmetal: hsl(var(--gunmetal-h), var(--gunmetal-s), var(--gunmetal-l));

    /* dark-cerulean: #005A8C */
    --dark-cerulean-h: 201deg;
    --dark-cerulean-s: 100%;
    --dark-cerulean-l: 27%;
    --dark-cerulean-l-invert: 93%;
    --dark-cerulean: hsl(var(--dark-cerulean-h), var(--dark-cerulean-s), var(--dark-cerulean-l));

    /* gold: #FFD700 */
    --gold-h: 51deg;
    --gold-s: 100%;
    --gold-l: 50%;
    --gold-l-invert: 7%;
    --gold: hsl(var(--gold-h), var(--gold-s), var(--gold-l));

    /* engineering-orange: #BB2D1D */
    --engineering-orange-h: 6deg;
    --engineering-orange-s: 73%;
    --engineering-orange-l: 42%;
    --engineering-orange-l-invert: 93%;
    --engineering-orange: hsl(var(--engineering-orange-h), var(--engineering-orange-s), var(--engineering-orange-l));

    /* midnight-green: #0A5D6F */
    --midnight-green-h: 191deg;
    --midnight-green-s: 83%;
    --midnight-green-l: 24%;
    --midnight-green-l-invert: 93%;
    --midnight-green: hsl(var(--midnight-green-h), var(--midnight-green-s), var(--midnight-green-l));

    /* Bulma variables */
    --bulma-body-background-color: var(--sky-blue);
    --bulma-box-background-color: var(--anti-flash-white);
    --bulma-card-background-color: var(--anti-flash-white);
    --bulma-card-header-background-color: var(--anti-flash-white);
    --bulma-card-content-background-color: var(--anti-flash-white);

    --bulma-text-h: var(--night-h);
    --bulma-text-s: var(--night-s);
    --bulma-text-l: var(--night-l);
    --bulma-text-invert-l: var(--night-l-invert);

    --bulma-hr-background-color: var(--gray);

    --bulma-link-text: var(--dark-cerulean);

    --bulma-primary-h: var(--gunmetal-h);
    --bulma-primary-s: var(--gunmetal-s);
    --bulma-primary-l: var(--gunmetal-l);
    --bulma-primary-invert-l: var(--gunmetal-l-invert);

    --bulma-link-h: var(--dark-cerulean-h);
    --bulma-link-s: var(--dark-cerulean-s);
    --bulma-link-l: var(--dark-cerulean-l);
    --bulma-link-invert-l: var(--dark-cerulean-l-invert);

    --bulma-info-h: var(--air-superiority-blue-h);
    --bulma-info-s: var(--air-superiority-blue-s);
    --bulma-info-l: var(--air-superiority-blue-l);
    --bulma-info-invert-l: var(--air-superiority-blue-l-invert);

    --bulma-success-h: var(--persian-orange-h);
    --bulma-success-s: var(--persian-orange-s);
    --bulma-success-l: var(--persian-orange-l);
    --bulma-success-invert-l: var(--persian-orange-l-invert);

    --bulma-warning-h: var(--gold-h);
    --bulma-warning-s: var(--gold-s);
    --bulma-warning-l: var(--gold-l);
    --bulma-warning-invert-l: var(--gold-l-invert);

    --bulma-danger-h: var(--engineering-orange-h);
    --bulma-danger-s: var(--engineering-orange-s);
    --bulma-danger-l: var(--engineering-orange-l);
    --bulma-danger-invert-l: var(--engineering-orange-l-invert);
}

.table {
    --bulma-table-background-color: hsla(var(--sky-blue-h), var(--sky-blue-s), var(--sky-blue-l), 0);
    --bulma-table-body-background-color: hsla(var(--sky-blue-h), var(--sky-blue-s), var(--sky-blue-l), 0);
    --bulma-table-cell-background-color: hsla(var(--sky-blue-h), var(--sky-blue-s), var(--sky-blue-l), 0);
    --bulma-table-striped-row-even-background-color: hsla(var(--sky-blue-h), var(--sky-blue-s), var(--sky-blue-l-invert), 0.035);
}

.content blockquote {
    --bulma-content-blockquote-border-left: 5px solid var(--persian-orange);
    --bulma-content-blockquote-background-color: var(--sky-blue);
}

/* Adapted from https://github.com/cityssm/bulma-sticky-table/blob/main/_sticky-table.scss */
.table.has-sticky-header {
    thead th {
        background-color: var(--sky-blue);
        position: sticky;
        top: 0;
        z-index: 5;
    }
}

footer.footer {
    --bulma-footer-background-color: var(--sky-blue);
    --bulma-footer-padding: 3rem 1.5rem 1rem
}

.loading-indicator {
    display: inline-block;
    animation: spinner 3s linear infinite;
    user-select: none;
}

@keyframes spinner {
    to {
        transform: rotate(360deg);
    }
}

.htmx-indicator {
    opacity: 0;
    transition: opacity 200ms ease-in-out;
}

.notification.announcement_message {
    background-color: var(--rosy-brown);
}

.notification.announcement_message a:not(.button):not(.dropdown-item) {
    color: var(--teal)
}

/* allauth form validation errors */

.invalid-feedback {
    display: flex;
    color: var(--engineering-orange);
}

.invalid-feedback:before {
    font-family: bootstrap-icons;
    content: "\F33B";
    margin-right: 0.5em;
    align-self: center;
}

/* Spoiler tag */

.spoiler {
    background-color: var(--bulma-strong-color);
}

.spoiler:hover {
    background-color: var(--sky-blue);
}

.spoiler.scheme-background:hover {
    background-color: var(--bulma-scheme-main);
}

/* Buttons */

.button.thick-border {
    outline: 1px solid currentColor;
}

/* Alpine.js x-cloak support */
[x-cloak] { display: none !important; }