/* Entire scrollbar */
::-webkit-scrollbar {
    width: 8px;
    background: transparent; /* optional fallback */
}

/* Scrollbar track (the background behind the thumb) */
::-webkit-scrollbar-track {
    background: transparent; /* fully transparent */
}

/* Scrollbar thumb (the draggable part) */
::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, #4f46e5, #a855f7); /* semi-transparent gradient */
    border-radius: 6px;
    border: 2px solid transparent; /* optional to add spacing */
}

/* Thumb hover effect */
::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, rgba(255,95,185,0.7), rgba(185,21,255,0.7));
}