/* Password reveal styles split from pages/css/global.css. */
.earn-pw-wrap {
  position: relative;
  display: block;
  width: 100%;
}
.earn-pw-wrap input[type="password"],
.earn-pw-wrap input[type="text"].earn-pw-revealed {
  padding-right: 44px !important;
}
.earn-pw-eye {
  position: absolute;
  right: 6px;
  top: 50%;
  transform: translateY(-50%);
  width: 36px;
  height: 36px;
  background: transparent;
  border: none;
  border-radius: 50%;
  padding: 0;
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: rgba(255, 255, 255, 0.4);
  transition:
    color 0.15s ease,
    background 0.15s ease;
  -webkit-appearance: none;
  appearance: none;
}
.earn-pw-eye:hover {
  color: rgba(255, 255, 255, 0.7);
  background: rgba(255, 255, 255, 0.04);
}
.earn-pw-eye:focus {
  outline: none;
  color: rgba(255, 255, 255, 0.7);
}
.earn-pw-eye svg {
  width: 18px;
  height: 18px;
  display: block;
  pointer-events: none;
}
.earn-pw-eye .earn-pw-eye-off {
  display: none;
}
.earn-pw-eye[data-revealed="1"] .earn-pw-eye-on {
  display: none;
}
.earn-pw-eye[data-revealed="1"] .earn-pw-eye-off {
  display: block;
}
