/*
 * Styles adapted from The Best Motherfucking Website
 * https://github.com/denysvitali/thebestmotherfuckingwebsite
 * License: MIT / WTFPL
 */

body {
    max-width: 800px;
    margin: 40px auto;
    font-family:
        "Open Sans", "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
    color: #464646;
    background-color: #ffffff;
    font-size: 16px;
    line-height: 1.6;
    letter-spacing: 0.02em;
    text-align: left;
    padding: 0 10px;
}

/* ===== Dark mode (inverted) ===== */
body.inverted {
    color: #ffffff;
    background-color: #000000;
}
body.inverted a:link {
    color: #66ccff;
}
body.inverted a:visited {
    color: #cc99aa;
}
body.inverted .block1 {
    color: #cccccc;
}
body.inverted .block1::before {
    background-color: #cccccc;
}
body.inverted .block2 {
    color: #cccccc;
}
body.inverted .block2::before {
    background-color: #cccccc;
}

/* ===== High contrast mode ===== */
body.highcontrast {
    color: #000000;
}
body.highcontrast .block1 {
    color: #000000;
}
body.highcontrast .block1::before {
    background-color: #000000;
}
body.highcontrast .block2 {
    color: #000000;
}
body.highcontrast .block2::before {
    background-color: #000000;
}

/* Inverted + high contrast = still inverted (white on black) */
body.inverted.highcontrast {
    color: #ffffff;
    background-color: #000000;
}

/* ===== Mode toggles ===== */
aside {
    float: right;
    font-size: 14px;
    white-space: nowrap;
    margin-bottom: 1em;
}
.mode-toggle {
    background: none;
    border: none;
    -webkit-appearance: none;
    font-family: inherit;
    font-size: 1em;
    padding: 0.2em 0.4em;
    cursor: pointer;
    opacity: 0.5;
    transition: opacity 0.15s;
}
body:not(.inverted) .mode-toggle {
    color: #0077aa;
}
body.inverted .mode-toggle {
    color: #66ccff;
}
.mode-toggle:hover {
    opacity: 1;
}
.mfw {
    color: rgb(22, 160, 133);
}
.mfwlink {
    color: rgb(22, 160, 133);
    text-decoration: underline;
}
ul li img {
    height: 1em;
}
.code {
    font-family: monospace;
    font-size: 0.95em;
}
.block1 {
    font-weight: bold;
    color: #444444;
}
.block1::before {
    content: "";
    display: inline-block;
    height: 1em;
    width: 1em;
    background-color: #444444;
}
.block2 {
    font-weight: bold;
    color: #454545;
}
.block2::before {
    content: "";
    display: inline-block;
    height: 1em;
    width: 1em;
    background-color: #454545;
}
.fauxparagraf {
    display: block;
    margin-top: 1em;
    margin-bottom: 1em;
    overflow: auto;
}
.chat {
    width: 100%;
    margin-right: 1em;
}
.photo {
    float: left;
    width: 40%;
    margin-right: 1em;
}
.soustitre {
    font-size: 0.75em;
}
blockquote {
    font-size: 1.2em;
    margin: 1em 0;
}
blockquote p {
    display: inline;
    margin: 0;
}
blockquote::before {
    content: open-quote;
    font-size: 2em;
    margin-right: 0.3em;
    font-family: "Times New Roman", Times, serif;
}
blockquote footer,
.sousblockquote {
    display: block;
    font-size: 0.6em;
    font-style: italic;
    margin-left: 3em;
}
.kopimi {
    margin-left: auto;
    margin-right: auto;
    display: block;
    height: 2em;
}
.cit {
    font-size: 0.7em;
    vertical-align: top;
    margin-left: 0.2em;
}
#wrong {
    color: maroon;
    font-weight: bold;
    text-decoration: underline;
}
a:link {
    color: #0077aa;
}
a:visited {
    color: #941352;
}
small {
    font-size: 0.5em;
}

/* ===== Code blocks (Chroma) ===== */
.chroma {
    padding: 0.75em 1em;
    border-radius: 6px;
    overflow-x: auto;
    font-size: 0.9em;
    line-height: 1.5;
}
code {
    font-family:
        "SF Mono", "Fira Code", "Fira Mono", "Roboto Mono", "Noto Sans SC",
        monospace;
    font-size: 0.9em;
}
:not(pre) > code {
    padding: 0.15em 0.35em;
    border-radius: 4px;
    background-color: #f0f0f0;
}
body.inverted :not(pre) > code {
    background-color: #30363d;
}

/* cyrillic-ext */
@font-face {
    font-family: "Open Sans";
    font-style: normal;
    font-weight: 400;
    src:
        local("Open Sans Regular"),
        local("OpenSans-Regular"),
        url(https://fonts.gstatic.com/s/opensans/v15/mem8YaGs126MiZpBA-UFWJ0bbck.woff2)
            format("woff2");
    unicode-range:
        U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
    font-family: "Open Sans";
    font-style: normal;
    font-weight: 400;
    src:
        local("Open Sans Regular"),
        local("OpenSans-Regular"),
        url(https://fonts.gstatic.com/s/opensans/v15/mem8YaGs126MiZpBA-UFUZ0bbck.woff2)
            format("woff2");
    unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
    font-family: "Open Sans";
    font-style: normal;
    font-weight: 400;
    src:
        local("Open Sans Regular"),
        local("OpenSans-Regular"),
        url(https://fonts.gstatic.com/s/opensans/v15/mem8YaGs126MiZpBA-UFWZ0bbck.woff2)
            format("woff2");
    unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
    font-family: "Open Sans";
    font-style: normal;
    font-weight: 400;
    src:
        local("Open Sans Regular"),
        local("OpenSans-Regular"),
        url(https://fonts.gstatic.com/s/opensans/v15/mem8YaGs126MiZpBA-UFVp0bbck.woff2)
            format("woff2");
    unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
    font-family: "Open Sans";
    font-style: normal;
    font-weight: 400;
    src:
        local("Open Sans Regular"),
        local("OpenSans-Regular"),
        url(https://fonts.gstatic.com/s/opensans/v15/mem8YaGs126MiZpBA-UFWp0bbck.woff2)
            format("woff2");
    unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
    font-family: "Open Sans";
    font-style: normal;
    font-weight: 400;
    src:
        local("Open Sans Regular"),
        local("OpenSans-Regular"),
        url(https://fonts.gstatic.com/s/opensans/v15/mem8YaGs126MiZpBA-UFW50bbck.woff2)
            format("woff2");
    unicode-range:
        U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF,
        U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
    font-family: "Open Sans";
    font-style: normal;
    font-weight: 400;
    src:
        local("Open Sans Regular"),
        local("OpenSans-Regular"),
        url(https://fonts.gstatic.com/s/opensans/v15/mem8YaGs126MiZpBA-UFVZ0b.woff2)
            format("woff2");
    unicode-range:
        U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
        U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215,
        U+FEFF, U+FFFD;
}
