/* Clear sticky navbar (~60px) when jumping to an anchor */
#content [id] {
    scroll-margin-top: 5rem;
}

#content a {
    color: var(--brand-strong);
    font-weight: 600;
}

#content a:hover {
    color: var(--ink);
}

/* Scroll-spy active state - toggled on the <li> by documentation.js via IntersectionObserver. */
#leftCol li.active > a {
    color: var(--brand-strong);
    font-weight: 600;
    background: var(--surface-raised);
    box-shadow: inset 3px 0 0 var(--brand);
}

/* Indent sub-items under each section header */
#leftCol nav > ul > li > ul {
    padding-left: 0.75rem;
}

/* Subtle custom scrollbar for the sidebar nav */
#leftCol nav::-webkit-scrollbar {
    width: 3px;
}
#leftCol nav::-webkit-scrollbar-track {
    background: transparent;
}
#leftCol nav::-webkit-scrollbar-thumb {
    background-color: var(--border-strong);
    border-radius: 9px;
}
#leftCol nav::-webkit-scrollbar-thumb:hover {
    background-color: var(--ink-muted);
}
#leftCol nav {
    scrollbar-width: thin;
    scrollbar-color: var(--border-strong) transparent;
}

/* The page and code blocks use the sidebar menu's scrollbar: thin, rounded, theme-colored, no track */
html,
.code-block pre {
    scrollbar-width: thin;
    scrollbar-color: var(--border-strong) transparent;
}
html::-webkit-scrollbar,
.code-block pre::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}
html::-webkit-scrollbar-track,
.code-block pre::-webkit-scrollbar-track {
    background: transparent;
}
html::-webkit-scrollbar-thumb,
.code-block pre::-webkit-scrollbar-thumb {
    background-color: var(--border-strong);
    border-radius: 9px;
}
html::-webkit-scrollbar-thumb:hover,
.code-block pre::-webkit-scrollbar-thumb:hover {
    background-color: var(--ink-muted);
}