script.js

const togglePassword = document.getElementById('togglePassword');
const passwordInput = document.getElementById('password');

togglePassword.addEventListener('click', function () {
    const isPasswordVisible = passwordInput.type === 'text';
    passwordInput.type = isPasswordVisible ? 'password' : 'text';

    togglePassword.src = isPasswordVisible ? 
    'https://res.cloudinary.com/drkmgpcad/image/upload/v1726940114/pnpa3clu4ece0xadanxb.png' : 
    'https://res.cloudinary.com/drkmgpcad/image/upload/v1726940115/glfy7fmdlvnvzctejgxg.png';
});

/* For Log In yung mula dito pataas dont touch huhu*/


/*for Loading screen to edit mo sa css if you want, di ko magawng trasparent so I make a bg for loading HEHEHEE*/
function showLoadingScreen(message) {
    // Create the loading screen HTML
    document.body.innerHTML = `
        <div class="loading-screen">
            <div class="log-in">${message}</div>
            <div class="loading-image">
                <img src="https://res.cloudinary.com/drkmgpcad/image/upload/v1726841328/rahjpg3k7mdtnow4ttux.png" alt="Loading Image">
            </div>
        </div>
    `;

    // Set a timeout to remove the loading screen after 1 second
    setTimeout(() => {
        document.body.innerHTML = ''; // Clear the loading screen
    }, 2000); // 2000 milliseconds = 2 seconds (1 second longer than before)
}