.wm-password-field {
    position: relative;
}

.wm-password-field__input {
    padding-right: 3rem !important;
}

.wm-password-field__toggle {
    align-items: center;
    border-radius: 9999px;
    color: #475569;
    cursor: pointer;
    display: inline-flex;
    height: 2rem;
    justify-content: center;
    position: absolute;
    right: 0.55rem;
    top: 50%;
    transform: translateY(-50%);
    transition: background-color 150ms ease, color 150ms ease;
    width: 2rem;
}

.wm-password-field__toggle:hover,
.wm-password-field__toggle:focus-visible {
    background: #ede9fe;
    color: #4c1d95;
    outline: none;
}

.wm-password-field__toggle:focus-visible {
    box-shadow: 0 0 0 2px rgb(168 85 247 / 0.45);
}

.wm-password-field__toggle.is-visible {
    background: #f3e8ff;
    color: #6d28d9;
}

.wm-password-field__toggle-icon {
    fill: none;
    height: 1.2rem;
    pointer-events: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.8;
    width: 1.2rem;
}

.wm-password-field__toggle-icon--hide,
.wm-password-field__toggle.is-visible .wm-password-field__toggle-icon--show {
    display: none;
}

.wm-password-field__toggle.is-visible .wm-password-field__toggle-icon--hide {
    display: block;
}
