/* The "On this page" list that pagetoc.js builds; its placement in the page
   grid is in vep-rs.css. */

.pagetoc {
    font-size: 0.85em;
    line-height: 1.45;
}

.pagetoc-title {
    margin: 0 0 0.6em;
    font-weight: 600;
}

.pagetoc ol {
    list-style: none;
    margin: 0;
    padding: 0;
}

.pagetoc li,
.content .pagetoc li + li {
    margin: 0;
}

.pagetoc a {
    display: block;
    padding: 4px 8px 4px 12px;
    border-inline-start: 2px solid var(--theme-popup-border);
    overflow-wrap: anywhere;
}

.pagetoc .pagetoc-h3 a {
    padding-inline-start: 24px;
}

.pagetoc code {
    font-size: inherit;
    padding: 0;
    background: none;
}

/* chrome.css colours `.content a:link`, which outranks a bare `.pagetoc a`. */
.content .pagetoc a:link,
.content .pagetoc a:visited {
    color: var(--fg);
    text-decoration: none;
}

.content .pagetoc a:hover {
    color: var(--links);
    text-decoration: underline;
    text-underline-offset: 0.15em;
}

.content .pagetoc a.active {
    color: var(--links);
    border-color: var(--links);
    font-weight: 600;
}

.pagetoc details {
    margin-block: 1em 0;
    padding: 4px 12px;
    border: 1px solid var(--theme-popup-border);
    border-radius: 4px;
}

.pagetoc summary {
    min-height: 24px;
    padding: 4px 0;
    font-weight: 600;
    cursor: pointer;
}

.pagetoc details[open] summary {
    margin-block-end: 0.5em;
}

@media (prefers-reduced-motion: no-preference) {
    .pagetoc a {
        transition: color 0.15s ease, border-color 0.15s ease;
    }
}