/* 9. PasswordInput Component */
.password-input {
    @apply relative;

    .password-input__field {
        @apply pr-10;
    }

    .password-input__toggle {
        @apply absolute inset-y-0 right-0 flex items-center rounded-r-md px-3 focus-visible:outline-none;
        color: var(--muted-foreground);

        &:hover {
            color: var(--foreground);
        }
    }

    .password-input__icon {
        @apply size-4;
    }
}