/* Settings secret mask + eye reveal (encrypted-password-reveal-w-gsap, no trial plugins) */

.nx-secret-mask {
  position: relative;
  display: block;
  width: 100%;
}

.nx-secret-mask__input.form-control,
.nx-secret-mask input.nx-secret-mask__input {
  padding-right: 2.5rem !important;
}

.nx-secret-mask__btn {
  position: absolute;
  top: 50%;
  right: 0.45rem;
  transform: translateY(-50%);
  z-index: 2;
  width: 1.75rem;
  height: 1.75rem;
  padding: 0;
  margin: 0;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  display: grid;
  place-items: center;
  color: rgba(30, 34, 40, 0.55);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

.nx-secret-mask__btn:hover,
.nx-secret-mask__btn:focus-visible,
.nx-secret-mask__btn[aria-pressed="true"] {
  color: rgba(20, 24, 30, 0.9);
  outline: none;
}

.nx-secret-mask__svg {
  width: 1.25rem;
  height: 1.25rem;
  display: block;
  overflow: visible;
}

.nx-secret-mask__glint {
  fill: #f5f5f5 !important;
}

.nx-secret-mask .sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

:is(html[data-bs-theme="midnight"], html.midnight) .nx-secret-mask__btn {
  color: rgba(255, 255, 255, 0.55);
}

:is(html[data-bs-theme="midnight"], html.midnight) .nx-secret-mask__btn:hover,
:is(html[data-bs-theme="midnight"], html.midnight) .nx-secret-mask__btn:focus-visible,
:is(html[data-bs-theme="midnight"], html.midnight) .nx-secret-mask__btn[aria-pressed="true"] {
  color: rgba(255, 255, 255, 0.92);
}

:is(html[data-bs-theme="midnight"], html.midnight) .nx-secret-mask__glint {
  fill: #0a0a0a !important;
}
