document.addEventListener('DOMContentLoaded', function () {
    const togglePassword = document.getElementById('togglePassword');
    const passwordInput = document.getElementById('contrasena');
    const welcomeMessageDiv = document.querySelector('.welcome-message');
    const loginErrorDiv = document.querySelector('.login-error');

    // ✅ NUEVA FUNCIÓN para mostrar mensajes
    function showMessage(element, duration = 3000) {
        if (element) {
            element.style.display = 'flex';
            setTimeout(() => {
                element.style.opacity = 0;
                setTimeout(() => element.remove(), 500);
            }, duration);
        }
    }

    if (welcomeMessageDiv) {
        showMessage(welcomeMessageDiv);
    }
    
    if (loginErrorDiv) {
        showMessage(loginErrorDiv);
    }

    // Lógica para el toggle del password (la que ya tienes)
    if (togglePassword && passwordInput) {
        togglePassword.addEventListener('click', function () {
            const type = passwordInput.getAttribute('type') === 'password' ? 'text' : 'password';
            passwordInput.setAttribute('type', type);
            this.querySelector('i').classList.toggle('fa-eye');
            this.querySelector('i').classList.toggle('fa-eye-slash');
        });
    }
});