/* De aanmeldschermen (fase 3c): het oogje in het wachtwoordveld. Een eigen
   bestand naast skin.css (niet in tools/build-css.py): de regels dragen zelf
   het gewicht van de skin, :is(#hsk,.hsk), en staan erna, dus winnen ze. */
:is(#hsk,.hsk) .hsk-pw{position:relative;display:block;min-width:0}
:is(#hsk,.hsk) .hsk-form .hsk-pw input[type=password],
:is(#hsk,.hsk) .hsk-form .hsk-pw input[type=text]{padding-right:50px}
:is(#hsk,.hsk) .hsk-pw-eye{position:absolute;top:2px;right:2px;bottom:2px;width:44px;display:grid;place-items:center;border:0;border-radius:calc(var(--r-sm) - 2px);background:transparent;color:var(--mut);cursor:pointer;padding:0;margin:0}
:is(#hsk,.hsk) .hsk-pw-eye[hidden]{display:none}
:is(#hsk,.hsk) .hsk-pw-eye:hover{color:var(--text);background:var(--surface-2)}
/* de focusring zoals elk veld van de huisstijl: --acc-t (4,5:1), binnen de knop (H18) */
:is(#hsk,.hsk) .hsk-pw-eye:focus-visible{outline:2px solid var(--acc-t);outline-offset:-2px}
:is(#hsk,.hsk) .hsk-pw-eye .hsk-i{width:20px;height:20px}
:is(#hsk,.hsk) .hsk-pw-eye .hsk-pw-off,
:is(#hsk,.hsk) .hsk-pw-eye.is-shown .hsk-pw-on{display:none}
:is(#hsk,.hsk) .hsk-pw-eye.is-shown .hsk-pw-off{display:block}