/* Table of contents (TOC) styles */

/* Right TOC navigation */
.mini-toc {
    position: sticky;
    top: 5rem;
    align-self: start;
    background: var(--bg-panel);
    border-left: 1px solid var(--border-soft);
    padding: 1rem 0 1rem 1rem;
    max-height: calc(100vh - 120px);
    overflow: auto;
}

.mini-toc h6 {
    margin: 0 0 .75rem 0.5rem;
    font-weight: 600;
}

.mini-toc-tree {
    list-style: none;
    padding-left: 0;
    margin: 0;
}

.mini-toc-tree a {
    font-size: 14px;
    display: block;
    padding: .25rem 0.5rem;
    border-radius: 6px;
    color: inherit;
    text-decoration: none;
}

.mini-toc ul li,
.mini-toc ol li {
    list-style: none;
}

.mini-toc-tree ul {
    padding-left: 1rem;
}

.mini-toc-tree a:hover {
    background: rgba(127, 127, 127, .10);
}

/* When TOC is included inside .content-area (no template changes), split into two columns */
.content-area:has(> .mini-toc) {
    display: grid;
    grid-template-columns: 1fr 270px;
    gap: 1.5rem;
}

.content-area:has(> .mini-toc)> :first-child {
    min-width: 0;
}

/* If .mini-toc is a sibling in .main-container, add third column */
.main-container:has(> .mini-toc) {
    grid-template-columns: 300px 1fr 260px;
}

/* Responsive */
@media (max-width: 1024px) {
    .content-area:has(> .mini-toc) {
        grid-template-columns: 1fr;
    }

    .mini-toc {
        display: none;
    }
}