/* WebKit (Safari/Chrome) */
::-webkit-scrollbar {
    height: 7px;
    width: 7px;
}

::-webkit-scrollbar-track {
    cursor: pointer;
    background: var(--scroll-track-color); /* Track color */
    border-radius: 100px; /* Rounded corners */
}

::-webkit-scrollbar-thumb {
    background: var(--scroll-thumb-color); /* Thumb color */
    border-radius: 100px; /* Rounded corners */
}
/*::-webkit-scrollbar-button:start:decrement,
::-webkit-scrollbar-button:end:increment {
    display: block;
    height: 7px;
    width: 70px;*/ /* Adjust the width as needed */
/*background-color: #ccc;*/ /* Button color */
/*cursor: pointer;
}*/

/*::-webkit-scrollbar-button {
    display: none;*/ /* Hide the default buttons */
/*}*/
/* Firefox */
::-moz-scrollbar {
    height: 7px;
    width: 7px;
}

/* Internet Explorer */
::-ms-scrollbar {
    height: 7px;
    width: 7px;
}

/* Edge */
::-ms-scrollbar {
    height: 7px;
    width: 7px;
}

/* Opera */
::-o-scrollbar {
    height: 7px;
    width: 7px;
}

/* Generic */
scrollbar {
    height: 7px;
    width: 7px;
}


@media(max-width:767px) {
    /* WebKit (Safari/Chrome) */
    ::-webkit-scrollbar {
        height: 0px;
        width: 7px;
    }
    /* Firefox */
    ::-moz-scrollbar {
        height: 0px;
        width: 7px;
    }

    /* Internet Explorer */
    ::-ms-scrollbar {
        height: 0px;
        width: 7px;
    }

    /* Edge */
    ::-ms-scrollbar {
        height: 0px;
        width: 7px;
    }

    /* Opera */
    ::-o-scrollbar {
        height: 0px;
        width: 7px;
    }

    /* Generic */
    scrollbar {
        height: 0px;
        width: 7px;
    }
}