/* Copyright (c) 2026, ADN DigiNet Ltd.
 * Part of DigiTicket, a modified version of Frappe Helpdesk (upstream project).
 * Licensed under the GNU AGPL-3.0. See LICENSE.
 *
 * Styling for the Set Password reveal toggle added by password_reveal.js.
 * Scoped to #reset-password so no other website form is affected. */

/* Edge and IE draw their own reveal button, which shows only while the field
 * has focus -- the inconsistency QA reported. Ours replaces it. */
#reset-password input[type="password"]::-ms-reveal,
#reset-password input[type="password"]::-ms-clear {
  display: none;
}

#reset-password .adn-pw-group {
  position: relative;
}

/* The input is the first child of its .form-group, so anchoring to the top of
 * the group lines the button up with the field even where a sibling (the
 * password-strength indicator) follows it. */
#reset-password .adn-pw-toggle {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  padding: 0;
  border: none;
  background: transparent;
  color: var(--text-muted, #8d99a6);
  cursor: pointer;
  line-height: 0;
}

#reset-password .adn-pw-toggle:hover,
#reset-password .adn-pw-toggle:focus {
  color: var(--text-color, #1f272e);
}

#reset-password .adn-pw-toggle:focus-visible {
  outline: 2px solid var(--primary, #0bc56a);
  outline-offset: -2px;
  border-radius: 4px;
}

/* Keep typed text clear of the button. */
#reset-password .adn-pw-group input[type="password"],
#reset-password .adn-pw-group input[type="text"] {
  padding-right: 2.5rem;
}