// Form switching
const container = document.getElementById("container");
const registerBtn = document.getElementById("register");
const loginBtn = document.getElementById("login");

registerBtn.addEventListener("click", () => {
    container.classList.add("active");
});

loginBtn.addEventListener("click", () => {
    container.classList.remove("active");
});

// Sign Up Password Visibility
const signupPasswordField = document.getElementById("signup-password");
const toggleSignupPassword = document.getElementById("toggle-signup-password");

// Toggle event untuk Sign Up
toggleSignupPassword.addEventListener("click", () => {
    const type = signupPasswordField.type === "password" ? "text" : "password";
    signupPasswordField.type = type;
    toggleSignupPassword.classList.toggle("fa-eye");
    toggleSignupPassword.classList.toggle("fa-eye-slash");
});

// Sign Up Password Confirmation Visibility
const signupPasswordConfirmationField = document.getElementById(
    "signup-password-confirmation"
);
const toggleSignupPasswordConfirmation = document.getElementById(
    "toggle-signup-password-confirmation"
);

// Toggle event untuk Sign Up Confirmation Password
toggleSignupPasswordConfirmation.addEventListener("click", () => {
    const type =
        signupPasswordConfirmationField.type === "password"
            ? "text"
            : "password";
    signupPasswordConfirmationField.type = type;
    toggleSignupPasswordConfirmation.classList.toggle("fa-eye");
    toggleSignupPasswordConfirmation.classList.toggle("fa-eye-slash");
});

// Sign In Password Visibility
const signinPasswordField = document.getElementById("signin-password");
const toggleSigninPassword = document.getElementById("toggle-signin-password");

// Toggle event untuk Sign In
toggleSigninPassword.addEventListener("click", () => {
    const type = signinPasswordField.type === "password" ? "text" : "password";
    signinPasswordField.type = type;
    toggleSigninPassword.classList.toggle("fa-eye");
    toggleSigninPassword.classList.toggle("fa-eye-slash");
});