/* =========================================================================
 * krypteia-sphinx.css
 *
 * Adapter applying the crypto-docs.css design tokens (phosphor palette,
 * IBM Plex stack, admonition variants) to the Sphinx Read-the-Docs theme
 * HTML structure. Loaded AFTER sphinx_rtd_theme.css so that the dark
 * theme overrides the upstream RTD defaults.
 *
 * Canonical design system: ./crypto-docs.css.
 * Section numbering: ./custom.css.
 *
 * SPDX-License-Identifier: Apache-2.0
 * Copyright 2026 Cédric Mesnil <cslashm@pm.me>
 *
 * Assumes crypto-docs.css is already loaded earlier in html_css_files (so
 * the design tokens are in scope here). Do NOT @import it — the parallel
 * load via conf.py is faster than a render-blocking @import chain.
 * ========================================================================= */

/* ---------- RTD shell: kill the default light backgrounds ----------------- */

html, body { background: var(--bg-0); color: var(--fg-1); }

.wy-grid-for-nav,
.wy-nav-content-wrap,
.wy-nav-content-wrap.shift {
    background: var(--bg-0);
}

.wy-nav-content {
    background: transparent;
    color: var(--fg-1);
    max-width: calc(var(--content-width) + 6rem);
    margin: 0 auto;
    padding: 3rem 3rem 6rem;
}

/* Restore the subtle grid background defined in crypto-docs.css */
.wy-nav-content-wrap {
    background:
        linear-gradient(var(--line) 1px, transparent 1px) 0 0 / 100% 64px,
        linear-gradient(90deg, var(--line) 1px, transparent 1px) 0 0 / 64px 100%,
        radial-gradient(ellipse at top, #0e1320 0%, var(--bg-0) 60%);
}
.wy-nav-content-wrap::before {
    content: "";
    position: fixed;
    inset: 0;
    background: var(--bg-0);
    opacity: 0.92;
    pointer-events: none;
    z-index: 0;
}
.wy-nav-content { position: relative; z-index: 1; }

/* ---------- Sidebar (.wy-nav-side) ---------------------------------------- */

.wy-nav-side {
    background: var(--bg-1);
    border-right: 1px solid var(--line);
    padding-top: 0;
}

.wy-side-nav-search {
    background: var(--bg-1);
    border-bottom: 1px solid var(--line);
    padding: 1.5rem 1rem;
}
.wy-side-nav-search > a,
.wy-side-nav-search .wy-dropdown > a {
    font-family: var(--font-mono);
    font-weight: 600;
    font-size: 0.95rem;
    color: var(--fg-0);
    letter-spacing: 0.02em;
}
.wy-side-nav-search > a::before {
    content: "// ";
    color: var(--accent);
}
.wy-side-nav-search > a img.logo { display: none; }

.wy-side-nav-search > div.version {
    color: var(--fg-3);
    font-family: var(--font-mono);
    font-size: 0.78rem;
    margin-top: 0.4em;
}

.wy-side-nav-search input[type="text"] {
    background: var(--bg-2);
    border: 1px solid var(--line-strong);
    border-radius: var(--radius);
    color: var(--fg-0);
    font-family: var(--font-mono);
    font-size: 0.85rem;
    padding: 0.4em 0.7em;
}
.wy-side-nav-search input[type="text"]:focus {
    border-color: var(--accent);
    outline: 0;
    box-shadow: 0 0 0 1px var(--accent-soft);
}

.wy-menu-vertical { background: transparent; }
.wy-menu-vertical p.caption {
    font-family: var(--font-mono);
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--fg-3);
    margin: 1.4rem 0 0.4rem;
    padding: 0 1.4em;
}
.wy-menu-vertical p.caption .caption-text { color: inherit; }

/* Force every flavour of sidebar link to the dark palette.
 * RTD ships several layered light-mode backgrounds (`#fcfcfc`, `#e3e3e3`,
 * `#c9c9c9`, `#bdbdbd`) on `.wy-menu-vertical li.current`, `li.current ul
 * li a`, `li.toctree-l1.current li.toctree-l2 a`, etc. They all win on
 * specificity unless we explicitly !important them down. */
.wy-menu-vertical a,
.wy-menu-vertical li a,
.wy-menu-vertical li.current a,
.wy-menu-vertical li.current ul li a,
.wy-menu-vertical li.toctree-l1 a,
.wy-menu-vertical li.toctree-l2 a,
.wy-menu-vertical li.toctree-l3 a,
.wy-menu-vertical li.toctree-l4 a,
.wy-menu-vertical li.toctree-l5 a,
.wy-menu-vertical li.toctree-l1.current li.toctree-l2 a,
.wy-menu-vertical li.toctree-l2.current li.toctree-l3 a,
.wy-menu-vertical li.toctree-l3.current li.toctree-l4 a {
    background: transparent !important;
    color: var(--fg-2) !important;
    border-right: 0 !important;
    border-left: 2px solid transparent !important;
    padding: 0.3rem 1.4em;
    font-weight: 400;
    transition: background 0.15s var(--ease), color 0.15s var(--ease);
}

/* Active page (the one currently rendered): cyan text + tinted background
 * + cyan left border, regardless of depth in the toctree. */
.wy-menu-vertical li.current > a,
.wy-menu-vertical li.toctree-l1.current > a,
.wy-menu-vertical li.toctree-l2.current > a,
.wy-menu-vertical li.toctree-l3.current > a,
.wy-menu-vertical li.toctree-l4.current > a,
.wy-menu-vertical li.toctree-l5.current > a {
    background: var(--accent-soft) !important;
    color: var(--accent) !important;
    border-left-color: var(--accent) !important;
    font-weight: 500;
}

/* Hover state — same regardless of nesting depth. */
.wy-menu-vertical a:hover,
.wy-menu-vertical li a:hover,
.wy-menu-vertical li.current a:hover,
.wy-menu-vertical li.current ul li a:hover {
    background: var(--bg-2) !important;
    color: var(--fg-0) !important;
}

/* Sphinx's parent-but-not-current branches: they were tagged `.current`
 * but we don't want them styled as the active page — only the leaf
 * `current > a` should glow cyan. Re-mute the wrapper li backgrounds. */
.wy-menu-vertical li.current,
.wy-menu-vertical li.toctree-l1.current,
.wy-menu-vertical li.toctree-l2.current,
.wy-menu-vertical li.toctree-l3.current {
    background: transparent !important;
}

/* Sidebar version footer */
.wy-nav-side .wy-side-scroll { background: transparent; }

/* ---------- Mobile top bar ------------------------------------------------ */

.wy-nav-top {
    background: var(--bg-1);
    border-bottom: 1px solid var(--line);
    color: var(--fg-0);
    font-family: var(--font-mono);
}
.wy-nav-top a {
    color: var(--fg-0);
}

/* ---------- Main content: heading hierarchy ------------------------------- */
/* The crypto-docs.css base already styles h1..h4 on the bare elements; the
 * RTD theme adds its own h2::before and h3::before that conflict with the
 * cyan accent bar / § marker we want. Re-assert here for RTD-scoped headings. */

.rst-content h1 {
    font-family: var(--font-serif);
    font-weight: 500;
    color: var(--fg-0);
    border-bottom: 1px solid var(--line-strong);
    padding-bottom: 0.6rem;
}

.rst-content h2 {
    font-family: var(--font-sans);
    font-weight: 600;
    color: var(--fg-0);
    border: 0;
    /* Neutralise crypto-docs.css generic h2 { position: relative;
     * padding-left: 1.2rem; } — the cyan accent bar that would land
     * there overlays the custom.css numbering. The numbering itself
     * is the marker. */
    padding-left: 0;
    position: static;
}
.rst-content h2::before {
    /* Neutralise crypto-docs.css generic h2::before { content: ""; position:
     * absolute; left: 0; width: 3px; background: cyan } — that rule would
     * turn this ::before into a 3-px bar at left:0 even though custom.css
     * has already filled `content` with the section number. */
    position: static;
    width: auto;
    height: auto;
    background: transparent;
    top: auto; bottom: auto; left: auto; right: auto;
    /* Inline section-number styling. */
    display: inline;
    color: var(--accent);
    font-family: var(--font-mono);
    font-weight: 500;
    font-size: 0.7em;
    letter-spacing: 0.08em;
    margin-right: 0.7em;
    vertical-align: 0.18em;
}
.rst-content h3::before,
.rst-content h4::before {
    color: var(--fg-3);
    font-family: var(--font-mono);
    font-weight: 500;
    font-size: 0.78em;
    margin-right: 0.6em;
    vertical-align: 0.12em;
}

.rst-content h3 { color: var(--fg-0); border: 0; }

/* ---------- Links --------------------------------------------------------- */

.rst-content a, .wy-nav-content a {
    color: var(--link);
    text-decoration: none;
    border-bottom: 1px solid color-mix(in srgb, var(--link) 40%, transparent);
    transition: border-color 0.15s var(--ease), color 0.15s var(--ease);
}
.rst-content a:hover, .wy-nav-content a:hover {
    color: var(--link-hover);
    border-bottom-color: var(--link-hover);
}
.rst-content a.headerlink {
    border: 0;
    color: var(--fg-3);
    opacity: 0;
    transition: opacity 0.15s var(--ease);
}
.rst-content h1:hover .headerlink,
.rst-content h2:hover .headerlink,
.rst-content h3:hover .headerlink,
.rst-content h4:hover .headerlink { opacity: 1; }

/* ---------- Inline code & kbd -------------------------------------------- */

.rst-content code.literal,
.rst-content tt.literal,
.wy-nav-content code:not(.notranslate):not(.literal) {
    background: var(--bg-1);
    color: var(--cyan);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 0.12em 0.45em;
    font-family: var(--font-mono);
    font-size: 0.88em;
    font-weight: 500;
    white-space: nowrap;
}
.rst-content code.xref.py,
.rst-content code.xref {
    color: var(--cyan);
    background: var(--bg-1);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 0.12em 0.45em;
    font-family: var(--font-mono);
    font-weight: 500;
}

/* ---------- Code blocks --------------------------------------------------- */

.rst-content div[class^="highlight"],
.rst-content .highlight {
    background: var(--bg-1);
    border: 1px solid var(--line);
    border-radius: var(--radius-lg);
    margin: 1.4em 0;
}
.rst-content pre,
.rst-content div[class^="highlight"] pre,
.rst-content .highlight pre {
    background: transparent;
    color: var(--fg-0);
    font-family: var(--font-mono);
    font-size: 0.88rem;
    line-height: 1.6;
    padding: 1.25rem 1.4rem;
    border: 0;
    margin: 0;
    overflow-x: auto;
    tab-size: 4;
}

/* ---------- Pygments token colors (phosphor palette) ---------------------- */
/* Map Pygments classes to the same colors crypto-docs.css uses for hljs. */

.rst-content .highlight .k,
.rst-content .highlight .kc,
.rst-content .highlight .kd,
.rst-content .highlight .kn,
.rst-content .highlight .kp,
.rst-content .highlight .kr,
.rst-content .highlight .kt        { color: var(--violet); font-weight: 500; }
.rst-content .highlight .s,
.rst-content .highlight .s1,
.rst-content .highlight .s2,
.rst-content .highlight .sb,
.rst-content .highlight .sc,
.rst-content .highlight .sd,
.rst-content .highlight .se,
.rst-content .highlight .sh,
.rst-content .highlight .si,
.rst-content .highlight .sx,
.rst-content .highlight .sr,
.rst-content .highlight .ss        { color: var(--green); }
.rst-content .highlight .m,
.rst-content .highlight .mb,
.rst-content .highlight .mf,
.rst-content .highlight .mh,
.rst-content .highlight .mi,
.rst-content .highlight .mo        { color: var(--amber); }
.rst-content .highlight .c,
.rst-content .highlight .c1,
.rst-content .highlight .ch,
.rst-content .highlight .cm,
.rst-content .highlight .cp,
.rst-content .highlight .cs        { color: var(--fg-3); font-style: italic; }
.rst-content .highlight .nf,
.rst-content .highlight .fm        { color: var(--cyan); }
.rst-content .highlight .nc,
.rst-content .highlight .nt        { color: var(--cyan); }
.rst-content .highlight .na,
.rst-content .highlight .nd        { color: var(--violet); }
.rst-content .highlight .nb,
.rst-content .highlight .bp        { color: var(--amber); }
.rst-content .highlight .nn        { color: var(--fg-0); }
.rst-content .highlight .n,
.rst-content .highlight .nv,
.rst-content .highlight .nx        { color: var(--fg-0); }
.rst-content .highlight .o,
.rst-content .highlight .ow,
.rst-content .highlight .p         { color: var(--fg-2); }

/* ---------- Admonitions: map Sphinx variants to phosphor accents --------- */

.rst-content .admonition,
.rst-content div.admonition {
    background: var(--bg-1);
    border: 1px solid var(--line);
    border-left: 3px solid var(--fg-3);
    border-radius: var(--radius);
    padding: 1rem 1.2rem;
    margin: 1.5em 0;
    color: var(--fg-1);
}
.rst-content .admonition > .admonition-title,
.rst-content .admonition p.admonition-title,
.rst-content .admonition > p.first {
    font-family: var(--font-mono);
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--fg-2);
    background: transparent;
    padding: 0;
    margin: 0 0 0.5rem;
}
.rst-content .admonition .admonition-title::before {
    content: "▸ ";
    margin-right: 0.3em;
}

.rst-content .admonition.note,
.rst-content .admonition.hint,
.rst-content .admonition.seealso         { border-left-color: var(--cyan); }
.rst-content .admonition.note  .admonition-title,
.rst-content .admonition.hint  .admonition-title,
.rst-content .admonition.seealso .admonition-title { color: var(--cyan); }

.rst-content .admonition.tip,
.rst-content .admonition.important       { border-left-color: var(--green); }
.rst-content .admonition.tip  .admonition-title,
.rst-content .admonition.important .admonition-title { color: var(--green); }

.rst-content .admonition.warning,
.rst-content .admonition.attention,
.rst-content .admonition.caution         { border-left-color: var(--amber); }
.rst-content .admonition.warning .admonition-title,
.rst-content .admonition.attention .admonition-title,
.rst-content .admonition.caution .admonition-title { color: var(--amber); }

.rst-content .admonition.danger,
.rst-content .admonition.error           { border-left-color: var(--red); }
.rst-content .admonition.danger .admonition-title,
.rst-content .admonition.error .admonition-title { color: var(--red); }

/* CESTI/crypto-specific variants (use the .crypto class on a custom-admonition) */
.rst-content .admonition.crypto          { border-left-color: var(--violet); }
.rst-content .admonition.crypto .admonition-title { color: var(--violet); }
.rst-content .admonition.crypto .admonition-title::before { content: "⚿ "; }

/* ---------- Tables -------------------------------------------------------- */
/* Wrestle Sphinx-RTD: the default theme bundles light-mode striped rows
 * (.wy-table-odd, :nth-child(2n-1) backgrounds), middle vertical align,
 * and aggressive paragraph margins inside cells. Override the lot. */

.rst-content table.docutils,
.rst-content table.field-list,
.wy-table-responsive table,
.rst-content table.list-table,
.rst-content table.colwidths-given,
.rst-content table.colwidths-auto {
    background: transparent;
    border: 1px solid var(--line);
    border-radius: var(--radius-lg);
    border-collapse: collapse;
    width: 100%;
    margin: 1.5em 0;
    font-size: 0.92rem;
    overflow: hidden;
    box-shadow: none;
}

.rst-content table.docutils thead,
.wy-table-responsive table thead { background: var(--bg-1); }

.rst-content table.docutils thead th,
.rst-content table.docutils th,
.wy-table-responsive table th {
    background: var(--bg-1);
    color: var(--fg-2);
    font-family: var(--font-mono);
    font-weight: 600;
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    border: 0;
    border-bottom: 1px solid var(--line);
    padding: 0.7rem 1rem;
    text-align: left;
    vertical-align: top;
    white-space: normal;
}

.rst-content table.docutils td,
.wy-table-responsive table td,
.rst-content table.docutils tbody tr td,
.rst-content table.docutils tbody tr:nth-child(2n-1) td,
.rst-content table.docutils.wy-table-odd tr:nth-child(2n-1) td,
.rst-content table.docutils.wy-table-striped tr:nth-child(2n-1) td,
.wy-table-odd td,
.wy-table-striped tr:nth-child(2n-1) td,
.wy-table-backed,
.wy-table-bordered-all {
    background: transparent !important;
    color: var(--fg-1);
    border: 0;
    border-bottom: 1px solid var(--line);
    padding: 0.7rem 1rem;
    vertical-align: top;        /* content sits at top of cell, not centered */
    white-space: normal;
}

.rst-content table.docutils tbody tr:hover td,
.wy-table-responsive table tbody tr:hover td {
    background: var(--bg-1) !important;
}
.rst-content table.docutils tbody tr:last-child td,
.wy-table-responsive table tbody tr:last-child td { border-bottom: 0; }

/* Sphinx wraps every cell's prose in <p>. RTD defaults add big margins
 * which puff up rows. Zero them inside table cells. */
.rst-content table.docutils td p,
.rst-content table.docutils th p,
.wy-table-responsive table td p,
.wy-table-responsive table th p {
    margin: 0;
    line-height: 1.55;
}
.rst-content table.docutils td p + p,
.wy-table-responsive table td p + p { margin-top: 0.5em; }

/* Inline code inside tables: make the badge sit flush with the prose
 * instead of wrapping its own oversized box. */
.rst-content table.docutils td code.literal,
.rst-content table.docutils th code.literal,
.wy-table-responsive table code.literal {
    white-space: nowrap;
    font-size: 0.85em;
}

/* ---------- Blockquote ---------------------------------------------------- */

.rst-content blockquote {
    margin: 1.5em 0;
    padding: 0.2em 1.2em;
    border-left: 2px solid var(--line-strong);
    color: var(--fg-2);
    font-style: italic;
    font-family: var(--font-serif);
    background: transparent;
}

/* ---------- Definition lists --------------------------------------------- */

.rst-content dl:not(.docutils):not(.field-list) {
    display: grid;
    grid-template-columns: minmax(160px, 220px) 1fr;
    gap: 0.5rem 1.5rem;
    margin: 1.5em 0;
    padding: 1rem 1.2rem;
    background: var(--bg-1);
    border: 1px solid var(--line);
    border-radius: var(--radius-lg);
}
.rst-content dl:not(.docutils):not(.field-list) > dt {
    font-family: var(--font-mono);
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--accent);
    padding-top: 0.1em;
    border: 0;
    background: transparent;
}
.rst-content dl:not(.docutils):not(.field-list) > dd {
    margin: 0;
    color: var(--fg-1);
}

/* ---------- Footer -------------------------------------------------------- */

footer, .rst-footer-buttons {
    color: var(--fg-3);
    border-color: var(--line);
}
footer hr { background: var(--line); }
.rst-footer-buttons a.btn {
    background: var(--bg-1);
    color: var(--fg-1);
    border: 1px solid var(--line-strong);
    box-shadow: none;
}
.rst-footer-buttons a.btn:hover {
    background: var(--bg-2);
    color: var(--accent);
    border-color: var(--accent);
}

/* ---------- Bibliography (sphinxcontrib-bibtex) -------------------------- */

dl.citation, dl.footnote {
    background: var(--bg-1);
    border: 1px solid var(--line);
    border-radius: var(--radius-lg);
    padding: 1rem 1.2rem;
}
dl.citation dt.label, dl.footnote dt.label {
    color: var(--accent);
    font-family: var(--font-mono);
    font-weight: 500;
}
.rst-content a.bibtex.reference { color: var(--accent); }

/* ---------- Misc tweaks --------------------------------------------------- */

/* Sphinx "current" toc highlight in mobile / nav top */
.wy-nav-top .fa.fa-bars { color: var(--accent); }

/* Search results page */
ul.search > li {
    background: transparent;
    border-bottom: 1px solid var(--line);
}

/* Hide RTD's "Read the Docs" footer link badge in dev builds — keep just the
 * Sphinx version notice. Comment out if you want it visible. */
/* .wy-nav-content-wrap > footer .rst-versions { display: none; } */