/**
 * WC OTP Login — unified loading spinners (theme .Spinner:after parity)
 *
 * @since 1.1.0
 */

@keyframes wc-otp-spinner-rotate {
    to {
        transform: rotate(360deg);
    }
}

:is(
    .wc-otp-send-btn,
    .wc-otp-verify-btn,
    .wc-otp-register-btn,
    .wc-otp-link-send-btn,
    .wc-otp-link-verify-btn,
    .wc-otp-sms-help-back,
    .wc-otp-reg-send-btn,
    .wc-otp-reg-verify-btn
).wc-otp-loading::after,
.wc-otp-telegram-login-button.is-busy::after,
.fo_input__identity-edit.wc-otp-loading::after,
.wc-otp-account-menu__link.is-busy::after {
    position: absolute;
    top: 50%;
    left: 50%;
    translate: -50% -50%;
    visibility: visible;
    opacity: 1;
    z-index: 2;
    transition: opacity 0.2s ease, visibility 0s linear;
    content: "";
    display: inline-block;
    width: var(--wc-otp-spinner-size);
    height: var(--wc-otp-spinner-size);
    border: 2px solid transparent;
    border-left-color: var(--wc-otp-spinner-fg, currentColor);
    border-bottom-color: var(--wc-otp-spinner-fg, currentColor);
    border-radius: 50%;
    vertical-align: middle;
    animation: wc-otp-spinner-rotate var(--wc-otp-spinner-duration) linear infinite;
}

.wc-otp-account-menu__link.is-busy::after {
    left: auto;
    inset-inline-end: 10px;
    translate: 0 -50%;
}

:is(
    .wc-otp-send-btn,
    .wc-otp-verify-btn,
    .wc-otp-register-btn,
    .wc-otp-link-send-btn,
    .wc-otp-link-verify-btn,
    .wc-otp-sms-help-back,
    .wc-otp-reg-send-btn,
    .wc-otp-reg-verify-btn
).wc-otp-loading {
    --wc-otp-spinner-fg: var(--wc-otp-spinner-fg-on-primary);
    color: transparent;
}

.wc-otp-send-btn.wc-otp-loading {
    --wc-otp-spinner-fg: var(--wc-otp-spinner-fg-on-primary);
}

.wc-otp-button-label {
    transition: opacity 0.2s ease;
}

:is(
    .wc-otp-send-btn,
    .wc-otp-verify-btn,
    .wc-otp-register-btn,
    .wc-otp-link-send-btn,
    .wc-otp-link-verify-btn,
    .wc-otp-sms-help-back,
    .wc-otp-reg-send-btn,
    .wc-otp-reg-verify-btn
).wc-otp-loading > .wc-otp-button-label {
    opacity: 0;
}

.wc-otp-telegram-login-button.is-busy {
    --wc-otp-spinner-fg: var(--wc-otp-spinner-fg-on-muted);
    color: transparent;
}

.fo_input__identity-edit.wc-otp-loading {
    --wc-otp-spinner-size: var(--wc-otp-spinner-size-sm);
    --wc-otp-spinner-fg: var(--wc-otp-spinner-fg-on-muted);
}

.wc-otp-account-menu__link.is-busy {
    --wc-otp-spinner-size: var(--wc-otp-spinner-size-sm);
    --wc-otp-spinner-fg: var(--wc-otp-spinner-fg-on-muted);
}

@media (prefers-reduced-motion: reduce) {
    :is(
        .wc-otp-send-btn,
        .wc-otp-verify-btn,
        .wc-otp-register-btn,
        .wc-otp-link-send-btn,
        .wc-otp-link-verify-btn,
        .wc-otp-sms-help-back,
        .wc-otp-reg-send-btn,
        .wc-otp-reg-verify-btn
    ).wc-otp-loading::after,
    .wc-otp-telegram-login-button.is-busy::after,
    .fo_input__identity-edit.wc-otp-loading::after,
    .wc-otp-account-menu__link.is-busy::after {
        animation-duration: 1.4s;
    }
}