/* ═══════════════════════════════════════════════
   px_custom_template — Password Recovery branding
   Maps --px-* admin tokens onto recovery wizard.
   Structural layout is handled by nova skin.
   ═══════════════════════════════════════════════ */


/* ── Primary color: method cards, OTP, focus rings ── */
body.task-login .wizard-method-card:hover .method-card-inner {
    border-color: var(--px-login-primary) !important;
}

body.task-login .wizard-method-card.is-selected .method-card-inner,
body.task-login .wizard-method-card:active .method-card-inner {
    border-color: var(--px-login-primary-hover) !important;
    background: var(--px-login-primary-soft) !important;
}

body.task-login .wizard-method-icon {
    background: var(--px-login-primary) !important;
}

body.task-login #login-form .wizard-otp-digit:focus {
    border-color: var(--px-login-primary) !important;
}

body.task-login #login-form .recovery-wizard input.form-control:not(.px-math-captcha-answer):not(.wizard-captcha-input):focus,
body.task-login #login-form .recovery-wizard select.form-control:focus,
body.task-login #login-form:has(#rcmresetnew) input.form-control:not(.px-math-captcha-answer):focus {
    border-color: var(--px-login-primary) !important;
}


/* ── Text colors from branding tokens ── */
body.task-login #login-form:has(#recovery-wizard) h1,
body.task-login #login-form:has(#rcmresetnew) h1 {
    color: var(--px-color-text) !important;
}

body.task-login #login-form:has(#recovery-wizard) .auth-subtitle,
body.task-login #login-form:has(#rcmresetnew) .auth-subtitle,
body.task-login #login-form:has(#rcmresetnew) p.hint {
    color: var(--px-color-text-secondary) !important;
}

body.task-login #login-form .recovery-wizard .form-group label,
body.task-login #login-form .recovery-wizard .wizard-methods-label,
body.task-login #login-form .recovery-wizard .wizard-otp-label {
    color: var(--px-color-text) !important;
}


/* ── Input border + surface from branding ── */
body.task-login #login-form .recovery-wizard input.form-control:not(.px-math-captcha-answer):not(.wizard-captcha-input),
body.task-login #login-form .recovery-wizard select.form-control,
body.task-login #login-form:has(#rcmresetnew) input.form-control:not(.px-math-captcha-answer) {
    border-color: var(--px-color-border) !important;
    background: var(--px-color-surface) !important;
    color: var(--px-color-text) !important;
}


/* ── Responsive typography using branded tokens ── */
@media (max-width: 560px) {
    body.task-login #login-form:has(#recovery-wizard) h1,
    body.task-login #login-form:has(#rcmresetnew) h1,
    body.task-login #login-form .recovery-wizard .wizard-step h1 {
        font-size: var(--px-text-xl) !important;
    }
}