/* Show/hide eye inside password fields (js/password-toggle.js adds the markup). */
.password-field { position: relative; }
.password-field > .form-control { padding-right: 3rem; }
.password-field > input::-ms-reveal { display: none; } /* Edge's own eye would double up */

.password-field__toggle {
    position: absolute; top: 0; right: 0; height: 100%; width: 3rem;
    display: flex; align-items: center; justify-content: center;
    border: 0; background: transparent; color: #6c757d; font-size: 1rem;
    border-radius: 0 .3rem .3rem 0; cursor: pointer;
}
.password-field > .form-control-lg ~ .password-field__toggle { font-size: 1.1rem; }
.password-field__toggle:hover,
.password-field__toggle:focus-visible { color: #3A7CA5; }
.password-field__toggle:focus-visible { outline: 2px solid #3A7CA5; outline-offset: -2px; }