/* PillingerWorks Two-Factor Authentication — UI layer
 * Intentionally scoped to the 2FA module and verification screen.
 * Uses existing PillingerWorks theme tokens/classes; no Personal Settings
 * or global login styles are owned by this stylesheet.
 */

/* Verification / login step */
.pw-auth-page .pw-auth-shell{
    width:100%;
    box-sizing:border-box;
    padding:clamp(28px,6vw,72px) 20px;
}

.pw-auth-page .pw-auth-card{
    width:min(100%,520px);
    margin:0 auto;
    box-sizing:border-box;
    padding:clamp(28px,5vw,44px);
    border:1px solid var(--pw-border,#273347);
    border-radius:var(--pw-radius-lg,18px);
    background:var(--pw-card,var(--pw-surface,#111827));
    box-shadow:var(--pw-shadow,0 18px 50px rgba(0,0,0,.18));
}

.pw-auth-page .pw-auth-header{
    margin-bottom:26px;
    text-align:center;
}

.pw-auth-page .pw-eyebrow{
    margin:0 0 8px;
    color:var(--pw-primary,var(--pw-accent,#7c8cff));
    font-size:.76rem;
    font-weight:700;
    letter-spacing:.12em;
    line-height:1.3;
    text-transform:uppercase;
}

.pw-auth-page .pw-auth-header h1{
    margin:0;
    color:var(--pw-heading,var(--pw-text,#fff));
    font-size:clamp(1.55rem,3vw,2rem);
    line-height:1.2;
}

.pw-auth-page .pw-auth-header p:not(.pw-eyebrow){
    max-width:430px;
    margin:12px auto 0;
    color:var(--pw-muted,#8f9db2);
    line-height:1.6;
}

.pw-auth-page .pw-auth-form{
    margin:0;
}

.pw-auth-page .pw-form-field{
    margin-bottom:20px;
}

.pw-auth-page .pw-form-field label{
    display:block;
    margin:0 0 8px;
    color:var(--pw-text,#e8edf5);
    font-size:.9rem;
    font-weight:600;
}

.pw-auth-page .pw-form-field input[type="text"]{
    display:block;
    width:100%;
    min-height:56px;
    box-sizing:border-box;
    margin:0;
    padding:10px 16px;
    border:1px solid var(--pw-border,#273347);
    border-radius:var(--pw-radius-md,12px);
    background:var(--pw-input,var(--pw-surface-2,#0d1422));
    color:var(--pw-text,#e8edf5);
    font-size:1.55rem;
    font-weight:700;
    letter-spacing:.32em;
    line-height:1;
    text-align:center;
    outline:none;
    transition:border-color .18s ease,box-shadow .18s ease;
}

.pw-auth-page .pw-form-field input[type="text"]:focus{
    border-color:var(--pw-primary,var(--pw-accent,#7c8cff));
    box-shadow:0 0 0 3px color-mix(in srgb,var(--pw-primary,var(--pw-accent,#7c8cff)) 16%,transparent);
}

.pw-auth-page .pw-checkbox{
    display:flex;
    align-items:flex-start;
    gap:10px;
    margin:0 0 20px;
    color:var(--pw-muted,#8f9db2);
    font-size:.9rem;
    line-height:1.45;
    cursor:pointer;
}

.pw-auth-page .pw-checkbox input{
    flex:0 0 auto;
    margin-top:3px;
}

.pw-auth-page .pw-auth-submit,
.pw-auth-page .pw-2fa-resend-form .pw-button{
    width:100%;
    min-height:48px;
}

.pw-auth-page .pw-2fa-resend-form{
    margin-top:10px;
}

.pw-auth-page .pw-notice{
    margin:0 0 18px;
    padding:12px 14px;
    border:1px solid var(--pw-border,#273347);
    border-radius:var(--pw-radius-md,12px);
    background:var(--pw-surface-2,rgba(255,255,255,.035));
    color:var(--pw-text,#e8edf5);
    font-size:.9rem;
    line-height:1.5;
}

.pw-auth-page .pw-notice--error{
    border-color:var(--pw-danger,#b94a5a);
}

.pw-auth-page .pw-auth-card .pw-button{
    box-sizing:border-box;
}

/* Personal Settings 2FA card — only the module owned by this plugin */
.pw-2fa-module .pw-2fa-device{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:16px;
    padding:14px 0;
    border-top:1px solid var(--pw-border,#273347);
}

.pw-2fa-device>div{
    display:flex;
    flex-direction:column;
    gap:4px;
}

.pw-2fa-device span,
.pw-2fa-module .pw-card-note{
    color:var(--pw-muted,#8f9db2);
}

.pw-2fa-devices{
    margin-top:24px;
}

.pw-2fa-devices h3{
    margin-bottom:4px;
}

.pw-2fa-settings-form .pwps-button,
.pw-2fa-device .pwps-button{
    margin-top:12px;
}

@media (max-width:700px){
    .pw-auth-page .pw-auth-shell{
        padding:24px 14px 40px;
    }

    .pw-auth-page .pw-auth-card{
        padding:24px 20px;
        border-radius:14px;
    }

    .pw-auth-page .pw-auth-header{
        margin-bottom:22px;
    }

    .pw-auth-page .pw-form-field input[type="text"]{
        min-height:54px;
        font-size:1.35rem;
    }

    .pw-2fa-module .pw-2fa-device{
        align-items:flex-start;
        flex-direction:column;
    }
}



/* Consolidated PillingerWorks 2FA UI — matches existing Personal Settings cards. */
.pw-auth-page .pw-auth-card{width:min(100%,440px);padding:36px;border-radius:14px;background:var(--pw-surface,#fff);border:1px solid var(--pw-border,#dfe3e8);box-shadow:0 8px 28px rgba(15,23,42,.055);color:var(--pw-text,#17202a);font-family:inherit}
.pw-auth-page .pw-auth-header{margin-bottom:22px;text-align:center}
.pw-auth-page .pw-auth-header h1{margin:0;color:var(--pw-text,#17202a);font:inherit;font-size:24px;font-weight:700;line-height:1.25;letter-spacing:-.02em}
.pw-auth-page .pw-auth-header p:not(.pw-eyebrow){margin:10px auto 0;max-width:430px;color:var(--pw-muted,#687386);font-family:inherit;font-size:13px;font-weight:400;line-height:1.5}
.pw-auth-page .pw-eyebrow{margin:0 0 8px;color:var(--pw-muted,#687386);font-family:inherit;font-size:11px;font-weight:700;line-height:1.3;letter-spacing:.1em;text-transform:uppercase}
.pw-auth-page .pw-form-field{margin:0 0 18px}
.pw-auth-page .pw-form-field label{display:block;margin:0 0 8px;color:var(--pw-text,#17202a);font-family:inherit;font-size:13px;font-weight:700;line-height:1.5}
.pw-auth-page .pw-form-field input[type="text"]{display:block;width:100%;min-height:48px;box-sizing:border-box;margin:0;padding:10px 14px;border:1px solid var(--pw-border,#dfe3e8);border-radius:9px;background:var(--pw-surface,#fff);color:var(--pw-text,#17202a);font-family:inherit;font-size:18px;font-weight:700;letter-spacing:.22em;line-height:1.3;text-align:center}
.pw-auth-page .pw-checkbox{display:flex;align-items:flex-start;gap:9px;margin:0 0 18px;color:var(--pw-muted,#687386);font-family:inherit;font-size:13px;font-weight:400;line-height:1.5}
.pw-auth-page .pw-checkbox input{flex:0 0 auto;margin-top:4px}
.pw-auth-page .pw-auth-submit{display:flex;justify-content:center;align-items:center;width:100%;min-height:44px;margin:0;box-sizing:border-box}
.pw-auth-page .pw-auth-card>.pw-2fa-resend-form{display:flex;justify-content:center;align-items:center;width:100%;margin:8px 0 0;padding:0;text-align:center}
.pw-auth-page .pw-auth-card>.pw-2fa-resend-form>.pw-2fa-resend-link{appearance:none;display:inline;width:auto;min-width:0;min-height:0;height:auto;margin:0;padding:2px 4px;border:0;border-radius:0;background:transparent;box-shadow:none;color:var(--pw-muted,#687386);font-family:inherit;font-size:13px;font-weight:500;line-height:1.5;text-align:center;text-decoration:underline;text-underline-offset:2px;cursor:pointer}
.pw-auth-page .pw-auth-card>.pw-2fa-resend-form>.pw-2fa-resend-link:hover{background:transparent;color:var(--pw-text,#17202a)}
.pw-auth-page .pw-notice{margin:0 0 16px;padding:12px 14px;border:1px solid var(--pw-border,#dfe3e8);border-radius:9px;background:var(--pw-surface-2,#f5f6f8);color:var(--pw-text,#17202a);font-size:13px;line-height:1.5}

.pwps-card.pw-2fa-module>.pwps-card-head{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;column-gap:16px;padding:22px 24px 17px}
.pwps-card.pw-2fa-module>.pwps-card-head>.pw-2fa-card-heading{display:block;min-width:0;margin:0}
.pwps-card.pw-2fa-module>.pwps-card-head>.pw-2fa-card-heading>h2{margin:0;color:var(--pwps-text,var(--pw-text,#17202a));font-family:inherit;font-size:16px;font-weight:700;line-height:1.25;letter-spacing:-.01em}
.pwps-card.pw-2fa-module>.pwps-card-head>.pw-2fa-card-heading>p{margin:6px 0 0;color:var(--pwps-muted,var(--pw-muted,#687386));font-family:inherit;font-size:13px;font-weight:400;line-height:1.5}
.pwps-card.pw-2fa-module>.pwps-card-head>.pwps-status{display:inline-flex;justify-self:end;align-self:start;margin:0;white-space:nowrap}
.pwps-card.pw-2fa-module .pwps-security-body{padding:20px 24px 22px;color:var(--pwps-text,var(--pw-text,#17202a));font-family:inherit;font-size:13px;line-height:1.5}
.pwps-card.pw-2fa-module .pwps-security-body label,.pwps-card.pw-2fa-module .pwps-security-body p,.pwps-card.pw-2fa-module .pw-2fa-devices{font-family:inherit;font-size:13px;line-height:1.5}
.pwps-card.pw-2fa-module .pw-card-note{margin:8px 0 0;color:var(--pwps-muted,var(--pw-muted,#687386));font-size:13px;line-height:1.5}
.pwps-card.pw-2fa-module .pw-2fa-settings-form>.pwps-button{margin-top:16px}
.pwps-card.pw-2fa-module .pw-2fa-devices{margin-top:26px}
.pwps-card.pw-2fa-module .pwps-security-subsection h3{margin:0;font-family:inherit;font-size:16px;font-weight:700;line-height:1.3}
.pwps-card.pw-2fa-module .pw-2fa-device{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:16px 0;border-top:1px solid var(--pwps-border,var(--pw-border,#dfe3e8))}
.pwps-card.pw-2fa-module .pw-2fa-device>.pw-2fa-device-meta{display:flex;flex:1 1 auto;flex-direction:column;align-items:flex-start;gap:6px;min-width:0}
.pwps-card.pw-2fa-module .pw-2fa-device-meta>strong{display:block;margin:0;font-size:13px;font-weight:700;line-height:1.45}
.pwps-card.pw-2fa-module .pw-2fa-device-meta>span{display:block;margin:0;color:var(--pwps-muted,var(--pw-muted,#687386));font-size:13px;font-weight:400;line-height:1.5;overflow-wrap:anywhere}
.pwps-card.pw-2fa-module .pw-2fa-device>form{flex:0 0 auto;margin:0}
.pwps-card.pw-2fa-module .pw-2fa-device>form .pwps-button{margin:0}

body.pw-appearance-dusk .pw-auth-page .pw-auth-card{background:var(--pw-card,var(--pw-surface,#111827));border-color:var(--pw-border,#273347);color:var(--pw-text,#e8edf5);box-shadow:var(--pw-shadow,0 18px 50px rgba(0,0,0,.18))}
body.pw-appearance-dusk .pw-auth-page .pw-auth-header h1,body.pw-appearance-dusk .pw-auth-page .pw-form-field label{color:var(--pw-text,#e8edf5)}
body.pw-appearance-dusk .pw-auth-page .pw-auth-header p:not(.pw-eyebrow),body.pw-appearance-dusk .pw-auth-page .pw-checkbox,body.pw-appearance-dusk .pw-auth-page .pw-2fa-resend-link{color:var(--pw-muted,#8f9db2)}
body.pw-appearance-dusk .pw-auth-page .pw-form-field input[type="text"]{background:var(--pw-input,var(--pw-surface-2,#0d1422));color:var(--pw-text,#e8edf5);border-color:var(--pw-border,#273347)}
body.pw-appearance-dusk .pw-auth-page .pw-notice{background:var(--pw-surface-2,rgba(255,255,255,.035));border-color:var(--pw-border,#273347);color:var(--pw-text,#e8edf5)}
body.pw-appearance-dusk .pwps-card.pw-2fa-module .pw-2fa-device{border-color:var(--pw-border,#273347)}
body.pw-appearance-dusk .pwps-card.pw-2fa-module .pw-2fa-device-meta>span,body.pw-appearance-dusk .pwps-card.pw-2fa-module .pw-card-note{color:var(--pw-muted,#8f9db2)}

@media(max-width:600px){
.pw-auth-page .pw-auth-shell{padding:24px 14px 40px}
.pw-auth-page .pw-auth-card{padding:24px 20px;border-radius:12px}
.pw-auth-page .pw-auth-header h1{font-size:22px}
.pwps-card.pw-2fa-module>.pwps-card-head{padding:18px 17px 15px;column-gap:10px}
.pwps-card.pw-2fa-module .pwps-security-body{padding:17px}
.pwps-card.pw-2fa-module .pw-2fa-device{align-items:stretch;flex-direction:column;gap:12px}
.pwps-card.pw-2fa-module .pw-2fa-device>form,.pwps-card.pw-2fa-module .pw-2fa-device>form .pwps-button{width:100%}
}