/* MyCorr Arctic Design System — mdBook theme override */

/* ── Geist font ── */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:wght@400;500;600;700&family=Geist+Mono:wght@400;500;600&display=swap');

/* ── Global overrides ── */
:root {
    --sidebar-target-width: 240px;
    --mono-font: "Geist Mono", monospace;
    --code-font-size: 0.85em;
}

/* ── Light theme ── */
.light, html:not(.js) {
    --bg: hsl(230, 20%, 99%);
    --fg: hsl(215, 25%, 20%);

    --sidebar-bg: hsl(204, 30%, 97%);
    --sidebar-fg: hsl(215, 25%, 20%);
    --sidebar-non-existant: hsl(215, 15%, 50%);
    --sidebar-active: hsl(205, 60%, 48%);
    --sidebar-spacer: hsl(210, 25%, 88%);

    --scrollbar: hsl(215, 15%, 50%);

    --icons: hsl(215, 15%, 50%);
    --icons-hover: hsl(205, 60%, 48%);

    --links: hsl(205, 60%, 48%);

    --inline-code-color: hsl(205, 60%, 40%);

    --theme-popup-bg: hsl(230, 20%, 99%);
    --theme-popup-border: hsl(210, 25%, 88%);
    --theme-hover: hsl(210, 35%, 94%);

    --quote-bg: hsl(204, 30%, 97%);
    --quote-border: hsl(210, 25%, 88%);

    --warning-border: hsl(38, 90%, 35%);

    --table-border-color: hsl(210, 25%, 88%);
    --table-header-bg: hsl(210, 35%, 94%);
    --table-alternate-bg: hsl(204, 30%, 97%);

    --searchbar-border-color: hsl(210, 25%, 88%);
    --searchbar-bg: hsl(230, 20%, 99%);
    --searchbar-fg: hsl(215, 25%, 20%);
    --searchbar-shadow-color: hsl(210, 25%, 88%);
    --searchresults-header-fg: hsl(215, 15%, 50%);
    --searchresults-border-color: hsl(210, 25%, 88%);
    --searchresults-li-bg: hsl(207, 54%, 88%);
    --search-mark-bg: hsl(207, 54%, 88%);

    --color-scheme: light;

    --footnote-highlight: hsl(205, 60%, 48%);
    --overlay-bg: rgba(200, 200, 210, 0.4);
}

/* ── Dark theme (all dark variants → MyCorr dark) ── */
.coal, .navy, .ayu, .rust {
    --bg: hsl(218, 22%, 10%);
    --fg: hsl(210, 40%, 96%);

    --sidebar-bg: hsl(215, 25%, 13%);
    --sidebar-fg: hsl(210, 40%, 96%);
    --sidebar-non-existant: hsl(210, 15%, 65%);
    --sidebar-active: hsl(205, 65%, 55%);
    --sidebar-spacer: hsl(220, 25%, 25%);

    --scrollbar: hsl(210, 15%, 65%);

    --icons: hsl(210, 15%, 65%);
    --icons-hover: hsl(205, 65%, 55%);

    --links: hsl(205, 65%, 55%);

    --inline-code-color: hsl(205, 65%, 62%);

    --theme-popup-bg: hsl(215, 25%, 13%);
    --theme-popup-border: hsl(220, 25%, 25%);
    --theme-hover: hsl(215, 30%, 19%);

    --quote-bg: hsl(215, 25%, 13%);
    --quote-border: hsl(220, 25%, 25%);

    --warning-border: hsl(38, 95%, 60%);

    --table-border-color: hsl(220, 25%, 25%);
    --table-header-bg: hsl(215, 30%, 19%);
    --table-alternate-bg: hsl(215, 25%, 13%);

    --searchbar-border-color: hsl(220, 25%, 25%);
    --searchbar-bg: hsl(215, 30%, 19%);
    --searchbar-fg: hsl(210, 40%, 96%);
    --searchbar-shadow-color: hsl(220, 25%, 25%);
    --searchresults-header-fg: hsl(210, 15%, 65%);
    --searchresults-border-color: hsl(220, 25%, 25%);
    --searchresults-li-bg: hsl(215, 25%, 13%);
    --search-mark-bg: hsl(215, 40%, 32%);

    --color-scheme: dark;

    --footnote-highlight: hsl(205, 65%, 55%);
    --overlay-bg: rgba(10, 14, 20, 0.5);
}

/* ── Auto dark preference ── */
@media (prefers-color-scheme: dark) {
    html:not(.js) {
        --bg: hsl(218, 22%, 10%);
        --fg: hsl(210, 40%, 96%);

        --sidebar-bg: hsl(215, 25%, 13%);
        --sidebar-fg: hsl(210, 40%, 96%);
        --sidebar-non-existant: hsl(210, 15%, 65%);
        --sidebar-active: hsl(205, 65%, 55%);
        --sidebar-spacer: hsl(220, 25%, 25%);

        --scrollbar: hsl(210, 15%, 65%);

        --icons: hsl(210, 15%, 65%);
        --icons-hover: hsl(205, 65%, 55%);

        --links: hsl(205, 65%, 55%);

        --inline-code-color: hsl(205, 65%, 62%);

        --theme-popup-bg: hsl(215, 25%, 13%);
        --theme-popup-border: hsl(220, 25%, 25%);
        --theme-hover: hsl(215, 30%, 19%);

        --quote-bg: hsl(215, 25%, 13%);
        --quote-border: hsl(220, 25%, 25%);

        --warning-border: hsl(38, 95%, 60%);

        --table-border-color: hsl(220, 25%, 25%);
        --table-header-bg: hsl(215, 30%, 19%);
        --table-alternate-bg: hsl(215, 25%, 13%);

        --searchbar-border-color: hsl(220, 25%, 25%);
        --searchbar-bg: hsl(215, 30%, 19%);
        --searchbar-fg: hsl(210, 40%, 96%);
        --searchbar-shadow-color: hsl(220, 25%, 25%);
        --searchresults-header-fg: hsl(210, 15%, 65%);
        --searchresults-border-color: hsl(220, 25%, 25%);
        --searchresults-li-bg: hsl(215, 25%, 13%);
        --search-mark-bg: hsl(215, 40%, 32%);

        --color-scheme: dark;
    }
}

/* ── Theme picker: hide unwanted themes, rename Coal → Dark ── */
#theme-list > button[id="ayu"],
#theme-list > button[id="navy"],
#theme-list > button[id="rust"] {
    display: none !important;
}

#theme-list > button[id="coal"] {
    font-size: 0;
}
#theme-list > button[id="coal"]::after {
    content: "Dark";
    font-size: 14px;
}

/* ── Hide sidebar scrollbar ── */
.sidebar .sidebar-scrollbox {
    scrollbar-width: none;            /* Firefox */
    -ms-overflow-style: none;         /* IE/Edge */
}
.sidebar .sidebar-scrollbox::-webkit-scrollbar {
    display: none;                    /* Chrome/Safari */
}

/* ── Typography ── */
body {
    font-family: "Noto Sans", system-ui, sans-serif;
    font-weight: 400;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
    font-family: "Noto Sans", system-ui, sans-serif;
    font-weight: 600;
}

code, pre, .hljs {
    font-family: "Geist Mono", monospace;
}

/* ── Sidebar refinements ── */
.sidebar .sidebar-scrollbox {
    font-size: 13px;
}

.sidebar ol.chapter li a {
    padding: 6px 16px;
    border-radius: 2px;
}

.sidebar ol.chapter li a:hover {
    background: var(--theme-hover);
}

.sidebar ol.chapter li.chapter-item.expanded a.active {
    font-weight: 600;
}

/* ── Content refinements ── */
.content main {
    font-size: 15px;
    line-height: 1.7;
}

.content a {
    text-decoration: underline;
    text-decoration-color: var(--links);
    text-underline-offset: 2px;
}

.content a:hover {
    opacity: 0.8;
}

/* ── Code blocks ── */
pre {
    border-radius: 2px;
    border: 1px solid var(--table-border-color);
}

code:not(pre > code) {
    padding: 1px 5px;
    border-radius: 2px;
    font-size: 0.88em;
}

/* ── Tables ── */
table {
    border-radius: 2px;
    overflow: hidden;
}

table th {
    font-weight: 600;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

/* ── Blockquotes ── */
blockquote {
    border-radius: 2px;
}

/* ── Legal metadata ── */
.legal-meta {
    color: var(--links);
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0.02em;
    margin-top: -8px;
    margin-bottom: 24px;
}

/* ── Menu bar ── */
#menu-bar {
    border-bottom: 1px solid var(--table-border-color);
}
