/* Small tweaks layered on top of sphinx-better-theme. */

/* Typography: a refined serif for headings paired with a clean modern sans for
   body text. System-font stacks so it renders identically offline and on RTD. */
:root {
    --nc-serif: "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, serif;
    --nc-sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --nc-mono: ui-monospace, "SF Mono", "SFMono-Regular", "JetBrains Mono", "Fira Code",
        "Cascadia Code", Menlo, Consolas, "Liberation Mono", monospace;

    /* Dark theme palette */
    --nc-bg: #1b1e23;
    --nc-surface: #22272e;
    --nc-fg: #c9ccd1;
    --nc-fg-strong: #e8eaed;
    --nc-muted: #8b929c;
    --nc-border: #2c3138;
    --nc-link: #8ab4f8;
    --nc-link-hover: #adc8fb;
}

/* Serif body, a touch larger, on a dark page. */
html, body { background: var(--nc-bg); }
body {
    font-family: var(--nc-serif);
    font-size: 1.0625rem;   /* ~17px */
    color: var(--nc-fg);
    line-height: 1.6;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--nc-serif);
    color: var(--nc-fg-strong);
    letter-spacing: -0.01em;
}
h1 { font-size: 2.4rem; line-height: 1.2; }
h2 { font-size: 1.8rem; margin-top: 2rem; }
h3 { font-size: 1.35rem; margin-top: 1.5rem; }

/* The project name belongs to the sidebar; keep the index title for Sphinx
   metadata while showing only the subtitle in the content column. */
.body section#nanocode > h1 { display: none; }
.body section#nanocode > p:first-of-type {
    margin-top: 2.4rem;
    font-size: 2rem;
    font-weight: 400;
    line-height: 1.2;
}

/* Links */
a, a:visited { color: var(--nc-link); }
a:hover { color: var(--nc-link-hover); }

/* Header, relbars, footer */
header#pageheader h1 a, header#pageheader h1 a:visited { color: var(--nc-fg-strong); }
.related.top { border-bottom-color: var(--nc-border); }
.related.bottom { border-top-color: var(--nc-border); }
.related, .related a, .related a:visited,
footer#pagefooter, footer#pagefooter a, footer#pagefooter a:visited { color: var(--nc-muted); }
.related a:hover, footer#pagefooter a:hover { color: var(--nc-fg); }

/* Keep the bottom navigation inside the content column instead of running
   underneath the fixed sidebar. */
@media (min-width: 821px) {
    .bodywrapper {
        box-sizing: border-box;
        padding-left: 1.5rem;
    }
    .related.bottom {
        width: min(calc(100% - 16rem), 44rem);
        margin-left: max(16rem, calc((100vw - 60rem) / 2 + 16rem));
        margin-right: 0;
    }
}

/* Fixed sidebar: the theme's bodywrapper keeps a matching 16rem content gutter.
   A long navigation tree scrolls internally. */
.sphinxsidebar {
    font-size: 1.0625rem;
    position: fixed;
    top: 1.5rem;
    left: max(0px, calc((100vw - 60rem) / 2));
    margin-left: 0;
    float: none;
    max-height: calc(100vh - 1.5rem);
    overflow-y: auto;
    scrollbar-color: #3a4048 transparent;
}
.sphinxsidebar, .sphinxsidebar a, .sphinxsidebar a:visited { color: var(--nc-fg); }
.sphinxsidebar h3, .sphinxsidebar h3 a, .sphinxsidebar h3 a:visited { color: var(--nc-muted); }
.sphinxsidebar h3.site-title {
    font-size: 2.5rem;
    margin-bottom: 0.75rem;
}
.sphinxsidebar h3.site-title a,
.sphinxsidebar h3.site-title a:visited { color: var(--nc-fg-strong); }
.sphinxsidebar a:hover { color: var(--nc-link); }

.sphinxsidebar .github-star {
    display: block;
    margin: 0 0 1.25rem;
}
.sphinxsidebar .doc-language {
    margin: -0.55rem 0 1.1rem;
    font-family: var(--nc-sans);
    font-size: 0.92rem;
    font-weight: 400;
}
.sphinxsidebar .doc-language a,
.sphinxsidebar .doc-language a:visited {
    color: var(--nc-link);
}
.sphinxsidebar .doc-language a:hover {
    color: var(--nc-link-hover);
    text-decoration: underline;
}
.sphinxsidebar .doc-language-current { color: var(--nc-fg-strong); }
.sphinxsidebar .doc-language-sep {
    margin: 0 0.4rem;
    color: var(--nc-muted);
}

/* Separate documentation pages from sections within the current page. */
.sphinxsidebar .toctree-l1 > a {
    color: var(--nc-fg-strong);
    font-weight: 600;
}
.sphinxsidebar .toctree-l2 > a {
    color: var(--nc-muted);
    font-size: 1rem;
}

/* Use one stable highlight for both the current page and subsection. None of
   these properties affect layout, so moving the highlight cannot shift links. */
.sphinxsidebar a.current,
.sphinxsidebar a.nc-active {
    color: var(--nc-fg-strong);
    background: rgba(138, 180, 248, 0.16);
    box-shadow: 0 0 0 3px rgba(138, 180, 248, 0.16);
    border-radius: 2px;
}
.sphinxsidebar input {
    background: var(--nc-surface);
    border: 1px solid var(--nc-border);
    color: var(--nc-fg);
    font-size: 0.95rem;
}

/* Tables */
table.docutils, table.docutils td, table.docutils th {
    border-color: var(--nc-border) !important;
}
table.docutils th { background: var(--nc-surface); color: var(--nc-fg-strong); }
.tool-reference { width: 100%; table-layout: fixed; }
.tool-reference figure { margin: 1rem 0 0; }

/* Terminal pictures: small faithful renderings of a nanocode screen or output,
   so a feature is recognisable on sight. Shared by every diagram in the docs. */
.term-shot {
    margin: 1.25rem 0 1.5rem;
    padding: 0.9rem 1.1rem;
    background: #282c34;
    border: 1px solid #21252b;
    border-radius: 8px;
    font-family: var(--nc-mono);
    font-size: 0.9rem;
    line-height: 1.7;
    white-space: pre;
    overflow-x: auto;
}
.term-shot span { display: block; }
.term-shot .fs-i, .term-shot .fs-caret { display: inline; }
.fs-user, .fs-queued { color: #d19a66; }
.fs-tool { color: #98c379; }
.fs-prompt { color: #abb2bf; }
.fs-divider, .fs-hint, .fs-dim { color: #5c6370; }
.fs-add { color: #98c379; }
.fs-del { color: #e06c75; }
.fs-sel { color: #56b6c2; }
.fs-tab-on { color: #282c34; background: #56b6c2; }
.fs-tab-off { color: #56b6c2; }
.fs-goal { color: #c678dd; }
.fs-doing { color: #e5c07b; }

/* Admonitions */
.admonition, .note, .topic, .seealso {
    background: var(--nc-surface) !important;
    border: 1px solid var(--nc-border) !important;
    color: var(--nc-fg);
}
.admonition.warning {
    background: #2a2620 !important;
    border-color: #5a4a2a !important;
}
.admonition.warning p.admonition-title { color: #d9b45f; }
.admonition.warning tt, .admonition.warning code { background: #3a3324; color: #e8dcc0; }
blockquote { color: var(--nc-muted); }

/* Code: modern monospace, soft card-like blocks, tidy inline chips. */
pre, tt, code, kbd, .highlight pre {
    font-family: var(--nc-mono);
}

/* Fenced/highlighted code blocks — dark, to match the One Dark syntax theme. */
div.highlight {
    background: #282c34;
    border: 1px solid #21252b;
    border-radius: 8px;
    margin: 1rem 0;
    overflow-x: auto;
}
div.highlight pre {
    margin: 0;
    padding: 0.85rem 1rem;
    background: transparent;
    border: 0;
    font-size: 0.95rem;
    line-height: 1.6;
    color: #abb2bf;
}

/* Plain (unhighlighted) pre blocks */
pre {
    background: #282c34;
    border: 1px solid #21252b;
    border-radius: 8px;
    margin: 1rem 0;
    padding: 0.85rem 1rem;
    font-size: 0.95rem;
    line-height: 1.6;
    color: #abb2bf;
    overflow-x: auto;
}

/* Inline code */
code.docutils.literal, tt.docutils.literal, code.literal {
    background: #2d333b;
    border: 1px solid var(--nc-border);
    border-radius: 5px;
    padding: 0.06em 0.36em;
    font-size: 0.9em;
    color: #e6e6e6;
}
code.docutils.literal .pre { color: inherit; }

/* Figures: centered, softly framed screenshots with a quiet caption. */
figure.align-center { text-align: center; margin: 1.5rem 0; }
figure img {
    max-width: 100%;
    height: auto;
    border: 1px solid var(--nc-border);
    border-radius: 10px;
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.4);
}
figure figcaption {
    margin-top: 0.6rem;
    font-size: 0.85rem;
    font-style: italic;
    color: var(--nc-muted);
}

/* Don't select shell prompts / doctest markers when copying code. */
.highlight .gp { user-select: none; }

/* Text selection tinted to the theme instead of the browser default blue. */
::selection { background: #3a5680; color: #fff; }

/* Subtle scrollbars for code that overflows, so they don't flash light on dark. */
div.highlight::-webkit-scrollbar, pre::-webkit-scrollbar { height: 10px; }
div.highlight::-webkit-scrollbar-thumb, pre::-webkit-scrollbar-thumb {
    background: #3a4048;
    border-radius: 6px;
}
div.highlight::-webkit-scrollbar-track, pre::-webkit-scrollbar-track { background: transparent; }

/* A restrained marker treatment for a few details users should not miss. */
.marker {
    border-bottom: 1px solid #9a7b3f;
    padding-bottom: 1px;
}

div.highlight, pre { scrollbar-color: #3a4048 transparent; }
