/* ZNBAQ POPUPS - ACCOUNT COMPACT OVERRIDE */

#znbaq-popups-root .zpop-modal.zpop-account {
    position: fixed !important;

    top: 50% !important;
    left: 50% !important;
    right: auto !important;
    bottom: auto !important;

    transform: translate(-50%, -50%) !important;

    width: 520px !important;
    max-width: calc(100vw - 30px) !important;

    height: auto !important;
    max-height: calc(100vh - 30px) !important;

    margin: 0 !important;
    padding: 18px 20px 20px !important;

    border-radius: 20px !important;

    overflow-x: hidden !important;
    overflow-y: auto !important;
}


/* HEADER */

#znbaq-popups-root .zpop-account .zpop-main-header {
    margin: 0 auto 12px !important;
}

#znbaq-popups-root .zpop-account .zpop-kicker {
    margin: 0 0 2px !important;
    font-size: 12px !important;
    line-height: 1.4 !important;
}

#znbaq-popups-root .zpop-account .zpop-main-title {
    margin: 0 0 3px !important;
    font-size: 20px !important;
    line-height: 1.35 !important;
}

#znbaq-popups-root .zpop-account .zpop-main-subtitle {
    margin: 0 !important;
    font-size: 11px !important;
}


/* GUEST */

#znbaq-popups-root .zpop-account .zpop-guest-card {
    margin: 0 0 9px !important;
    padding: 13px 14px 11px !important;

    border-width: 1px !important;
    border-radius: 14px !important;
}

#znbaq-popups-root .zpop-account .zpop-card-title {
    margin: 0 0 2px !important;
    font-size: 17px !important;
}

#znbaq-popups-root .zpop-account .zpop-card-subtitle {
    margin: 0 0 8px !important;
    font-size: 10.5px !important;
}

#znbaq-popups-root .zpop-account .zpop-guest-card .zpop-primary {
    min-height: 39px !important;
    height: 39px !important;

    padding: 4px 12px !important;

    border-radius: 8px !important;

    font-size: 13px !important;
    line-height: 1 !important;
}

#znbaq-popups-root .zpop-account .zpop-card-helper {
    margin: 6px 0 0 !important;
    font-size: 10px !important;
}


/* DIVIDER */

#znbaq-popups-root .zpop-account .zpop-separator {
    margin: 8px 0 !important;
}


/* LOGIN PREVIEW */

#znbaq-popups-root .zpop-account .zpop-login-preview {
    max-width: 440px !important;
}

#znbaq-popups-root .zpop-account .zpop-preview-title {
    margin: 0 0 1px !important;
    font-size: 14px !important;
}

#znbaq-popups-root .zpop-account .zpop-preview-subtitle {
    margin: 0 0 6px !important;
    font-size: 10.5px !important;
}

#znbaq-popups-root .zpop-account .zpop-login-preview .zpop-secondary {
    min-height: 38px !important;
    height: 38px !important;

    padding: 4px 12px !important;

    border-radius: 8px !important;

    font-size: 13px !important;
    line-height: 1 !important;
}


/* CLOSE BUTTON */

#znbaq-popups-root .zpop-account .zpop-close {
    position: absolute !important;

    top: 12px !important;
    left: 12px !important;
    right: auto !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 32px !important;
    min-width: 32px !important;
    height: 32px !important;
    min-height: 32px !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    border-radius: 50% !important;

    background: #f3eef4 !important;

    color: #554e59 !important;

    font-family: Arial, sans-serif !important;
    font-size: 0 !important;
    font-weight: 400 !important;
    line-height: 1 !important;

    box-shadow: none !important;
}

#znbaq-popups-root .zpop-account .zpop-close span {
    display: none !important;
}

#znbaq-popups-root .zpop-account .zpop-close::before,
#znbaq-popups-root .zpop-account .zpop-close::after {
    content: "" !important;

    position: absolute !important;

    top: 50% !important;
    left: 50% !important;

    width: 13px !important;
    height: 1.5px !important;

    border-radius: 2px !important;

    background: currentColor !important;

    transform-origin: center !important;
}

#znbaq-popups-root .zpop-account .zpop-close::before {
    transform: translate(-50%, -50%) rotate(45deg) !important;
}

#znbaq-popups-root .zpop-account .zpop-close::after {
    transform: translate(-50%, -50%) rotate(-45deg) !important;
}


/* LOGIN / FORGOT */

#znbaq-popups-root .zpop-account .zpop-inner-header {
    margin: 2px auto 12px !important;
    max-width: 440px !important;
}

#znbaq-popups-root .zpop-account .zpop-inner-title {
    margin-bottom: 3px !important;
    font-size: 20px !important;
}

#znbaq-popups-root .zpop-account .zpop-inner-subtitle {
    font-size: 11px !important;
}

#znbaq-popups-root .zpop-account .zpop-form {
    max-width: 440px !important;
}

#znbaq-popups-root .zpop-account .zpop-field {
    margin-bottom: 8px !important;
}

#znbaq-popups-root .zpop-account .zpop-label {
    margin-bottom: 3px !important;
    font-size: 11px !important;
}

#znbaq-popups-root .zpop-account .zpop-input {
    height: 39px !important;
    padding: 0 11px !important;

    border-radius: 8px !important;

    font-size: 12px !important;
}

#znbaq-popups-root .zpop-account .zpop-primary.zpop-full {
    min-height: 40px !important;
    height: 40px !important;

    border-radius: 8px !important;

    font-size: 13px !important;
}


/* MOBILE */

@media (max-width: 600px) {

    #znbaq-popups-root .zpop-modal.zpop-account {
        width: calc(100vw - 24px) !important;
        max-width: 520px !important;

        padding: 17px 14px !important;
    }
}


/* ==========================================================
   MAIN SCREEN LOGIN + ONE-LINE GUEST TEXT
========================================================== */

/* Remove kicker completely */
#znbaq-popups-root .zpop-account .zpop-kicker {
    display: none !important;
}


/* Guest helper lines stay on one line on desktop */
#znbaq-popups-root .zpop-account .zpop-card-subtitle,
#znbaq-popups-root .zpop-account .zpop-card-helper {
    white-space: nowrap !important;
}


/* Main login area */
#znbaq-popups-root .zpop-account .zpop-login-preview {
    max-width: 460px !important;
}

#znbaq-popups-root .zpop-account .zpop-main-login-form {
    margin-top: 8px !important;
}

#znbaq-popups-root .zpop-account .zpop-main-login-form .zpop-field {
    margin-bottom: 7px !important;
}

#znbaq-popups-root .zpop-account .zpop-main-login-form .zpop-label {
    margin-bottom: 3px !important;
    font-size: 11px !important;
}

#znbaq-popups-root .zpop-account .zpop-main-login-form .zpop-input {
    height: 38px !important;
}

#znbaq-popups-root .zpop-account .zpop-main-login-form .zpop-primary {
    height: 39px !important;
    min-height: 39px !important;
}


/* Password show button */
#znbaq-popups-root .zpop-account .zpop-password-toggle {
    left: 5px !important;
    bottom: 5px !important;

    height: 28px !important;
    min-height: 28px !important;

    min-width: 55px !important;

    padding: 0 8px !important;

    border-radius: 7px !important;

    font-size: 10px !important;
}


/* Forgot */
#znbaq-popups-root .zpop-account .zpop-forgot-main {
    margin-top: 6px !important;
    font-size: 11px !important;
}


/* Register */
#znbaq-popups-root .zpop-account .zpop-register-choice {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 5px !important;

    margin-top: 5px !important;

    font-size: 11px !important;
}

#znbaq-popups-root .zpop-account .zpop-register-text {
    color: #706875 !important;
}

#znbaq-popups-root .zpop-account .zpop-register-button {
    appearance: none !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    background: transparent !important;

    color: #8a3797 !important;

    font-family: inherit !important;
    font-size: 11px !important;
    font-weight: 700 !important;

    cursor: pointer !important;
}


/* Register temporary screen */
#znbaq-popups-root .zpop-account .zpop-register-placeholder {
    max-width: 440px !important;

    margin: 0 auto !important;
    padding: 18px !important;

    border: 1px dashed #d8cadb !important;
    border-radius: 12px !important;

    text-align: center !important;

    color: #817784 !important;
    font-size: 12px !important;
}


/* Mobile can wrap long helper text */
@media (max-width: 600px) {

    #znbaq-popups-root .zpop-account .zpop-card-subtitle,
    #znbaq-popups-root .zpop-account .zpop-card-helper {
        white-space: normal !important;
    }

}


/* ==========================================================
   FINAL ACCOUNT STRUCTURE
========================================================== */


/* Entire popup still compact */
#znbaq-popups-root .zpop-modal.zpop-account {
    width: 520px !important;
    max-width: calc(100vw - 24px) !important;
}


/* ==========================================================
   SECTION 1 — GUEST
========================================================== */

#znbaq-popups-root .zpop-account .zpop-guest-card {
    margin: 0 !important;
    padding: 13px 14px 11px !important;

    border: 1px solid #b55ac0 !important;
    border-radius: 14px !important;

    background: #fcf8fc !important;
}


/* force these to one line on desktop */
#znbaq-popups-root .zpop-account .zpop-card-subtitle,
#znbaq-popups-root .zpop-account .zpop-card-helper {
    width: auto !important;
    max-width: none !important;

    margin-left: auto !important;
    margin-right: auto !important;

    white-space: nowrap !important;

    text-align: center !important;
}


/* ==========================================================
   SECTION 2 — LOGIN
========================================================== */

#znbaq-popups-root .zpop-account .zpop-login-preview {
    max-width: none !important;

    margin: 10px 0 0 !important;
    padding: 12px 14px 11px !important;

    border: 1px solid #ded3e1 !important;
    border-radius: 14px !important;

    background: #fff !important;
}


/* Hide old separator */
#znbaq-popups-root .zpop-account .zpop-separator {
    display: none !important;
}


#znbaq-popups-root .zpop-account .zpop-preview-title {
    margin: 0 0 8px !important;

    font-size: 14px !important;
}


/* Inputs */
#znbaq-popups-root .zpop-account .zpop-main-login-form {
    max-width: none !important;

    margin: 0 !important;
}


#znbaq-popups-root .zpop-account .zpop-main-login-form .zpop-field {
    margin-bottom: 7px !important;
}


#znbaq-popups-root .zpop-account .zpop-main-login-form .zpop-input {
    height: 38px !important;
}


/* ==========================================================
   PASSWORD + EYE
========================================================== */

#znbaq-popups-root .zpop-account .zpop-field-password {
    position: relative !important;

    margin-bottom: 0 !important;
}


#znbaq-popups-root .zpop-account .zpop-field-password .zpop-input {
    padding-left: 42px !important;
}


#znbaq-popups-root .zpop-account .zpop-password-toggle {
    position: absolute !important;

    left: 6px !important;
    right: auto !important;

    top: auto !important;
    bottom: 4px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 30px !important;
    min-width: 30px !important;

    height: 30px !important;
    min-height: 30px !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    border-radius: 50% !important;

    background: transparent !important;

    color: #8f389c !important;

    box-shadow: none !important;
}


#znbaq-popups-root .zpop-account .zpop-password-toggle:hover {
    background: #f5eef6 !important;
}


#znbaq-popups-root .zpop-account .zpop-eye-icon {
    display: block !important;

    width: 18px !important;
    height: 18px !important;

    pointer-events: none !important;
}


/* ==========================================================
   FORGOT PASSWORD DIRECTLY UNDER PASSWORD
========================================================== */

#znbaq-popups-root .zpop-account .zpop-forgot-main {
    display: block !important;

    width: auto !important;

    margin: 3px 2px 7px auto !important;
    padding: 0 !important;

    border: 0 !important;

    background: transparent !important;

    color: #8f389c !important;

    font-size: 10px !important;
    font-weight: 600 !important;

    line-height: 1.4 !important;

    text-align: right !important;

    box-shadow: none !important;
}


/* Login button */
#znbaq-popups-root .zpop-account .zpop-main-login-form .zpop-primary {
    margin-top: 2px !important;

    height: 39px !important;
    min-height: 39px !important;
}


/* ==========================================================
   SECTION 3 — REGISTER
========================================================== */

#znbaq-popups-root .zpop-account .zpop-register-choice {
    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    gap: 6px !important;

    width: 100% !important;

    margin: 10px 0 0 !important;
    padding: 10px 12px !important;

    border: 1px solid #ded3e1 !important;
    border-radius: 14px !important;

    background: #fcfafc !important;
}


#znbaq-popups-root .zpop-account .zpop-register-text,
#znbaq-popups-root .zpop-account .zpop-register-button {
    font-size: 11px !important;
}


/* register link only, no button box */
#znbaq-popups-root .zpop-account .zpop-register-button {
    width: auto !important;
    min-width: 0 !important;

    height: auto !important;
    min-height: 0 !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    border-radius: 0 !important;

    background: transparent !important;

    color: #8f389c !important;

    font-weight: 700 !important;

    box-shadow: none !important;
}


/* ==========================================================
   MOBILE
========================================================== */

@media (max-width: 600px) {

    #znbaq-popups-root .zpop-account .zpop-card-subtitle,
    #znbaq-popups-root .zpop-account .zpop-card-helper {
        white-space: normal !important;
    }

}


/* ==========================================================
   FINAL ACCOUNT POPUP LAYOUT
========================================================== */


/* ----------------------------------------------------------
   1) GUEST SECTION
---------------------------------------------------------- */

#znbaq-popups-root .zpop-account .zpop-guest-card {
    margin: 0 !important;
    padding: 13px 16px 11px !important;

    border: 1px solid #a94fb4 !important;
    border-radius: 14px !important;

    background: #fcf8fc !important;
}


/* Keep both guest sentences in ONE line on desktop */
#znbaq-popups-root .zpop-account .zpop-card-subtitle,
#znbaq-popups-root .zpop-account .zpop-card-helper {
    display: block !important;

    width: 100% !important;
    max-width: 100% !important;

    margin-left: auto !important;
    margin-right: auto !important;

    white-space: nowrap !important;

    overflow: visible !important;

    text-align: center !important;

    line-height: 1.35 !important;
}


/* ----------------------------------------------------------
   2) LOGIN SECTION
---------------------------------------------------------- */

#znbaq-popups-root .zpop-account .zpop-login-preview {
    max-width: none !important;

    margin: 10px 0 0 !important;
    padding: 13px 15px 12px !important;

    border: 1px solid #ddd2df !important;
    border-radius: 14px !important;

    background: #ffffff !important;
}


/* Hide old separator because each section has own box */
#znbaq-popups-root .zpop-account .zpop-separator {
    display: none !important;
}


#znbaq-popups-root .zpop-account .zpop-preview-title {
    margin: 0 0 8px !important;

    font-size: 14px !important;
    font-weight: 700 !important;

    text-align: center !important;
}


/* Login form */
#znbaq-popups-root .zpop-account .zpop-main-login-form {
    max-width: none !important;

    margin: 0 !important;
}


#znbaq-popups-root .zpop-account .zpop-main-login-form .zpop-field {
    margin-bottom: 7px !important;
}


#znbaq-popups-root .zpop-account .zpop-main-login-form .zpop-input {
    height: 38px !important;

    border-radius: 8px !important;
}


/* ----------------------------------------------------------
   PASSWORD + EYE
---------------------------------------------------------- */

#znbaq-popups-root .zpop-account .zpop-field-password {
    position: relative !important;

    margin-bottom: 0 !important;
}


#znbaq-popups-root .zpop-account .zpop-field-password .zpop-input {
    padding-left: 44px !important;
}


/* eye only */
#znbaq-popups-root .zpop-account .zpop-password-toggle {
    position: absolute !important;

    left: 6px !important;
    right: auto !important;

    top: auto !important;
    bottom: 4px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 30px !important;
    min-width: 30px !important;

    height: 30px !important;
    min-height: 30px !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    border-radius: 50% !important;

    background: transparent !important;

    color: #8a3797 !important;

    font-size: 0 !important;

    box-shadow: none !important;
}


#znbaq-popups-root .zpop-account .zpop-password-toggle:hover {
    background: #f5eef6 !important;
}


#znbaq-popups-root .zpop-account .zpop-eye-icon {
    display: block !important;

    width: 18px !important;
    height: 18px !important;

    color: #8a3797 !important;

    pointer-events: none !important;
}


/* ----------------------------------------------------------
   FORGOT PASSWORD
   small + directly under password
---------------------------------------------------------- */

#znbaq-popups-root .zpop-account .zpop-forgot-main {
    display: block !important;

    width: fit-content !important;

    margin: 3px 2px 7px auto !important;
    padding: 0 !important;

    border: 0 !important;

    background: transparent !important;

    color: #8a3797 !important;

    font-size: 10px !important;
    font-weight: 600 !important;

    line-height: 1.35 !important;

    text-align: right !important;

    box-shadow: none !important;
}


/* Login message should not reserve empty space */
#znbaq-popups-root .zpop-account .zpop-form-message {
    min-height: 0 !important;

    margin: 0 0 5px !important;
}


/* login button */
#znbaq-popups-root .zpop-account .zpop-main-login-form .zpop-primary {
    height: 39px !important;
    min-height: 39px !important;

    margin-top: 0 !important;

    border-radius: 8px !important;
}


/* ----------------------------------------------------------
   3) CREATE ACCOUNT SECTION
---------------------------------------------------------- */

#znbaq-popups-root .zpop-account .zpop-register-choice {
    display: flex !important;

    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;

    gap: 6px !important;

    width: 100% !important;

    margin: 10px 0 0 !important;
    padding: 11px 12px !important;

    border: 1px solid #ddd2df !important;
    border-radius: 14px !important;

    background: #fcfafc !important;
}


#znbaq-popups-root .zpop-account .zpop-register-text {
    color: #665e69 !important;

    font-size: 11px !important;
}


#znbaq-popups-root .zpop-account .zpop-register-button {
    display: inline !important;

    width: auto !important;
    min-width: 0 !important;

    height: auto !important;
    min-height: 0 !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    border-radius: 0 !important;

    background: transparent !important;

    color: #8a3797 !important;

    font-size: 11px !important;
    font-weight: 700 !important;

    line-height: 1.4 !important;

    box-shadow: none !important;
}


/* ----------------------------------------------------------
   MOBILE
---------------------------------------------------------- */

@media (max-width: 600px) {

    #znbaq-popups-root .zpop-account .zpop-card-subtitle,
    #znbaq-popups-root .zpop-account .zpop-card-helper {
        white-space: normal !important;
    }

    #znbaq-popups-root .zpop-account .zpop-login-preview {
        padding: 12px 11px 11px !important;
    }

}


/* ==========================================================
   ACCOUNT LAYOUT 13
========================================================== */


/* ----------------------------------------------------------
   SECTION 1 - GUEST
   title
   sentence + sentence
   button
---------------------------------------------------------- */

#znbaq-popups-root .zpop-account .zpop-guest-card {
    display: grid !important;

    grid-template-columns: 1fr 1fr !important;
    column-gap: 12px !important;
    row-gap: 6px !important;

    align-items: center !important;

    padding: 13px 16px 12px !important;

    border: 1px solid #a94fb4 !important;
    border-radius: 12px !important;

    background: #fcf8fc !important;
}


/* title full width */
#znbaq-popups-root .zpop-account .zpop-card-title {
    grid-column: 1 / -1 !important;
    grid-row: 1 !important;

    margin: 0 !important;

    text-align: center !important;
}


/* sentence 1 */
#znbaq-popups-root .zpop-account .zpop-card-subtitle {
    grid-column: 1 !important;
    grid-row: 2 !important;

    width: auto !important;
    margin: 0 !important;

    white-space: nowrap !important;

    text-align: left !important;

    font-size: 10px !important;
}


/* sentence 2 */
#znbaq-popups-root .zpop-account .zpop-card-helper {
    grid-column: 2 !important;
    grid-row: 2 !important;

    width: auto !important;
    margin: 0 !important;

    white-space: nowrap !important;

    text-align: right !important;

    font-size: 10px !important;
}


/* guest button under BOTH sentences */
#znbaq-popups-root .zpop-account .zpop-guest-card .zpop-primary {
    grid-column: 1 / -1 !important;
    grid-row: 3 !important;

    width: 100% !important;

    margin: 2px 0 0 !important;
}


/* ----------------------------------------------------------
   SECTION 2 - LOGIN
---------------------------------------------------------- */

#znbaq-popups-root .zpop-account .zpop-login-preview {
    display: block !important;

    margin: 10px 0 0 !important;
    padding: 13px 15px 12px !important;

    border: 1px solid #d8cddd !important;
    border-radius: 12px !important;

    background: #fff !important;
}


#znbaq-popups-root .zpop-account .zpop-preview-title {
    margin: 0 0 8px !important;

    text-align: center !important;
}


/* Login button centered perfectly */
#znbaq-popups-root .zpop-account .zpop-main-login-form .zpop-primary {
    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    width: 100% !important;
    height: 39px !important;

    padding: 0 !important;

    text-align: center !important;
    line-height: 1 !important;
}


/* Forgot password: LEFT directly below password */
#znbaq-popups-root .zpop-account .zpop-forgot-main {
    display: block !important;

    width: fit-content !important;

    margin-top: 3px !important;
    margin-right: auto !important;
    margin-bottom: 7px !important;
    margin-left: 0 !important;

    padding: 0 !important;

    border: 0 !important;

    background: transparent !important;

    color: #913399 !important;

    font-size: 10px !important;
    font-weight: 600 !important;

    text-align: left !important;

    box-shadow: none !important;
}


/* No empty message gap */
#znbaq-popups-root .zpop-account .zpop-form-message:empty {
    display: none !important;
}


/* ----------------------------------------------------------
   SECTION 3 - REGISTER
   completely separate box
---------------------------------------------------------- */

#znbaq-popups-root .zpop-account .zpop-register-choice {
    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    gap: 6px !important;

    width: 100% !important;

    margin: 10px 0 0 !important;
    padding: 11px 12px !important;

    border: 1px solid #d8cddd !important;
    border-radius: 12px !important;

    background: #fcfafc !important;
}


#znbaq-popups-root .zpop-account .zpop-register-button {
    width: auto !important;
    min-width: 0 !important;

    height: auto !important;
    min-height: 0 !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    background: transparent !important;

    color: #913399 !important;

    font-size: 11px !important;
    font-weight: 700 !important;

    box-shadow: none !important;
}


/* ----------------------------------------------------------
   X
---------------------------------------------------------- */

#znbaq-popups-root .zpop-account .zpop-close {
    z-index: 100 !important;

    cursor: pointer !important;
    pointer-events: auto !important;
}


/* hide old separator */
#znbaq-popups-root .zpop-account .zpop-separator {
    display: none !important;
}


/* Mobile */
@media (max-width: 600px) {

    #znbaq-popups-root .zpop-account .zpop-guest-card {
        grid-template-columns: 1fr !important;
    }

    #znbaq-popups-root .zpop-account .zpop-card-title,
    #znbaq-popups-root .zpop-account .zpop-card-subtitle,
    #znbaq-popups-root .zpop-account .zpop-card-helper,
    #znbaq-popups-root .zpop-account .zpop-guest-card .zpop-primary {
        grid-column: 1 !important;
    }

    #znbaq-popups-root .zpop-account .zpop-card-title {
        grid-row: 1 !important;
    }

    #znbaq-popups-root .zpop-account .zpop-card-subtitle {
        grid-row: 2 !important;
        text-align: center !important;
    }

    #znbaq-popups-root .zpop-account .zpop-card-helper {
        grid-row: 3 !important;
        text-align: center !important;
    }

    #znbaq-popups-root .zpop-account .zpop-guest-card .zpop-primary {
        grid-row: 4 !important;
    }
}


/* ==========================================================
   ACCOUNT FIX 14
========================================================== */


/* One centered guest sentence only */
#znbaq-popups-root .zpop-account .zpop-card-subtitle {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;

    display: block !important;

    width: 100% !important;

    margin: 0 !important;

    white-space: nowrap !important;

    text-align: center !important;

    font-size: 10px !important;
    line-height: 1.5 !important;
}


/* Old second sentence no longer shown */
#znbaq-popups-root .zpop-account .zpop-card-helper {
    display: none !important;
}


/* Guest button immediately after sentence */
#znbaq-popups-root .zpop-account .zpop-guest-card .zpop-primary {
    grid-column: 1 / -1 !important;
    grid-row: 3 !important;

    margin-top: 3px !important;
}


/* Eye */
#znbaq-popups-root .zpop-account .zpop-password-toggle {
    cursor: pointer !important;
    pointer-events: auto !important;
    z-index: 5 !important;
}


#znbaq-popups-root .zpop-account .zpop-password-toggle.is-visible {
    background: #f3eaf4 !important;
}


/* Close must always be clickable */
#znbaq-popups-root .zpop-account .zpop-close {
    cursor: pointer !important;
    pointer-events: auto !important;
    z-index: 999 !important;
}


/* Mobile */
@media (max-width: 600px) {

    #znbaq-popups-root .zpop-account .zpop-card-subtitle {
        white-space: normal !important;
    }

}


/* ==========================================================
   FIX 14B
========================================================== */

/* Show one concise sentence only */
#znbaq-popups-root .zpop-account .zpop-card-subtitle {
    grid-column: 1 / -1 !important;

    width: 100% !important;

    margin: 2px 0 7px !important;

    text-align: center !important;
    white-space: nowrap !important;
}

#znbaq-popups-root .zpop-account .zpop-card-helper {
    display: none !important;
}


/* Eye interaction */
#znbaq-popups-root .zpop-account .zpop-password-toggle {
    cursor: pointer !important;
    pointer-events: auto !important;
    z-index: 20 !important;
}

#znbaq-popups-root .zpop-account .zpop-password-toggle.is-visible {
    background: #f3eaf4 !important;
}


/* Close interaction */
#znbaq-popups-root .zpop-account .zpop-close {
    cursor: pointer !important;
    pointer-events: auto !important;
    z-index: 999 !important;
}


/* ==========================================================
   REGISTER VIEW
========================================================== */

#znbaq-popups-root .zpop-account [data-account-view="register"] {
    padding-top: 2px !important;
}

#znbaq-popups-root .zpop-account .zpop-register-form {
    max-width: 460px !important;
    margin: 0 auto !important;
}

#znbaq-popups-root .zpop-account .zpop-register-name-row {
    display: grid !important;

    grid-template-columns: 1fr 1fr !important;

    gap: 8px !important;
}

#znbaq-popups-root .zpop-account .zpop-register-form .zpop-field {
    margin-bottom: 8px !important;
}

#znbaq-popups-root .zpop-account .zpop-register-form .zpop-input {
    height: 39px !important;

    border-radius: 8px !important;

    font-size: 12px !important;
}

#znbaq-popups-root .zpop-account .zpop-register-form .zpop-primary {
    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    width: 100% !important;

    min-height: 40px !important;
    height: 40px !important;

    padding: 0 !important;

    border-radius: 8px !important;

    text-align: center !important;
}

#znbaq-popups-root .zpop-account .zpop-form-message {
    font-size: 10.5px !important;
    line-height: 1.5 !important;

    text-align: center !important;
}

#znbaq-popups-root .zpop-account .zpop-form-message.is-success {
    color: #2e7d32 !important;
}

#znbaq-popups-root .zpop-account .zpop-back {
    margin: 0 0 4px auto !important;

    font-size: 11px !important;
}


/* Mobile */
@media (max-width: 600px) {

    #znbaq-popups-root .zpop-account .zpop-register-name-row {
        grid-template-columns: 1fr !important;

        gap: 0 !important;
    }

}


/* ==========================================================
   REGISTER VIEW - COMPACT SPACING
========================================================== */

#znbaq-popups-root .zpop-account [data-account-view="register"] {
    padding-top: 0 !important;
}


/* Back */
#znbaq-popups-root .zpop-account [data-account-view="register"] .zpop-back {
    margin: 0 0 2px auto !important;
    padding: 0 !important;

    font-size: 11px !important;
    line-height: 1.3 !important;
}


/* Header */
#znbaq-popups-root .zpop-account [data-account-view="register"] .zpop-inner-header {
    margin: 0 auto 10px !important;
}

#znbaq-popups-root .zpop-account [data-account-view="register"] .zpop-inner-title {
    margin: 0 0 2px !important;

    font-size: 20px !important;
    line-height: 1.3 !important;
}

#znbaq-popups-root .zpop-account [data-account-view="register"] .zpop-inner-subtitle {
    margin: 0 !important;

    font-size: 10.5px !important;
    line-height: 1.4 !important;
}


/* Form */
#znbaq-popups-root .zpop-account .zpop-register-form {
    max-width: 460px !important;

    margin: 0 auto !important;
}


/* Fields */
#znbaq-popups-root .zpop-account .zpop-register-form .zpop-field {
    margin: 0 0 7px !important;
}


/* Labels closer to input */
#znbaq-popups-root .zpop-account .zpop-register-form .zpop-label {
    display: block !important;

    margin: 0 0 3px !important;
    padding: 0 !important;

    font-size: 10.5px !important;
    line-height: 1.3 !important;
}


/* Inputs */
#znbaq-popups-root .zpop-account .zpop-register-form .zpop-input {
    display: block !important;

    width: 100% !important;

    height: 37px !important;
    min-height: 37px !important;

    margin: 0 !important;
    padding: 0 11px !important;

    border-radius: 8px !important;

    font-size: 12px !important;
    line-height: 37px !important;
}


/* Name row */
#znbaq-popups-root .zpop-account .zpop-register-name-row {
    display: grid !important;

    grid-template-columns: 1fr 1fr !important;

    gap: 8px !important;

    margin: 0 !important;
}


/* Password */
#znbaq-popups-root .zpop-account .zpop-register-form .zpop-field-password {
    position: relative !important;
}

#znbaq-popups-root .zpop-account .zpop-register-form .zpop-field-password .zpop-input {
    padding-left: 42px !important;
}


/* Eye centered vertically in input */
#znbaq-popups-root .zpop-account .zpop-register-form .zpop-password-toggle {
    left: 5px !important;
    bottom: 3px !important;

    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    min-height: 30px !important;
}


/* Messages don't create empty gap */
#znbaq-popups-root .zpop-account .zpop-register-form .zpop-form-message {
    min-height: 0 !important;

    margin: 0 0 5px !important;
    padding: 0 !important;
}

#znbaq-popups-root .zpop-account .zpop-register-form .zpop-form-message:empty {
    display: none !important;
}


/* Submit */
#znbaq-popups-root .zpop-account .zpop-register-form .zpop-primary {
    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    width: 100% !important;

    height: 39px !important;
    min-height: 39px !important;

    margin: 2px 0 0 !important;
    padding: 0 !important;

    border-radius: 8px !important;

    line-height: 1 !important;
}


/* Reduce overall popup padding in register screen */
#znbaq-popups-root .zpop-modal.zpop-account {
    padding-top: 16px !important;
    padding-bottom: 16px !important;
}


/* Mobile */
@media (max-width: 600px) {

    #znbaq-popups-root .zpop-account .zpop-register-name-row {
        grid-template-columns: 1fr !important;
        gap: 0 !important;
    }

    #znbaq-popups-root .zpop-account .zpop-register-form .zpop-field {
        margin-bottom: 6px !important;
    }
}


/* === REGISTER BACK BOTTOM OVERRIDES START === */

/* Register view layout */
#znbaq-popups-root .zpop-account [data-account-view="register"]{
    display:flex !important;
    flex-direction:column !important;
}

/* Header */
#znbaq-popups-root .zpop-account [data-account-view="register"] .zpop-inner-header{
    order:1 !important;
    margin:0 auto 16px !important;
}

/* Hide the short subtitle */
#znbaq-popups-root .zpop-account [data-account-view="register"] .zpop-inner-subtitle{
    display:none !important;
}

/* Form before back link */
#znbaq-popups-root .zpop-account [data-account-view="register"] .zpop-register-form{
    order:2 !important;
    max-width:540px !important;
    width:100% !important;
    margin:0 auto !important;
}

/* More vertical spacing */
#znbaq-popups-root .zpop-account [data-account-view="register"] .zpop-field{
    margin:0 0 12px !important;
}

#znbaq-popups-root .zpop-account [data-account-view="register"] .zpop-label{
    margin:0 0 6px !important;
    line-height:1.45 !important;
}

#znbaq-popups-root .zpop-account [data-account-view="register"] .zpop-input{
    height:41px !important;
    min-height:41px !important;
}

#znbaq-popups-root .zpop-account [data-account-view="register"] .zpop-register-name-row{
    gap:10px !important;
    margin-bottom:2px !important;
}

#znbaq-popups-root .zpop-account [data-account-view="register"] .zpop-primary{
    margin-top:8px !important;
}

/* Move "Back" to bottom center */
#znbaq-popups-root .zpop-account [data-account-view="register"] .zpop-back{
    order:3 !important;

    position:static !important;
    top:auto !important;
    right:auto !important;
    left:auto !important;

    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;

    align-self:center !important;

    margin:14px auto 0 !important;
    padding:0 !important;

    font-size:14px !important;
    line-height:1.4 !important;
    text-align:center !important;
}

/* Mobile */
@media (max-width: 640px){
    #znbaq-popups-root .zpop-account [data-account-view="register"] .zpop-inner-header{
        margin-bottom:14px !important;
    }

    #znbaq-popups-root .zpop-account [data-account-view="register"] .zpop-field{
        margin-bottom:11px !important;
    }

    #znbaq-popups-root .zpop-account [data-account-view="register"] .zpop-register-name-row{
        gap:8px !important;
    }

    #znbaq-popups-root .zpop-account [data-account-view="register"] .zpop-back{
        margin-top:12px !important;
    }
}

/* === REGISTER BACK BOTTOM OVERRIDES END === */


/* ==========================================================
   CRITICAL ACCOUNT VIEW VISIBILITY FIX
========================================================== */

/*
 * hidden MUST always win.
 * Only one account screen can be visible at a time.
 */
#znbaq-popups-root .zpop-account .zpop-account-view[hidden] {
    display: none !important;
}


/*
 * Register uses flex ONLY when it is actually visible.
 */
#znbaq-popups-root .zpop-account .zpop-account-view[data-account-view="register"]:not([hidden]) {
    display: flex !important;
    flex-direction: column !important;
}


/*
 * Default / login / forgot visible states
 */
#znbaq-popups-root .zpop-account .zpop-account-view[data-account-view="default"]:not([hidden]),
#znbaq-popups-root .zpop-account .zpop-account-view[data-account-view="login"]:not([hidden]),
#znbaq-popups-root .zpop-account .zpop-account-view[data-account-view="forgot"]:not([hidden]) {
    display: block !important;
}


/* ==========================================================
   FLOATING LABELS INSIDE INPUTS
========================================================== */

#znbaq-popups-root .zpop-account .zpop-field {
    position: relative !important;

    margin-bottom: 11px !important;
}


/* label inside box */
#znbaq-popups-root .zpop-account .zpop-field > .zpop-label {
    position: absolute !important;

    top: 5px !important;
    right: 11px !important;
    left: auto !important;

    z-index: 3 !important;

    margin: 0 !important;
    padding: 0 !important;

    color: #746a77 !important;

    font-size: 9px !important;
    font-weight: 600 !important;

    line-height: 1.15 !important;

    pointer-events: none !important;

    background: transparent !important;
}


/* make room inside input for label */
#znbaq-popups-root .zpop-account .zpop-field > .zpop-input {
    height: 44px !important;
    min-height: 44px !important;

    padding-top: 14px !important;
    padding-right: 11px !important;
    padding-bottom: 3px !important;

    line-height: 1.3 !important;
}


/* password input */
#znbaq-popups-root .zpop-account .zpop-field-password > .zpop-input {
    padding-left: 42px !important;
}


/* eye centered in taller field */
#znbaq-popups-root .zpop-account .zpop-field-password > .zpop-password-toggle {
    top: 50% !important;
    bottom: auto !important;

    transform: translateY(-50%) !important;
}


/* Register fields */
#znbaq-popups-root .zpop-account .zpop-register-form .zpop-field {
    margin-bottom: 11px !important;
}


/* Login fields */
#znbaq-popups-root .zpop-account .zpop-main-login-form .zpop-field {
    margin-bottom: 10px !important;
}


/* Forgot screen fields */
#znbaq-popups-root .zpop-account [data-account-view="forgot"] .zpop-field {
    margin-bottom: 11px !important;
}


/* Mobile */
@media (max-width: 600px) {

    #znbaq-popups-root .zpop-account .zpop-field > .zpop-label {
        top: 5px !important;
        right: 10px !important;

        font-size: 8.5px !important;
    }

    #znbaq-popups-root .zpop-account .zpop-field > .zpop-input {
        height: 43px !important;
        min-height: 43px !important;
    }

}


/* ==========================================================
   CENTER USER INPUT TEXT
========================================================== */

#znbaq-popups-root .zpop-account .zpop-input {
    text-align: center !important;
}


/*
 * Keep enough space for floating label,
 * but typed text remains centered.
 */
#znbaq-popups-root .zpop-account .zpop-field > .zpop-input {
    padding-right: 42px !important;
    padding-left: 42px !important;
}


/* Password fields also stay centered */
#znbaq-popups-root .zpop-account .zpop-field-password > .zpop-input {
    padding-right: 42px !important;
    padding-left: 42px !important;

    text-align: center !important;
}

/* Softer floating labels */
#znbaq-popups-root .zpop-account .zpop-field > .zpop-label {
    color: #a59ca7 !important;
    font-weight: 500 !important;
    opacity: .9 !important;
}



/* ==========================================================
   REGISTER VALIDATION
========================================================== */

@keyframes zpopFieldShake {
    0%, 100% {
        transform: translateX(0);
    }

    20% {
        transform: translateX(-5px);
    }

    40% {
        transform: translateX(5px);
    }

    60% {
        transform: translateX(-3px);
    }

    80% {
        transform: translateX(3px);
    }
}


#znbaq-popups-root .zpop-account .zpop-input.zpop-input-error {
    border-color: #d64545 !important;

    box-shadow:
        0 0 0 1px rgba(214,69,69,.12) !important;

    animation:
        zpopFieldShake .34s ease !important;
}


#znbaq-popups-root .zpop-account .zpop-input.zpop-input-error:focus {
    border-color: #d64545 !important;

    box-shadow:
        0 0 0 2px rgba(214,69,69,.10) !important;
}


/* Register message ALWAYS below submit button */
#znbaq-popups-root .zpop-account .zpop-register-form [data-zpop-register-message] {
    display: block !important;

    width: 100% !important;

    min-height: 0 !important;

    margin: 7px 0 0 !important;
    padding: 0 4px !important;

    color: #c73939 !important;

    font-size: 10.5px !important;
    font-weight: 600 !important;

    line-height: 1.5 !important;

    text-align: center !important;
}


#znbaq-popups-root .zpop-account .zpop-register-form [data-zpop-register-message]:empty {
    display: none !important;
}


#znbaq-popups-root .zpop-account .zpop-register-form [data-zpop-register-message].is-success {
    color: #2e7d32 !important;
}


/* Accessibility */
@media (prefers-reduced-motion: reduce) {

    #znbaq-popups-root .zpop-account .zpop-input.zpop-input-error {
        animation: none !important;
    }

}


/* ==========================================================
   FINAL FIELD VALIDATION UI
========================================================== */

@keyframes zpopErrorShake {
    0%, 100% {
        transform: translateX(0);
    }

    15% {
        transform: translateX(-6px);
    }

    30% {
        transform: translateX(6px);
    }

    45% {
        transform: translateX(-5px);
    }

    60% {
        transform: translateX(5px);
    }

    75% {
        transform: translateX(-2px);
    }

    90% {
        transform: translateX(2px);
    }
}


/* Animate whole field */
#znbaq-popups-root .zpop-account .zpop-field.zpop-field-shake {
    animation: zpopErrorShake .42s ease both !important;
}


/* Strong red border */
#znbaq-popups-root .zpop-account .zpop-input.zpop-input-error {
    border: 1.5px solid #df3d3d !important;

    outline: none !important;

    box-shadow:
        0 0 0 2px rgba(223,61,61,.08) !important;

    background-color: #fffafa !important;
}


/* Keep red even on focus */
#znbaq-popups-root .zpop-account .zpop-input.zpop-input-error:focus {
    border-color: #df3d3d !important;

    box-shadow:
        0 0 0 2px rgba(223,61,61,.12) !important;
}


/* Label becomes red too */
#znbaq-popups-root .zpop-account .zpop-field.zpop-field-error > .zpop-label {
    color: #cf4646 !important;
    opacity: 1 !important;
}


/* Error messages */
#znbaq-popups-root .zpop-account .zpop-form-message {
    width: 100% !important;

    margin: 7px 0 0 !important;
    padding: 0 5px !important;

    color: #d43f3f !important;

    font-size: 10.5px !important;
    font-weight: 600 !important;

    line-height: 1.45 !important;

    text-align: center !important;
}


#znbaq-popups-root .zpop-account .zpop-form-message:empty {
    display: none !important;
}


#znbaq-popups-root .zpop-account .zpop-form-message.is-success {
    color: #31823d !important;
}


/*
 * Login message specifically below button.
 */
#znbaq-popups-root .zpop-account .zpop-main-login-form [data-zpop-login-message] {
    margin-top: 7px !important;
}


/*
 * Register message specifically below button.
 */
#znbaq-popups-root .zpop-account .zpop-register-form [data-zpop-register-message] {
    margin-top: 7px !important;
}


/* Loading */
#znbaq-popups-root .zpop-account button.is-loading {
    opacity: .65 !important;
    pointer-events: none !important;
}


/* Accessibility */
@media (prefers-reduced-motion: reduce) {

    #znbaq-popups-root .zpop-account .zpop-field.zpop-field-shake {
        animation: none !important;
    }

}


/* ==========================================================
   VALIDATION FINAL
========================================================== */

@keyframes zpopShake {
    0%,100% { transform: translateX(0); }
    20% { transform: translateX(-5px); }
    40% { transform: translateX(5px); }
    60% { transform: translateX(-3px); }
    80% { transform: translateX(3px); }
}


#znbaq-popups-root .zpop-field.zpop-field-shake {
    animation: zpopShake .38s ease !important;
}


#znbaq-popups-root .zpop-input.zpop-input-error {
    border-color: #db4242 !important;

    background: #fffafa !important;

    box-shadow:
        0 0 0 1px rgba(219,66,66,.14) !important;
}


#znbaq-popups-root .zpop-field.zpop-field-error > .zpop-label {
    color: #d05252 !important;
    opacity: 1 !important;
}


/* Messages */
#znbaq-popups-root .zpop-form-message {
    display: block !important;

    width: 100% !important;

    margin: 7px 0 0 !important;

    color: #d24141 !important;

    font-size: 10.5px !important;
    font-weight: 600 !important;

    text-align: center !important;
}


#znbaq-popups-root .zpop-form-message:empty {
    display: none !important;
}


#znbaq-popups-root .zpop-form-message.is-success {
    color: #30823a !important;
}


/* ==========================================================
   ZNBAQ ACCOUNT VALIDATION - STANDALONE
========================================================== */

@keyframes zpopAccountErrorShake {
    0%, 100% {
        transform: translateX(0);
    }

    20% {
        transform: translateX(-6px);
    }

    40% {
        transform: translateX(6px);
    }

    60% {
        transform: translateX(-4px);
    }

    80% {
        transform: translateX(4px);
    }
}


#znbaq-popups-root
.zpop-account
.zpop-field.zpop-field-shake {

    animation:
        zpopAccountErrorShake .38s ease !important;
}


#znbaq-popups-root
.zpop-account
.zpop-input.zpop-input-error {

    border-color: #df4141 !important;

    background-color:
        #fffafa !important;

    box-shadow:
        0 0 0 1px rgba(223,65,65,.16) !important;
}


#znbaq-popups-root
.zpop-account
.zpop-input.zpop-input-error:focus {

    border-color: #df4141 !important;

    box-shadow:
        0 0 0 2px rgba(223,65,65,.12) !important;
}


#znbaq-popups-root
.zpop-account
.zpop-field.zpop-field-error
> .zpop-label {

    color: #d34848 !important;

    opacity: 1 !important;
}


#znbaq-popups-root
.zpop-account
.zpop-form-message {

    width: 100% !important;

    margin:
        7px 0 0 !important;

    padding:
        0 4px !important;

    color: #d63e3e !important;

    font-size:
        10.5px !important;

    font-weight:
        600 !important;

    line-height:
        1.45 !important;

    text-align:
        center !important;
}


#znbaq-popups-root
.zpop-account
.zpop-form-message:empty {

    display: none !important;
}


#znbaq-popups-root
.zpop-account
.zpop-form-message.is-success {

    color: #33833e !important;
}

/* ===== ZPOP SAFE UI V3 START ===== */

/*
 * IMPORTANT:
 * Every selector below starts with #znbaq-popups-root.
 * It cannot style the old Codazon account popup or normal website fields.
 */


/* ---------- field icon ---------- */

#znbaq-popups-root .zpop-field {
    position: relative;
}

#znbaq-popups-root .zpop-field > .zpop-field-icon {
    position: absolute !important;
    right: 16px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;

    width: 28px !important;
    height: 28px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    color: #8f66a1 !important;
    pointer-events: none !important;
    z-index: 5 !important;
}

#znbaq-popups-root .zpop-field > .zpop-field-icon svg {
    display: block !important;
    width: 24px !important;
    height: 24px !important;
}


/* password: icon on right, eye stays on left */

#znbaq-popups-root .zpop-field-password > .zpop-field-icon {
    right: 16px !important;
}

#znbaq-popups-root .zpop-field-password > .zpop-password-toggle {
    left: 14px !important;
    right: auto !important;
}


/* ---------- back button ---------- */

#znbaq-popups-root button.zpop-back {
    position: relative !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;

    width: 100% !important;
    min-height: 50px !important;

    margin: 0 0 18px !important;
    padding: 0 18px !important;

    border: 1px solid #dccbe3 !important;
    border-radius: 14px !important;

    background: #faf7fc !important;
    color: #754780 !important;

    font-size: 14px !important;
    font-weight: 700 !important;

    box-shadow: none !important;
}

#znbaq-popups-root button.zpop-back:hover {
    background: #f4edf7 !important;
    border-color: #c9afd4 !important;
}

#znbaq-popups-root button.zpop-back .zpop-back-arrow {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 21px !important;
    height: 21px !important;

    font-size: 21px !important;
    line-height: 1 !important;
}


/* ---------- validation summary ---------- */

#znbaq-popups-root .zpop-form-message:not(:empty) {
    margin-top: 10px !important;
    padding: 10px 12px !important;

    border-radius: 10px !important;

    background: #fff5f5 !important;
    border: 1px solid #f1caca !important;

    color: #b33b3b !important;

    font-size: 13px !important;
    line-height: 1.65 !important;
    text-align: center !important;
}

#znbaq-popups-root .zpop-form-message.is-success:not(:empty) {
    background: #f2fbf5 !important;
    border-color: #c8e7d1 !important;
    color: #287347 !important;
}


/* ---------- loading ---------- */

#znbaq-popups-root .zpop-ui-loading {
    position: relative !important;
    pointer-events: none !important;
}

#znbaq-popups-root .zpop-ui-loading::after {
    content: "" !important;

    display: inline-block !important;
    width: 17px !important;
    height: 17px !important;

    margin-right: 9px !important;

    border: 2px solid currentColor !important;
    border-bottom-color: transparent !important;
    border-radius: 50% !important;

    vertical-align: middle !important;

    animation: zpopSafeUiSpinner .65s linear infinite !important;
}

@keyframes zpopSafeUiSpinner {
    to {
        transform: rotate(360deg);
    }
}


/* keep everything compact on mobile */

@media (max-width: 767px) {
    #znbaq-popups-root .zpop-field > .zpop-field-icon {
        right: 14px !important;
        width: 26px !important;
        height: 26px !important;
    }

    #znbaq-popups-root .zpop-field > .zpop-field-icon svg {
        width: 22px !important;
        height: 22px !important;
    }

    #znbaq-popups-root button.zpop-back {
        min-height: 48px !important;
    }
}

/* ===== ZPOP SAFE UI V3 END ===== */

/* ===== ZPOP BACK+ICONS FIX START ===== */
#znbaq-popups-root .zpop-account-view[data-account-view="register"],
#znbaq-popups-root .zpop-account-view[data-account-view="forgot"] {
    display: flex;
    flex-direction: column;
}

/* keep back button always at bottom */
#znbaq-popups-root .zpop-account-view[data-account-view="register"] .zpop-back,
#znbaq-popups-root .zpop-account-view[data-account-view="forgot"] .zpop-back {
    order: 999;
    margin-top: 18px;
    margin-bottom: 0;
    min-height: 56px;
    height: 56px;
    padding: 0 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border-radius: 16px;
    width: 100%;
    font-size: 18px;
    font-weight: 700;
    line-height: 1;
    box-sizing: border-box;
}

/* if button wrapper exists, keep it at bottom too */
#znbaq-popups-root .zpop-account-view[data-account-view="register"] .zpop-back-wrap,
#znbaq-popups-root .zpop-account-view[data-account-view="forgot"] .zpop-back-wrap {
    order: 999;
    margin-top: 18px;
}

/* input fields spacing for right-side icons */
#znbaq-popups-root .zpop-field {
    position: relative;
}

#znbaq-popups-root .zpop-input {
    padding-right: 60px !important;
}

/* right side decorative field icons */
#znbaq-popups-root .zpop-field .zpop-field-icon,
#znbaq-popups-root .zpop-field .zpop-input-icon,
#znbaq-popups-root .zpop-field .zpop-icon-right,
#znbaq-popups-root .zpop-field .zpop-label-icon {
    position: absolute;
    right: 18px;
    top: 50%;
    transform: translateY(-50%);
    width: 24px;
    height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    z-index: 3;
}

/* keep password eye on the left only */
#znbaq-popups-root .zpop-field-password .zpop-password-toggle {
    left: 18px !important;
    right: auto !important;
    top: 50%;
    transform: translateY(-50%);
}

#znbaq-popups-root .zpop-field-password .zpop-input {
    padding-left: 56px !important;
    padding-right: 60px !important;
}

/* slightly improve register name row alignment */
#znbaq-popups-root .zpop-register-name-row .zpop-field .zpop-input {
    padding-right: 60px !important;
}

/* mobile */
@media (max-width: 767px) {
    #znbaq-popups-root .zpop-account-view[data-account-view="register"] .zpop-back,
    #znbaq-popups-root .zpop-account-view[data-account-view="forgot"] .zpop-back {
        min-height: 54px;
        height: 54px;
        font-size: 17px;
        border-radius: 14px;
        margin-top: 16px;
    }

    #znbaq-popups-root .zpop-field .zpop-field-icon,
    #znbaq-popups-root .zpop-field .zpop-input-icon,
    #znbaq-popups-root .zpop-field .zpop-icon-right,
    #znbaq-popups-root .zpop-field .zpop-label-icon {
        right: 16px;
        width: 22px;
        height: 22px;
    }

    #znbaq-popups-root .zpop-input {
        padding-right: 54px !important;
    }

    #znbaq-popups-root .zpop-field-password .zpop-input {
        padding-left: 52px !important;
        padding-right: 54px !important;
    }
}
/* ===== ZPOP BACK+ICONS FIX END ===== */

/* ===== ZPOP FINAL UNIFIED BUTTONS START ===== */

/* جميع الأزرار الرئيسية داخل البوب أب الجديد فقط */
#znbaq-popups-root .zpop-account button.zpop-primary,
#znbaq-popups-root .zpop-account .zpop-primary.zpop-full,
#znbaq-popups-root .zpop-account .zpop-guest-card button.zpop-primary,
#znbaq-popups-root .zpop-account .zpop-main-login-form button.zpop-primary,
#znbaq-popups-root .zpop-account .zpop-register-form button.zpop-primary,
#znbaq-popups-root .zpop-account [data-zpop-forgot-form] button.zpop-primary,
#znbaq-popups-root .zpop-account button.zpop-back {
    width: 100% !important;

    height: 50px !important;
    min-height: 50px !important;
    max-height: 50px !important;

    padding-top: 0 !important;
    padding-bottom: 0 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    box-sizing: border-box !important;
    line-height: 1 !important;
}

/* الرجوع يبقى تحت */
#znbaq-popups-root .zpop-account [data-account-view="register"] button.zpop-back,
#znbaq-popups-root .zpop-account [data-account-view="forgot"] button.zpop-back,
#znbaq-popups-root .zpop-account [data-account-view="login"] button.zpop-back {
    order: 999 !important;
    margin-top: 14px !important;
    margin-bottom: 0 !important;
}

/* اللودينج لا يغير حجم الزر */
#znbaq-popups-root .zpop-account .zpop-ui-loading {
    height: 50px !important;
    min-height: 50px !important;
    max-height: 50px !important;
}

/* ===== ZPOP FINAL UNIFIED BUTTONS END ===== */

/* ===== ZPOP FORCE BACK BOTTOM START ===== */

/*
 * ONLY visible views of the NEW Znbaq popup.
 * Hidden views remain untouched.
 */
#znbaq-popups-root .zpop-account
.zpop-account-view[data-account-view="login"]:not([hidden]),

#znbaq-popups-root .zpop-account
.zpop-account-view[data-account-view="register"]:not([hidden]),

#znbaq-popups-root .zpop-account
.zpop-account-view[data-account-view="forgot"]:not([hidden]) {
    display: flex !important;
    flex-direction: column !important;
}


/* 1 — title/header */
#znbaq-popups-root .zpop-account
.zpop-account-view[data-account-view="login"]:not([hidden]) > .zpop-inner-header,

#znbaq-popups-root .zpop-account
.zpop-account-view[data-account-view="register"]:not([hidden]) > .zpop-inner-header,

#znbaq-popups-root .zpop-account
.zpop-account-view[data-account-view="forgot"]:not([hidden]) > .zpop-inner-header {
    order: 1 !important;
}


/* 2 — form */
#znbaq-popups-root .zpop-account
.zpop-account-view[data-account-view="login"]:not([hidden]) > .zpop-form,

#znbaq-popups-root .zpop-account
.zpop-account-view[data-account-view="register"]:not([hidden]) > .zpop-form,

#znbaq-popups-root .zpop-account
.zpop-account-view[data-account-view="forgot"]:not([hidden]) > .zpop-form {
    order: 2 !important;
}


/* 3 — BACK ALWAYS LAST */
#znbaq-popups-root .zpop-account
.zpop-account-view[data-account-view="login"]:not([hidden]) > button.zpop-back,

#znbaq-popups-root .zpop-account
.zpop-account-view[data-account-view="register"]:not([hidden]) > button.zpop-back,

#znbaq-popups-root .zpop-account
.zpop-account-view[data-account-view="forgot"]:not([hidden]) > button.zpop-back {
    order: 9999 !important;

    position: static !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;

    width: 100% !important;

    height: 50px !important;
    min-height: 50px !important;
    max-height: 50px !important;

    margin: 12px 0 0 !important;
    padding: 0 16px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 9px !important;

    box-sizing: border-box !important;

    border-radius: 8px !important;

    font-size: 13px !important;
    line-height: 1 !important;
}


/*
 * ALL main action buttons = exact same dimensions
 */
#znbaq-popups-root .zpop-account button.zpop-primary {
    height: 50px !important;
    min-height: 50px !important;
    max-height: 50px !important;

    padding-top: 0 !important;
    padding-bottom: 0 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    box-sizing: border-box !important;

    border-radius: 8px !important;
    line-height: 1 !important;
}


/* Spinner must not alter button dimensions */
#znbaq-popups-root .zpop-account button.zpop-primary.zpop-ui-loading,
#znbaq-popups-root .zpop-account button.zpop-back.zpop-ui-loading {
    height: 50px !important;
    min-height: 50px !important;
    max-height: 50px !important;
}


/* ===== ZPOP FORCE BACK BOTTOM END ===== */

/* ===== ZPOP UNIFY WIDTHS START ===== */

/* الفورم نفسه بعرض موحد */
#znbaq-popups-root .zpop-account
.zpop-account-view[data-account-view="login"]:not([hidden]) > .zpop-form,

#znbaq-popups-root .zpop-account
.zpop-account-view[data-account-view="register"]:not([hidden]) > .zpop-form,

#znbaq-popups-root .zpop-account
.zpop-account-view[data-account-view="forgot"]:not([hidden]) > .zpop-form {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}


/* كل الحقول بعرض البوكس */
#znbaq-popups-root .zpop-account
.zpop-account-view[data-account-view="login"] .zpop-field,

#znbaq-popups-root .zpop-account
.zpop-account-view[data-account-view="register"] .zpop-field,

#znbaq-popups-root .zpop-account
.zpop-account-view[data-account-view="forgot"] .zpop-field {
    width: 100% !important;
    max-width: none !important;
}


/* كل inputs نفس العرض */
#znbaq-popups-root .zpop-account .zpop-input {
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
}


/* الأزرار الرئيسية نفس العرض */
#znbaq-popups-root .zpop-account button.zpop-primary,
#znbaq-popups-root .zpop-account button.zpop-back {
    width: 100% !important;
    max-width: none !important;
    align-self: stretch !important;
    box-sizing: border-box !important;
}


/* Forgot: تأكيد عدم وجود تضييق قديم */
#znbaq-popups-root .zpop-account
.zpop-account-view[data-account-view="forgot"] .zpop-form,

#znbaq-popups-root .zpop-account
.zpop-account-view[data-account-view="forgot"] .zpop-field,

#znbaq-popups-root .zpop-account
.zpop-account-view[data-account-view="forgot"] button.zpop-primary {
    width: 100% !important;
    max-width: none !important;
}


/* نفس عرض زر الرجوع */
#znbaq-popups-root .zpop-account
.zpop-account-view[data-account-view="forgot"] > button.zpop-back,

#znbaq-popups-root .zpop-account
.zpop-account-view[data-account-view="register"] > button.zpop-back,

#znbaq-popups-root .zpop-account
.zpop-account-view[data-account-view="login"] > button.zpop-back {
    width: 100% !important;
    max-width: none !important;
}


/* ===== ZPOP UNIFY WIDTHS END ===== */

/* ===== ZPOP LABEL SHIFT START ===== */

#znbaq-popups-root .zpop-account .zpop-field > .zpop-label {
    right: 46px !important;
    left: auto !important;
}

#znbaq-popups-root .zpop-account .zpop-register-name-row .zpop-field > .zpop-label {
    right: 46px !important;
}

@media (max-width: 767px) {
    #znbaq-popups-root .zpop-account .zpop-field > .zpop-label,
    #znbaq-popups-root .zpop-account .zpop-register-name-row .zpop-field > .zpop-label {
        right: 44px !important;
    }
}

/* ===== ZPOP LABEL SHIFT END ===== */