/* 2FA-codestap — kleine, op zichzelf staande stijl bovenop portal.css */
.wok-2fa{max-width:460px;margin:0 auto}
.wok-2fa-slot{width:70px;height:70px;margin:0 auto 18px;border-radius:20px;
  background:var(--p-grad);color:#fff;display:flex;align-items:center;justify-content:center;
  font-size:30px;box-shadow:0 10px 26px rgba(16,98,254,.28)}
.wok-2fa h1{margin:0 0 6px;font-size:23px;color:var(--p-merk);text-align:center;line-height:1.25}
.wok-2fa-sub{margin:0 0 22px;color:var(--p-dim);font-size:14.5px;text-align:center;line-height:1.5}
.wok-2fa .wok-card-body{padding:26px 26px 24px}
.wok-2fa-label{display:block;font-weight:700;font-size:13px;color:var(--p-dim);
  margin:0 0 8px;text-align:center}
.wok-2fa-code{width:100%;box-sizing:border-box;padding:15px 12px;border:1.5px solid var(--p-rand);
  border-radius:12px;font:inherit;font-size:30px;font-weight:700;letter-spacing:12px;
  text-align:center;color:var(--p-merk);background:var(--p-vlak);transition:border-color .15s,box-shadow .15s}
.wok-2fa-code::placeholder{color:#cbd5e1;letter-spacing:12px}
.wok-2fa-code:focus{outline:none;border-color:var(--p-accent);background:#fff;
  box-shadow:0 0 0 4px rgba(16,98,254,.12)}
.wok-2fa-knop{width:100%;box-sizing:border-box;border:0;cursor:pointer;font:inherit;font-weight:700;
  font-size:15px;padding:15px 28px;border-radius:8px;background:var(--btn-primary,#1d65af);color:#fff;
  margin-top:16px;box-shadow:0 4px 12px rgba(29,101,175,.35);transition:transform .08s,background .15s}
.wok-2fa-knop:hover{background:#1a5a9c}
.wok-2fa-knop:active{transform:translateY(1px)}
.wok-2fa-acties{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.wok-2fa-acties form{flex:1 1 140px}
.wok-2fa-sec{width:100%;box-sizing:border-box;cursor:pointer;font:inherit;font-weight:700;font-size:13px;
  padding:8px 15px;border-radius:8px;border:none;background:rgba(16,98,254,.08);color:#1d65af;
  display:inline-flex;align-items:center;justify-content:center;gap:8px;transition:background .12s}
.wok-2fa-sec:hover{background:rgba(16,98,254,.14);color:#1d65af}
.wok-2fa-sec.grijs{color:var(--p-dim)}
.wok-2fa-sec.wa{color:#128c7e;border-color:#a7e0d6}
.wok-2fa-sec.wa:hover{background:#e9fbf6;border-color:#128c7e}

/* Uit template verplaatste statische stijlen (wrapper, geblokkeerde kaart, terug-knop) */
.wok-2fa-wrap{padding-top:44px}
.wok-2fa-eind{text-align:center;padding:28px 24px}
.wok-2fa-knop.wok-2fa-terug{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  width:auto;padding:13px 26px;text-decoration:none;margin-top:0}
