/* ============================================================
   RESETPAGINA
   ============================================================ */
form[name="_fRESET"],form[name="_fNEWPW"]{position:relative;z-index:1;width:100%;max-width:420px}

/* ---------- Meldingen ---------- */
.auth-alert p{margin:0}
.auth-alert strong{display:block;margin-bottom:2px;font-weight:700}
.auth-alert[hidden]{display:none}
.auth-alert.is-success{background:var(--soft);border-color:var(--border);color:var(--ink)}
.auth-alert.is-success svg{color:var(--status)}
.auth-alert.is-error{background:#fdf2f2;border-color:#f0c4c4;color:#8a2c2c}
.auth-alert.is-error svg{color:#d44c4c}
.auth-alert.is-shake{animation:nudge .36s cubic-bezier(.36,.07,.19,.97) both}

/* ---------- Knoppen ---------- */
.btn-login[disabled],.btn-login[disabled]:hover{opacity:.7;cursor:progress;transform:none;filter:none}
/* Een link met class btn-login ziet eruit als de hoofdknop */
a.btn-login{display:flex;align-items:center;justify-content:center;text-align:center;
  text-decoration:none;color:var(--btn-ink)}
a.btn-login:hover,a.btn-login:focus{color:var(--btn-ink);text-decoration:none}

/* ---------- Ongeldig veld ---------- */
.field input.is-invalid{border-color:#d44c4c;background:#fff;box-shadow:0 0 0 4px rgba(212,76,76,.14)}
.field input.is-invalid ~ .ico{color:#d44c4c}

/* ---------- Wachtwoordvereisten (live checklist) ---------- */
.pw-rules{list-style:none;margin:2px 0 18px;padding:0;display:grid;gap:7px}
.pw-rules li{display:flex;align-items:center;gap:9px;font-size:13px;line-height:1.4;color:var(--muted);
  transition:color .15s ease}
.pw-rules li::before{content:"";flex:0 0 16px;height:16px;border-radius:50%;border:1.5px solid var(--border);
  background:#fff center/10px 10px no-repeat;transition:background-color .15s ease,border-color .15s ease}
.pw-rules li.is-ok{color:var(--ink)}
.pw-rules li.is-ok::before{border-color:var(--status);background-color:var(--status);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E")}
.pw-rules li.is-bad{color:#8a2c2c;font-weight:600}
.pw-rules li.is-bad::before{border-color:#d44c4c;background-color:#fdf2f2}

/* ---------- Link terug naar aanmelden ---------- */
.auth-back{margin:18px 0 0;text-align:center;font-size:13px}

@keyframes nudge{10%,90%{transform:translateX(-1px)}20%,80%{transform:translateX(2px)}
  30%,50%,70%{transform:translateX(-4px)}40%,60%{transform:translateX(4px)}}
@media (prefers-reduced-motion:reduce){.auth-alert.is-shake{animation:none}}
