/* Password handling */

.btn-password-action {
  position: absolute;
  top: 3px;
  width: 28px;
  height: 30px;
  background: 0;
  border: 0;
}

[data-passwordtogglefor] {
  /* background-color: var(--bs-btn-disabled-bg);
  -webkit-mask-image: var(--icon-eye-closed) !important;
  mask-image: var(--icon-eye-closed) !important; */
  right: 4px;
  z-index: 9;
}

[data-passwordrandomizefor] {
  right: 32px;
  z-index: 9;
}

[type="password"],
[aria-type=password][type="text"] {
  padding-right: calc(1.5em + 0.75rem);
  background-repeat: no-repeat;
  background-position: right calc(0.375em + 0.1875rem) center;
  background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
}

.btn-password-action {
  /* -webkit-mask-position: right 36px center, right 8px center; */
  -webkit-mask-position: center center;
  -webkit-mask-repeat: no-repeat;
  /* -webkit-mask-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); */
}

[type="password"]~button[data-passwordtogglefor] {
  background-color: var(--bs-primary, #008577);
  -webkit-mask-image: url('data:image/svg+xml,<svg width="1em" height="1em" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg"><path d="M13.359 11.238C15.06 9.72 16 8 16 8s-3-5.5-8-5.5a7.028 7.028 0 0 0-2.79.588l.77.771A5.944 5.944 0 0 1 8 3.5c2.12 0 3.879 1.168 5.168 2.457A13.134 13.134 0 0 1 14.828 8c-.058.087-.122.183-.195.288-.335.48-.83 1.12-1.465 1.755-.165.165-.337.328-.517.486l.708.709z"/><path d="M11.297 9.176a3.5 3.5 0 0 0-4.474-4.474l.823.823a2.5 2.5 0 0 1 2.829 2.829l.822.822zm-2.943 1.299l.822.822a3.5 3.5 0 0 1-4.474-4.474l.823.823a2.5 2.5 0 0 0 2.829 2.829z"/><path d="M3.35 5.47c-.18.16-.353.322-.518.487A13.134 13.134 0 0 0 1.172 8l.195.288c.335.48.83 1.12 1.465 1.755C4.121 11.332 5.881 12.5 8 12.5c.716 0 1.39-.133 2.02-.36l.77.772A7.029 7.029 0 0 1 8 13.5C3 13.5 0 8 0 8s.939-1.721 2.641-3.238l.708.709z"/><path fill-rule="evenodd" d="M13.646 14.354l-12-12 .708-.708 12 12-.708.708z"/></svg>') !important;
  mask-image: url('data:image/svg+xml,<svg width="1em" height="1em" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg"><path d="M13.359 11.238C15.06 9.72 16 8 16 8s-3-5.5-8-5.5a7.028 7.028 0 0 0-2.79.588l.77.771A5.944 5.944 0 0 1 8 3.5c2.12 0 3.879 1.168 5.168 2.457A13.134 13.134 0 0 1 14.828 8c-.058.087-.122.183-.195.288-.335.48-.83 1.12-1.465 1.755-.165.165-.337.328-.517.486l.708.709z"/><path d="M11.297 9.176a3.5 3.5 0 0 0-4.474-4.474l.823.823a2.5 2.5 0 0 1 2.829 2.829l.822.822zm-2.943 1.299l.822.822a3.5 3.5 0 0 1-4.474-4.474l.823.823a2.5 2.5 0 0 0 2.829 2.829z"/><path d="M3.35 5.47c-.18.16-.353.322-.518.487A13.134 13.134 0 0 0 1.172 8l.195.288c.335.48.83 1.12 1.465 1.755C4.121 11.332 5.881 12.5 8 12.5c.716 0 1.39-.133 2.02-.36l.77.772A7.029 7.029 0 0 1 8 13.5C3 13.5 0 8 0 8s.939-1.721 2.641-3.238l.708.709z"/><path fill-rule="evenodd" d="M13.646 14.354l-12-12 .708-.708 12 12-.708.708z"/></svg>') !important;
}

[aria-type=password][type="text"]~button[data-passwordtogglefor] {
  background-color: var(--bs-primary, #008577);
  -webkit-mask-image: url('data:image/svg+xml,<svg width="1em" height="1em" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg"><path d="M 10 7 C 12.21 7 14 8.79 14 11 C 14 13.21 12.21 15 10 15 C 7.79 15 6 13.21 6 11 C 6 8.79 7.79 7 10 7 Z M 10 8.5 C 8.62 8.5 7.5 9.62 7.5 11 C 7.5 12.38 8.62 13.5 10 13.5 C 11.38 13.5 12.5 12.38 12.5 11 C 12.5 9.62 11.38 8.5 10 8.5 Z M 10 3.5 C 14.61 3.5 18.6 6.65 19.7 11.06 C 19.8 11.46 19.56 11.87 19.16 11.97 C 18.75 12.07 18.35 11.83 18.25 11.43 C 17.31 7.68 13.92 5 10 5 C 6.08 5 2.69 7.68 1.75 11.43 C 1.65 11.83 1.25 12.08 0.84 11.98 C 0.44 11.88 0.2 11.47 0.3 11.07 C 1.4 6.65 5.39 3.5 10 3.5 Z"/></svg>') !important;
  mask-image: url('data:image/svg+xml,<svg width="1em" height="1em" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg"><path d="M 10 7 C 12.21 7 14 8.79 14 11 C 14 13.21 12.21 15 10 15 C 7.79 15 6 13.21 6 11 C 6 8.79 7.79 7 10 7 Z M 10 8.5 C 8.62 8.5 7.5 9.62 7.5 11 C 7.5 12.38 8.62 13.5 10 13.5 C 11.38 13.5 12.5 12.38 12.5 11 C 12.5 9.62 11.38 8.5 10 8.5 Z M 10 3.5 C 14.61 3.5 18.6 6.65 19.7 11.06 C 19.8 11.46 19.56 11.87 19.16 11.97 C 18.75 12.07 18.35 11.83 18.25 11.43 C 17.31 7.68 13.92 5 10 5 C 6.08 5 2.69 7.68 1.75 11.43 C 1.65 11.83 1.25 12.08 0.84 11.98 C 0.44 11.88 0.2 11.47 0.3 11.07 C 1.4 6.65 5.39 3.5 10 3.5 Z"/></svg>') !important;
}

button[data-passwordrandomizefor] {
  background-color: var(--bs-primary, #008577);
  -webkit-mask-image: url('data:image/svg+xml,<svg width="1em" height="1em" viewBox="0 0 20 20" fill="currentColor" xmlns="http://www.w3.org/2000/svg"><path d="M 10 2.5 C 5.86 2.5 2.5 5.86 2.5 10 C 2.5 14.14 5.86 17.5 10 17.5 C 14.14 17.5 17.5 14.14 17.5 10 C 17.5 9.62 17.47 9.25 17.42 8.89 C 17.35 8.44 17.68 8 18.14 8 C 18.51 8 18.84 8.26 18.9 8.62 C 18.96 9.07 19 9.53 19 10 C 19 14.97 14.97 19 10 19 C 5.03 19 1 14.97 1 10 C 1 5.03 5.03 1 10 1 C 12.31 1 14.41 1.87 16 3.29 L 16 2.25 C 16 1.84 16.34 1.5 16.75 1.5 C 17.16 1.5 17.5 1.84 17.5 2.25 L 17.5 5.25 C 17.5 5.66 17.16 6 16.75 6 L 13.75 6 C 13.34 6 13 5.66 13 5.25 C 13 4.84 13.34 4.5 13.75 4.5 L 15.1 4.5 C 13.76 3.26 11.97 2.5 10 2.5 Z"/></svg>') !important;
  mask-image: url('data:image/svg+xml,<svg width="1em" height="1em" viewBox="0 0 20 20" fill="currentColor" xmlns="http://www.w3.org/2000/svg"><path d="M 10 2.5 C 5.86 2.5 2.5 5.86 2.5 10 C 2.5 14.14 5.86 17.5 10 17.5 C 14.14 17.5 17.5 14.14 17.5 10 C 17.5 9.62 17.47 9.25 17.42 8.89 C 17.35 8.44 17.68 8 18.14 8 C 18.51 8 18.84 8.26 18.9 8.62 C 18.96 9.07 19 9.53 19 10 C 19 14.97 14.97 19 10 19 C 5.03 19 1 14.97 1 10 C 1 5.03 5.03 1 10 1 C 12.31 1 14.41 1.87 16 3.29 L 16 2.25 C 16 1.84 16.34 1.5 16.75 1.5 C 17.16 1.5 17.5 1.84 17.5 2.25 L 17.5 5.25 C 17.5 5.66 17.16 6 16.75 6 L 13.75 6 C 13.34 6 13 5.66 13 5.25 C 13 4.84 13.34 4.5 13.75 4.5 L 15.1 4.5 C 13.76 3.26 11.97 2.5 10 2.5 Z"/></svg>') !important;
}

input[type=password].password-create,
input[type=text][aria-type=password].password-create,
.was-validated input[type=password].password-create.form-control:invalid,
.was-validated input[type=password].password-create.form-control.is-invalid,
.was-validated input[type=text][aria-type=password].password-create.form-control:invalid,
.was-validated input[type=text][aria-type=password].password-create.form-control.is-invalid,
.was-validated input[type=password].password-create.form-control:valid,
.was-validated input[type=password].password-create.form-control.is-valid,
.was-validated input[type=text][aria-type=password].password-create.form-control:valid,
.was-validated input[type=text][aria-type=password].password-create.form-control.is-valid {
  padding-right: calc(1.5em + 0.75rem + 28px);
}

.was-validated input[type=password].form-control:invalid,
.was-validated input[type=password].form-control.is-invalid,
.was-validated input[type=text][aria-type=password].form-control:invalid,
.was-validated input[type=text][aria-type=password].form-control.is-invalid,
.was-validated input[type=password].form-control:valid,
.was-validated input[type=password].form-control.is-valid,
.was-validated input[type=text][aria-type=password].form-control:valid,
.was-validated input[type=text][aria-type=password].form-control.is-valid {
  background-position: right 0.15rem top 0.15rem;
  background-size: 0.75rem 0.75rem;
}