/* Keep the original input, label and form submission intact. */
.password-field {
  position: relative;
  display: block;
  width: 100%;
  min-width: 0;
}
html .password-field > input {
  display: block;
  width: 100%;
  min-height: 44px;
  margin: 0;
  padding-inline-end: 52px;
}
html .password-field > .password-toggle {
  position: absolute;
  inset-inline-end: 2px;
  top: 50%;
  transform: translateY(-50%);
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  min-height: 0;
  padding: 0;
  margin: 0;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--brand-muted, #61758a);
  cursor: pointer;
  touch-action: manipulation;
}
html .password-field > .password-toggle:hover {
  color: var(--brand-primary, #237f85);
  background: #237f850d;
}
html .password-field > .password-toggle:focus-visible {
  outline: 2px solid var(--brand-primary, #237f85);
  outline-offset: -3px;
}
.password-field > input::-ms-reveal { display: none; }