(() => {
  "use strict";

  const toggle = document.querySelector("[data-pw-toggle]");
  const password = document.getElementById("id_password");
  if (toggle && password) {
    const eye = toggle.querySelector("[data-eye]");
    const eyeOff = toggle.querySelector("[data-eye-off]");
    toggle.addEventListener("click", () => {
      const show = password.type === "password";
      password.type = show ? "text" : "password";
      toggle.setAttribute("aria-label", show ? "Wachtwoord verbergen" : "Wachtwoord tonen");
      if (eye && eyeOff) {
        eye.hidden = show;
        eyeOff.hidden = !show;
      }
    });
  }

  const form = document.querySelector("form.auth-form");
  form?.addEventListener("submit", () => {
    const button = form.querySelector("[data-submit]");
    if (!button || button.dataset.busy || !form.checkValidity()) return;
    button.dataset.busy = "1";
    const label = button.querySelector("[data-label]");
    if (label) label.textContent = "Bezig met inloggen…";
  });
})();