/* Webkit-based browsers */
::-webkit-scrollbar {
    width: 12px;
    height: 12px;
}

::-webkit-scrollbar-thumb {
    background-color: #4a4a4a;
    border: 2px solid #ffffff;
    border-radius: 10px;
    box-shadow: 0px 3px 2px -3px #555, inset 0 0 4px #000, inset 0 0 3px 3px #000000b3;
}

::-webkit-scrollbar-thumb:active {
    background-color: #2c2c2c;
}

::-webkit-scrollbar-track {
    background-color: transparent;
    border: 1px solid #ffffff;
    box-shadow: 0px 3px 2px -3px #555, inset 0 0 4px #000, inset 0 0 3px 3px #000000b3;
}

::-webkit-scrollbar-track:active {
    background-color: transparent;
}

/* Firefox */
* {
    scrollbar-width: thin;
    scrollbar-color: #4a4a4a transparent;
}

/* Internet Explorer and Edge */
* {
    -ms-overflow-style: none; /* Disable scrollbar styling */
}

body::-webkit-scrollbar {
    display: none; /* Hide the default scrollbar */
}

.scrollbar-style.secondary {
    scrollbar-color: #555 transparent;
}
.scrollbar-style.secondary::-webkit-scrollbar-thumb:active {
    background-color: #444;
}