{"id":696,"date":"2026-06-25T15:16:03","date_gmt":"2026-06-25T12:16:03","guid":{"rendered":"https:\/\/schooly.wordpress.aait-d.com\/\/register-login\/"},"modified":"2026-06-25T15:16:03","modified_gmt":"2026-06-25T12:16:03","slug":"register-login","status":"publish","type":"page","link":"https:\/\/schooly.wordpress.aait-d.com\/register-login\/","title":{"rendered":"Login & Register"},"content":{"rendered":"        <div class=\"register-pand-auth-container rp-ltr\" id=\"rp-auth-container\" dir=\"ltr\">\n            <div class=\"register-pand-auth-box\">\n\n                <div class=\"register-pand-auth-header\">\n                    <button class=\"register-pand-tab-btn active\" data-tab=\"customer\">Login \/ Register<\/button>\n                    <button class=\"register-pand-tab-btn\" data-tab=\"school-login\">School Portal Login<\/button>\n                <\/div>\n\n                <div class=\"register-pand-auth-body\">\n                    <div class=\"register-pand-alert-msg\" style=\"display:none;\"><\/div>\n\n                    <!-- ===== CUSTOMER PANEL: Login + Register (inner toggle) ===== -->\n                    <div id=\"register-pand-customer-form\" class=\"register-pand-auth-form active\">\n\n                        <div class=\"register-pand-inner-tabs\">\n                            <button type=\"button\" class=\"register-pand-inner-tab-btn active\" data-inner-tab=\"login\">Login<\/button>\n                            <button type=\"button\" class=\"register-pand-inner-tab-btn\" data-inner-tab=\"register\">Create New Account<\/button>\n                        <\/div>\n\n                        <!-- ===== LOGIN FORM: Phone + Password ===== -->\n                        <form id=\"register-pand-login-form\" class=\"register-pand-inner-panel active\" autocomplete=\"off\">\n\n                                                        <div class=\"rp-demo-banner\">\u2699 Demo mode active<\/div>\n                            \n                            <div class=\"register-pand-form-group\">\n                                <label for=\"login_phone\">Phone Number <span class=\"required\">*<\/span><\/label>\n                                <div class=\"rp-phone-input-wrapper\">\n                                    <span class=\"rp-phone-prefix\">+20<\/span>\n                                    <input type=\"tel\" name=\"phone\" id=\"login_phone\" required\n                                        placeholder=\"1XXXXXXXXX\" autocomplete=\"tel\" inputmode=\"numeric\"\n                                        oninput=\"this.value=this.value.replace(\/[^0-9]\/g,'')\">\n                                <\/div>\n                            <\/div>\n\n                            <div class=\"register-pand-form-group\">\n                                <label for=\"login_pass\">Password <span class=\"required\">*<\/span><\/label>\n                                <div class=\"password-input-wrapper\">\n                                    <input type=\"password\" name=\"password\" id=\"login_pass\" required placeholder=\"Enter password\">\n                                    <span class=\"toggle-password\" data-target=\"login_pass\">\ud83d\udc41<\/span>\n                                <\/div>\n                                <div class=\"rp-forgot-pass-link\">\n                                    <a href=\"#\" class=\"rp-forgot-password-trigger\" data-phone-field=\"login_phone\">Forgot password?<\/a>\n                                <\/div>\n                            <\/div>\n\n                            <button type=\"submit\" class=\"register-pand-submit-btn\">\n                                <span class=\"btn-text\">Login<\/span>\n                                <span class=\"btn-spinner\" style=\"display:none;\"><\/span>\n                            <\/button>\n\n                        <\/form><!-- \/login -->\n\n                        <!-- ===== REGISTER FORM ===== -->\n                        <form id=\"register-pand-register-form\" class=\"register-pand-inner-panel\">\n\n                            <div class=\"register-pand-form-group\">\n                                <label for=\"reg_user\">Username <span class=\"required\">*<\/span><\/label>\n                                <input type=\"text\" name=\"username\" id=\"reg_user\" required placeholder=\"Example: ahmed_dev\">\n                            <\/div>\n\n                            <div class=\"register-pand-form-group\">\n                                <label for=\"reg_phone\">Phone Number <span class=\"required\">*<\/span><\/label>\n                                <div class=\"rp-phone-input-wrapper rp-phone-verify-wrapper\" id=\"reg-phone-wrapper\">\n                                    <span class=\"rp-phone-prefix\">+20<\/span>\n                                    <input type=\"tel\" name=\"phone\" id=\"reg_phone\" required\n                                        placeholder=\"1XXXXXXXXX\" autocomplete=\"tel\" inputmode=\"numeric\"\n                                        oninput=\"this.value=this.value.replace(\/[^0-9]\/g,'')\">\n                                    <span class=\"rp-phone-status\" id=\"reg-phone-status\"><\/span>\n                                <\/div>\n                                <p class=\"rp-phone-hint\">You&#039;ll receive a verification code via WhatsApp to confirm your number<\/p>\n                            <\/div>\n\n                            <div class=\"register-pand-form-group\">\n                                <label for=\"reg_email\">Email Address<\/label>\n                                <input type=\"email\" name=\"email\" id=\"reg_email\" placeholder=\"Example: name@example.com\">\n                            <\/div>\n\n                            <div class=\"register-pand-form-group\">\n                                <label for=\"reg_pass\">Password <span class=\"required\">*<\/span><\/label>\n                                <div class=\"password-input-wrapper\">\n                                    <input type=\"password\" name=\"password\" id=\"reg_pass\" required placeholder=\"Choose a strong password\">\n                                    <span class=\"toggle-password\" data-target=\"reg_pass\">\ud83d\udc41<\/span>\n                                <\/div>\n                            <\/div>\n\n                            \n                            <button type=\"submit\" class=\"register-pand-submit-btn\">\n                                <span class=\"btn-text\">Create Account<\/span>\n                                <span class=\"btn-spinner\" style=\"display:none;\"><\/span>\n                            <\/button>\n                        <\/form><!-- \/register -->\n\n                    <\/div><!-- \/customer -->\n\n                    <!-- ===== SCHOOL LOGIN FORM: Phone + Password (no registration) ===== -->\n                    <form id=\"register-pand-school-login-form\" class=\"register-pand-auth-form\" autocomplete=\"off\">\n\n                        <div class=\"register-pand-form-group\">\n                            <label for=\"school_login_phone\">Phone Number <span class=\"required\">*<\/span><\/label>\n                            <div class=\"rp-phone-input-wrapper\">\n                                <span class=\"rp-phone-prefix\">+20<\/span>\n                                <input type=\"tel\" name=\"phone\" id=\"school_login_phone\" required\n                                    placeholder=\"1XXXXXXXXX\" autocomplete=\"tel\" inputmode=\"numeric\"\n                                    oninput=\"this.value=this.value.replace(\/[^0-9]\/g,'')\">\n                            <\/div>\n                        <\/div>\n\n                        <div class=\"register-pand-form-group\">\n                            <label for=\"school_login_pass\">Password <span class=\"required\">*<\/span><\/label>\n                            <div class=\"password-input-wrapper\">\n                                <input type=\"password\" name=\"password\" id=\"school_login_pass\" required\n                                    placeholder=\"Enter password\" autocomplete=\"current-password\">\n                                <span class=\"toggle-password\" data-target=\"school_login_pass\">\ud83d\udc41<\/span>\n                            <\/div>\n                            <!--<div class=\"rp-forgot-pass-link\">-->\n                            <!--    <a href=\"#\" class=\"rp-forgot-password-trigger\" data-phone-field=\"school_login_phone\">\u0646\u0633\u064a\u062a \u0643\u0644\u0645\u0629 \u0627\u0644\u0645\u0631\u0648\u0631\u061f<\/a>-->\n                            <!--<\/div>-->\n                        <\/div>\n\n                        <button type=\"submit\" class=\"register-pand-submit-btn\">\n                            <span class=\"btn-text\">School Portal Login<\/span>\n                            <span class=\"btn-spinner\" style=\"display:none;\"><\/span>\n                        <\/button>\n\n                    <\/form><!-- \/school-login -->\n\n                <\/div>\n            <\/div>\n        <\/div>\n\n        <!-- ===== OTP POPUP MODAL (Registration only) ===== -->\n        <div id=\"rp-otp-modal\" class=\"rp-otp-modal-overlay rp-ltr\" role=\"dialog\" aria-modal=\"true\" style=\"display:none;\" dir=\"ltr\">\n            <div class=\"rp-otp-modal-box\">\n                <button class=\"rp-otp-modal-close\" type=\"button\" aria-label=\"Close\">&times;<\/button>\n\n                <div class=\"rp-otp-modal-icon\">\ud83d\udcf1<\/div>\n                <h3 class=\"rp-otp-modal-title\">Verify Your Phone Number<\/h3>\n                <p class=\"rp-otp-modal-sub\"><\/p>\n\n                                <div class=\"rp-demo-banner\" style=\"margin-bottom:18px;\">\n                    \u2699 Demo mode \u2014 Code: <strong>123456<\/strong>\n                <\/div>\n                \n                <div class=\"rp-otp-boxes\" dir=\"ltr\">\n                    <input type=\"text\" class=\"rp-otp-box rp-reg-otp-box\" maxlength=\"1\" inputmode=\"numeric\" pattern=\"[0-9]\" autocomplete=\"one-time-code\">\n                    <input type=\"text\" class=\"rp-otp-box rp-reg-otp-box\" maxlength=\"1\" inputmode=\"numeric\" pattern=\"[0-9]\">\n                    <input type=\"text\" class=\"rp-otp-box rp-reg-otp-box\" maxlength=\"1\" inputmode=\"numeric\" pattern=\"[0-9]\">\n                    <input type=\"text\" class=\"rp-otp-box rp-reg-otp-box\" maxlength=\"1\" inputmode=\"numeric\" pattern=\"[0-9]\">\n                    <input type=\"text\" class=\"rp-otp-box rp-reg-otp-box\" maxlength=\"1\" inputmode=\"numeric\" pattern=\"[0-9]\">\n                    <input type=\"text\" class=\"rp-otp-box rp-reg-otp-box\" maxlength=\"1\" inputmode=\"numeric\" pattern=\"[0-9]\">\n                <\/div>\n\n                <div class=\"rp-otp-modal-error\" style=\"display:none;\"><\/div>\n\n                <button type=\"button\" id=\"rp-reg-verify-otp-btn\" class=\"register-pand-submit-btn\" style=\"margin-top:20px;\">\n                    <span class=\"btn-text\">Confirm Code<\/span>\n                    <span class=\"btn-spinner\" style=\"display:none;\"><\/span>\n                <\/button>\n\n                <div class=\"rp-otp-footer\" style=\"margin-top:16px;\">\n                    <span id=\"rp-reg-resend-timer\">Resend in <strong id=\"rp-reg-countdown\">60<\/strong> seconds<\/span>\n                    <a href=\"#\" id=\"rp-reg-resend-btn\" style=\"display:none;\">Resend Code<\/a>\n                <\/div>\n            <\/div>\n        <\/div>\n\n        <!-- ===== FORGOT PASSWORD MODAL (Phone \u2192 OTP \u2192 New Password) ===== -->\n        <div id=\"rp-forgot-modal\" class=\"rp-otp-modal-overlay rp-ltr\" role=\"dialog\" aria-modal=\"true\" style=\"display:none;\" dir=\"ltr\">\n            <div class=\"rp-otp-modal-box\">\n                <button class=\"rp-otp-modal-close\" type=\"button\" aria-label=\"Close\">&times;<\/button>\n\n                <div class=\"rp-otp-modal-icon\">\ud83d\udd11<\/div>\n                <h3 class=\"rp-otp-modal-title\">Recover Password<\/h3>\n\n                <!-- Step 1: Phone number -->\n                <div class=\"rp-fp-step rp-fp-step-phone\">\n                    <p class=\"rp-otp-modal-sub\">Enter the phone number registered to your account, and you&#039;ll receive a verification code via WhatsApp.<\/p>\n\n                    <div class=\"register-pand-form-group\" style=\"text-align:right;\">\n                        <div class=\"rp-phone-input-wrapper\">\n                            <span class=\"rp-phone-prefix\">+20<\/span>\n                            <input type=\"tel\" id=\"fp_phone\" placeholder=\"1XXXXXXXXX\" autocomplete=\"tel\" inputmode=\"numeric\"\n                                oninput=\"this.value=this.value.replace(\/[^0-9]\/g,'')\">\n                        <\/div>\n                    <\/div>\n\n                    <div class=\"rp-otp-modal-error rp-fp-error rp-fp-error-phone\" style=\"display:none;\"><\/div>\n\n                    <button type=\"button\" id=\"rp-fp-send-otp-btn\" class=\"register-pand-submit-btn\">\n                        <span class=\"btn-text\">Send Verification Code<\/span>\n                        <span class=\"btn-spinner\" style=\"display:none;\"><\/span>\n                    <\/button>\n                <\/div>\n\n                <!-- Step 2: OTP -->\n                <div class=\"rp-fp-step rp-fp-step-otp\" style=\"display:none;\">\n                    <p class=\"rp-otp-modal-sub rp-fp-otp-sub\"><\/p>\n\n                                        <div class=\"rp-demo-banner\" style=\"margin-bottom:18px;\">\n                        \u2699 Demo mode \u2014 Code: <strong>123456<\/strong>\n                    <\/div>\n                    \n                    <div class=\"rp-otp-boxes\" dir=\"ltr\">\n                        <input type=\"text\" class=\"rp-otp-box rp-fp-otp-box\" maxlength=\"1\" inputmode=\"numeric\" pattern=\"[0-9]\" autocomplete=\"one-time-code\">\n                        <input type=\"text\" class=\"rp-otp-box rp-fp-otp-box\" maxlength=\"1\" inputmode=\"numeric\" pattern=\"[0-9]\">\n                        <input type=\"text\" class=\"rp-otp-box rp-fp-otp-box\" maxlength=\"1\" inputmode=\"numeric\" pattern=\"[0-9]\">\n                        <input type=\"text\" class=\"rp-otp-box rp-fp-otp-box\" maxlength=\"1\" inputmode=\"numeric\" pattern=\"[0-9]\">\n                        <input type=\"text\" class=\"rp-otp-box rp-fp-otp-box\" maxlength=\"1\" inputmode=\"numeric\" pattern=\"[0-9]\">\n                        <input type=\"text\" class=\"rp-otp-box rp-fp-otp-box\" maxlength=\"1\" inputmode=\"numeric\" pattern=\"[0-9]\">\n                    <\/div>\n\n                    <div class=\"rp-otp-modal-error rp-fp-error rp-fp-error-otp\" style=\"display:none;\"><\/div>\n\n                    <button type=\"button\" id=\"rp-fp-verify-otp-btn\" class=\"register-pand-submit-btn\" style=\"margin-top:20px;\">\n                        <span class=\"btn-text\">Confirm Code<\/span>\n                        <span class=\"btn-spinner\" style=\"display:none;\"><\/span>\n                    <\/button>\n\n                    <div class=\"rp-otp-footer\" style=\"margin-top:16px;\">\n                        <span id=\"rp-fp-resend-timer\">Resend in <strong id=\"rp-fp-countdown\">60<\/strong> seconds<\/span>\n                        <a href=\"#\" id=\"rp-fp-resend-btn\" style=\"display:none;\">Resend Code<\/a>\n                    <\/div>\n                <\/div>\n\n                <!-- Step 3: New password -->\n                <div class=\"rp-fp-step rp-fp-step-reset\" style=\"display:none;\">\n                    <p class=\"rp-otp-modal-sub\">Your phone number has been verified, enter your new password.<\/p>\n\n                    <div class=\"register-pand-form-group\" style=\"text-align:right;\">\n                        <label for=\"fp_new_pass\">New Password<\/label>\n                        <div class=\"password-input-wrapper\">\n                            <input type=\"password\" id=\"fp_new_pass\" placeholder=\"Choose a strong password\">\n                            <span class=\"toggle-password\" data-target=\"fp_new_pass\">\ud83d\udc41<\/span>\n                        <\/div>\n                    <\/div>\n\n                    <div class=\"register-pand-form-group\" style=\"text-align:right;\">\n                        <label for=\"fp_new_pass_confirm\">Confirm Password<\/label>\n                        <div class=\"password-input-wrapper\">\n                            <input type=\"password\" id=\"fp_new_pass_confirm\" placeholder=\"Re-enter password\">\n                            <span class=\"toggle-password\" data-target=\"fp_new_pass_confirm\">\ud83d\udc41<\/span>\n                        <\/div>\n                    <\/div>\n\n                    <div class=\"rp-otp-modal-error rp-fp-error rp-fp-error-reset\" style=\"display:none;\"><\/div>\n\n                    <button type=\"button\" id=\"rp-fp-reset-btn\" class=\"register-pand-submit-btn\">\n                        <span class=\"btn-text\">Change Password<\/span>\n                        <span class=\"btn-spinner\" style=\"display:none;\"><\/span>\n                    <\/button>\n                <\/div>\n\n            <\/div>\n        <\/div>\n\n        <script>\n        (function() {\n            function rpCenter() {\n                var c = document.getElementById('rp-auth-container');\n                if (!c) return;\n                \/\/ Find the tallest header\/nav above the content area\n                var usedH = 0;\n                ['header','#masthead','#site-header','.site-header','.header-main','nav.navbar','.navbar'].forEach(function(sel){\n                    var el = document.querySelector(sel);\n                    if (el && el.offsetHeight > usedH) usedH = el.offsetHeight;\n                });\n                var footerH = 0;\n                ['footer','#colophon','#site-footer','.site-footer'].forEach(function(sel){\n                    var el = document.querySelector(sel);\n                    if (el && el.offsetHeight > footerH) footerH = el.offsetHeight;\n                });\n                var available = window.innerHeight - usedH - footerH;\n                c.style.minHeight = Math.max(available, 480) + 'px';\n            }\n            rpCenter();\n            window.addEventListener('resize', rpCenter);\n        })();\n        <\/script>\n        \n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-696","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/schooly.wordpress.aait-d.com\/wp-json\/wp\/v2\/pages\/696","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/schooly.wordpress.aait-d.com\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/schooly.wordpress.aait-d.com\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/schooly.wordpress.aait-d.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/schooly.wordpress.aait-d.com\/wp-json\/wp\/v2\/comments?post=696"}],"version-history":[{"count":0,"href":"https:\/\/schooly.wordpress.aait-d.com\/wp-json\/wp\/v2\/pages\/696\/revisions"}],"wp:attachment":[{"href":"https:\/\/schooly.wordpress.aait-d.com\/wp-json\/wp\/v2\/media?parent=696"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}