/* WebinarHub 360° — approved Sign In visual language for OTHER access and
   registration journeys. Scoped to the routes selected by layouts/layout.php.
   Presentation only: fields, validation, route links, workflows and page
   backgrounds remain as in the established codebase. The Sign In view itself
   deliberately does not load this stylesheet. */

/* Account creation, email PIN, guest registration and profile-completion share
   the same navy information panel and spacious white form surface. */
body.wh-v4 .auth-grid.wh4-signup,
body.wh-v4 .hub-recovery.fpd-signin {
    gap: clamp(16px, 2.3vw, 30px) !important;
    align-items: stretch !important;
    min-width: 0;
}
body.wh-v4 .auth-grid.wh4-signup > .auth-art.registration-context,
body.wh-v4 .hub-recovery.fpd-signin > .fpd-signin__hero {
    background: linear-gradient(140deg, #021f2d 0%, #193b4a 100%) !important;
    background-image: linear-gradient(140deg, #021f2d 0%, #193b4a 100%) !important;
    color: #fff !important;
    border: 1px solid #021f2d !important;
    border-radius: 20px !important;
    padding: clamp(24px, 3vw, 40px) !important;
    box-shadow: none !important;
    min-width: 0;
    overflow: hidden;
}
body.wh-v4 .auth-grid.wh4-signup > .auth-art.registration-context::before,
body.wh-v4 .auth-grid.wh4-signup > .auth-art.registration-context::after,
body.wh-v4 .hub-recovery.fpd-signin > .fpd-signin__hero::before,
body.wh-v4 .hub-recovery.fpd-signin > .fpd-signin__hero::after {
    content: none !important;
    display: none !important;
}
body.wh-v4 .auth-grid.wh4-signup > .auth-art.registration-context :is(h1, h2),
body.wh-v4 .hub-recovery.fpd-signin > .fpd-signin__hero h1 {
    color: #fff !important;
    font-size: clamp(27px, 3vw, 40px) !important;
    letter-spacing: -.035em;
    line-height: 1.16 !important;
    margin: 12px 0 !important;
    overflow-wrap: anywhere;
}
body.wh-v4 .auth-grid.wh4-signup > .auth-art.registration-context > p,
body.wh-v4 .hub-recovery.fpd-signin .fpd-signin__intro {
    color: rgba(255, 255, 255, .85) !important;
    font-size: 15px !important;
    line-height: 1.6 !important;
}
body.wh-v4 .auth-grid.wh4-signup > .auth-art.registration-context :is(.eyebrow, .fpd-auth-info-card__eyebrow),
body.wh-v4 .hub-recovery.fpd-signin .fpd-signin__hero .fpd-signin__eyebrow {
    color: #f6a220 !important;
}
body.wh-v4 .auth-grid.wh4-signup > .auth-art.registration-context :is(.wh-signup-accent, .hub-choice-accent),
body.wh-v4 .hub-recovery.fpd-signin .fpd-signin__hero h1 span {
    color: #f6a220 !important;
    text-decoration-line: underline !important;
    text-decoration-color: #f6a220 !important;
    text-decoration-thickness: .08em !important;
    text-underline-offset: .16em !important;
}
/* Signup and PIN have a portal/security inset matching the approved Sign In
   inset, but never expose or fabricate information about an account. */
body.wh-v4 .fpd-auth-info-card,
body.wh-v4 .auth-grid.wh4-signup > .auth-art.registration-context .selected-webinar,
body.wh-v4 .hub-recovery.fpd-signin .fpd-signin__webinar,
body.wh-v4 .hub-choice-compact .hub-choice-brand-features {
    width: 100%;
    display: grid;
    gap: 7px;
    margin-top: clamp(18px, 2.6vw, 28px);
    padding: clamp(15px, 1.6vw, 20px) !important;
    border: 1px solid #f6a220 !important;
    border-radius: 12px !important;
    background: #fff !important;
    color: #021f2d !important;
    box-shadow: none !important;
    min-width: 0;
}
body.wh-v4 .fpd-auth-info-card__eyebrow {
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .14em;
    color: #bb760a !important;
}
body.wh-v4 .fpd-auth-info-card :is(strong, small),
body.wh-v4 .auth-grid.wh4-signup .selected-webinar strong,
body.wh-v4 .hub-recovery .fpd-signin__webinar strong {
    display: block;
    overflow-wrap: anywhere;
    color: #021f2d !important;
}
body.wh-v4 .fpd-auth-info-card small,
body.wh-v4 .auth-grid.wh4-signup .selected-webinar > span:not(.eyebrow) {
    color: #536b78 !important;
    line-height: 1.5;
}
body.wh-v4 .auth-grid.wh4-signup .selected-webinar .eyebrow,
body.wh-v4 .hub-recovery .fpd-signin__webinar .fpd-signin__eyebrow {
    color: #a86300 !important;
}
/* Keep the original multiple-registration-options inset on a white surface. */
body.wh-v4 .hub-choice-compact .hub-choice-brand-features {
    gap: 13px;
}
body.wh-v4 .hub-choice-compact .hub-choice-brand-feature strong {
    color: #021f2d !important;
}
body.wh-v4 .hub-choice-compact .hub-choice-brand-feature small {
    color: #536b78 !important;
}
body.wh-v4 .hub-choice-compact .hub-choice-feature-icon {
    background: #fff1d8 !important;
    color: #021f2d !important;
}
/* Sign In's white card treatment is repeated without replacing form elements,
   reordering fields or changing the long-form wizards. */
body.wh-v4 .auth-grid.wh4-signup > .auth-form,
body.wh-v4 .hub-recovery.fpd-signin .fpd-signin__card,
body.wh-v4 .registration-journey > .panel,
body.wh-v4 .wh-staff-activation > .panel {
    background: #fff !important;
    border: 1px solid #dfe9ed !important;
    border-radius: 20px !important;
    box-shadow: 0 14px 36px rgba(2, 31, 45, .055) !important;
    padding: clamp(22px, 3vw, 40px) !important;
    min-width: 0;
}
body.wh-v4 .auth-grid.wh4-signup > .auth-form :is(h1, h2),
body.wh-v4 .hub-recovery.fpd-signin .fpd-signin__card h2,
body.wh-v4 .registration-journey > .panel > h1,
body.wh-v4 .wh-staff-activation > .panel > h1 {
    color: #021f2d !important;
    font-size: clamp(25px, 2.5vw, 32px) !important;
    line-height: 1.2 !important;
    letter-spacing: -.035em;
}
body.wh-v4 :is(.auth-grid.wh4-signup > .auth-form, .hub-recovery .fpd-signin__card, .registration-journey > .panel)
    :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea) {
    border-radius: 10px !important;
    min-height: 44px;
    max-width: 100%;
    background: #fff !important;
}
body.wh-v4 :is(.auth-grid.wh4-signup > .auth-form, .hub-recovery .fpd-signin__card, .registration-journey > .panel)
    :is(input, select, textarea):focus-visible {
    outline: 3px solid #f6a220 !important;
    outline-offset: 2px;
    border-color: #021f2d !important;
}
body.wh-v4 .auth-grid.wh4-signup > .auth-form :is(a:not(.btn), .password-toggle),
body.wh-v4 .hub-recovery .fpd-signin__card :is(a:not(.btn), .password-toggle),
body.wh-v4 .registration-journey > .panel a:not(.btn) {
    color: #021f2d !important;
    text-decoration-color: #f6a220 !important;
}
body.wh-v4 .auth-grid.wh4-signup > .auth-form a:not(.btn):hover,
body.wh-v4 .hub-recovery .fpd-signin__card a:not(.btn):hover {
    text-decoration: underline;
    text-decoration-color: #f6a220 !important;
    text-underline-offset: .17em;
}
body.wh-v4 .auth-grid.wh4-signup > .auth-form .password-toggle {
    background: #fff8eb !important;
    color: #021f2d !important;
}
body.wh-v4 .auth-grid.wh4-signup :is(.wizard-progress .is-current b, .journey-step),
body.wh-v4 .hub-guest-layout .guest-wizard-fill {
    background: #021f2d !important;
    color: #fff !important;
}
body.wh-v4 .auth-grid.wh4-signup .wizard-progress .is-complete b,
body.wh-v4 .hub-choice-compact .choice-icon {
    background: #fff2da !important;
    color: #021f2d !important;
}
body.wh-v4 .auth-grid.wh4-signup .guest-wizard-track {
    background: #edf0f1 !important;
}
body.wh-v4 .auth-grid.wh4-signup .wizard-actions,
body.wh-v4 .auth-grid.wh4-signup .guest-wizard-buttons { flex-wrap: wrap; }
body.wh-v4 .auth-grid.wh4-signup > .auth-form .btn-primary,
body.wh-v4 .hub-recovery .fpd-signin__card .btn-primary,
body.wh-v4 .registration-journey .btn-primary,
body.wh-v4 .wh-staff-activation .btn-primary {
    background: #021f2d !important;
    border-color: #021f2d !important;
    color: #fff !important;
}
body.wh-v4 .auth-grid.wh4-signup > .auth-form .btn-ghost,
body.wh-v4 .registration-journey .btn-ghost { background: #f6a220 !important; color: #021f2d !important; }
/* Registration confirmation keeps its existing single-column design, enhanced
   with the same typography, padding and warm decorative section accents. */
body.wh-v4 .registration-journey .journey-step {
    background: #fff2da !important;
    color: #021f2d !important;
}
body.wh-v4 .registration-journey .webinar-extra-questions legend {
    color: #021f2d !important;
    border-bottom-color: #f6a220 !important;
}
@media (min-width: 901px) {
    body.wh-v4 .auth-grid.wh4-signup {
        grid-template-columns: minmax(0, 1fr) minmax(0, 2fr) !important;
    }
    body.wh-v4 .auth-grid.wh4-signup > .auth-art.registration-context {
        align-self: stretch !important;
    }
    body.wh-v4 .auth-grid.wh4-signup > .auth-form {
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        align-self: stretch !important;
    }
    body.wh-v4 .hub-recovery.fpd-signin {
        grid-template-columns: minmax(0, 1fr) minmax(0, 2fr) !important;
    }
    body.wh-v4 .hub-recovery.fpd-signin > .hub-recovery__workspace {
        background: transparent !important;
        padding: 0 !important;
        align-items: stretch !important;
    }
    body.wh-v4 .hub-recovery.fpd-signin .fpd-signin__card {
        width: 100% !important;
        max-width: none !important;
        min-height: 100% !important;
    }
}
@media (max-width: 900px) {
    /* Form first on phones; retain both panels and all registration fields. */
    body.wh-v4 .auth-grid.wh4-signup,
    body.wh-v4 .hub-recovery.fpd-signin {
        display: flex !important;
        flex-direction: column !important;
        gap: 14px !important;
    }
    body.wh-v4 .auth-grid.wh4-signup > .auth-form,
    body.wh-v4 .hub-recovery.fpd-signin > .hub-recovery__workspace {
        order: 1 !important;
        min-width: 0;
    }
    body.wh-v4 .auth-grid.wh4-signup > .auth-art.registration-context,
    body.wh-v4 .hub-recovery.fpd-signin > .hub-recovery__hero {
        order: 2 !important;
    }
    body.wh-v4 .hub-recovery.fpd-signin > .hub-recovery__workspace {
        background: transparent !important;
        padding: 0 !important;
    }
    body.wh-v4 .auth-grid.wh4-signup > .auth-form {
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
    }
    body.wh-v4 .hub-choice-compact .hub-choice-brand-features {
        grid-template-columns: minmax(0, 1fr) !important;
    }
}
@media (max-width: 560px) {
    body.wh-v4 .auth-grid.wh4-signup > .auth-form,
    body.wh-v4 .hub-recovery.fpd-signin .fpd-signin__card,
    body.wh-v4 .registration-journey > .panel {
        padding: 20px 17px !important;
    }
    body.wh-v4 .auth-grid.wh4-signup > .auth-art.registration-context,
    body.wh-v4 .hub-recovery.fpd-signin > .fpd-signin__hero {
        padding: 23px 20px !important;
    }
    body.wh-v4 .auth-grid.wh4-signup .participant-form-grid {
        grid-template-columns: minmax(0, 1fr) !important;
    }
}
/* The shared privacy disclosure is part of each signup/registration form;
   replace its legacy teal interaction accent without changing its copy. */
body.wh-v4 :is(.auth-grid.wh4-signup, .registration-journey)
    .hub-data-use-notice :is(summary, a, summary::marker) {
    color: #021f2d !important;
    text-decoration-color: #f6a220 !important;
}
body.wh-v4 :is(.auth-grid.wh4-signup, .registration-journey)
    .hub-data-use-disclosure summary:focus-visible {
    outline: 3px solid #f6a220 !important;
    outline-offset: 2px;
}

/* Signup-only: swap the generic promotional inset for genuinely useful
   registration guidance and the EXISTING wizard navigation. A single set of
   controls is moved between desktop and mobile; validation is unchanged. */
body.wh-v4 .auth-grid.wh4-signup .fpd-signup-assist {
    gap: 10px;
    align-content: start;
}
body.wh-v4 .fpd-signup-assist__dock {
    display: grid;
    gap: 14px;
    min-width: 0;
}
body.wh-v4 .fpd-signup-assist .hub-data-use-notice {
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: #021f2d;
    font-size: 13px;
    line-height: 1.5;
}
body.wh-v4 .fpd-signup-assist .hub-data-use-summary {
    color: #021f2d;
    font-size: 13px;
    line-height: 1.55;
    margin: 0 0 9px;
}
body.wh-v4 .fpd-signup-assist .hub-data-use-notice :is(summary, a) {
    color: #021f2d !important;
    text-decoration-color: #f6a220 !important;
}
/* Wizard navigation stays beneath the active form step on every screen. */
body.wh-v4 .auth-grid.wh4-signup > .auth-form .wizard-actions {
    margin-top: 18px !important;
    padding-top: 16px !important;
    border-top: 1px solid #e1ebee !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
}
body.wh-v4 .auth-grid.wh4-signup > .auth-form .wizard-count {
    color: #021f2d !important;
    font-size: 13px !important;
}
body.wh-v4 .auth-grid.wh4-signup > .auth-form [data-wizard-next] {
    background: #021f2d !important;
    border-color: #021f2d !important;
    color: #fff !important;
}
body.wh-v4 .auth-grid.wh4-signup > .auth-form [data-wizard-back] {
    background: #f6a220 !important;
    color: #021f2d !important;
    border-color: #f6a220 !important;
}
body.wh-v4 .fpd-signup-assist [data-signup-signin-link] {
    font-size: 13px;
    line-height: 1.5;
    margin: 0 !important;
    color: #536b78;
}
body.wh-v4 .fpd-signup-assist [data-signup-signin-link] a {
    color: #021f2d !important;
    font-weight: 700;
    text-decoration: underline;
    text-decoration-color: #f6a220 !important;
    text-underline-offset: .2em;
}
@media (min-width: 901px) {
    body.wh-v4 .auth-grid.wh4-signup:has([data-signup-assist-dock]) > .auth-art.registration-context {
        justify-content: flex-start;
    }
}
@media (max-width: 900px) {
    body.wh-v4 .auth-grid.wh4-signup:has([data-signup-assist-dock]) > .auth-form .hub-data-use-notice {
        padding: 11px 12px !important;
        margin: 4px 0 0 !important;
        font-size: 13px;
    }
    body.wh-v4 .auth-grid.wh4-signup:has([data-signup-assist-dock]) > .auth-form [data-signup-signin-link] {
        margin: 0 0 5px !important;
        font-size: 13px;
    }
    body.wh-v4 .auth-grid.wh4-signup:has([data-signup-assist-dock]) > .auth-art .fpd-signup-assist:has(.fpd-signup-assist__dock:empty) {
        display: none;
    }
}
/* The registration context sets paragraphs white for the navy panel. Override
   that inherited !important rule only inside the white guidance card. */
body.wh-v4 .auth-grid.wh4-signup > .auth-art.registration-context .fpd-signup-assist :is(.hub-data-use-summary, .hub-data-use-details p) {
    color: #021f2d !important;
}
body.wh-v4 .auth-grid.wh4-signup > .auth-art.registration-context .fpd-signup-assist [data-signup-signin-link] {
    color: #536b78 !important;
}


/* Selected-webinar signup only: fit the useful information and active step
   above the fold on typical laptops without clipping the form on short screens.
   Do not touch generic signup, login or the public registration alternatives. */
@media (min-width: 901px) {
    body.wh-v4 .auth-grid.wh4-signup.wh-webinar-signup {
        gap: clamp(12px, 1.5vw, 22px) !important;
        padding: 12px clamp(14px, 2vw, 28px) 18px;
        min-height: calc(100dvh - var(--hub-header-height) - 70px);
        align-items: stretch !important;
    }
    body.wh-v4 .auth-grid.wh4-signup.wh-webinar-signup > .auth-art.registration-context {
        padding: clamp(20px, 2vw, 30px) !important;
        gap: 10px !important;
        justify-content: center !important;
    }
    body.wh-v4 .auth-grid.wh4-signup.wh-webinar-signup > .auth-art.registration-context h1 {
        margin: 4px 0 9px !important;
    }
    body.wh-v4 .auth-grid.wh4-signup.wh-webinar-signup > .auth-art.registration-context .selected-webinar,
    body.wh-v4 .auth-grid.wh4-signup.wh-webinar-signup > .auth-art.registration-context .fpd-signup-assist {
        margin-top: 10px !important;
        padding: 14px 16px !important;
    }
    body.wh-v4 .auth-grid.wh4-signup.wh-webinar-signup > .auth-form {
        padding: clamp(20px, 2.1vw, 29px) !important;
    }
    body.wh-v4 .auth-grid.wh4-signup.wh-webinar-signup > .auth-form > h2 {
        margin: 0 0 5px !important;
    }
    body.wh-v4 .auth-grid.wh4-signup.wh-webinar-signup > .auth-form > p.muted {
        margin: 0 0 12px !important;
    }
    body.wh-v4 .auth-grid.wh4-signup.wh-webinar-signup .wizard-progress {
        margin: 0 0 12px !important;
        padding: 4px 0 12px;
    }
    body.wh-v4 .auth-grid.wh4-signup.wh-webinar-signup .participant-form-grid {
        gap: 11px 16px !important;
    }
    body.wh-v4 .auth-grid.wh4-signup.wh-webinar-signup > .auth-form .wizard-actions {
        margin-top: 15px !important;
        padding-top: 13px !important;
    }
}
/* A fixed navigation bar must not conceal a wizard step scrolled into view. */
body.wh-v4 .auth-grid.wh4-signup .wizard-step .form-heading,
body.wh-v4 .auth-grid.wh4-signup .wizard-progress {
    scroll-margin-top: calc(var(--hub-header-height, 76px) + 20px);
}
/* Retriable operational failure, shown only if the district API fails. */
.wh-district-retry { margin-top: 7px; width: auto; font-size: 12px; }