/* ============================================================================= /*
    📁 scroll-bar.css ▶ 

    - 
    💻 JKCPROD © 2024 
/* ============================================================================= */

/***********************************************************************************
                                🔧 ELEMENTS 🔧                     
************************************************************************************/

*{
    /* {"Change the scrollbar color "} */
    --scrollbarColor: #35909E;

    /* {"Change the scrollbar background color "} */
    --backgroundColorScrollbar: transparent; 
}

/***********************************************************************************/
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     
/***********************************************************************************/                     


/* Pour Webkit (Chrome, Safari, etc.) */
::-webkit-scrollbar {
    width: 10px; /* Largeur de la barre de défilement */
    background-color: var(--backgroundColorScrollbar); /* Couleur de fond de la barre */
}

/* Pour Internet Explorer */
body {
    scrollbar-base-color: var(--backgroundColorScrollbar);
    scrollbar-3dlight-color: var(--backgroundColorScrollbar);
    scrollbar-highlight-color: var(--backgroundColorScrollbar);
}

/* Pour Webkit */
::-webkit-scrollbar-thumb {
    background-color: var(--scrollbarColor); /* Couleur de la poignée */
    border-radius: 5px; /* Bord arrondi pour la poignée */
    background-clip: padding-box; 
    border: 2px solid transparent;
}

/* Pour Internet Explorer */
body {
    scrollbar-arrow-color: var(--scrollbarColor);
    scrollbar-darkshadow-color: var(--scrollbarColor);
    scrollbar-face-color: var(--scrollbarColor);
    scrollbar-shadow-color: var(--scrollbarColor);
    scrollbar-track-color: transparent; 
}

::-webkit-scrollbar-thumb:hover {
    background-color: #555; /* Darken the thumb's color on hover */
}

::-webkit-scrollbar-button {
    background-color: var(--backgroundColorScrollbar); 
    width: 5px; 
    height: 5px;
}