<br />
<b>Notice</b>:  session_start(): Ignoring session_start() because a session is already active in <b>/home/u785970985/domains/blacknbold.in/public_html/task-management/login.php</b> on line <b>3</b><br />
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Login &middot; blacknbold Task Manager</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
    <link rel="stylesheet" href="assets/css/style.css">
</head>
<body class="login-body">
    <form class="login-box" method="POST">
        <div class="login-brand" style="text-align:center; margin-bottom:16px;">
            <img src="images/logo.webp" alt="Logo" style="height:48px; max-width:220px; object-fit:contain;">
        </div>
        <p class="login-sub">Agency Task Management</p>
                <label>Email</label>
        <input type="email" name="email" required autofocus>
        <label>Password</label>
        <div style="position:relative; width:100%;">
            <input type="password" name="password" id="loginPassword" required style="padding-right:42px; width:100%; box-sizing:border-box;">
            <button type="button" id="togglePasswordBtn" title="Toggle password visibility" style="position:absolute; right:12px; top:50%; transform:translateY(-50%); background:none !important; border:none !important; color:var(--text-muted, #a1a1aa) !important; font-size:16px !important; cursor:pointer !important; padding:4px !important; margin:0 !important; width:auto !important; height:auto !important; box-shadow:none !important; z-index:10;">
                <i class="fa-regular fa-eye" id="toggleEyeIcon"></i>
            </button>
        </div>
        <button type="submit">LOGIN</button>
        <!--<a href="signup.php" style="display:block; text-align:center; margin-top:14px;">New employee? Create an account</a>-->
    </form>
    <script>
    document.addEventListener('DOMContentLoaded', function() {
        const passwordInput = document.getElementById('loginPassword');
        const toggleBtn = document.getElementById('togglePasswordBtn');
        const eyeIcon = document.getElementById('toggleEyeIcon');

        if (toggleBtn && passwordInput && eyeIcon) {
            toggleBtn.addEventListener('click', function() {
                if (passwordInput.type === 'password') {
                    passwordInput.type = 'text';
                    eyeIcon.classList.remove('fa-eye');
                    eyeIcon.classList.add('fa-eye-slash');
                } else {
                    passwordInput.type = 'password';
                    eyeIcon.classList.remove('fa-eye-slash');
                    eyeIcon.classList.add('fa-eye');
                }
            });
        }
    });
    </script>
</body>
</html>
