.sh-auth-page{min-height:calc(100vh - 80px);background:#f5f7fb;padding:18px 20px 24px;box-sizing:border-box;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;color:#111827}
.sh-auth-shell{width:min(1080px,100%);min-height:650px;margin:0 auto;background:#fff;border-radius:24px;overflow:hidden;box-shadow:0 24px 70px rgba(15,23,42,.12);display:grid;grid-template-columns:42% 58%}
.sh-auth-brand-panel{background:linear-gradient(145deg,#111827,#1f2937 55%,#111827);color:#fff;padding:60px 48px;display:flex;align-items:center}
.sh-auth-brand-inner{max-width:380px;margin:auto 0}
.sh-auth-mark{width:52px;height:52px;border-radius:15px;background:#fff;color:#111827;display:inline-flex;align-items:center;justify-content:center;font-size:18px;font-weight:800;letter-spacing:-.5px}
.sh-auth-brand-name{font-size:38px;font-weight:800;letter-spacing:-1.5px;margin-top:24px}
.sh-auth-brand-tagline{font-size:17px;color:#cbd5e1;margin:8px 0 45px}
.sh-auth-brand-points{display:grid;gap:20px;color:#e5e7eb;font-size:14px;line-height:1.5}
.sh-auth-brand-points span{display:inline-flex;width:24px;height:24px;border-radius:50%;align-items:center;justify-content:center;background:#fff;color:#111827;margin-right:10px;font-weight:800}
.sh-auth-form-panel{display:flex;align-items:center;justify-content:center;padding:55px 65px}
.sh-auth-card{width:min(440px,100%)}
.sh-auth-mobile-brand{display:none}
.sh-auth-heading h1{margin:0;font-size:32px;line-height:1.15;letter-spacing:-1px;color:#111827}
.sh-auth-heading p{margin:10px 0 26px;color:#64748b;font-size:14px}
.sh-auth-context-message{border:1px solid #bfdbfe;background:#eff6ff;color:#1d4ed8;padding:13px 15px;border-radius:10px;font-size:13px;line-height:1.45;margin-bottom:20px}
.sh-auth-tabs{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid #e5e7eb;margin-bottom:25px}
.sh-auth-tabs button{border:0;background:transparent;padding:13px 8px;color:#64748b;font-size:14px;font-weight:700;cursor:pointer;position:relative}
.sh-auth-tabs button.active{color:#111827}
.sh-auth-tabs button.active:after{content:"";position:absolute;left:15%;right:15%;bottom:-1px;height:2px;background:#111827;border-radius:2px}
.sh-auth-form[hidden]{display:none!important}
.sh-auth-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.sh-auth-field{margin-bottom:18px}
.sh-auth-field label{display:block;font-size:13px;font-weight:700;color:#334155;margin-bottom:7px}
.sh-auth-field input{width:100%;height:48px;border:1px solid #dbe2ea;border-radius:10px;background:#fff;padding:0 13px;box-sizing:border-box;color:#111827;font-size:14px;outline:none;transition:border-color .15s,box-shadow .15s}
.sh-auth-field input:focus{border-color:#111827;box-shadow:0 0 0 3px rgba(17,24,39,.08)}
.sh-auth-field input:invalid:not(:placeholder-shown){border-color:#fca5a5}
.sh-auth-label-row{display:flex;justify-content:space-between}
.sh-auth-password-wrap{position:relative}
.sh-auth-password-wrap input{padding-right:62px}
.sh-auth-password-toggle{position:absolute;right:9px;top:50%;transform:translateY(-50%);border:0;background:transparent;color:#475569;font-size:12px;font-weight:700;cursor:pointer}
.sh-auth-field-error{display:block;min-height:16px;margin-top:5px;color:#dc2626;font-size:11px}
.sh-auth-password-hint{font-size:11px;color:#94a3b8;margin-top:6px}
.sh-auth-strength{height:4px;border-radius:10px;background:#e2e8f0;margin-top:8px;overflow:hidden;font-size:10px;color:#64748b;padding-left:0}
.sh-auth-strength:before{content:"";display:block;height:100%;width:0;background:#cbd5e1;transition:width .2s}
.sh-auth-strength.score-1:before{width:25%;background:#ef4444}
.sh-auth-strength.score-2:before{width:50%;background:#f59e0b}
.sh-auth-strength.score-3:before{width:75%;background:#84cc16}
.sh-auth-strength.score-4:before{width:100%;background:#22c55e}
.sh-auth-form-error{background:#fef2f2;border:1px solid #fecaca;color:#b91c1c;border-radius:10px;padding:12px;font-size:13px;line-height:1.4;margin:5px 0 15px}
.sh-auth-submit{width:100%;height:50px;border:0;border-radius:10px;background:#111827;color:#fff;font-size:14px;font-weight:800;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:9px;transition:transform .15s,opacity .15s}
.sh-auth-submit:hover{transform:translateY(-1px)}
.sh-auth-submit:disabled{opacity:.65;cursor:not-allowed;transform:none}
.sh-auth-spinner{display:none;width:15px;height:15px;border:2px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;animation:sh-auth-spin .7s linear infinite}
.sh-auth-submit.loading .sh-auth-spinner{display:inline-block}
.sh-auth-terms{text-align:center;color:#94a3b8;font-size:11px;line-height:1.5;margin:22px 0 0}
.sh-auth-already{padding:80px 20px;min-height:60vh;background:#f5f7fb;display:flex;justify-content:center;align-items:center}
.sh-auth-already .sh-auth-card{background:#fff;padding:45px;border-radius:20px;text-align:center;box-shadow:0 20px 60px rgba(15,23,42,.1)}
.sh-auth-primary-link{display:inline-flex;margin-top:18px;padding:12px 20px;border-radius:9px;background:#111827;color:#fff;text-decoration:none;font-weight:700;font-size:13px}
@keyframes sh-auth-spin{to{transform:rotate(360deg)}}
@media(max-width:850px){
 .sh-auth-shell{grid-template-columns:1fr;min-height:auto}
 .sh-auth-brand-panel{display:none}
 .sh-auth-form-panel{padding:38px 28px}
 .sh-auth-mobile-brand{display:flex;align-items:center;gap:10px;margin-bottom:35px;font-size:20px}
 .sh-auth-mobile-brand .sh-auth-mark{width:38px;height:38px;border-radius:11px;font-size:13px;background:#111827;color:#fff}
}
@media(max-width:520px){
 .sh-auth-page{padding:0;min-height:100vh}
 .sh-auth-shell{border-radius:0;min-height:100vh}
 .sh-auth-form-panel{padding:30px 20px;align-items:flex-start}
 .sh-auth-card{padding-top:5px}
 .sh-auth-heading h1{font-size:28px}
 .sh-auth-grid{grid-template-columns:1fr;gap:0}
 .sh-auth-tabs{margin-bottom:22px}
}

/* SkillHost Core v2.6 legacy modal is intentionally replaced by this dedicated page. */
.sh-auth-modal{display:none!important}

/* Standalone auth viewport: keep Login/Register immediately visible on page load. */
body:has(.sh-auth-page) .sh-auth-page{min-height:calc(100vh - 80px);display:flex;align-items:flex-start;justify-content:center;padding-top:18px}
body:has(.sh-auth-page) .sh-auth-shell{min-height:min(680px,calc(100vh - 122px));max-height:calc(100vh - 122px)}
body:has(.sh-auth-page) .sh-auth-form-panel{overflow:auto}
body:has(.sh-auth-page) .sh-auth-card{padding-bottom:4px}
@media(max-width:850px){
 body:has(.sh-auth-page) .sh-auth-shell{max-height:none;min-height:calc(100vh - 80px)}
 body:has(.sh-auth-page) .sh-auth-form-panel{overflow:visible}
}

body.skillhost-auth-page-active .sh-auth-page{min-height:calc(100vh - 80px);display:flex;align-items:flex-start;justify-content:center;padding-top:18px}
body.skillhost-auth-page-active .sh-auth-shell{min-height:min(680px,calc(100vh - 122px));max-height:calc(100vh - 122px)}
body.skillhost-auth-page-active .sh-auth-form-panel{overflow:auto}
@media(max-width:850px){
 body.skillhost-auth-page-active .sh-auth-shell{max-height:none;min-height:calc(100vh - 80px)}
 body.skillhost-auth-page-active .sh-auth-form-panel{overflow:visible}
}

/* v1.0.3: the auth page is a true standalone viewport, not a theme content block. */
html.skillhost-auth-standalone,
body.skillhost-auth-standalone{margin:0!important;padding:0!important;width:100%;min-height:100%;background:#f5f7fb!important}
body.skillhost-auth-standalone{overflow-x:hidden}
body.skillhost-auth-standalone .sh-auth-page{min-height:100vh!important;height:auto!important;padding:24px!important;display:flex!important;align-items:center!important;justify-content:center!important;box-sizing:border-box!important}
body.skillhost-auth-standalone .sh-auth-shell{width:min(1080px,100%)!important;min-height:650px!important;max-height:none!important;margin:0 auto!important}
body.skillhost-auth-standalone .sh-auth-form-panel{overflow:visible!important}
body.skillhost-auth-standalone .sh-auth-card{max-height:none!important;overflow:visible!important}
body.skillhost-auth-standalone .sh-auth-mobile-brand{display:none}
@media(max-width:850px){
 body.skillhost-auth-standalone .sh-auth-page{padding:0!important;align-items:stretch!important}
 body.skillhost-auth-standalone .sh-auth-shell{min-height:100vh!important;border-radius:0!important}
 body.skillhost-auth-standalone .sh-auth-form-panel{overflow:visible!important}
 body.skillhost-auth-standalone .sh-auth-mobile-brand{display:flex}
}

/* Header account links added by SkillHost Auth. */
.sh-auth-nav-item>a{font-weight:700!important}
.sh-auth-nav-login>a,.sh-auth-nav-register>a{white-space:nowrap}
.sh-site-auth-fallback{position:fixed;top:12px;right:18px;z-index:999999;display:flex;align-items:center;gap:8px;background:#fff;padding:7px 10px;border-radius:999px;box-shadow:0 6px 22px rgba(15,23,42,.12);font:600 13px/1.2 Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif}
.sh-site-auth-fallback a{color:#111827;text-decoration:none;padding:5px 8px;border-radius:7px}
.sh-site-auth-fallback a:last-child{background:#111827;color:#fff}
@media(max-width:600px){
 .sh-site-auth-fallback{top:8px;right:8px;font-size:12px}
}

/* v1.0.4: keep the auth card fully visible without page-level scrolling. */
html.skillhost-auth-standalone,
html.skillhost-auth-standalone body{width:100%;height:100%;min-height:100%;margin:0!important;padding:0!important}
body.skillhost-auth-standalone{overflow:hidden!important}
body.skillhost-auth-standalone .sh-auth-page{
    min-height:100vh!important;
    height:100vh!important;
    max-height:100vh!important;
    padding:12px 18px!important;
    overflow:hidden!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    box-sizing:border-box!important;
}
body.skillhost-auth-standalone .sh-auth-shell{
    min-height:0!important;
    height:min(680px,calc(100vh - 24px))!important;
    max-height:calc(100vh - 24px)!important;
    overflow:hidden!important;
}
body.skillhost-auth-standalone .sh-auth-form-panel{
    min-height:0!important;
    overflow:hidden!important;
    padding:36px 58px!important;
}
body.skillhost-auth-standalone .sh-auth-card{
    max-height:100%!important;
    overflow:visible!important;
}
@media(max-width:850px){
    body.skillhost-auth-standalone{overflow:auto!important}
    body.skillhost-auth-standalone .sh-auth-page{
        height:auto!important;
        min-height:100vh!important;
        max-height:none!important;
        overflow:visible!important;
        padding:0!important;
    }
    body.skillhost-auth-standalone .sh-auth-shell{
        height:auto!important;
        min-height:100vh!important;
        max-height:none!important;
        overflow:visible!important;
    }
    body.skillhost-auth-standalone .sh-auth-form-panel{
        overflow:visible!important;
        padding:30px 20px 40px!important;
    }
}

/*
 * v1.0.5 — TRUE FULL-VIEWPORT AUTH OVERLAY
 *
 * The screenshot shows the WordPress theme header/breadcrumb/content wrapper
 * still consuming viewport space. The auth component therefore becomes a
 * fixed full-screen layer. This is intentionally stronger than theme-specific
 * header selectors because it works regardless of which SkillHost theme
 * template is active.
 */
html:has(.sh-auth-page),
body:has(.sh-auth-page){
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    height:100%!important;
}
body:has(.sh-auth-page) .sh-auth-page{
    position:fixed!important;
    inset:0!important;
    z-index:2147483000!important;
    width:100vw!important;
    height:100vh!important;
    min-height:100vh!important;
    max-height:100vh!important;
    margin:0!important;
    padding:16px 20px!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    background:#f5f7fb!important;
}
body:has(.sh-auth-page) .sh-auth-shell{
    width:min(1080px,100%)!important;
    height:min(680px,calc(100vh - 32px))!important;
    min-height:0!important;
    max-height:calc(100vh - 32px)!important;
    margin:0!important;
    overflow:hidden!important;
}
body:has(.sh-auth-page) .sh-auth-form-panel{
    min-height:0!important;
    overflow:hidden!important;
}
body:has(.sh-auth-page) .sh-auth-card{
    max-height:none!important;
    overflow:visible!important;
}

/* The standalone template gets the same rules without relying on :has(). */
body.skillhost-auth-standalone{
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
}
body.skillhost-auth-standalone .sh-auth-page{
    position:fixed!important;
    inset:0!important;
    z-index:2147483000!important;
    width:100vw!important;
    height:100vh!important;
    min-height:100vh!important;
    max-height:100vh!important;
    margin:0!important;
    padding:16px 20px!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
}
body.skillhost-auth-standalone .sh-auth-shell{
    width:min(1080px,100%)!important;
    height:min(680px,calc(100vh - 32px))!important;
    min-height:0!important;
    max-height:calc(100vh - 32px)!important;
    margin:0!important;
    overflow:hidden!important;
}
body.skillhost-auth-standalone .sh-auth-form-panel{
    min-height:0!important;
    overflow:hidden!important;
}

/* Compact desktop form so the entire login action stays above the fold. */
body:has(.sh-auth-page) .sh-auth-form-panel,
body.skillhost-auth-standalone .sh-auth-form-panel{
    padding-top:32px!important;
    padding-bottom:28px!important;
}
body:has(.sh-auth-page) .sh-auth-field,
body.skillhost-auth-standalone .sh-auth-field{
    margin-bottom:12px!important;
}
body:has(.sh-auth-page) .sh-auth-heading p,
body.skillhost-auth-standalone .sh-auth-heading p{
    margin-bottom:18px!important;
}
body:has(.sh-auth-page) .sh-auth-tabs,
body.skillhost-auth-standalone .sh-auth-tabs{
    margin-bottom:17px!important;
}
body:has(.sh-auth-page) .sh-auth-terms,
body.skillhost-auth-standalone .sh-auth-terms{
    margin-top:12px!important;
}

/* Mobile: use the whole viewport and compact the controls. */
@media(max-width:850px){
    html:has(.sh-auth-page),
    body:has(.sh-auth-page),
    body.skillhost-auth-standalone{
        overflow:hidden!important;
    }
    body:has(.sh-auth-page) .sh-auth-page,
    body.skillhost-auth-standalone .sh-auth-page{
        position:fixed!important;
        inset:0!important;
        width:100vw!important;
        height:100vh!important;
        min-height:100vh!important;
        max-height:100vh!important;
        padding:10px!important;
        overflow:hidden!important;
        align-items:center!important;
    }
    body:has(.sh-auth-page) .sh-auth-shell,
    body.skillhost-auth-standalone .sh-auth-shell{
        width:100%!important;
        height:100%!important;
        min-height:0!important;
        max-height:100%!important;
        border-radius:14px!important;
        overflow:hidden!important;
    }
    body:has(.sh-auth-page) .sh-auth-form-panel,
    body.skillhost-auth-standalone .sh-auth-form-panel{
        padding:18px 20px!important;
        align-items:flex-start!important;
        overflow:hidden!important;
    }
    body:has(.sh-auth-page) .sh-auth-mobile-brand,
    body.skillhost-auth-standalone .sh-auth-mobile-brand{
        display:flex!important;
        margin-bottom:14px!important;
    }
    body:has(.sh-auth-page) .sh-auth-heading h1,
    body.skillhost-auth-standalone .sh-auth-heading h1{
        font-size:24px!important;
    }
    body:has(.sh-auth-page) .sh-auth-heading p,
    body.skillhost-auth-standalone .sh-auth-heading p{
        margin:5px 0 12px!important;
        font-size:12px!important;
    }
    body:has(.sh-auth-page) .sh-auth-tabs,
    body.skillhost-auth-standalone .sh-auth-tabs{
        margin-bottom:12px!important;
    }
    body:has(.sh-auth-page) .sh-auth-field,
    body.skillhost-auth-standalone .sh-auth-field{
        margin-bottom:7px!important;
    }
    body:has(.sh-auth-page) .sh-auth-field label,
    body.skillhost-auth-standalone .sh-auth-field label{
        margin-bottom:4px!important;
        font-size:11px!important;
    }
    body:has(.sh-auth-page) .sh-auth-field input,
    body.skillhost-auth-standalone .sh-auth-field input{
        height:39px!important;
        font-size:12px!important;
    }
    body:has(.sh-auth-page) .sh-auth-field-error,
    body.skillhost-auth-standalone .sh-auth-field-error{
        min-height:10px!important;
        margin-top:2px!important;
        font-size:9px!important;
    }
    body:has(.sh-auth-page) .sh-auth-submit,
    body.skillhost-auth-standalone .sh-auth-submit{
        height:42px!important;
    }
    body:has(.sh-auth-page) .sh-auth-terms,
    body.skillhost-auth-standalone .sh-auth-terms{
        margin-top:7px!important;
        font-size:9px!important;
    }
}