:root {
    --maincolwidth: 1000px;
    --pico-font-size: 18px !important;
    --bs-root-font-size: 18px !important;
}

#listing-listing {
    margin: auto;
    max-width: var(--maincolwidth)
}

body, * {
    font-family: 'JetBrains Mono', monospace;
}

main {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

p {
    font-size: .9rem;
}

section > h1 {font-size: 1.5rem}
section > h2 {font-size: 1.25rem}
section > h3 {font-size: 1rem}


#quarto-content {
    display: grid;
    gap: 0;
    grid-template-columns:
        [screen-start] 1.5em
        [screen-start-inset] 5fr
        [page-start] minmax(25px, 50px)
        [page-start-inset] minmax(50px, 150px)
        [body-start-outset] minmax(25px, 50px)
        [body-start] 1.5em
        [body-content-start] minmax(500px, calc(800px - 3em))
        [body-content-end] 1.5em
        [body-end] minmax(25px, 50px)
        [body-end-outset] minmax(50px, 150px)
        [page-end-inset] minmax(25px, 50px)
        [page-end] 5fr
        [screen-end-inset] 1.5em
        [screen-end];
}

#quarto-sidebar {
    background-color: var(--pico-background-color);
    padding-left: 0;
    padding-top: 150px;
}

#title-block-header {display: none}

/* Container: sticky TOC */
#TOC {
    display: block;
    position: sticky;
    max-height: calc(100vh - 4rem);
    overflow-y: auto;
    font-size: 0.75rem;
    color: var(--pico-color);
    transition: top 0.2s linear;
    will-change: top;
    padding: 0;
}

/* Title */
#toc-title {
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--pico-muted-color);
}

#TOC ul {
    display: block;
    list-style: none;
    margin: 0;
    position: relative;
}

#TOC > ul {
    /* border-left: 2px solid var(--pico-muted-border-color); */
    margin-left: 0.5rem;
}

#TOC li {
    padding: 0;
    position: relative;
    width: 100%;
}

/* Links */
#TOC a {
    padding: 0;
    text-decoration: none;
    display: block;
    color: var(--pico-muted-color);
    transition: color 0.15s ease;
    position: relative;
    margin: 0;

    /* Allow text to wrap */
    overflow-wrap: break-word;
    word-wrap: break-word;
    hyphens: auto;
}

#TOC ul a {
    border-left: 2px solid var(--pico-muted-border-color);
    border-top: none;
    border-bottom: none;
}

#TOC ul > li > a {
    padding-left: 0.5rem;
    padding-bottom: .2rem;
    padding-top: .2rem;
}

#TOC ul > li > ul > li > a {
    padding-left: 1rem;
    padding-bottom: .2rem;
    padding-top: .2rem;
}

/* Override pico defaults */
nav li :where(a, [role=link]) {
    margin: 0.5rem;
    border-radius: 0;
}

/* Override bootstrap defaults */
.sidebar nav[role=doc-toc] > ul a {
    border: none;
}

.sidebar nav[role=doc-toc] ul > li > a:hover, .sidebar nav[role=doc-toc] ul > li > ul > li > a:hover {
    border-left: 2px solid var(--pico-contrast) !important;
    color: var(--pico-contrast) !important;
}

.sidebar nav[role=doc-toc] ul > li > a.active, .sidebar nav[role=doc-toc] ul > li > ul > li > a.active {
    border-left: 2px solid var(--pico-contrast) !important;
    color: var(--pico-contrast) !important;
    font-weight: 600;
}

/* Collapsed state: only show active link */
#TOC.toc-collapsed #toc-title {
    display: none;
}

#TOC.toc-collapsed ul li {
    display: none;
}

#TOC.toc-collapsed ul li a.toc-active {
    display: block;
}

/* Compact box in collapsed mode */
#TOC.toc-collapsed {
    padding: 0.5rem 0;
}

#listing-listing a:hover {
    font-weight: 600;
    color: var(--pico-primary-hover)
}

#quarto-margin-sidebar {
    padding-top: 150px;
}

#quarto-margin-sidebar > div {
    font-size: .7rem !important;
}

#quarto-margin-sidebar > div > div.category.active {
    color: var(--pico-primary)
}

#listing-listing > table > tbody {
    font-size: 0.8rem;
}

input:not([type=checkbox],[type=radio]), select, textarea {
    margin-bottom: 0;
}

#listing-listing > div.listing-actions-group > div.input-group.input-group-sm.quarto-listing-sort, #listing-listing > div.listing-actions-group > div.input-group.input-group-sm.quarto-listing-filter {height: 40px !important}

#listing-listing > div.listing-actions-group > div.input-group.input-group-sm.quarto-listing-filter > span, #listing-listing > div.listing-actions-group > div.input-group.input-group-sm.quarto-listing-filter > input {height: 100%}

.katex .mathrm {
    font-size: .9rem;
}