/* ALCANCE Sign Up — final visual corrections v4, 2026-09-30.
 * Clean atmospheric background + premium glass account selector.
 */
body.mp-signup-page .mp-client-signup-shell,
body.mp-signup-page .mp-prof-signup-shell,
body.mp-signup-page .mp-client-signup-shell.is-elementor-component,
body.mp-signup-page .mp-prof-signup-shell.is-elementor-component {
    background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 520 260'%3E%3Cg fill='none' stroke='%2349B5E7' stroke-width='3' opacity='.18'%3E%3Cpath d='M-20 235 95 122l82 70 92-105 132 148'/%3E%3Cpath opacity='.62' d='M12 250 118 168l78 48 86-68 108 95'/%3E%3C/g%3E%3C/svg%3E"),
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 560 270'%3E%3Cg fill='none' stroke='%2382BD41' stroke-width='3' opacity='.08'%3E%3Cpath d='M70 245 170 138l86 72 96-118 139 153'/%3E%3Cpath opacity='.55' d='M118 257 210 185l76 49 88-73 110 96'/%3E%3C/g%3E%3C/svg%3E"),
        linear-gradient(145deg, #F8FBFF 0%, #EEF6FB 100%) !important;
    background-size: 440px 220px, 470px 225px, cover !important;
    background-position:
        left -70px bottom 4px,
        right -95px bottom 10px,
        center center !important;
    background-repeat: no-repeat !important;
}

/* Premium glass trigger: translucent enough to reveal the hero image, but
   still readable and protected from theme/global button colours. */
body.mp-signup-page .mp-account-picker-trigger,
body.mp-signup-page .mp-account-picker-trigger:focus,
body.mp-signup-page .mp-account-picker-trigger:focus-visible,
body.mp-signup-page .mp-account-picker-trigger:active,
body.mp-signup-page .mp-account-picker.is-open .mp-account-picker-trigger {
    -webkit-appearance: none !important;
    appearance: none !important;
    background: rgba(8,21,34,.66) !important;
    background-color: rgba(8,21,34,.66) !important;
    background-image: none !important;
    color: #FFFFFF !important;
    border: 1px solid rgba(73,181,231,.34) !important;
    box-shadow:
        0 10px 24px rgba(0,0,0,.16),
        inset 0 1px 0 rgba(255,255,255,.06) !important;
    text-shadow: none !important;
    outline: none !important;
    -webkit-backdrop-filter: blur(10px) saturate(118%) !important;
    backdrop-filter: blur(10px) saturate(118%) !important;
    transition: background-color .2s ease, border-color .2s ease, box-shadow .2s ease !important;
}

body.mp-signup-page .mp-account-picker-trigger:hover,
body.mp-signup-page .mp-account-picker.is-open .mp-account-picker-trigger {
    background: rgba(8,21,34,.76) !important;
    background-color: rgba(8,21,34,.76) !important;
    border-color: rgba(73,181,231,.52) !important;
    box-shadow:
        0 12px 28px rgba(0,0,0,.20),
        inset 0 1px 0 rgba(255,255,255,.08) !important;
}

body.mp-signup-page .mp-account-picker-trigger:focus-visible {
    box-shadow:
        0 0 0 3px rgba(73,181,231,.12),
        0 12px 28px rgba(0,0,0,.20),
        inset 0 1px 0 rgba(255,255,255,.08) !important;
}

body.mp-signup-page .mp-account-picker-trigger-copy strong {
    color: #FFFFFF !important;
}

body.mp-signup-page .mp-account-picker-trigger-copy small,
body.mp-signup-page .mp-account-picker-chevron {
    color: rgba(255,255,255,.74) !important;
}

body.mp-signup-page .mp-account-picker-trigger-icon {
    color: #F47F22 !important;
    background: rgba(244,127,34,.14) !important;
    border: 1px solid rgba(244,127,34,.28) !important;
}

/* Open menu remains fully opaque so cards/text never bleed through. */
body.mp-signup-page .mp-account-picker-menu {
    background: #FFFFFF !important;
    opacity: 1 !important;
    border: 1px solid rgba(73,181,231,.18) !important;
    box-shadow: 0 18px 42px rgba(8,25,43,.24) !important;
}

@media (max-width: 1320px) {
    body.mp-signup-page .mp-client-signup-shell,
    body.mp-signup-page .mp-prof-signup-shell,
    body.mp-signup-page .mp-client-signup-shell.is-elementor-component,
    body.mp-signup-page .mp-prof-signup-shell.is-elementor-component {
        background-size: 300px 150px, 300px 145px, cover !important;
        background-position: left -105px bottom 0, right -125px bottom 0, center center !important;
    }
}

@media (max-width: 960px) {
    body.mp-signup-page .mp-client-signup-shell,
    body.mp-signup-page .mp-prof-signup-shell,
    body.mp-signup-page .mp-client-signup-shell.is-elementor-component,
    body.mp-signup-page .mp-prof-signup-shell.is-elementor-component {
        background-image: linear-gradient(145deg, #F8FBFF 0%, #EEF6FB 100%) !important;
        background-size: cover !important;
        background-position: center !important;
    }
}