/* ================================================================================ */
/* sticky TOC sidebar */
/* ================================================================================ */

/* hide .floating-toc on mobile devices */
/* @media (max-width: 991px) { */
@media (max-width: 1722px) {
    .floating-toc {
        display: none !important;
    }
}

.floating-toc {
    font-family: 'Inter Tight Light', sans-serif;
    font-size: 11px;
    position: fixed;
    top: 6rem;
    left: 5px;
    width: 200px;
    background-color: #f7f7f7;
    border: 1px solid #ccc;
    border-radius: 0.5rem;
    padding: 5px;
    max-height: 80vh;   /* TOC can grow up to 80% of viewport */
    overflow-y: auto;   /* scrolls only if too tall */
    z-index: 1050;
}

#toc-list,
#toc-list ul {
    list-style: none;
    margin: 0;
    padding-left: 0;
}

/* Base link style */
#toc-list a.toc-link {
    display: block;
    overflow: hidden;
    /* white-space: nowrap; */
    /* text-overflow: ellipsis; */
    /* text-overflow: ellipsis; */
    word-break: break-word;
    overflow-wrap: break-word;
    text-align: justify;
    hyphens: auto;
    color: black;
    text-decoration: none;
    font-size: 12px;
    line-height: 1.3;
}

/* Active link */
#toc-list a.toc-link.active {
    /* font-weight: bold; */
    color: var(--primary2);
    text-decoration: none;
}

/* Top-level h2 */
#toc-list > li > a {
    font-weight: bold;
    padding-left: 0; /* flush left */
    width: 100%;      /* ensures ellipsis works */
}

/* Second-level h3 */
#toc-list ul > li > a {
    font-weight: normal;
    padding-left: 1rem;  /* indentation */
    width: calc(100% - 0rem); /* adjust width for ellipsis */
}

/* Third-level h4 */
#toc-list ul ul > li > a {
    font-size: 0.9em;
    padding-left: 2rem;  /* indentation */
    width: calc(100% - 0rem); /* adjust width for ellipsis */
}

/* first list element in toc */
#toc-list > li:first-child a.toc-link {
    font-family: 'Inter Tight SemiBold', sans-serif;
    font-size: 15px;        /* slightly larger */
    margin-bottom: 0.3rem;  /* some vertical spacing */
    text-decoration: none;
}
