/*
Copyright (C) 2019-2020 Oscar Benedito

This program is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.

This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
GNU General Public License for more details.

You should have received a copy of the GNU General Public License
along with this program.  If not, see <https://www.gnu.org/licenses/>.
*/

/* declarations {{{ */

:root {
    --gap: 1.5rem;
    --content-gap: 1.5rem;
    --main-width: 800px;

    --text-color: hsl(0, 0%, 12%);
    --text-strong: hsl(0, 0%, 10%);
    --secondary-text: hsl(0, 0%, 44%);
    --primary-logo: #6dba6a;
    --primary-text: #50914a;
    --hr-color: hsl(0, 0%, 94%);
    --hr-dark: hsl(0, 0%, 88%);
    --button-color: hsl(0, 0%, 74%);
    --background: #fff;
    --code-bg: hsl(0, 0%, 96%);
}

@media(prefers-color-scheme:dark) {
    :root {
        --text-color: hsl(0, 0%, 80%);
        --text-strong: hsl(0, 0%, 80%);
        --secondary-text: hsl(0, 0%, 55%);
        --primary-logo: #4876a1;
        --primary-text: #4d80b3;
        --hr-color: hsl(0, 0%, 20%);
        --hr-dark: hsl(0, 0%, 20%);
        --button-color: hsl(0, 0%, 70%);
        --background: hsl(0, 0%, 8%);
        --code-bg: hsl(0, 0%, 8%);
    }
}

/* Only imports the letters needed for the logo ("BOacdeinorst"). The WOFF2 file
 * is embedded here to avoid the extra HTTP request. */
@font-face {
    font-family: 'Libre Baskerville';
    font-weight: 700;
    /* {{{ */ src: url('data:application/font-woff2;charset=utf-8;base64,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') format('woff2'); /* }}} */
    unicode-range: U+0042,U+004F,U+0061,U+0063,U+0064,U+0065,U+0069,U+006E,U+006F,U+0072,U+0073,U+0074;
}

/* declarations }}} */

/* defaults {{{ */

*,
*::after,
*::before {
    box-sizing: border-box;
}

body {
    margin: 0;
    color: var(--text-color);
    font-family: sans-serif;
    line-height: 1.7;
    word-break: break-word;
    background: var(--background);
}

article,
aside,
div,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section {
    display: block;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin-top: 0;
    margin-bottom: 0;
    line-height: 1.2;
    color: var(--text-strong);
}

h1 {
    margin-bottom: 2px;
    font-size: 2em;
}

b,
strong {
    font-weight: 700;
    color: var(--text-strong);
}

ul {
    margin: 0;
    padding: 0;
}

a {
    color: var(--primary-text);
}

a:hover {
    text-decoration: none;
}

table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    margin-bottom: 2em;
}

table td,
table th {
    min-width: 80px;
    padding: 0.75em 0.5em;
    line-height: 1.5;
    border-bottom: 1px solid var(--hr-dark);
}

table th {
    font-size: 0.9em;
    text-align: left;
}

svg {
    fill: currentColor;
    stroke: currentColor;
    max-width: 400px;
}

/* defaults }}} */

/* header {{{ */

header#page-header {
    border-bottom: 2px solid var(--hr-color);
    padding: calc(1.5 * var(--gap)) var(--gap);
}

header#page-header .content {
    max-width: var(--main-width);
    margin-right: auto;
    margin-left: auto;
}

header#page-header .content .logo {
    font-size: 1.9em;
    font-weight: bold;
    font-family: 'Libre Baskerville', serif;
    color: var(--primary-logo);
    line-height: 1;
    text-decoration: none;
}

header#page-header .content .logo:hover {
    color: var(--primary-text);
    text-decoration: none;
}

header#page-header .content nav,
header#page-header .content nav a {
    color: var(--secondary-text);
}

/* header }}} */

/* footer {{{ */

footer#page-footer {
    padding: 0 var(--gap);
    margin: calc(1.5 * var(--gap)) 0;
}

footer#page-footer .content {
    max-width: var(--main-width);
    margin-right: auto;
    margin-left: auto;
    text-align: center;
    color: var(--secondary-text);
}

footer#page-footer .content a {
    color: var(--secondary-text);
}

/* footer }}} */

/* main {{{ */

main {
    position: relative;
    max-width: calc(var(--main-width) + var(--gap) * 2);
    padding: 0 var(--gap);
    margin: var(--gap) auto calc(var(--gap) * 2) auto;
}

.pagination {
    display: flex;
}

.button {
    color: var(--secondary-text);
    font-size: 0.8em;
    line-height: 2.8em;
    background: var(--background);
    border-radius: 1.4em;
    padding: 0 1.2em;
    border: 1px solid transparent;
    border-color: var(--button-color);
    border-width: 1px;
    text-decoration: none;
}

.button:hover {
    color: var(--background);
    border-color: transparent;
    background: var(--button-color);
    text-decoration: none;
}

.button.right {
    margin-left: auto;
}

/* main }}} */

/* post entry summary {{{ */

main.list > header {
    margin-bottom: var(--gap);
}

article.summary {
    padding: 1em 0;
}

article.summary h2 a {
    color: var(--text-color);
    text-decoration: none;
}

article.summary h2 a:hover {
    text-decoration: underline;
}

article.summary p {
    margin: 0 !important;
}

article.summary header {
    margin-bottom: 1em;
}

article.summary .metadata,
article.summary .metadata a {
    color: var(--secondary-text);
}

article.summary:not(:first-of-type) {
    border-top: 2px solid var(--hr-color);
}

/* post entry summary }}} */

/* article {{{ */

article header {
    margin-bottom: var(--content-gap);
}

article .metadata,
article .metadata a {
    color: var(--secondary-text);
}

article .content h1 {
    margin-top: 2.5rem;
    margin-bottom: 2rem;
}

article .content h2 {
    margin-top: 2rem;
    margin-bottom: 1.5rem;
}

article .content h3 {
    margin-top: 1.5rem;
    margin-bottom: 1rem;
}

article .content h4,
article .content h5,
article .content h6 {
    margin-top: 1.5rem;
    margin-bottom: 0.5rem;
}

article .content ol,
article .content p,
article .content:not(li) > ul {
    margin-bottom: var(--content-gap);
}

article .content ol,
article .content ul {
    padding-left: 1.25rem;
}

article .content li {
    margin-top: 0.3rem;
}

article .content li p {
    margin-bottom: 0;
}

article .content pre {
    margin-bottom: var(--gap);
    border-radius: 4px;
    overflow-x: auto;
    margin-left: 0;
    margin-right: 0;
    border: 1px solid var(--hr-dark);
    background-color: var(--code-bg)!important;
}

article .content code {
    border: 1px solid var(--hr-dark);
    background-color: var(--code-bg);
    padding: 4px 6px;
    font-family: monospace;
    line-height: 1.5;
    border-radius: 2px;
}

article .content pre code {
    display: block;
    margin-left: 0;
    margin-right: 0;
    padding: calc(var(--gap)/2);
    border: none;
    background: 0 0;
}

article .content blockquote {
    padding: 0 0 0 1.2rem;
    border-left: 3px solid var(--secondary-text);
    color: var(--secondary-text);
}

article .content hr {
    height: 2px;
    margin-top: var(--content-gap);
    margin-bottom: var(--content-gap);
    background: var(--hr-color);
    border-top: 0;
    border-bottom: 0;
    border: 0;
}

/* article }}} */

/* other {{{ */

.table-container {
    overflow-x: auto;
}

/* other }}} */