/* Scrollbar Styles for Dark Mode */

        /* Webkit browsers (Chrome, Safari, Edge) */
        .dark ::-webkit-scrollbar {
            width: 12px;
            /* Width of the scrollbar */
        }

        .dark ::-webkit-scrollbar-track {
            background-color: rgb(30, 41, 59);
            /* Dark background color for scrollbar track */
        }

        .dark ::-webkit-scrollbar-thumb {
            background-color: rgb(113, 113, 122);
            /* Dark gray color for scrollbar thumb */
            border-radius:5px;
            /* Rounded corners for the scrollbar thumb */
        }

        .dark ::-webkit-scrollbar-thumb:hover {
            background-color: rgb(82, 82, 91);
            /* Darker gray color for scrollbar thumb on hover */
        }

        /* Firefox */
        .scroll-container,
        .dark {
            scrollbar-width: thin;
            /* Width of the scrollbar */
            scrollbar-color: rgb(26,27,30) rgb(49,51,56);
            /* Thumb color and track color */
        }

        /* Example styling for a specific element with dark mode */
        .scroll-container,
        .dark .scrollable-element {
            overflow-y: scroll;
            /* Enable vertical scrolling */
        }

        /* Regular Scrollbar Styles */

        /* Webkit browsers (Chrome, Safari, Edge) */
        ::-webkit-scrollbar {
            border-radius: 50%;
            width: 12px;
            /* Width of the scrollbar */
        }

        ::-webkit-scrollbar-track {
            background-color: rgb(255,255,255);
            /* Light background color for scrollbar track */
        }

        ::-webkit-scrollbar-thumb {
            background-color: rgb(200,200,200);
            /* Light gray color for scrollbar thumb */
            border-radius: 5px;
            /*border-radius: 2px;*/
            /* Rounded corners for the scrollbar thumb */
        }

        ::-webkit-scrollbar-thumb:hover {
            background-color: #555;
            /* Darker gray color for scrollbar thumb on hover */
        }

        /* Firefox */
        
        .scrollable {
            scrollbar-width: thin;
            /* Width of the scrollbar */
            scrollbar-color: rgb(128, 132, 142) rgb(200,200,200);
            /* Thumb color and track color */
        }

        /* Example styling for a specific element */
       
        .scrollable-element {
            overflow-y: scroll;
            /* Enable vertical scrolling */
        }

        .dark .scroll-container {
            scrollbar-color: rgb(26,27,30) rgb(49,51,56);
            
        }

        .scroll-container {
            scrollbar-color: rgb(200,200,200) rgb(255,255,255);
            
        }
        .scroll-container::-webkit-scrollbar-thumb {
          
            border-radius: 10px; /* Rounded corners */
        }