
/* AOST Member Registration UI v0.9 */

/* Release Elementor/UM width constraints only around recognised AOST registration forms */
.aost-um-elementor-host{max-width:none!important}
.aost-um-elementor-host.elementor-widget,.aost-um-elementor-host.elementor-widget-shortcode,
.aost-um-elementor-host>.elementor-widget-container{width:100%!important;max-width:none!important}
.aost-registration.um,.aost-registration,.aost-registration>form{
 --g:#92D050;--ink:#17211b;--muted:#737d77;--line:#e5ebe6;--soft:#f8faf7;
 width:100%!important;max-width:none!important;min-width:0!important;
 margin-left:auto!important;margin-right:auto!important;box-sizing:border-box!important;
}
.aost-registration .aost-shell{
 width:min(1120px,100%)!important;max-width:1120px!important;
 margin:36px auto 58px!important;box-sizing:border-box!important;
}
.aost-registration .aost-intro{text-align:center;max-width:760px;margin:0 auto 34px;padding:0 20px}
.aost-registration .aost-intro>span{display:inline-flex;padding:7px 12px;border-radius:999px;background:#f2f6ef;color:#5e7b43;font-size:11px;font-weight:800;letter-spacing:.13em}
.aost-registration .aost-intro h1{margin:14px 0 10px!important;color:var(--ink)!important;font-size:clamp(34px,4vw,50px)!important;line-height:1.06!important;letter-spacing:-.035em!important}
.aost-registration .aost-intro p{margin:0!important;color:var(--muted)!important;font-size:15px!important}

.aost-registration .aost-progress{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:6px!important;margin:0 0 22px!important;padding:11px!important;background:#f7f9f6;border:1px solid var(--line);border-radius:16px}
.aost-registration .aost-progress>div{display:flex;align-items:center;justify-content:center;gap:8px;min-width:0;padding:8px 5px}
.aost-registration .aost-progress b{width:28px;height:28px;flex:0 0 28px;display:grid;place-items:center;border-radius:50%;background:#eaf5df;color:#69a92e;font-size:10px}
.aost-registration .aost-progress span{font-size:11px;font-weight:700;color:#58625c;white-space:nowrap}

.aost-registration .aost-card{width:100%!important;max-width:none!important;margin:0 0 20px!important;border:1px solid var(--line);border-radius:18px;background:#fff;overflow:hidden;box-shadow:0 10px 30px rgba(23,33,27,.045);box-sizing:border-box}
.aost-registration .aost-card>header{display:flex;align-items:center;gap:14px;padding:20px 28px!important;border-bottom:1px solid var(--line);background:#fcfdfc}
.aost-registration .aost-card>header>span{width:34px;height:34px;flex:0 0 34px;display:grid;place-items:center;border-radius:50%;background:#eaf5df;color:#68a92d;font-size:11px;font-weight:900}
.aost-registration .aost-card h2{margin:0!important;font-size:18px!important;color:var(--ink)!important;line-height:1.25!important}
.aost-registration .aost-card header p{margin:3px 0 0!important;font-size:12px!important;color:#8a938d!important;line-height:1.4!important}

.aost-registration .aost-card-body{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:24px 34px!important;padding:28px 30px 32px!important;width:100%!important;box-sizing:border-box}
.aost-registration .aost-field{width:100%!important;max-width:none!important;min-width:0!important;float:none!important;clear:none!important;margin:0!important;box-sizing:border-box!important}
.aost-registration .aost-span-2,.aost-registration .aost-photo{grid-column:1/-1!important}
.aost-registration .um-field-label{margin:0 0 8px!important}
.aost-registration .um-field-label label{font-size:13px!important;line-height:1.35!important;font-weight:700!important;color:#505a54!important}
.aost-registration .um-field-label-icon,.aost-registration .um-field-label i{color:var(--g)!important}
.aost-registration .um-field-area,.aost-registration .um-field-area>*{max-width:100%!important;box-sizing:border-box!important}

.aost-registration input[type=text],.aost-registration input[type=email],.aost-registration input[type=password],
.aost-registration input[type=tel],.aost-registration input[type=url],.aost-registration input[type=number],
.aost-registration select,.aost-registration textarea,.aost-registration .select2-selection{
 width:100%!important;max-width:100%!important;border:1px solid #dce3dd!important;border-radius:11px!important;background:#fff!important;box-shadow:none!important
}
.aost-registration input[type=text],.aost-registration input[type=email],.aost-registration input[type=password],
.aost-registration input[type=tel],.aost-registration input[type=url],.aost-registration input[type=number],.aost-registration select{
 height:48px!important;min-height:48px!important;padding:0 14px!important
}
.aost-registration textarea{min-height:115px!important;padding:13px 14px!important}
.aost-registration input:focus,.aost-registration textarea:focus,.aost-registration select:focus{border-color:var(--g)!important;box-shadow:0 0 0 3px rgba(146,208,80,.13)!important;outline:0!important}

/* Professional/profile */
.aost-registration .aost-photo .um-field-area{max-width:320px!important}
.aost-registration .aost-card-professional .aost-span-2{grid-column:1/-1!important}

/* Documents */
.aost-registration .aost-card-documents .aost-card-body{grid-template-columns:repeat(3,minmax(0,1fr))!important}
.aost-registration .aost-document{width:100%!important;min-width:0!important;padding:20px!important;border:1px solid var(--line)!important;border-radius:14px!important;background:var(--soft)!important}
.aost-registration .aost-document .um-field-label label{word-break:normal!important;overflow-wrap:normal!important}
.aost-registration .aost-document .um-field-area{width:100%!important}
.aost-registration .aost-document .um-button{width:100%!important}

/* Buttons */
.aost-registration .um-button,.aost-registration input.um-button,.aost-registration button.um-button{
 border:0!important;border-radius:999px!important;background:var(--g)!important;color:#fff!important;
 box-shadow:0 7px 18px rgba(146,208,80,.18)!important;min-height:44px!important;padding:0 26px!important;font-weight:700!important
}
.aost-registration .um-button:hover,.aost-registration input.um-button:hover,.aost-registration button.um-button:hover{background:#74b936!important}

/* Final confirmation */
.aost-registration .aost-card-finish .aost-card-body{display:block!important;padding:28px 32px 34px!important}
.aost-registration .aost-card-finish .um-field,
.aost-registration .aost-card-finish .um-field-checkbox,
.aost-registration .aost-card-finish .um-field-privacy{width:100%!important;max-width:850px!important;margin:0 auto 20px!important}
.aost-registration .aost-card-finish .um-field-checkbox-option{line-height:1.55!important;color:#666f69!important}
.aost-registration .aost-card-finish .g-recaptcha,
.aost-registration .aost-card-finish [class*="recaptcha"]{
 display:block!important;width:304px!important;max-width:100%!important;margin:26px auto!important;overflow:visible!important
}
.aost-registration .aost-card-finish iframe[src*="recaptcha"]{display:block!important;max-width:100%!important;margin:0 auto!important}
.aost-registration .aost-card-finish .um-col-alt,
.aost-registration .aost-card-finish .um-center{text-align:center!important;width:100%!important;max-width:none!important;margin:26px auto 0!important}
.aost-registration .aost-card-finish .aost-submit,
.aost-registration .aost-card-finish input[type=submit],
.aost-registration .aost-card-finish button[type=submit]{
 display:block!important;width:auto!important;min-width:270px!important;max-width:100%!important;
 margin:26px auto 0!important;padding:0 34px!important;text-transform:uppercase!important;letter-spacing:.09em!important;font-size:12px!important
}

/* Hide orphaned empty UM spacers created by original columns */
.aost-registration .um-clear{height:0!important;min-height:0!important;margin:0!important}

@media(max-width:900px){
 .aost-registration .aost-progress{grid-template-columns:repeat(2,1fr)!important}
 .aost-registration .aost-progress>div{justify-content:flex-start}
 .aost-registration .aost-card-documents .aost-card-body{grid-template-columns:1fr!important}
}
@media(max-width:680px){
 .aost-registration .aost-shell{width:100%!important}
 .aost-registration .aost-progress{display:none!important}
 .aost-registration .aost-card-body{grid-template-columns:1fr!important;padding:21px 18px!important;gap:19px!important}
 .aost-registration .aost-span-2,.aost-registration .aost-photo{grid-column:auto!important}
 .aost-registration .aost-card>header{padding:18px!important}
 .aost-registration .aost-card-finish .aost-card-body{padding:22px 18px 26px!important}
}


/* v0.5 — centering correction after removing the Elementor container */
.aost-registration,
.aost-registration.um,
.aost-registration > form {
    margin-left: auto !important;
    margin-right: auto !important;
}
.aost-registration .aost-shell {
    margin-left: auto !important;
    margin-right: auto !important;
}
.elementor-widget-shortcode:has(.aost-registration),
.elementor-widget-container:has(.aost-registration) {
    width: 100% !important;
    max-width: none !important;
}
.elementor-widget-shortcode:has(.aost-registration) > .elementor-widget-container {
    display: flex !important;
    justify-content: center !important;
}


/* v0.6 — desktop width + true viewport centering.
   The UM shortcode wrapper itself is narrow, so centering only inside it is insufficient. */
@media (min-width: 901px) {
    .aost-registration .aost-shell {
        width: min(1080px, calc(100vw - 96px)) !important;
        max-width: 1080px !important;

        /* Center relative to the viewport even if the UM/shortcode parent is narrow/off-centre. */
        position: relative !important;
        left: 50% !important;
        transform: translateX(-50%) !important;

        margin-top: 42px !important;
        margin-bottom: 64px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .aost-registration .aost-intro {
        max-width: 760px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        padding-left: 28px !important;
        padding-right: 28px !important;
    }

    .aost-registration .aost-progress {
        width: 100% !important;
        box-sizing: border-box !important;
    }

    .aost-registration .aost-card {
        width: 100% !important;
        max-width: 1080px !important;
    }

    .aost-registration .aost-card-body {
        padding: 34px 38px 38px !important;
        gap: 28px 40px !important;
    }

    .aost-registration .aost-card>header {
        padding: 22px 36px !important;
    }
}

/* The previous :has flex centering is no longer needed and can interfere with old Elementor wrappers. */
.elementor-widget-shortcode:has(.aost-registration) > .elementor-widget-container {
    display: block !important;
}


/* v0.7 — exact viewport centering.
   JS measures the real rendered position and supplies only the missing horizontal delta. */
@media (min-width: 901px) {
    .aost-registration .aost-shell {
        left: auto !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        transform: translateX(var(--aost-shift-x, 0px)) !important;
    }
}
@media (max-width: 900px) {
    .aost-registration .aost-shell {
        left: auto !important;
        transform: none !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
}


/* ==========================================================
   v0.8 — simplified layout
   No JS viewport correction. The natural UM layout is used.
   ========================================================== */

/* Kill all centering experiments from v0.6/v0.7. */
.aost-registration .aost-shell {
    position: static !important;
    left: auto !important;
    transform: none !important;
    width: 100% !important;
    max-width: 1080px !important;
    margin: 42px auto 64px !important;
    padding: 0 24px !important;
    box-sizing: border-box !important;
}

/* Keep the actual UM/form wrapper naturally centred as well. */
.aost-registration.um,
.aost-registration,
.aost-registration > form {
    width: 100% !important;
    max-width: 1180px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* ACCOUNT
   Email gets its own row; password + confirmation stay together below it. */
.aost-registration .aost-card-account .aost-card-body {
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
}
.aost-registration .aost-card-account .aost-email {
    grid-column: 1 / -1 !important;
    max-width: none !important;
}
.aost-registration .aost-card-account .aost-password,
.aost-registration .aost-card-account .aost-password-confirm {
    grid-column: auto !important;
}

/* PROFILE PHOTO
   Turn the loose upload into one deliberate centred upload panel. */
.aost-registration .aost-photo {
    grid-column: 1 / -1 !important;
    width: min(520px,100%) !important;
    margin: 0 auto !important;
    padding: 24px !important;
    border: 1px solid var(--line) !important;
    border-radius: 15px !important;
    background: var(--soft) !important;
    text-align: center !important;
}
.aost-registration .aost-photo .um-field-label {
    text-align: center !important;
    margin-bottom: 16px !important;
}
.aost-registration .aost-photo .um-field-area {
    width: 100% !important;
    max-width: 320px !important;
    margin: 0 auto !important;
}
.aost-registration .aost-photo .um-button {
    width: 100% !important;
    margin: 0 auto !important;
}

/* FINAL SUBMIT
   The submit is an action, not another card. Strip UM wrapper chrome completely. */
.aost-registration .aost-card-finish .aost-submit-wrap,
.aost-registration .aost-card-finish .um-col-alt.aost-submit-wrap,
.aost-registration .aost-card-finish .um-center.aost-submit-wrap {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    min-height: 0 !important;
    margin: 28px 0 0 !important;
    padding: 0 !important;
    border: 0 !important;
    outline: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}
.aost-registration .aost-card-finish .aost-submit {
    width: min(360px,100%) !important;
    min-width: 0 !important;
    height: 50px !important;
    margin: 0 auto !important;
    border: 0 !important;
    outline: 0 !important;
    box-shadow: 0 7px 18px rgba(146,208,80,.18) !important;
}

/* reCAPTCHA centred and independent from submit */
.aost-registration .aost-card-finish .g-recaptcha {
    margin-left: auto !important;
    margin-right: auto !important;
}

@media (max-width:680px) {
    .aost-registration .aost-shell {
        width: 100% !important;
        margin: 24px auto 42px !important;
        padding: 0 14px !important;
    }
    .aost-registration .aost-card-account .aost-email,
    .aost-registration .aost-card-account .aost-password,
    .aost-registration .aost-card-account .aost-password-confirm {
        grid-column: 1 !important;
    }
    .aost-registration .aost-photo {
        padding: 20px 16px !important;
    }
}


/* v0.9 — restore the good wide layout and exact centering, without showing the jump */
@media (min-width:901px){
  .aost-registration .aost-shell{
    width:min(1080px,calc(100vw - 96px))!important;
    max-width:1080px!important;
    position:relative!important;
    left:auto!important;
    margin-left:0!important;
    margin-right:0!important;
    transform:translateX(var(--aost-final-shift,0px))!important;
    visibility:hidden!important;
  }
  .aost-registration .aost-shell.aost-ready{
    visibility:visible!important;
  }
}

/* Submit: remove every visual wrapper around the actual green button */
.aost-registration .aost-card-finish .aost-submit-wrap,
.aost-registration .aost-card-finish .aost-submit-wrap *,
.aost-registration .aost-card-finish .um-col-alt,
.aost-registration .aost-card-finish .um-center{
    outline:none!important;
}
.aost-registration .aost-card-finish .aost-submit-wrap,
.aost-registration .aost-card-finish .um-col-alt.aost-submit-wrap,
.aost-registration .aost-card-finish .um-center.aost-submit-wrap{
    border:none!important;
    background:transparent!important;
    box-shadow:none!important;
    border-radius:0!important;
    padding:0!important;
    min-height:0!important;
}

/* Ultimate Member sometimes leaves one extra bordered field-area around submit */
.aost-registration .aost-card-finish .aost-submit-wrap .um-field-area,
.aost-registration .aost-card-finish .aost-submit-wrap .um-field,
.aost-registration .aost-card-finish .aost-submit-wrap > div{
    border:none!important;
    outline:none!important;
    background:transparent!important;
    box-shadow:none!important;
    border-radius:0!important;
    padding:0!important;
}

/* Keep only the button itself */
.aost-registration .aost-card-finish .aost-submit{
    border:none!important;
    outline:none!important;
    border-radius:999px!important;
}


/* v0.9.2 — FINAL SCOPED OVERRIDE
   Only AOST registration forms enhanced by this plugin.
   Purpose: beat old Astra/Ultimate Member presentation rules without touching them. */
html body .aost-registration.um,
html body .aost-registration {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
}

@media (min-width: 901px) {
    html body .aost-registration .aost-shell {
        width: min(1080px, calc(100vw - 96px)) !important;
        min-width: 0 !important;
        max-width: 1080px !important;
        box-sizing: border-box !important;
    }

    html body .aost-registration .aost-progress,
    html body .aost-registration .aost-card {
        width: 100% !important;
        max-width: none !important;
        box-sizing: border-box !important;
    }
}

/* Astra has global .um-form/.um-field rules.
   Inside these four forms, the plugin owns spacing and field appearance. */
html body .aost-registration .um-form {
    width: 100% !important;
    max-width: none !important;
}

html body .aost-registration .aost-card-body > .aost-field {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
}

/* Keep the v0.9 field look even though Astra globally gives UM inputs a 2px green border. */
html body .aost-registration .aost-field input[type="text"],
html body .aost-registration .aost-field input[type="email"],
html body .aost-registration .aost-field input[type="tel"],
html body .aost-registration .aost-field input[type="password"],
html body .aost-registration .aost-field input[type="number"],
html body .aost-registration .aost-field input[type="url"],
html body .aost-registration .aost-field select,
html body .aost-registration .aost-field textarea {
    border: 1px solid #dce3dd !important;
    border-radius: 11px !important;
}


/* v0.9.3 — three surgical fixes only.
   Keep v0.9.2 centering/layout untouched. */

/* 1) Account: password + confirmation must share the same row on desktop. */
@media (min-width: 701px) {
    html body .aost-registration .aost-card-account .aost-card-body {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        column-gap: 28px !important;
        row-gap: 22px !important;
        align-items: start !important;
    }

    /* Email occupies the complete first row. */
    html body .aost-registration .aost-card-account .aost-card-body > .aost-field-email {
        grid-column: 1 / -1 !important;
    }

    /* Password fields sit side-by-side on the second row. */
    html body .aost-registration .aost-card-account .aost-card-body > .aost-field-password,
    html body .aost-registration .aost-card-account .aost-card-body > .aost-field-password-confirm {
        grid-column: auto !important;
    }
}

/* 2) Profile photo: center the complete photo field/card, without touching other profile fields. */
html body .aost-registration .aost-card-profile .aost-field-photo,
html body .aost-registration .aost-card-profile .aost-photo-card {
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
}

html body .aost-registration .aost-card-profile .aost-photo-card {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
}

/* 3) Submit: do NOT remove/rebuild UM wrappers. Just make the existing outer box invisible. */
html body .aost-registration .aost-card-finish .aost-submit-wrap {
    border-color: transparent !important;
    outline-color: transparent !important;
    box-shadow: none !important;
    background: transparent !important;
}
