{{- $highlightColor := .Site.Params.style.vars.highlightColor | default (.Site.Params.highlightColor | default "#e22d30") -}}

@font-face {
    font-family: Jonova;
    font-style: normal;
    font-weight: normal;
    src: url("../fonts/Jonova-Regular.woff2");
    size-adjust: 110%;
}

@font-face {
    font-family: Jonova;
    font-style: normal;
    font-weight: bold;
    src: url("../fonts/Jonova-Bold.woff2");
    size-adjust: 110%;
}

@font-face {
    font-family: Jonova;
    font-style: italic;
    font-weight: normal;
    src: url("../fonts/Jonova-Italic.woff2");
    size-adjust: 110%;
}

@font-face {
    font-family: Jonova;
    font-style: italic;
    font-weight: bold;
    src: url("../fonts/Jonova-BoldItalic.woff2");
    size-adjust: 110%;
}

body {
    font-family: Jonova, "Open Sans", Helvetica, Arial, sans-serif;
}

/*
   Submenu
*/
.menu__item {
    position: relative;
}
.submenu__list {
    list-style: none;
    background: #2a2a2a;
    display: none;
    position: absolute;
    top: auto;
    width: auto;
    max-width: 400px;
    z-index: 1;
}
.menu__item:hover .submenu__list {
    display: block;
}
.submenu__link {
    display: block;
    padding: 10px 15px;
    padding: .625rem .9375rem;
    font-weight: 700;
    color: #fff;
    text-transform: uppercase;
    white-space: nowrap;
}
.submenu__item--active .submenu__link {
    color: $highlightColor;
}

/*
 Etc
*/
.post__meta:empty {
    display: none;
}
kbd {
    background-color: #fcfcfc;
    border: 1px solid #cbcbcb;
    border-bottom-color: #959da5;
    border-radius: 3px;
    box-shadow: inset 0 -1px 0 #959da5;
    color: #2a2a2a;
    display: inline-block;
    font-size: 11px;
    line-height: 10px;
    padding: 3px 5px;
    vertical-align: middle;
}
.w300 {
    max-width: 300px;
}
.w400 {
    max-width: 400px;
}

@media (prefers-color-scheme: dark) {
    body {
        background: #0f0f0f;
        color: #c0c0c0;
    }
    .wrapper {
        background: #1b1b1b;
    }
    h1, h2, h3, h4, h5, h6 {
        color: inherit;
    }
    a {
        color: inherit;
    }
    hr {
        border-top-color: #313131;
    }
    p {
        color: inherit;
    }
    pre, code {
        background-color: #272822;
        border-color: #313131;
    }
    pre {
        color: inherit;
    }
    kbd {
        background-color: #2a2a2a;
        border-color: #313131;
        color: inherit;
    }
    abbr[title] {
        border-bottom-color: #c0c0c0;
    }
    .header {
        background: #1b1b1b;
    }
    .logo__title {
        color: #c0c0c0
    }
    .logo__tagline {
        border-top-color: #313131;
    }
    .toc {
        background: transparent;
        border-color: #313131;
    }
    .toc__menu a {
        border-color: #313131;
    }
}

@media print {
    body {
        background: none;
    }
    .container--outer {
        margin: 0 auto;
    }
    .menu {
        display: none;
    }
    .footer {
        background: transparent;
    }
    .footer a {
        color: inherit;
    }
}