{"id":17324,"date":"2025-03-12T10:17:39","date_gmt":"2025-03-12T14:17:39","guid":{"rendered":"https:\/\/demo2.mybscu.org\/?page_id=17324"},"modified":"2025-03-17T15:59:18","modified_gmt":"2025-03-17T19:59:18","slug":"educator-checking-upgrade-form","status":"publish","type":"page","link":"https:\/\/demo2.mybscu.org\/es\/educator-checking-upgrade-form\/","title":{"rendered":"Formulario de actualizaci\u00f3n de verificaci\u00f3n para educadores"},"content":{"rendered":"<div data-parent=\"true\" class=\"vc_row row-container\" id=\"row-unique-0\"><div class=\"row limit-width row-parent\"><div class=\"wpb_row row-inner\"><div class=\"wpb_column pos-top pos-center align_left column_parent col-lg-12 single-internal-gutter\"><div class=\"uncol style-light\"  ><div class=\"uncoltable\"><div class=\"uncell no-block-padding\" ><div class=\"uncont\" >\n\t<div class=\"wpb_raw_code wpb_content_element wpb_raw_html\" >\n\t\t<div class=\"wpb_wrapper\">\n\t\t\t<!-- Educator Interest Checking Upgrade Form - For WordPress HTML Container -->\n<div class=\"bscu-form-container\">\n    <style>\n        \/* Reset CSS for form elements to prevent WordPress interference *\/\n        .bscu-form-container * {\n            box-sizing: border-box !important;\n        }\n        \n        .bscu-form-container input,\n        .bscu-form-container label,\n        .bscu-form-container select,\n        .bscu-form-container button,\n        .bscu-form-container p,\n        .bscu-form-container h1,\n        .bscu-form-container div {\n            margin: 0;\n            padding: 0;\n            font-family: inherit;\n            color: inherit;\n            line-height: inherit;\n            \n        }\n        \n        \/* Force override any WordPress theme styles *\/\n        .bscu-form-container .bscu-input {\n            width: 100% !important;\n            padding: 0.75rem !important;\n            border: 1px solid #d1d5db !important;\n            border-radius: 0.375rem !important;\n            font-size: 1rem !important;\n            box-sizing: border-box !important;\n            margin: 0 !important;\n            height: auto !important;\n            max-width: 1200px !important;\n            display: block !important;\n            line-height: 1.5 !important;\n            min-height: calc(1.5em + 0.75rem + 2px) !important;\n            background-clip: padding-box !important;\n            background-color: #fff !important;\n        }\n        \n        .bscu-form-container .bscu-label {\n            display: block !important;\n            font-size: 0.875rem !important;\n            font-weight: 500 !important;\n            margin-bottom: 0.5rem !important;\n            color: #374151 !important;\n        }\n        \n        .bscu-form-container .bscu-checkbox-input {\n            width: 1.25rem !important;\n            height: 1.25rem !important;\n            margin-right: 0.75rem !important;\n            margin-top: 0.25rem !important;\n            appearance: none !important;\n            -webkit-appearance: none !important;\n            -moz-appearance: none !important;\n            border: 1px solid #d1d5db !important;\n            border-radius: 0.25rem !important;\n            background-color: #fff !important;\n        }\n        .bscu-form-container .bscu-checkbox-group.agreement-hidden {\n            display: none !important;\n        }\n        \n        .bscu-form-container .bscu-btn {\n            width: auto !important;\n            display: inline-block !important;\n            padding: 0.75rem 1.5rem !important;\n            font-size: 1rem !important;\n            font-weight: 500 !important;\n            text-align: center !important;\n            border: none !important;\n            border-radius: 0.375rem !important;\n            cursor: pointer !important;\n            line-height: 1.5 !important;\n        }\n        \n        .bscu-form-container .bscu-form-row {\n            display: flex !important;\n            flex-wrap: wrap !important;\n            margin: -0.5rem !important;\n            clear: both !important;\n        }\n\n        \/* BSCU Custom Styles - Isolated from WordPress CSS *\/\n        .bscu-form-container {\n            --bscu-primary: #00475f;\n            --bscu-primary-light: #005d7f;\n            --bscu-accent: #44b0e4;\n            --bscu-gray-100: #f3f4f6;\n            --bscu-gray-200: #e5e7eb;\n            --bscu-gray-300: #d1d5db;\n            --bscu-gray-500: #6b7280;\n            --bscu-gray-700: #374151;\n            --bscu-gray-900: #111827;\n            --bscu-success: #10b981;\n            --bscu-error: #ef4444;\n            \n            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif !important;\n            line-height: 1.5 !important;\n            color: var(--bscu-gray-900) !important;\n            width: 100% !important;\n            max-width: 800px !important;\n            margin: 0 auto !important;\n        }\n        \n        .bscu-card {\n            background-color: white !important;\n            border-radius: 0.75rem !important;\n            box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important;\n            overflow: hidden !important;\n            margin: 2rem auto !important;\n        }\n        \n        .bscu-card-inner {\n            padding: 2rem !important;\n        }\n        \n        .bscu-card-header {\n            border-bottom: 1px solid var(--bscu-gray-200) !important;\n            padding-bottom: 1.5rem !important;\n            margin-bottom: 1.5rem !important;\n        }\n        \n        .bscu-card-title {\n            font-size: 1.5rem !important;\n            font-weight: 700 !important;\n            color: var(--bscu-primary) !important;\n            margin-bottom: 1rem !important;\n        }\n        \n        .bscu-card-intro {\n            font-size: 1rem !important;\n            color: var(--bscu-gray-700) !important;\n            margin-bottom: 1rem !important;\n            line-height: 1.6 !important;\n        }\n        \n        .bscu-notice {\n            background-color: #fff8e6 !important;\n            border-left: 4px solid #fbbf24 !important;\n            padding: 1rem !important;\n            margin-top: 1rem !important;\n            border-radius: 0.25rem !important;\n        }\n        \n        .bscu-notice p {\n            margin: 0 !important;\n            color: #92400e !important;\n            font-size: 0.938rem !important;\n        }\n        \n        .bscu-form-group {\n            margin-bottom: 1.5rem !important;\n        }\n        \n        .bscu-form-col {\n            flex: 1 0 100% !important;\n            padding: 0.5rem !important;\n        }\n        \n        @media (min-width: 640px) {\n            .bscu-form-col-half {\n                flex: 0 0 50% !important;\n                max-width: 50% !important;\n            }\n        }\n        \n        .bscu-required::after {\n            content: '*' !important;\n            color: var(--bscu-error) !important;\n            margin-left: 0.25rem !important;\n        }\n        \n        .bscu-input:focus {\n            outline: none !important;\n            border-color: var(--bscu-primary) !important;\n            box-shadow: 0 0 0 3px rgba(0, 71, 95, 0.2) !important;\n        }\n        \n        .bscu-checkbox-group {\n            display: flex !important;\n            align-items: flex-start !important;\n            margin-bottom: 1rem !important;\n        }\n        \n        .bscu-checkbox-input:checked {\n            background-color: var(--bscu-primary) !important;\n            border-color: var(--bscu-primary) !important;\n            background-image: url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' viewBox='0 0 20 20' fill='white'%3E%3Cpath fill-rule='evenodd' d='M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z' clip-rule='evenodd'\/%3E%3C\/svg%3E\") !important;\n            background-size: contain !important;\n        }\n        \n        .bscu-checkbox-input:focus {\n            outline: none !important;\n            box-shadow: 0 0 0 3px rgba(0, 71, 95, 0.2) !important;\n        }\n        \n        .bscu-checkbox-label {\n            font-size: 0.875rem !important;\n            color: var(--bscu-gray-700) !important;\n        }\n        \n        .bscu-terms-container {\n            margin-top: 1.5rem !important;\n            margin-bottom: 1.5rem !important;\n            padding: 1rem !important;\n            background-color: var(--bscu-gray-100) !important;\n            border-radius: 0.5rem !important;\n            max-height: 200px !important;\n            overflow-y: auto !important;\n            font-size: 0.875rem !important;\n            color: var(--bscu-gray-700) !important;\n            display: none !important; \/* Hide by default *\/\n        }\n\n        .bscu-terms-container.terms-visible {\n            display: block !important;\n        }\n        \n        .bscu-btn-disabled {\n            opacity: 0.7 !important;\n            cursor: not-allowed !important;\n            background-color: var(--bscu-gray-500) !important;\n        }\n        \n        .bscu-btn-primary {\n            background-color: var(--bscu-primary) !important;\n            color: white !important;\n            box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important;\n        }\n        \n        .bscu-btn-primary:hover {\n            background-color: var(--bscu-primary-light) !important;\n        }\n        \n        .bscu-btn-primary:active {\n            transform: translateY(1px) !important;\n        }\n        \n        .bscu-btn-block {\n            display: block !important;\n            width: 100% !important;\n        }\n        \n        .bscu-alert {\n            padding: 1rem !important;\n            margin-bottom: 1.5rem !important;\n            border-left: 4px solid !important;\n            border-radius: 0 0.25rem 0.25rem 0 !important;\n        }\n        \n        .bscu-alert-error {\n            background-color: rgba(239, 68, 68, 0.1) !important;\n            border-color: var(--bscu-error) !important;\n            color: var(--bscu-error) !important;\n        }\n        \n        .bscu-alert-success {\n            background-color: rgba(16, 185, 129, 0.1) !important;\n            border-color: var(--bscu-success) !important;\n            color: var(--bscu-success) !important;\n        }\n        \n        \/* Hide form after successful submission *\/\n        .bscu-form-success .bscu-form {\n            display: none !important;\n        }\n\n        \/* Fix for error state *\/\n        .bscu-input.error {\n            border-color: var(--bscu-error) !important;\n        }\n\n        \/* Modal Styles *\/\n        \/* Enhanced Modal Styles with WordPress Protection *\/\n.bscu-form-container .bscu-modal {\n    display: none;\n    position: fixed !important;\n    z-index: 999999 !important; \/* Very high z-index to ensure it's on top *\/\n    left: 0 !important;\n    top: 0 !important;\n    width: 100% !important;\n    height: 100% !important;\n    overflow: auto !important;\n    background-color: rgba(0,0,0,0.4) !important;\n    animation: bscu-fadeIn 0.3s !important;\n    padding: 0 !important;\n    margin: 0 !important;\n    border: none !important;\n    outline: none !important;\n}\n\n.bscu-form-container .bscu-modal-content {\n    background-color: #fff !important;\n    margin: 10vh auto !important;\n    padding: 2rem !important;\n    border-radius: 0.75rem !important;\n    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15) !important;\n    width: 90% !important;\n    max-width: 500px !important;\n    text-align: center !important;\n    animation: bscu-slideIn 0.3s !important;\n    \n    \/* Added positioning to center the modal properly *\/\n    position: relative !important;\n}\n\n@keyframes bscu-fadeIn {\n    from {opacity: 0}\n    to {opacity: 1}\n}\n\n@keyframes bscu-slideIn {\n    from {transform: translate(-50%, -60%); opacity: 0;}\n    to {transform: translate(-50%, -50%); opacity: 1;}\n}\n\n\/* Extra styling for buttons, icons, etc. to ensure WordPress doesn't override them *\/\n.bscu-form-container .bscu-modal-icon {\n    margin-bottom: 1.5rem !important;\n    display: inline-block !important;\n}\n\n.bscu-form-container .bscu-modal h2 {\n    color: var(--bscu-primary) !important;\n    margin-bottom: 1rem !important;\n    font-size: 1.75rem !important;\n    line-height: 1.2 !important;\n    font-weight: 600 !important;\n}\n\n.bscu-form-container .bscu-modal p {\n    margin-bottom: 1.5rem !important;\n    font-size: 1.1rem !important;\n    color: var(--bscu-gray-700) !important;\n    line-height: 1.4 !important;\n}\n\n.bscu-form-container .bscu-modal .bscu-btn {\n    min-width: 100px !important;\n    margin: 0 auto !important;\n    display: block !important;\n}\n\n.bscu-form-container .bscu-modal-close {\n    color: var(--bscu-gray-500) !important;\n    float: right !important;\n    font-size: 1.5rem !important;\n    font-weight: bold !important;\n    cursor: pointer !important;\n    line-height: 1 !important;\n    padding: 0 !important;\n    background: none !important;\n    border: none !important;\n}\n\n.bscu-form-container .bscu-modal-close:hover {\n    color: var(--bscu-gray-900) !important;\n}\n    <\/style>\n\n    <!-- Success Message (initially hidden, shown via JavaScript after successful submission) -->\n    <div id=\"bscu-success-message\" style=\"display: none;\" class=\"bscu-alert bscu-alert-success\">\n        <p>\u00a1Su solicitud de actualizaci\u00f3n del servicio de comprobaci\u00f3n de intereses para educadores se ha enviado correctamente!<\/p>\n    <\/div>\n    \n    <!-- Error Message (initially hidden, shown via JavaScript if errors occur) -->\n    <div id=\"bscu-error-message\" style=\"display: none;\" class=\"bscu-alert bscu-alert-error\">\n        <p>Se produjo un error al enviar su solicitud. Por favor, revise el formulario e int\u00e9ntelo de nuevo.<\/p>\n        <div id=\"bscu-error-details\"><\/div>\n    <\/div>\n\n    <div class=\"bscu-card\">\n        <div class=\"bscu-card-inner\">\n            <div class=\"bscu-card-header\">\n                <h1 class=\"bscu-card-title\">Solicitud de actualizaci\u00f3n de verificaci\u00f3n de intereses para educadores<\/h1>\n                <p class=\"bscu-card-intro\">Gracias por su inter\u00e9s en <strong>actualizaci\u00f3n<\/strong> \u00a1Transfiera su cuenta corriente a la cuenta de inter\u00e9s para educadores de BrightStar! Para aprovechar estos beneficios exclusivos, complete este formulario.<\/p>\n                <div class=\"bscu-notice\">\n                    <p><strong>Importante:<\/strong> Tenga en cuenta que esta actualizaci\u00f3n solo se aplica a los n\u00fameros de cuenta que terminan con los sufijos 60-69.<\/p>\n                <\/div>\n            <\/div>\n\n            <form id=\"bscu-upgrade-form\" class=\"bscu-form\" action=\"\">\n                <input type=\"hidden\" name=\"utm_source\" id=\"utm_source\" value=\"\">\n                <input type=\"hidden\" name=\"utm_campaign\" id=\"utm_campaign\" value=\"\">\n\n                <!-- Personal Information -->\n                <div class=\"bscu-form-row\">\n                    <div class=\"bscu-form-col bscu-form-col-half\">\n                        <div class=\"bscu-form-group\">\n                            <label for=\"firstName\" class=\"bscu-label bscu-required\">Nombre de pila<\/label>\n                            <input type=\"text\" id=\"firstName\" name=\"firstName\" class=\"bscu-input\" required>\n                        <\/div>\n                    <\/div>\n                    <div class=\"bscu-form-col bscu-form-col-half\">\n                        <div class=\"bscu-form-group\">\n                            <label for=\"lastName\" class=\"bscu-label bscu-required\">Apellido<\/label>\n                            <input type=\"text\" id=\"lastName\" name=\"lastName\" class=\"bscu-input\" required>\n                        <\/div>\n                    <\/div>\n                <\/div>\n\n                <div class=\"bscu-form-row\">\n                    <div class=\"bscu-form-col bscu-form-col-half\">\n                        <div class=\"bscu-form-group\">\n                            <label for=\"memberPhone\" class=\"bscu-label bscu-required\">N\u00famero de tel\u00e9fono del miembro<\/label>\n                            <input type=\"tel\" id=\"memberPhone\" name=\"memberPhone\" class=\"bscu-input\" required>\n                        <\/div>\n                    <\/div>\n                    <div class=\"bscu-form-col bscu-form-col-half\">\n                        <div class=\"bscu-form-group\">\n                            <label for=\"email\" class=\"bscu-label bscu-required\">Correo electr\u00f3nico<\/label>\n                            <input type=\"email\" id=\"email\" name=\"email\" class=\"bscu-input\" required>\n                        <\/div>\n                    <\/div>\n                <\/div>\n\n                <div class=\"bscu-form-row\">\n                    <div class=\"bscu-form-col bscu-form-col-half\">\n                        <div class=\"bscu-form-group\">\n                            <label for=\"educationalAffiliation\" class=\"bscu-label bscu-required\">Afiliaci\u00f3n educativa<\/label>\n                            <input type=\"text\" id=\"educationalAffiliation\" name=\"educationalAffiliation\" class=\"bscu-input\" required>\n                        <\/div>\n                    <\/div>\n                    <div class=\"bscu-form-col bscu-form-col-half\">\n                        <div class=\"bscu-form-group\">\n                            <label for=\"memberNumber\" class=\"bscu-label bscu-required\">N\u00famero de miembro<\/label>\n                            <input type=\"text\" id=\"memberNumber\" name=\"memberNumber\" class=\"bscu-input\" required>\n                        <\/div>\n                    <\/div>\n                <\/div>\n\n                <div class=\"bscu-form-group\">\n                    <label for=\"checkingAccount\" class=\"bscu-label\">N\u00famero de cuenta corriente completo<\/label>\n                    <input type=\"text\" id=\"checkingAccount\" name=\"checkingAccount\" class=\"bscu-input\">\n                <\/div>\n\n                <!-- Request Options -->\n                <div class=\"bscu-form-group\">\n                    <div class=\"bscu-checkbox-group\">\n                        <input type=\"checkbox\" id=\"upgradeRequest\" name=\"upgradeRequest\" class=\"bscu-checkbox-input\">\n                        <label for=\"upgradeRequest\" class=\"bscu-checkbox-label\">Me gustar\u00eda actualizar.<\/label>\n                    <\/div>\n                    \n                    <div class=\"bscu-checkbox-group\">\n                        <input type=\"checkbox\" id=\"optInCourtesyPay\" name=\"optInCourtesyPay\" class=\"bscu-checkbox-input\">\n                        <label for=\"optInCourtesyPay\" class=\"bscu-checkbox-label\">Me gustar\u00eda activar el servicio de pago de cortes\u00eda para transacciones con tarjeta de d\u00e9bito\/ATM.<\/label>\n                    <\/div>\n                <\/div>\n\n                <!-- Terms -->\n                <div class=\"bscu-terms-container\">\n                    <p>El servicio de Pago de Cortes\u00eda sobregira su cuenta corriente (&quot;Cuenta&quot;) para pagar cheques, transacciones con tarjeta de d\u00e9bito ATM\/Visa, d\u00e9bitos ACH, pagos autom\u00e1ticos de facturas, incluidas las transacciones recurrentes con tarjeta de d\u00e9bito, y otras transacciones presentadas para pago desde su Cuenta que de otro modo ser\u00edan rechazadas y devueltas sin pagar debido a un saldo real o disponible insuficiente. Para pagar estos conceptos, su Cuenta estar\u00e1 sobregirada (en negativo). Para ser elegible para el Pago de Cortes\u00eda, un miembro debe tener: a) una cuenta corriente con al menos 30 d\u00edas de antig\u00fcedad; b) tener al menos 18 a\u00f1os de edad; c) no tener m\u00e1s de 11 d\u00edas de retraso en ning\u00fan pr\u00e9stamo de la Cooperativa de Cr\u00e9dito. El servicio de Pago de Cortes\u00eda se activar\u00e1 autom\u00e1ticamente en su Cuenta para cheques, ACH, giros de cuentas y transacciones recurrentes con tarjeta de d\u00e9bito, sujeto a los criterios mencionados en esta secci\u00f3n. Usted tiene derecho a dar su consentimiento expreso o a optar por el pago de sobregiros para transacciones con tarjeta de d\u00e9bito y de un solo uso. Sin su consentimiento expreso, la Cooperativa de Cr\u00e9dito no pagar\u00e1 las transacciones con tarjeta de d\u00e9bito y cajero autom\u00e1tico que generen sobregiros en su cuenta. El saldo negativo m\u00e1ximo permitido puede variar. La Cooperativa de Cr\u00e9dito podr\u00e1 rechazar cualquier transacci\u00f3n que exceda dicho saldo. Si su cuenta supera el saldo negativo m\u00e1ximo, la Cooperativa de Cr\u00e9dito podr\u00e1 cancelar inmediatamente el servicio de Pago de Cortes\u00eda o cerrar su cuenta sin previo aviso. Todos los saldos negativos deben pagarse inmediatamente a la Cooperativa de Cr\u00e9dito a solicitud. Si usted no paga los saldos negativos a solicitud, la Cooperativa de Cr\u00e9dito podr\u00e1 cancelar inmediatamente el servicio de Pago de Cortes\u00eda y\/o cerrar su cuenta sin previo aviso. Usted ser\u00e1 responsable de los saldos negativos hasta que se paguen en su totalidad a la Cooperativa de Cr\u00e9dito. Las comisiones por Pago de Cortes\u00eda se cargar\u00e1n autom\u00e1ticamente a su cuenta al momento de pagar las transacciones por sobregiro. Sin perjuicio de cualquier otra disposici\u00f3n en contrario en este documento y a pesar de su elegibilidad para el Servicio de Pago de Cortes\u00eda, la Cooperativa de Cr\u00e9dito no tiene la obligaci\u00f3n de pagar ninguna transacci\u00f3n que de otro modo podr\u00eda ser rechazada y devuelta sin pagar debido a un saldo real o disponible insuficiente o a un saldo no cobrado, y puede rechazar cualquier transacci\u00f3n de este tipo a su entera discreci\u00f3n sin previo aviso. El Servicio de Pago de Cortes\u00eda puede cancelarse comunic\u00e1ndose con nosotros al 800-637-BSCU (2728).<\/p>\n                <\/div>\n\n                <div class=\"bscu-form-group\">\n                    <div class=\"bscu-checkbox-group\">\n                        <input type=\"checkbox\" id=\"agreementConfirmed\" name=\"agreementConfirmed\" class=\"bscu-checkbox-input\">\n                        <label for=\"agreementConfirmed\" class=\"bscu-checkbox-label bscu-required\">He le\u00eddo y comprendo los t\u00e9rminos de pago de cortes\u00eda mencionados anteriormente.<\/label>\n                    <\/div>\n                <\/div>\n\n                <div class=\"bscu-form-group\">\n                    <button type=\"submit\" class=\"bscu-btn bscu-btn-primary bscu-btn-block\">Enviar solicitud<\/button>\n                <\/div>\n            <input type=\"hidden\" name=\"trp-form-language\" value=\"es\"\/><\/form>\n            \n        <\/div>\n    <\/div>\n\n    <script>\n\n    document.addEventListener('DOMContentLoaded', function() {\n        \/\/ Define showSuccessModal in the global scope\n        window.showSuccessModal = function() {\n    const modal = document.getElementById('bscu-success-modal');\n    \n    \/\/ Apply more specific reset styles to counter WordPress influence\n    modal.style.cssText = `\n        display: block !important;\n        position: fixed !important;\n        z-index: 999999 !important;\n        left: 0 !important;\n        top: 0 !important;\n        width: 100% !important;\n        height: 100% !important;\n        overflow: auto !important;\n        background-color: rgba(0,0,0,0.4) !important;\n        padding: 0 !important;\n        margin: 0 !important;\n    `;\n    \n    const modalContent = modal.querySelector('.bscu-modal-content');\n    modalContent.style.cssText = `\n        background-color: #fff !important;\n        margin: 10% auto !important;\n        padding: 2rem !important;\n        border-radius: 0.75rem !important;\n        box-shadow: 0 10px 25px rgba(0,0,0,0.15) !important;\n        width: 90% !important;\n        max-width: 500px !important;\n        text-align: center !important;\n        position: relative !important;\n        top: auto !important;\n        left: auto !important;\n        transform: none !important;\n    `;\n    \n    \/\/ Fix icon, title, message and button styling\n    const icon = modal.querySelector('.bscu-modal-icon');\n    icon.style.cssText = 'margin-bottom: 1.5rem !important; display: inline-block !important;';\n    \n    const title = modal.querySelector('h2');\n    title.style.cssText = 'color: #00475f !important; margin-bottom: 1rem !important; font-size: 1.75rem !important;';\n    \n    const message = modal.querySelector('p');\n    message.style.cssText = 'margin-bottom: 1.5rem !important; font-size: 1.1rem !important; color: #374151 !important;';\n    \n    const button = modal.querySelector('.bscu-modal-btn');\n    button.style.cssText = 'min-width: 100px !important; margin: 0 auto !important; display: block !important; background-color: #00475f !important; color: white !important; padding: 0.75rem 1.5rem !important; border-radius: 0.375rem !important; border: none !important;';\n    \n    const closeBtn = modal.querySelector('.bscu-modal-close');\n    closeBtn.style.cssText = 'position: absolute !important; right: 1rem !important; top: 1rem !important; font-size: 1.5rem !important; cursor: pointer !important; color: #6b7280 !important;';\n    \n    \/\/ Prevent scrolling\n    document.body.style.overflow = 'hidden';\n    \n    \/\/ Move to body to escape any problematic containers\n    document.body.appendChild(modal);\n};\n    \n        \/\/ Get references to the checkbox and terms container\n        const optInCheckbox = document.getElementById('optInCourtesyPay');\n        const termsContainer = document.querySelector('.bscu-terms-container');\n        const agreementCheckbox = document.getElementById('agreementConfirmed');\n        const agreementCheckboxGroup = document.querySelector('label[for=\"agreementConfirmed\"]').closest('.bscu-checkbox-group');\n        \n        \/\/ Initially hide the agreement checkbox group since terms are hidden\n        agreementCheckboxGroup.style.display = 'none';\n        \n        \/\/ Function to toggle terms visibility\n        function toggleTermsVisibility() {\n            if (optInCheckbox.checked) {\n                termsContainer.classList.add('terms-visible');\n                agreementCheckboxGroup.classList.remove('agreement-hidden');\n            } else {\n                termsContainer.classList.remove('terms-visible');\n                agreementCheckboxGroup.classList.add('agreement-hidden');\n                \/\/ Uncheck the agreement box if user unchecks the opt-in\n                agreementCheckbox.checked = false;\n            }\n        }\n\n        agreementCheckboxGroup.classList.add('agreement-hidden');\n\n        const observer = new MutationObserver(function(mutations) {\n            if (!optInCheckbox.checked && !agreementCheckboxGroup.classList.contains('agreement-hidden')) {\n                agreementCheckboxGroup.classList.add('agreement-hidden');\n            }\n        });\n        \n        observer.observe(agreementCheckboxGroup, { \n            attributes: true, \n            childList: false, \n            subtree: false \n        });\n        \n        \/\/ Add event listener to the checkbox\n        optInCheckbox.addEventListener('change', toggleTermsVisibility);\n        \n        \/\/ Initial check on page load\n        toggleTermsVisibility();\n    \n        \/\/ Set up modal controls\n    const modal = document.getElementById('bscu-success-modal');\n    const closeBtn = modal.querySelector('.bscu-modal-close');\n    const okBtn = modal.querySelector('.bscu-modal-btn');\n    \n    \/\/ Event listeners for closing the modal\n    closeBtn.addEventListener('click', closeModal);\n    okBtn.addEventListener('click', closeModal);\n    \n    \/\/ Close on click outside the modal content\n    modal.addEventListener('click', function(event) {\n        if (event.target === modal) {\n            closeModal();\n        }\n    });\n    \n    \/\/ Ensure modal has the correct inline styles as a fallback\n    \/\/ This is in addition to your CSS, not a replacement\n    const modalContent = modal.querySelector('.bscu-modal-content');\n    modalContent.style.position = 'absolute';\n    modalContent.style.top = '50%';\n    modalContent.style.left = '50%';\n    modalContent.style.transform = 'translate(-50%, -50%)';\n        \n        \/\/ Function to close modal\n        \nfunction closeModal() {\n    const modal = document.getElementById('bscu-success-modal');\n    modal.style.display = 'none';\n    document.body.style.overflow = 'auto';\n    \n    \/\/ Reset the submit button since the form was successfully submitted\n    const submitButton = document.querySelector('button[type=\"submit\"]');\n    if (submitButton) {\n        submitButton.disabled = false;\n        submitButton.innerHTML = 'Submit Request';\n        submitButton.classList.remove('bscu-btn-disabled');\n    }\n    \n    \/\/ Return the modal to its original position in the DOM if needed\n    const formCardInner = document.querySelector('.bscu-card-inner');\n    if (formCardInner && !formCardInner.contains(modal)) {\n        formCardInner.appendChild(modal);\n    }\n\n    \/\/ Force a re-check of the terms visibility state\n    const optInCheckbox = document.getElementById('optInCourtesyPay');\n    if (optInCheckbox && typeof toggleTermsVisibility === 'function') {\n        toggleTermsVisibility();\n    }\n}\n        \n        \/\/ Event listeners for closing the modal\n        closeBtn.addEventListener('click', closeModal);\n        okBtn.addEventListener('click', closeModal);\n        window.addEventListener('click', function(event) {\n            if (event.target === modal) {\n                closeModal();\n            }\n        });\n    \n        \/\/ Load jsPDF library\n        const jsPDFScript = document.createElement('script');\n        jsPDFScript.src = 'https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/jspdf\/2.5.1\/jspdf.umd.min.js';\n        jsPDFScript.async = true;\n        document.head.appendChild(jsPDFScript);\n        \n        \/\/ Load SVG.js for the logo\n        const svgScript = document.createElement('script');\n        svgScript.src = 'https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/svg.js\/3.1.1\/svg.min.js';\n        svgScript.async = true;\n        document.head.appendChild(svgScript);\n        \n        \/\/ Parse UTM parameters and add to hidden form fields\n        const urlParams = new URLSearchParams(window.location.search);\n        const utmSource = urlParams.get('utm_source');\n        const utmCampaign = urlParams.get('utm_campaign');\n        \n        if (utmSource) document.getElementById('utm_source').value = utmSource;\n        if (utmCampaign) document.getElementById('utm_campaign').value = utmCampaign;\n        \n        \/\/ Form submission handling\n        const form = document.getElementById('bscu-upgrade-form');\n        const successMessage = document.getElementById('bscu-success-message');\n        const errorMessage = document.getElementById('bscu-error-message');\n        const errorDetails = document.getElementById('bscu-error-details');\n        \n        form.addEventListener('submit', function(e) {\n            e.preventDefault();\n            \n            \/\/ Reset messages\n            successMessage.style.display = 'none';\n            errorMessage.style.display = 'none';\n            errorDetails.innerHTML = '';\n            \n            \/\/ Disable the submit button\n            const submitButton = form.querySelector('button[type=\"submit\"]');\n            submitButton.disabled = true;\n            submitButton.innerHTML = 'Processing...';\n            submitButton.classList.add('bscu-btn-disabled');\n            \n            \/\/ Validate form\n            let isValid = true;\n            const requiredFields = ['firstName', 'lastName', 'memberPhone', 'educationalAffiliation', 'memberNumber', 'email'];\n            \n            requiredFields.forEach(field => {\n                const input = document.getElementById(field);\n                if (!input.value.trim()) {\n                    isValid = false;\n                    input.classList.add('error');\n                } else {\n                    input.classList.remove('error');\n                }\n            });\n            \n            \/\/ Only validate agreement if opt-in is checked\n            if (optInCheckbox.checked && !agreementCheckbox.checked) {\n                isValid = false;\n                errorDetails.innerHTML += '<p>You must confirm that you understand the Courtesy Pay terms.<\/p>';\n            }\n            \n            if (!isValid) {\n                errorMessage.style.display = 'block';\n                \/\/ Re-enable the button if validation fails\n                submitButton.disabled = false;\n                submitButton.innerHTML = 'Submit Request';\n                submitButton.classList.remove('bscu-btn-disabled');\n                return;\n            }\n            \n            \/\/ Add this right before creating the FormData object in your form submission handler\nif (!optInCheckbox.checked) {\n    \/\/ If user didn't opt in, we need to create a hidden field to satisfy the PHP validation\n    const hiddenAgreement = document.createElement('input');\n    hiddenAgreement.type = 'hidden';\n    hiddenAgreement.name = 'agreementConfirmed';\n    hiddenAgreement.value = 'on';\n    form.appendChild(hiddenAgreement);\n    \n    \/\/ Set a cleanup timeout to remove the element after submission\n    setTimeout(() => {\n        if (form.contains(hiddenAgreement)) {\n            form.removeChild(hiddenAgreement);\n        }\n    }, 1000);\n}\n            \/\/ Prepare the form data for submission\n            const formData = new FormData(form);\n            \n            \/\/ Prepare the data for Jira\n            const memberNumber = document.getElementById('memberNumber').value;\n            const firstName = document.getElementById('firstName').value;\n            const lastName = document.getElementById('lastName').value;\n            const memberPhone = document.getElementById('memberPhone').value;\n            const email = document.getElementById('email').value;\n            const educationalAffiliation = document.getElementById('educationalAffiliation').value;\n            const checkingAccount = document.getElementById('checkingAccount').value || 'Not provided';\n            const upgradeRequested = document.getElementById('upgradeRequest').checked;\n            const optInCourtesyPay = document.getElementById('optInCourtesyPay').checked;\n            \n            \/\/ Create a description for the Jira ticket\n            let jiraDescription = \"You have received a checking account upgrade request. Below is the form submission data, and you can also find the details in the attached document.\\n\\n\";\n            jiraDescription += `Member Number: ${memberNumber}\\n`;\n            jiraDescription += `First Name: ${firstName}\\n`;\n            jiraDescription += `Last Name: ${lastName}\\n`;\n            jiraDescription += `Member Phone Number: ${memberPhone}\\n`;\n            jiraDescription += `Email: ${email}\\n`;\n            jiraDescription += `Educational Affiliation: ${educationalAffiliation}\\n`;\n            jiraDescription += `Full Checking Account Number: ${checkingAccount}\\n`;\n            \n            if (upgradeRequested) {\n                jiraDescription += `I would like to upgrade.\\n`;\n            }\n            \n            if (optInCourtesyPay) {\n                jiraDescription += `I would like to Opt-In to Courtesy Pay for ATM\/Visa debit card transactions.\\n`;\n            }\n            \n            jiraDescription += `I have read and understand the Courtesy Pay terms above.\\n`;\n            \n            \/\/ Add description to form data\n            formData.append('jiraDescription', jiraDescription);\n            formData.append('jiraSummary', `${memberNumber} - Educator Checking Account Upgrade Request`);\n            formData.append('jiraMemberNumber', memberNumber);\n            \n            \/\/ Generate PDF\n            generatePDF(form).then(pdfBlob => {\n                \/\/ Add the PDF file to formData\n                formData.append('pdfAttachment', pdfBlob, 'educator_checking_upgrade_request.pdf');\n                \n                \/\/ Send data to API\n                fetch('\/api\/eduupgrade.php', {\n                    method: 'POST',\n                    body: formData\n                })\n                .then(response => response.json())\n                .then(data => {\n                    if (data.success) {\n                        showSuccessModal();\n                        form.reset();\n                    } else {\n                        errorDetails.innerHTML = '<p>' + (data.message || 'An unexpected error occurred.') + '<\/p>';\n                        errorMessage.style.display = 'block';\n                        \/\/ Re-enable the button on error\n                        submitButton.disabled = false;\n                        submitButton.innerHTML = 'Submit Request';\n                        submitButton.classList.remove('bscu-btn-disabled');\n                    }\n                })\n                .catch(error => {\n                    console.error('Error:', error);\n                    errorDetails.innerHTML = '<p>Unable to connect to the server. Please try again later.<\/p>';\n                    errorMessage.style.display = 'block';\n                    \/\/ Re-enable the button on error\n                    submitButton.disabled = false;\n                    submitButton.innerHTML = 'Submit Request';\n                    submitButton.classList.remove('bscu-btn-disabled');\n                });\n            }).catch(error => {\n                console.error('PDF generation error:', error);\n                errorDetails.innerHTML = '<p>Error generating PDF. Please try again.<\/p>';\n                errorMessage.style.display = 'block';\n                \/\/ Re-enable the button on error\n                submitButton.disabled = false;\n                submitButton.innerHTML = 'Submit Request';\n                submitButton.classList.remove('bscu-btn-disabled');\n            });\n        });\n        \n        \/\/ Function to generate PDF from form data\n        async function generatePDF(form) {\n            \/\/ Wait for jsPDF to be fully loaded\n            while (typeof window.jspdf === 'undefined') {\n                await new Promise(r => setTimeout(r, 100));\n            }\n            \n            const { jsPDF } = window.jspdf;\n            \n            \/\/ Create a new PDF document\n            const doc = new jsPDF();\n            const pageWidth = doc.internal.pageSize.getWidth();\n            const pageHeight = doc.internal.pageSize.getHeight();\n            \n            \/\/ Add colored header background\n            doc.setFillColor(0, 71, 95); \/\/ #00475f\n            doc.rect(0, 0, pageWidth, 40, 'F');\n            \n            \/\/ Add BrightStar Credit Union logo\n            \/\/ Since we can't directly add an SVG from an external URL, we'll create a placeholder for the logo\n            doc.setFillColor(255, 255, 255);\n            doc.setTextColor(255, 255, 255);\n            doc.setFontSize(16);\n            doc.text('BrightStar Credit Union', 20, 25);\n            \n            \/\/ Add document title\n            doc.setFontSize(16);\n            doc.setTextColor(0, 0, 0);\n            doc.text('Educator Interest Checking Upgrade Request', pageWidth\/2, 55, { align: 'center' });\n            \n            \/\/ Add current date\n            const today = new Date();\n            const dateStr = today.toLocaleDateString('en-US', { \n                year: 'numeric', \n                month: 'long', \n                day: 'numeric' \n            });\n            doc.setFontSize(10);\n            doc.setTextColor(100, 100, 100);\n            doc.text(`Date: ${dateStr}`, 20, 65);\n            \n            \/\/ Add form data\n            doc.setFontSize(12);\n            doc.setTextColor(0, 0, 0);\n            \n            \/\/ Member Information section\n            doc.setFontSize(14);\n            doc.setTextColor(0, 71, 95);\n            doc.text('Member Information', 20, 75);\n            \n            doc.setFontSize(11);\n            doc.setTextColor(0, 0, 0);\n            \n            let y = 85;\n            const lineHeight = 7;\n            \n            \/\/ Add member details\n            const memberInfo = [\n                `Name: ${document.getElementById('firstName').value} ${document.getElementById('lastName').value}`,\n                `Phone: ${document.getElementById('memberPhone').value}`,\n                `Email: ${document.getElementById('email').value}`,\n                `Educational Affiliation: ${document.getElementById('educationalAffiliation').value}`,\n                `Member Number: ${document.getElementById('memberNumber').value}`,\n                `Checking Account: ${document.getElementById('checkingAccount').value || 'Not provided'}`\n            ];\n            \n            memberInfo.forEach(info => {\n                doc.text(info, 20, y);\n                y += lineHeight;\n            });\n            \n            \/\/ Request Details section\n            y += 5;\n            doc.setFontSize(14);\n            doc.setTextColor(0, 71, 95);\n            doc.text('Request Details', 20, y);\n            y += 10;\n            \n            doc.setFontSize(11);\n            doc.setTextColor(0, 0, 0);\n            \n            const upgradeRequested = document.getElementById('upgradeRequest').checked;\n            const optInCourtesyPay = document.getElementById('optInCourtesyPay').checked;\n            \n            doc.text(`Upgrade Requested: ${upgradeRequested ? 'Yes' : 'No'}`, 20, y);\n            y += lineHeight;\n            doc.text(`Opt-In to Courtesy Pay for ATM\/Visa: ${optInCourtesyPay ? 'Yes' : 'No'}`, 20, y);\n            y += lineHeight;\n            \n            \/\/ Terms acknowledgment\n            \/\/ Only include Terms acknowledgment if the user opted in for Courtesy Pay\nif (optInCourtesyPay) {\n    y += 5;\n    doc.setFontSize(14);\n    doc.setTextColor(0, 71, 95);\n    doc.text('Terms Acknowledgment', 20, y);\n    y += 10;\n    \n    doc.setFontSize(11);\n    doc.setTextColor(0, 0, 0);\n    doc.text(\"Member has confirmed understanding of Courtesy Pay terms and conditions.\", 20, y);\n    y += lineHeight;\n}\n            \n            \/\/ Add UTM tracking info if available\n            const utmSource = document.getElementById('utm_source').value;\n            const utmCampaign = document.getElementById('utm_campaign').value;\n            \n            if (utmSource || utmCampaign) {\n                y += 20;\n                doc.setFontSize(9);\n                doc.setTextColor(150, 150, 150);\n                if (utmSource) doc.text(`Source: ${utmSource}`, 20, y);\n                y += 5;\n                if (utmCampaign) doc.text(`Campaign: ${utmCampaign}`, 20, y);\n            }\n            \n            \/\/ Add footer with background\n            doc.setFillColor(234, 234, 234); \/\/ #eaeaea\n            doc.rect(0, pageHeight - 20, pageWidth, 20, 'F');\n            \n            doc.setFontSize(10);\n            doc.setTextColor(0, 0, 0);\n            const currentYear = new Date().getFullYear();\n            doc.text(`BrightStar Credit Union \u00a9 ${currentYear}`, pageWidth\/2, pageHeight - 10, { align: 'center' });\n            \n            \/\/ Convert the PDF to a blob\n            const pdfBlob = doc.output('blob');\n            return pdfBlob;\n        }\n    });\n    \n    <\/script>\n    <!-- Success Modal -->\n    <div id=\"bscu-success-modal\" class=\"bscu-modal bscu-custom-modal\" style=\"display: none;\">\n        <div class=\"bscu-modal-content bscu-custom-modal-content\">\n            <span class=\"bscu-modal-close bscu-custom-close\">\u00d7<\/span>\n            <div class=\"bscu-modal-icon bscu-custom-icon\">\n                <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"48\" height=\"48\" viewbox=\"0 0 24 24\" fill=\"none\" stroke=\"#10b981\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                    <path d=\"M22 11.08V12a10 10 0 1 1-5.93-9.14\"><\/path>\n                    <polyline points=\"22 4 12 14.01 9 11.01\"><\/polyline>\n                <\/svg>\n            <\/div>\n            <h2 class=\"bscu-custom-title\">\u00a1\u00c9xito!<\/h2>\n            <p class=\"bscu-custom-message\">\u00a1Su solicitud de actualizaci\u00f3n del servicio de comprobaci\u00f3n de intereses para educadores se ha enviado correctamente!<\/p>\n            <button class=\"bscu-btn bscu-btn-primary bscu-modal-btn bscu-custom-btn\">DE ACUERDO<\/button>\n        <\/div>\n    <\/div>\n<\/div>\n\t\t<\/div>\n\t<\/div>\n<\/div><\/div><\/div><\/div><\/div><script id=\"script-row-unique-0\" data-row=\"script-row-unique-0\" type=\"text\/javascript\" class=\"vc_controls\">UNCODE.initRow(document.getElementById(\"row-unique-0\"));<\/script><\/div><\/div><\/div>","protected":false},"excerpt":{"rendered":"Your Educator Interest Checking upgrade request has been submitted successfully! There was a problem submitting your request. Please check the [...]","protected":false},"author":8,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-17324","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/demo2.mybscu.org\/es\/wp-json\/wp\/v2\/pages\/17324","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/demo2.mybscu.org\/es\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/demo2.mybscu.org\/es\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/demo2.mybscu.org\/es\/wp-json\/wp\/v2\/users\/8"}],"replies":[{"embeddable":true,"href":"https:\/\/demo2.mybscu.org\/es\/wp-json\/wp\/v2\/comments?post=17324"}],"version-history":[{"count":4,"href":"https:\/\/demo2.mybscu.org\/es\/wp-json\/wp\/v2\/pages\/17324\/revisions"}],"predecessor-version":[{"id":17372,"href":"https:\/\/demo2.mybscu.org\/es\/wp-json\/wp\/v2\/pages\/17324\/revisions\/17372"}],"wp:attachment":[{"href":"https:\/\/demo2.mybscu.org\/es\/wp-json\/wp\/v2\/media?parent=17324"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}