.navbar-nav .nav-link {
    color: #6c757d; /* Gris oscuro por defecto */
    transition: color 0.3s ease, background-color 0.3s ease; /* Suaviza el cambio */
}

.navbar-nav .nav-link:hover {
    color: #ffffff; /* Blanco al pasar el cursor */
    background-color: #343a40; /* Fondo negro al pasar el cursor */
    border-radius: 4px; /* Botón con bordes redondeados */
}

.navbar-nav .nav-link.active {
    color: #ffffff; /* Blanco para el texto activo */
    background-color: #495057; /* Fondo gris oscuro para el enlace activo */
    border-radius: 4px;
    font-weight: bold; /* Resalta el texto */
}

.navbar-nav .nav-item {
    margin-right: 10px; /* Añade espacio entre los botones */
}

.navbar-nav .nav-item:last-child {
    margin-right: 0; /* Elimina el margen del último elemento */
}