/* ****************** LAYOUT ********************* */



/* Grundgerüst für Full-Width und Full-Height */
html, body {
    height: 100%;
    margin: 0;
    padding: 0;
    overflow: hidden; /* Verhindert das Scrollen des gesamten Bodys */
    background-color:  var(--color-bg);
}




/* Gemeinsame Stile für alle drei Spalten */
.sidebar-column, .main-column {
    height: 100vh;
    overflow-y: auto; /* Aktiviert vertikales Scrollen pro Spalte */
    -webkit-overflow-scrolling: touch; /* Besseres Scrollen auf iOS */
}

/* Verhindert, dass die Sidebar-Inhalte beim Scrollen verschwinden */
.sticky-top {
    position: sticky;
    top: 0;
}

.main-column {
    position: relative;
    scroll-behavior: smooth;
}

.main-column .sticky-top {
    top: 0;
   
}

::-webkit-scrollbar {
    width: 6px;
}

::-webkit-scrollbar-track {
    background:  var(--color-bg-light);
}

::-webkit-scrollbar-thumb {
    background: var(--color-bg-dark);
    border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
    background:  var(--color-bg-darker);
}




/* ****************** SCROLLSPY ********************* */

#toc .nav-link {
    color: var(--color-txt-light);
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
    transition: all 0.2s;
}

#toc .nav-link:hover {
    background-color: var(--color-bg);
    color: var(--color-base);
}

#toc .nav-link.active {
    background-color: var(--color-bg);
}

.toggle-sidebar-right {
    padding-right: -10px;
}


/* Responsive Anpassungen */
/* @media (max-width: 991.98px) {
    .main-column {
        overflow-y: auto;
        height: 100vh;
    }
} */