.password-toggle-btn,
.toggle-password {
    cursor: pointer;
    user-select: none;
}

.password-toggle-btn i,
.toggle-password i {
    font-size: 1.05rem;
    line-height: 1;
    color: #64748b;
}

.password-toggle-btn:hover i,
.toggle-password:hover i {
    color: #334155;
}

.pss-field {
    position: relative;
}

.pss-field .field-icon.password-toggle-btn,
label.position-relative > .field-icon.password-toggle-btn {
    position: absolute;
    right: 10px;
    bottom: 10px;
    border: none;
    background: transparent;
    padding: 0;
    z-index: 2;
}

[dir="rtl"] .pss-field .field-icon.password-toggle-btn,
[dir="rtl"] label.position-relative > .field-icon.password-toggle-btn {
    right: auto;
    left: 10px;
}

.custom-login .custom-login-form .field-icon.password-toggle-btn {
    cursor: pointer;
    z-index: 2;
}

.pss-field input.form-control,
label.position-relative input[type="password"],
label.position-relative input[type="text"] {
    padding-right: 2.75rem;
}

[dir="rtl"] .pss-field input.form-control,
[dir="rtl"] label.position-relative input[type="password"],
[dir="rtl"] label.position-relative input[type="text"] {
    padding-right: 0.75rem;
    padding-left: 2.75rem;
}

.password-field-wrap.input-group .form-control:focus {
    z-index: 1;
}

.password-field-wrap.input-group .password-toggle-btn {
    background: #fff;
}