/*
 * Authpress sign-in, sign-up and password forms (shortcodes and blocks).
 *
 * Scoped to the wrappers those forms render in, so it never touches wp-login.php.
 * Restyle by overriding the custom properties on any wrapper, or on a parent:
 *
 *   .fls_auth_wrapper { --ap-accent: #0a7d5a; --ap-radius: 8px; }
 */
.fls_auth_wrapper,
.fls_login_wrapper,
.fls_registration_wrapper,
.fls_reset_pass_wrapper,
#fls_magic_login,
.fm_login_wrapper {
    --ap-accent: #0b63ce;
    --ap-text: #191919;
    --ap-muted: #5f6368;
    --ap-line: #e0dfdc;
    --ap-danger: #b42318;
    --ap-success: #067647;
    --ap-radius: 14px;

    box-sizing: border-box;
    color: var(--ap-text);
    font: inherit;
    line-height: 1.5;
}

.fls_auth_wrapper *,
.fls_login_wrapper *,
.fls_registration_wrapper *,
.fls_reset_pass_wrapper *,
#fls_magic_login *,
.fm_login_wrapper * {
    box-sizing: border-box;
}

/* The card. The combined form is one card; standalone forms are a card each. */
.fls_auth_wrapper,
.fls_login_wrapper,
.fls_registration_wrapper,
.fls_reset_pass_wrapper,
#fls_magic_login,
.fm_login_wrapper {
    width: 100%;
    max-width: 440px !important;
    margin: 24px auto;
    padding: 32px;
    background: #fff;
    border: 1px solid var(--ap-line);
    border-radius: var(--ap-radius);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04), 0 10px 30px rgba(0, 0, 0, 0.06);
    text-align: left;
}

.fls_auth_wrapper .fls_login_wrapper,
.fls_auth_wrapper .fls_registration_wrapper,
.fls_auth_wrapper .fls_reset_pass_wrapper,
.fls_login_wrapper #fls_magic_login {
    max-width: none !important;
    margin: 0;
    padding: 0;
    background: none;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.fls_registration_wrapper.hide,
.fls_reset_pass_wrapper.hide {
    display: none;
}

/* Title block */
.fls_form_head {
    margin-bottom: 22px;
}

.fls_form_head h2 {
    margin: 0 0 4px;
    font-size: 1.65em;
    font-weight: 700;
    line-height: 1.2;
    color: var(--ap-text);
}

.fls_form_head p {
    margin: 0;
    color: var(--ap-muted);
}

.fm_login_wrapper h3 {
    margin: 0 0 18px;
    font-size: 1.2em;
    font-weight: 700;
    text-align: center;
    color: var(--ap-text);
}

/* Fields */
body .fls_login_wrapper form#loginform > p,
body .fls_login_wrapper #fls_2fa_form > p,
body .fls_registration_wrapper .fls_field_group,
body .fls_reset_pass_wrapper .fls_field_group {
    margin: 0 0 16px;
}

body .fls_login_wrapper label,
body .fls_registration_wrapper label,
body .fls_reset_pass_wrapper label,
body #fls_magic_login label {
    display: block;
    margin: 0 0 6px;
    font-size: 0.92em;
    font-weight: 600;
    color: var(--ap-text);
}

body .fls_login_wrapper p.login-remember label {
    display: flex;
    gap: 0.5rem;
    align-items: center;
    margin: 0;
    font-weight: 400;
    color: var(--ap-muted);
    cursor: pointer;
}

body .fls_login_wrapper input[type="text"],
body .fls_login_wrapper input[type="email"],
body .fls_login_wrapper input[type="password"],
body .fls_login_wrapper input[type="number"],
body .fls_login_wrapper input.input,
body .fls_registration_wrapper input[type="text"],
body .fls_registration_wrapper input[type="email"],
body .fls_registration_wrapper input[type="password"],
body .fls_registration_wrapper input[type="number"],
body .fls_registration_wrapper input[type="tel"],
body .fls_registration_wrapper input[type="url"],
body .fls_registration_wrapper input[type="date"],
body .fls_registration_wrapper textarea,
body .fls_registration_wrapper select,
body .fls_reset_pass_wrapper input[type="text"],
body .fls_reset_pass_wrapper input[type="email"],
body #fls_magic_login input[type="text"],
body #fls_magic_login input[type="email"],
body #fls_magic_login .fls_magic_input {
    display: block;
    width: 100%;
    height: auto;
    min-height: 46px;
    margin: 0;
    padding: 11px 14px;
    font: inherit;
    color: var(--ap-text);
    background: #fff;
    border: 1px solid #8c8f94;
    border-radius: 8px;
    box-shadow: none;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

body .fls_login_wrapper input:focus,
body .fls_registration_wrapper input:focus,
body .fls_registration_wrapper select:focus,
body .fls_registration_wrapper textarea:focus,
body .fls_reset_pass_wrapper input:focus,
body #fls_magic_login input:focus {
    outline: 0;
    border-color: var(--ap-accent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--ap-accent) 22%, transparent);
}

body .fls_login_wrapper input[type="checkbox"] {
    width: 1.1em;
    height: 1.1em;
    margin: 0;
    accent-color: var(--ap-accent);
}

body .fls_registration_wrapper .fls_field_label.is-required label::after,
body .fls_reset_pass_wrapper .fls_field_label.is-required label::after {
    color: var(--ap-danger);
}

body .fls_registration_wrapper .fls_registration_form .fls_field_group.is-error input,
body .fls_registration_wrapper .fls_registration_form .fls_field_group.is-error select,
body .fls_reset_pass_wrapper .fls_reset_pass_form .fls_field_group.is-error input {
    border-color: var(--ap-danger);
}

/* Messages */
.fls_auth_wrapper .error.text-danger,
.fls_login_wrapper .error.text-danger,
.fls_registration_wrapper .error.text-danger,
.fls_reset_pass_wrapper .error.text-danger,
#fls_magic_login .error.text-danger {
    margin-top: 6px;
    font-size: 0.88em;
    color: var(--ap-danger);
}

.fls_auth_wrapper .success.text-success,
.fls_login_wrapper .success.text-success,
.fls_registration_wrapper .success.text-success,
.fls_reset_pass_wrapper .success.text-success {
    margin: 0 0 16px;
    padding: 12px 14px;
    color: var(--ap-success);
    background: #ecfdf3;
    border: 1px solid #abefc6;
    border-radius: 8px;
}

.fls_2fa_instruction {
    margin: 0 0 16px;
    color: var(--ap-muted);
}

/* Buttons */
body .fls_login_wrapper input#wp-submit,
body .fls_login_wrapper #fls_magic_submit,
body .fls_login_wrapper #fls_totp_submit,
body .fls_registration_wrapper .fls_registration_form #fls_submit,
body .fls_registration_wrapper .fls_registration_form #fls_verification_submit,
body .fls_reset_pass_wrapper .fls_reset_pass_form #fls_reset_pass,
body #fls_magic_login #fls_magic_submit {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 48px;
    margin: 4px 0 0;
    padding: 12px 20px;
    font: inherit;
    font-size: 1em;
    font-weight: 600;
    line-height: 1.2;
    color: #fff;
    background: var(--ap-accent);
    border: 0;
    border-radius: 999px;
    box-shadow: none;
    cursor: pointer;
    transition: background-color 0.15s ease;
}

body .fls_login_wrapper input#wp-submit:hover,
body .fls_login_wrapper #fls_magic_submit:hover,
body .fls_login_wrapper #fls_totp_submit:hover,
body .fls_registration_wrapper .fls_registration_form #fls_submit:hover,
body .fls_registration_wrapper .fls_registration_form #fls_verification_submit:hover,
body .fls_reset_pass_wrapper .fls_reset_pass_form #fls_reset_pass:hover,
body #fls_magic_login #fls_magic_submit:hover {
    background: color-mix(in srgb, var(--ap-accent) 85%, #000);
    border-radius: 999px;
}

body .fls_registration_wrapper .fls_registration_form #fls_submit.fls_loading,
body .fls_registration_wrapper .fls_registration_form #fls_verification_submit.fls_loading,
body .fls_reset_pass_wrapper .fls_reset_pass_form #fls_reset_pass.fls_loading {
    background: color-mix(in srgb, var(--ap-accent) 60%, #fff);
}

body .fls_login_wrapper input#wp-submit:focus-visible,
body .fls_registration_wrapper .fls_registration_form #fls_submit:focus-visible,
body .fls_reset_pass_wrapper .fls_reset_pass_form #fls_reset_pass:focus-visible {
    outline: 2px solid var(--ap-accent);
    outline-offset: 2px;
}

/* Secondary actions: "Sign in with a magic link" */
body .fls_magic_show_btn,
body .magic_btn_secondary {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 46px;
    padding: 10px 20px;
    font: inherit;
    font-weight: 600;
    color: var(--ap-accent);
    background: #fff;
    border: 1px solid var(--ap-accent);
    border-radius: 999px;
    cursor: pointer;
}

body .fls_magic_show_btn:hover,
body .magic_btn_secondary:hover {
    color: var(--ap-accent);
    background: color-mix(in srgb, var(--ap-accent) 8%, #fff);
    border-radius: 999px;
}

/* "or" divider */
.fls_magic-or span {
    padding: 0 12px;
    font-size: 0.85em;
    color: var(--ap-muted);
    letter-spacing: 0.04em;
}

.fls_magic-or::before,
.fls_magic-or::after {
    border-bottom-color: var(--ap-line);
}

.fls_login_wrapper #fls_magic_login {
    margin-top: 16px;
}

.login_magic_success {
    padding: 8px 0;
}

.login_success_heading h3 {
    margin: 0 0 6px;
    font-size: 1.3em;
}

/* Links under the form */
.fls_login_wrapper > p[style*="text-align"],
.fls_registration_wrapper > p[style*="text-align"] {
    margin: 18px 0 0;
    font-size: 0.95em;
    color: var(--ap-muted);
}

.fls_login_wrapper > p[style*="text-align"] + p[style*="text-align"] {
    margin-top: 6px;
}

.fls_login_wrapper a,
.fls_registration_wrapper a,
.fls_reset_pass_wrapper a,
#fls_magic_login a {
    font-weight: 600;
    color: var(--ap-accent);
    text-decoration: none;
}

.fls_login_wrapper a:hover,
.fls_registration_wrapper a:hover,
.fls_reset_pass_wrapper a:hover,
#fls_magic_login a:hover {
    text-decoration: underline;
}

/* Social buttons */
.fm_login_wrapper .fm_buttons_wrap {
    display: grid;
    gap: 10px;
}

.fm_login_wrapper a.ap_auth_btn {
    flex-grow: 0 !important;
    gap: 8px;
    min-height: 46px;
    margin: 0;
    padding: 10px 18px;
    font-size: 1em;
    font-weight: 600;
    line-height: 1.2;
    text-decoration: none;
    border: 1px solid transparent;
    border-radius: 999px;
    transition: filter 0.15s ease, background-color 0.15s ease;
}

.fm_login_wrapper a.ap_auth_btn svg {
    flex: none;
    margin: 0;
}

.fm_login_wrapper a.ap_auth_btn.ap_auth_google {
    color: #3c4043;
    background: #fff;
    border-color: #747775;
}

.fm_login_wrapper a.ap_auth_btn.ap_auth_google:hover {
    color: #3c4043;
    background: #f6f8fa;
}

.fm_login_wrapper a.ap_auth_btn.ap_auth_github,
.fm_login_wrapper a.ap_auth_btn.ap_auth_github:hover {
    color: #fff;
    background: #24292e;
}

.fm_login_wrapper a.ap_auth_btn.ap_auth_github:hover,
.fm_login_wrapper a.ap_auth_btn.ap_auth_facebook:hover {
    filter: brightness(1.2);
}

.fm_login_wrapper a.ap_auth_btn.ap_auth_facebook,
.fm_login_wrapper a.ap_auth_btn.ap_auth_facebook:hover {
    color: #fff;
    background: #1877f2;
}

.fm_login_wrapper a.ap_auth_btn.ap_auth_facebook svg,
.fm_login_wrapper a.ap_auth_btn.ap_auth_facebook:hover svg,
.fm_login_wrapper a.ap_auth_btn.ap_auth_github:hover svg {
    fill: #fff !important;
}

@media (max-width: 480px) {
    .fls_auth_wrapper,
    .fls_login_wrapper,
    .fls_registration_wrapper,
    .fls_reset_pass_wrapper,
    .fm_login_wrapper {
        margin: 12px auto;
        padding: 22px 18px;
    }

    .fls_auth_wrapper .fls_login_wrapper,
    .fls_auth_wrapper .fls_registration_wrapper,
    .fls_auth_wrapper .fls_reset_pass_wrapper {
        padding: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    body .fls_login_wrapper input,
    body .fls_login_wrapper button,
    body .fls_login_wrapper input#wp-submit {
        transition: none;
    }
}

.fls_magic_content {
    margin-bottom: 14px;
}

body #fls_magic_login #fls_magic_submit {
    margin-top: 12px;
}

/* Custom sign-up fields */
body .fls_registration_wrapper textarea { min-height: 88px; resize: vertical; }
body .fls_registration_wrapper .fls_field_help { display: block; margin-top: 4px; font-size: 0.86em; color: var(--ap-muted); }
body .fls_registration_wrapper .fls_check { display: flex; gap: 10px; align-items: flex-start; cursor: pointer; }
body .fls_registration_wrapper .fls_check input[type="checkbox"] { flex: none; width: 1.15em; height: 1.15em; margin: 0.2em 0 0; accent-color: var(--ap-accent); }
body .fls_registration_wrapper .fls_check span.is-required::after { content: " *"; color: var(--ap-danger); }

/* Alerts: sign-in and sign-up results */
body .fls_alert {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    padding: 12px 14px;
    margin: 0 0 16px;
    font-size: 0.95em;
    line-height: 1.45;
    border: 1px solid transparent;
    border-radius: 10px;
    animation: fls-alert-in 0.22s ease-out;
}

body .fls_alert .fls_alert__icon { flex: none; display: inline-flex; margin-top: 1px; }
body .fls_alert .fls_alert__text { min-width: 0; overflow-wrap: anywhere; }
body .fls_alert .fls_alert__text a { color: inherit; font-weight: 600; text-decoration: underline; }

body .fls_alert.fls_alert--error {
    margin-top: 0;
    color: #8a1f11;
    background: #fdf0ee;
    border-color: #f4c7c0;
}

body .fls_alert.fls_alert--success {
    margin-top: 0;
    color: #0f5b33;
    background: #ebf7f0;
    border-color: #b7e2c7;
}

body form.is-redirecting .fls_alert--success .fls_alert__icon svg { animation: fls-alert-pop 0.35s ease-out; }

@keyframes fls-alert-in { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
@keyframes fls-alert-pop { 0% { transform: scale(0.6); } 70% { transform: scale(1.15); } 100% { transform: scale(1); } }

@media (prefers-reduced-motion: reduce) {
    body .fls_alert, body form.is-redirecting .fls_alert--success .fls_alert__icon svg { animation: none; }
}

/* Logo above a form */
body .fls_form_logo { margin: 0 0 18px; text-align: center; }
body .fls_form_logo a { display: inline-block; line-height: 0; }
body .fls_form_logo img { display: block; width: auto; max-height: 90px; height: auto; margin: 0 auto; }

/* Two-step sign-in */
body .fls_login_wrapper form#loginform[data-authpress-steps] .fls_identity,
body .fls_login_wrapper form#loginform[data-authpress-steps] .fls_step_continue { display: none; }

body .fls_login_wrapper form#loginform.is-step-1 .login-password,
body .fls_login_wrapper form#loginform.is-step-1 .login-remember,
body .fls_login_wrapper form#loginform.is-step-1 .login-submit,
body .fls_login_wrapper form#loginform.is-step-1 .authpress-turnstile-wrap { display: none; }

body .fls_login_wrapper form#loginform.is-step-1 .fls_step_continue {
    display: block;
    width: 100%;
    min-height: 48px;
    margin: 4px 0 8px;
    font: inherit;
    font-weight: 600;
    color: #fff;
    cursor: pointer;
    background: var(--ap-accent);
    border: 0;
    border-radius: 999px;
}
body .fls_login_wrapper form#loginform.is-step-1 .fls_step_continue:disabled { opacity: 0.7; cursor: progress; }

body .fls_login_wrapper form#loginform.is-step-2 .login-username { display: none; }
body .fls_login_wrapper form#loginform.is-step-2 .fls_identity {
    display: flex;
    gap: 10px;
    align-items: center;
    justify-content: space-between;
    padding: 10px 14px;
    margin: 0 0 14px;
    background: color-mix(in srgb, var(--ap-accent) 7%, #fff);
    border: 1px solid color-mix(in srgb, var(--ap-accent) 25%, #fff);
    border-radius: 10px;
}
body .fls_login_wrapper .fls_identity__who { min-width: 0; overflow-wrap: anywhere; font-weight: 600; }
body .fls_login_wrapper .fls_identity__change { padding: 0; font: inherit; font-size: 0.9em; color: var(--ap-accent); text-decoration: underline; cursor: pointer; background: none; border: 0; }
