.translate-x-full {
    transform: translateX(100%);
}

.translate-x-0 {
    transform: translateX(0);
}

#sidebar {
    transition: transform 0.3s ease-out;
    display: none; /* Inicialmente oculto */
    background-color: white; /* Cambiar color de fondo */
    width: 25%; /* Reducir el ancho en un 20% */
    border-left: 4px solid #9b9b9b; /* Línea divisoria a la izquierda */
    overflow-y: auto;
}

    #sidebar.visible {
        display: block; /* Mostrar cuando se agrega la clase */
    }