/* Estilos personalizados para barras de desplazamiento */
::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

::-webkit-scrollbar-track {
    background: rgba(14, 13, 23, 0.5);
}

::-webkit-scrollbar-thumb {
    background: rgba(237, 55, 191, 0.7);
    border-radius: 5px;
}

::-webkit-scrollbar-thumb:hover {
    background: rgba(237, 55, 191, 0.9);
}

/* Estilos para Firefox */
* {
    scrollbar-width: thin;
    scrollbar-color: rgba(237, 55, 191, 0.7) rgba(14, 13, 23, 0.5);
}

/* Ocultar barras de desplazamiento pero mantener la funcionalidad */
.scrollbar-hide {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.scrollbar-hide::-webkit-scrollbar {
    display: none;
}

/* Barras de desplazamiento para elementos específicos */
.custom-scrollbar::-webkit-scrollbar {
    width: 6px;
}

.custom-scrollbar::-webkit-scrollbar-track {
    background: rgba(14, 13, 23, 0.3);
}

.custom-scrollbar::-webkit-scrollbar-thumb {
    background: rgba(237, 55, 191, 0.5);
    border-radius: 3px;
}

.custom-scrollbar::-webkit-scrollbar-thumb:hover {
    background: rgba(237, 55, 191, 0.8);
}

/* Barras de desplazamiento oscuras */
.dark-scrollbar::-webkit-scrollbar-track {
    background: #0e0d17;
}

.dark-scrollbar::-webkit-scrollbar-thumb {
    background: #333;
}

.dark-scrollbar::-webkit-scrollbar-thumb:hover {
    background: #555;
}

/* Barras de desplazamiento minimalistas */
.minimal-scrollbar::-webkit-scrollbar {
    width: 4px;
}

.minimal-scrollbar::-webkit-scrollbar-track {
    background: transparent;
}

.minimal-scrollbar::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.2);
}

.minimal-scrollbar::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, 0.3);
}