/* Anmeldung, Passwort und Sicherheit (Partner- und Kundenportal): nur innerhalb von .zugang, damit nichts anderes betroffen ist.
   Passwortfelder wie die übrigen Eingabefelder (site.css stylt type=password nicht), Bestätigen in der KAI-Markenfarbe statt Grün. */
.zugang input[type=password], .zugang .pw-feld input {
  width: 100%; padding: 13px 14px; border: 1.5px solid var(--line); border-radius: 10px; font-size: 16px; font-family: inherit; background: #fff; color: var(--ink);
}
.zugang input[type=email] { padding: 13px 14px; }
/* Code aus der App bzw. Wiederherstellungscode: groß, gut lesbar, mittig */
.zugang input[autocomplete=one-time-code] {
  width: 100%; padding: 14px; border: 1.5px solid var(--line); border-radius: 10px; background: #fff; color: var(--ink);
  font-family: inherit; font-size: 24px; font-weight: 600; letter-spacing: .25em; text-align: center; font-variant-numeric: tabular-nums;
}
.zugang input[autocomplete=one-time-code]::placeholder { color: #c3c7d2; letter-spacing: .25em; }
.zugang input:focus { outline: none; border-color: var(--brand); box-shadow: 0 0 0 3px rgba(63, 81, 181, .15); }
.zugang .btn:not(.outline) { background: var(--brand); border-radius: 10px; }
.zugang .btn:not(.outline):hover { background: var(--brand-dark); }
.zugang .btn:focus-visible { outline: 3px solid rgba(63, 81, 181, .35); outline-offset: 2px; }
/* Passwort anzeigen */
.zugang .pw-feld { position: relative; }
.zugang .pw-feld input { padding-right: 96px; }
.zugang .pw-zeigen { position: absolute; right: 6px; top: 50%; transform: translateY(-50%); border: 0; background: none; color: var(--brand); font-family: inherit; font-weight: 600; font-size: 14px; line-height: 1; padding: 10px 10px; border-radius: 8px; cursor: pointer; }
.zugang .pw-zeigen:hover { background: var(--lavender); }
.zugang .pw-zeigen:focus-visible { outline: 2px solid var(--brand); }