/* ---- Body ---------------------------------------------------------- */

body {
    font-family: var(--font-body);
    background: var(--bg-page);
    color: var(--text);
    font-size: 16px;
    line-height: 1.65;
}

/* ---- Headings (article only) -------------------------------------- */

.article h1,
.article h2,
.article h3,
.article h4 {
    color: var(--headings);
    font-family: var(--font-body);
    margin-top: 14px;
    margin-bottom: 8px;
}

.article h1 {
    font-size: 230%;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -0.015em;
    padding: 4px 0 2px;
    margin-bottom: 0.8rem;
}

.article h1 a,
.article h2 a,
.article h3 a,
.article h4 a,
.article h1 a:visited,
.article h2 a:visited,
.article h3 a:visited,
.article h4 a:visited {
    color: inherit;
    text-decoration: none;
}

/* Anchor link (¶) replaced with a FontAwesome chain-link icon, shown
   only on heading hover. Same pattern as the old RTD theme. */
.article a.headerlink,
.article a.headerlink:visited,
.article a.headerlink:hover {
    visibility: visible;  /* override basic.css default */
    margin-left: 0.6rem;
    padding-left: 0;
    color: var(--text-muted);
    font-weight: normal;
    font-size: 0;
    text-decoration: none;
    opacity: 0;
    transition: opacity 0.15s ease;
}

.article a.headerlink::after,
.article a.headerlink:hover::after {
    font-family: "Font Awesome 7 Free";
    font-weight: 900;
    content: "\f0c1";
    font-size: 0.85rem;
    color: var(--text-muted);
}

.article h1:hover a.headerlink,
.article h2:hover a.headerlink,
.article h3:hover a.headerlink,
.article h4:hover a.headerlink,
.article h5:hover a.headerlink,
.article h6:hover a.headerlink,
.article dt:hover a.headerlink {
    opacity: 0.7;
}

.article a.headerlink:hover {
    opacity: 1;
}

.article h2 {
    font-size: 150%;
    font-weight: 600;
    line-height: 1.3;
    padding: 2px 0;
    margin-top: 1.4rem;
    margin-bottom: 0.5rem;
}

.article h3 {
    font-size: 125%;
    font-weight: 600;
    line-height: 1.35;
    padding: 2px 0;
    margin-top: 1rem;
}

.article h4 {
    font-size: 115%;
    font-weight: 500;
    padding: 2px 0;
}

/* ---- Paragraphs and lists ----------------------------------------- */

.article p {
    margin-bottom: 16px;
}

.article ul,
.article ol {
    margin: 0 0 1em;
    padding-left: 1.5em;
}

.article li {
    margin-bottom: 0.3em;
}

/* ---- Links (prose only) ------------------------------------------- */

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

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

.article a.reference:has(code.xref) {
    color: var(--links-api);
}

.article a.reference:has(code.xref):hover {
    text-decoration: none;
}

/* External links get a small "↗" FontAwesome icon after the text. */
.article a.reference.external:not(:has(img)):not([href^="#"])::after {
    content: "\f08e";
    font-family: "Font Awesome 7 Free";
    font-weight: 900;
    font-size: 0.4em;
    margin-left: 0.3em;
    vertical-align: super;
    opacity: 0.6;
}

/* Pull the icon flush against trailing inline code to avoid a gap. */
.article a.reference.external:has(> code):not(:has(img))::after,
.article a.reference.external:has(> span > code):not(:has(img))::after {
    margin-left: 0;
}

.article a.reference code,
.article a.reference tt {
    color: inherit;
    background: none;
    font-size: 90%;
    font-weight: normal;
    text-decoration: underline;
    text-decoration-color: var(--links-api-underline);
    text-decoration-thickness: 1px;
    text-underline-offset: 4px;
}

/* ---- Inline code (`literals`) ------------------------------------- */

code {
    font-family: var(--font-mono);
    font-size: 92%;
    font-weight: normal;
    color: var(--inline-code-text);
    background: var(--inline-code-bg);
    padding: 0.1em 0.35em;
    border-radius: 4px;
    border: none;
}

pre code {
    background: transparent;
    padding: 0;
    border-radius: 0;
    font-size: inherit;
    color: inherit;
}

/* ---- Blockquotes --------------------------------------------------- */

blockquote {
    margin: 1em 0;
    padding: 0 1em;
    border-left: 3px solid var(--border);
    color: var(--text-secondary);
}

/* ---- Horizontal rule ----------------------------------------------- */

hr {
    border: 0;
    border-top: 1px solid var(--border);
    margin: 2em 0;
}

/* ---- In-content TOC (`.. contents::`) ----------------------------- */

/* basic.css wraps these in a 1px #ccc border with padding; drop the
   border so the list reads as native prose. */
.article aside.topic,
.article div.topic,
.article nav.contents {
    border: 0;
    padding: 0;
    background: transparent;
}