
/* -----------------------------------------------------------

    Details

------------------------------------------------------------- */

.details {
    display: block;
}

.details__summary {
    display: inline-block;
    position: relative;
    padding: 1rem 1.25rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    font-weight: 700;
    color: #053787;
    background: #d6e4ec;
}

.details__summary:hover,
.details__summary:focus {
    color: #000;
}

.details__summary::before {
    content: "";
    height: 0.35em;
    width: 0.35em;
    border-left: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(-135deg);
    margin-right: 0.5em;
    transition: all 0.15s ease;
}

.details[open] > .details__summary::before {
    transform: rotate(-45deg);
}

.details__summary::-webkit-details-marker {
    display: none;
}

.details__summary-text {
    text-decoration: none;
    font-size: inherit;
    font-weight: inherit;
    color: inherit;
    margin: 0;
}

.details__summary:hover .details__summary-text {
    color: #000;
}

.details__body {
    transition: all 0.2s ease;
    opacity: 0;
    padding: 0.5rem 1.5rem 1.5rem 1.5rem;
    background-color: #d6e4ec;
}

.details[open] > .details__body {
    opacity: 1;
}

/* -----------------------------------------------------------

    Table of Contents

------------------------------------------------------------- */

/* [1]: account for the page header’s height */

html {
    scroll-behavior: smooth;
    scroll-padding-top: 11rem; /* [1] */
}

.toc {
    margin-bottom: 30px;
}

.toc .no-js & {
    display: none;
}

.toc ul,
.toc ol {
    font-size: inherit;
    font-weight: 700;
    color: inherit;
    list-style: none;
    margin: 0;
    padding: 0;
    counter-reset: toc-counter;
}

.toc ul li,
.toc ol li {
    margin: 0;
    padding-bottom: 0;
    position: relative;
}

.toc ol li {
    padding-left: 2ch;
}

.toc ol ol li {
    padding-left: 3.2ch;
}

.toc ol ol ol li {
    padding-left: 4.4ch;
}

.toc ol ol,
.toc ul ul,
.toc li + li {
    margin-top: 0.75em;
}

.toc ol li::before {
    content: counters(toc-counter, ".") "";
    counter-increment: toc-counter;
    padding-right: 0.5em;
    font-weight: 400;
    display: inline-block;
    position: absolute;
    left: 0;
    top: auto;
    max-height: none;
    width: auto;
    text-align: right;
}

.toc a {
    color: #053787;
}

.toc a:hover,
.toc a:active,
.toc a:focus {
    color: #053787;
}
