/* ===================================
   ADMIN LOGIN PAGE - JAVASCRIPT
   ==================================== */

document.addEventListener('DOMContentLoaded', function() {
    // Form validation
    const loginForm = document.querySelector('.admin-login-form');
    
    if (loginForm) {
        loginForm.addEventListener('submit', function(e) {
            const email = document.getElementById('admin_email');
            const password = document.getElementById('admin_password');
            
            if (!email.value.trim()) {
                e.preventDefault();
                showAlert('Please enter your email address', 'error');
                email.focus();
                return false;
            }
            
            if (!password.value.trim()) {
                e.preventDefault();
                showAlert('Please enter your password', 'error');
                password.focus();
                return false;
            }
            
            // Email validation
            if (!isValidEmail(email.value)) {
                e.preventDefault();
                showAlert('Please enter a valid email address', 'error');
                email.focus();
                return false;
            }
            
            if (password.value.length < 6) {
                e.preventDefault();
                showAlert('Password must be at least 6 characters', 'error');
                password.focus();
                return false;
            }
        });
    }

    // Email validation function
    function isValidEmail(email) {
        const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
        return emailRegex.test(email);
    }

    // Show alert function
    function showAlert(message, type) {
        // Create alert element
        const alert = document.createElement('div');
        alert.className = `admin-alert alert-${type}`;
        alert.innerHTML = `
            <i class="fa fa-${type === 'error' ? 'exclamation-circle' : 'check-circle'}"></i>
            ${message}
        `;
        
        // Insert after login header
        const header = document.querySelector('.admin-login-header');
        if (header.nextElementSibling && header.nextElementSibling.classList.contains('admin-alert')) {
            header.nextElementSibling.remove();
        }
        header.insertAdjacentElement('afterend', alert);
        
        // Remove after 5 seconds
        setTimeout(() => {
            alert.remove();
        }, 5000);
    }

    // Show/hide password
    const passwordInput = document.getElementById('admin_password');
    if (passwordInput) {
        const togglePassword = document.createElement('button');
        togglePassword.type = 'button';
        togglePassword.className = 'password-toggle';
        togglePassword.innerHTML = '<i class="fa fa-eye"></i>';
        togglePassword.addEventListener('click', function(e) {
            e.preventDefault();
            if (passwordInput.type === 'password') {
                passwordInput.type = 'text';
                togglePassword.innerHTML = '<i class="fa fa-eye-slash"></i>';
            } else {
                passwordInput.type = 'password';
                togglePassword.innerHTML = '<i class="fa fa-eye"></i>';
            }
        });
    }

    // Focus animations
    const inputs = document.querySelectorAll('.form-control');
    inputs.forEach(input => {
        input.addEventListener('focus', function() {
            this.closest('.form-group').classList.add('focused');
        });

        input.addEventListener('blur', function() {
            if (!this.value) {
                this.closest('.form-group').classList.remove('focused');
            }
        });
    });

    // Remember me functionality
    const rememberCheckbox = document.querySelector('input[name="remember_me"]');
    if (rememberCheckbox) {
        // Restore remembered email
        const rememberedEmail = localStorage.getItem('admin_remembered_email');
        if (rememberedEmail) {
            document.getElementById('admin_email').value = rememberedEmail;
            rememberCheckbox.checked = true;
        }

        // Save email on form submit
        if (loginForm) {
            loginForm.addEventListener('submit', function() {
                if (rememberCheckbox.checked) {
                    localStorage.setItem('admin_remembered_email', document.getElementById('admin_email').value);
                } else {
                    localStorage.removeItem('admin_remembered_email');
                }
            });
        }
    }

    // Responsive adjustments
    function handleResponsive() {
        const windowWidth = window.innerWidth;
        const loginContainer = document.querySelector('.admin-login-container');
        
        if (windowWidth <= 1023) {
            // Tablet and below
            if (loginContainer) {
                loginContainer.style.gridTemplateColumns = '1fr';
            }
        } else {
            // Desktop
            if (loginContainer) {
                loginContainer.style.gridTemplateColumns = '1fr 1fr';
            }
        }
    }

    // Handle window resize
    window.addEventListener('resize', handleResponsive);
    handleResponsive();

    // Prevent form submission on Enter in remember checkbox
    document.querySelectorAll('input').forEach(input => {
        if (input.type === 'checkbox') {
            input.addEventListener('keypress', function(e) {
                if (e.key === 'Enter') {
                    e.preventDefault();
                    this.checked = !this.checked;
                }
            });
        }
    });
});

// Add animation classes
const style = document.createElement('style');
style.textContent = `
    .form-group.focused .form-control {
        border-color: #2196F3;
    }

    .password-toggle {
        position: absolute;
        right: 12px;
        top: 50%;
        transform: translateY(-50%);
        background: none;
        border: none;
        color: #2196F3;
        cursor: pointer;
        font-size: 16px;
    }

    .form-group {
        position: relative;
    }
`;
document.head.appendChild(style);
