/* Always show vertical scrollbar to prevent layout shift during SPA transitions */
html {
    overflow-y: scroll;
}

/* Customizable Scrollbar (Webkit) */
::-webkit-scrollbar {
    width: 8px; /* Slightly thinner */
    height: 8px;
    background-color: transparent; /* Transparent track */
}

::-webkit-scrollbar-track {
    background-color: transparent; /* Transparent track */
}

::-webkit-scrollbar-thumb {
    background-color: rgba(120, 120, 120, 0.3); /* Subtle grey, semi-transparent */
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background-color: rgba(120, 120, 120, 0.5); /* Slightly darker on hover */
}

/* Firefox scrollbar (limited support) */
html {
    scrollbar-width: thin;
    scrollbar-color: rgba(120, 120, 120, 0.3) transparent;
}

.collapsible-anim {
    overflow: hidden;
    transition: height 220ms ease, opacity 220ms ease;
    will-change: height, opacity;
}