{"id":1484,"date":"2026-05-01T05:54:56","date_gmt":"2026-05-01T05:54:56","guid":{"rendered":"https:\/\/zupitex.in\/?page_id=1484"},"modified":"2026-05-01T05:56:19","modified_gmt":"2026-05-01T05:56:19","slug":"signup","status":"publish","type":"page","link":"https:\/\/zupitex.in\/index.php\/signup\/","title":{"rendered":"SignUp"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"1484\" class=\"elementor elementor-1484\" data-elementor-post-type=\"page\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-0d48f95 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"0d48f95\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-2ab9c40\" data-id=\"2ab9c40\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-e403d98 elementor-widget elementor-widget-shortcode\" data-id=\"e403d98\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-shortcode\">    \n    <style>\n        \/* Reusing your premium variables *\/\n       :root {\n            --primary-color: #768f14;\n            --hover-color: #000;\n            --bg-color: #ffffff;\n            --text-main: #2b2b2b;\n            --text-muted: #6b7280;\n            --input-border: #768f14;\n        }\n\n        .premium-signup-wrapper {\n            padding: 20px;\n            display: flex;\n            justify-content: center;\n        }\n\n        .premium-signup-container {\n            width: 100%;\n            max-width: 600px; \/* Slightly wider for the grid *\/\n            padding: 40px 30px;\n            background: var(--bg-color);\n            border-radius: 20px;\n            box-shadow: 0 10px 40px rgba(0, 0, 0, 0.08);\n            font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, sans-serif;\n            box-sizing: border-box;\n        }\n\n        .premium-signup-container h2 {\n            text-align: center;\n            color: var(--text-main);\n            margin: 0 0 8px 0;\n            font-size: 28px;\n            font-weight: 700;\n        }\n\n        .premium-signup-container p.subtitle {\n            text-align: center;\n            color: var(--text-muted);\n            margin-bottom: 30px;\n            font-size: 15px;\n        }\n\n        .premium-form-grid {\n            display: grid;\n            grid-template-columns: 1fr 1fr;\n            gap: 16px;\n        }\n\n        .premium-form-group {\n            margin-bottom: 20px;\n            position: relative;\n        }\n\n        .premium-form-group.full-width {\n            grid-column: 1 \/ -1;\n        }\n\n        .premium-form-group label {\n            display: block;\n            margin-bottom: 8px;\n            font-size: 14px;\n            color: var(--text-main);\n            font-weight: 600;\n        }\n\n        .premium-form-group input {\n            width: 100%;\n            padding: 14px 16px;\n            border: 2px solid var(--input-border);\n            border-radius: 12px;\n            font-size: 15px;\n            color: var(--text-main);\n            transition: all 0.3s ease;\n            box-sizing: border-box;\n            background: #fafafa;\n        }\n\n        .premium-form-group input:focus {\n            outline: none;\n            border-color: var(--hover-color);\n            background: #ffffff;\n            box-shadow: 0 0 0 4px rgba(24, 181, 179, 0.15);\n        }\n\n        .premium-signup-btn {\n            width: 100%;\n            padding: 16px;\n            background: var(--primary-color);\n            color: #fff;\n            border: none;\n            border-radius: 12px;\n            font-size: 16px;\n            font-weight: 600;\n            cursor: pointer;\n            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n            margin-top: 10px;\n        }\n\n        .premium-signup-btn:hover {\n            background: var(--hover-color);\n            transform: translateY(-2px);\n            box-shadow: 0 8px 20px rgba(24, 181, 179, 0.3);\n        }\n\n        \/* Toaster Notification - Specific to Signup to avoid conflicts *\/\n        #premium-signup-toast {\n            visibility: hidden;\n            min-width: 250px;\n            max-width: 350px;\n            background: #fff;\n            color: var(--text-main);\n            border-radius: 12px;\n            padding: 16px 24px;\n            position: fixed;\n            z-index: 9999;\n            top: 24px;\n            right: 24px;\n            font-size: 15px;\n            font-weight: 500;\n            box-shadow: 0 10px 30px rgba(0,0,0,0.1);\n            opacity: 0;\n            transform: translateX(120%);\n            transition: all 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);\n            display: flex;\n            align-items: center;\n            gap: 12px;\n        }\n\n        #premium-signup-toast.show {\n            visibility: visible;\n            opacity: 1;\n            transform: translateX(0);\n        }\n\n        #premium-signup-toast.error { border-left: 6px solid var(--primary-color); }\n        #premium-signup-toast.success { border-left: 6px solid #10b981; }\n\n        @media (max-width: 480px) {\n            .premium-form-grid { grid-template-columns: 1fr; gap: 0; }\n            .premium-signup-container { padding: 30px 20px; border-radius: 16px; }\n            #premium-signup-toast { top: 16px; right: 16px; left: 16px; min-width: auto; transform: translateY(-120%); }\n            #premium-signup-toast.show { transform: translateY(0); }\n        }\n    <\/style>\n\n    <div class=\"premium-signup-wrapper\">\n        <div class=\"premium-signup-container\">\n            <h2>Create an Account<\/h2>\n            <p class=\"subtitle\">Join us today to get started<\/p>\n            \n            <form id=\"premium-signup-form\" novalidate>\n                <input type=\"hidden\" id=\"security\" name=\"security\" value=\"74ba7ee9c6\" \/><input type=\"hidden\" name=\"_wp_http_referer\" value=\"\/index.php\/wp-json\/wp\/v2\/pages\/1484\" \/>                \n                <div class=\"premium-form-grid\">\n                    <div class=\"premium-form-group\">\n                        <label for=\"signup_fname\">First Name<\/label>\n                        <input type=\"text\" id=\"signup_fname\" name=\"signup_fname\" required placeholder=\"John\">\n                    <\/div>\n                    <div class=\"premium-form-group\">\n                        <label for=\"signup_lname\">Last Name<\/label>\n                        <input type=\"text\" id=\"signup_lname\" name=\"signup_lname\" required placeholder=\"Doe\">\n                    <\/div>\n                <\/div>\n\n                <div class=\"premium-form-group full-width\">\n                    <label for=\"signup_username\">Username<\/label>\n                    <input type=\"text\" id=\"signup_username\" name=\"signup_username\" required placeholder=\"johndoe123\">\n                <\/div>\n\n                <div class=\"premium-form-group full-width\">\n                    <label for=\"signup_email\">Email Address<\/label>\n                    <input type=\"email\" id=\"signup_email\" name=\"signup_email\" required placeholder=\"name@example.com\">\n                <\/div>\n                \n                <div class=\"premium-form-grid\">\n                    <div class=\"premium-form-group\">\n                        <label for=\"signup_password\">Password<\/label>\n                        <input type=\"password\" id=\"signup_password\" name=\"signup_password\" required placeholder=\"Create password\">\n                    <\/div>\n                    <div class=\"premium-form-group\">\n                        <label for=\"signup_password_confirm\">Confirm<\/label>\n                        <input type=\"password\" id=\"signup_password_confirm\" name=\"signup_password_confirm\" required placeholder=\"Repeat password\">\n                    <\/div>\n                <\/div>\n                \n                <button type=\"submit\" class=\"premium-signup-btn\">Sign Up<\/button>\n            <\/form>\n        <\/div>\n    <\/div>\n\n    <div id=\"premium-signup-toast\">\n        <span id=\"signup-toast-message\"><\/span>\n    <\/div>\n\n    <script>\n    document.addEventListener('DOMContentLoaded', function() {\n        const form = document.getElementById('premium-signup-form');\n        const toast = document.getElementById('premium-signup-toast');\n        const toastMessage = document.getElementById('signup-toast-message');\n        let toastTimeout;\n\n        function showToast(message, type) {\n            clearTimeout(toastTimeout);\n            toastMessage.textContent = message;\n            toast.className = '';\n            void toast.offsetWidth; \n            toast.className = 'show ' + type;\n            \n            toastTimeout = setTimeout(function() {\n                toast.classList.remove('show');\n            }, 4000);\n        }\n\n        form.addEventListener('submit', function(e) {\n            e.preventDefault();\n            \n            \/\/ Basic Frontend Validation\n            const fname = document.getElementById('signup_fname').value;\n            const lname = document.getElementById('signup_lname').value;\n            const username = document.getElementById('signup_username').value;\n            const email = document.getElementById('signup_email').value;\n            const pass1 = document.getElementById('signup_password').value;\n            const pass2 = document.getElementById('signup_password_confirm').value;\n            const emailRegex = \/^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$\/;\n\n            if(!fname || !lname || !username || !email || !pass1 || !pass2) {\n                return showToast('Please fill in all fields.', 'error');\n            }\n            if (!emailRegex.test(email)) {\n                return showToast('Please enter a valid email format.', 'error');\n            }\n            if(pass1 !== pass2) {\n                return showToast('Passwords do not match.', 'error');\n            }\n            if(pass1.length < 6) {\n                return showToast('Password must be at least 6 characters.', 'error');\n            }\n\n            const btn = form.querySelector('.premium-signup-btn');\n            const originalBtnText = btn.textContent;\n            btn.textContent = 'Creating Account...';\n            btn.disabled = true;\n\n            const formData = new FormData(form);\n            formData.append('action', 'premium_ajax_signup');\n\n            fetch('https:\/\/zupitex.in\/wp-admin\/admin-ajax.php', {\n                method: 'POST',\n                body: formData\n            })\n            .then(response => response.json())\n            .then(data => {\n                if (data.success) {\n                    showToast(data.data.message, 'success');\n                    setTimeout(() => {\n                        window.location.href = data.data.redirect_url;\n                    }, 1500);\n                } else {\n                    showToast(data.data.message, 'error');\n                    btn.textContent = originalBtnText;\n                    btn.disabled = false;\n                }\n            })\n            .catch(error => {\n                showToast('A server error occurred. Please try again.', 'error');\n                btn.textContent = originalBtnText;\n                btn.disabled = false;\n            });\n        });\n    });\n    <\/script>\n    \n    <\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"class_list":["post-1484","page","type-page","status-publish","hentry"],"_hostinger_reach_plugin_has_subscription_block":false,"_hostinger_reach_plugin_is_elementor":false,"_links":{"self":[{"href":"https:\/\/zupitex.in\/index.php\/wp-json\/wp\/v2\/pages\/1484","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/zupitex.in\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/zupitex.in\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/zupitex.in\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/zupitex.in\/index.php\/wp-json\/wp\/v2\/comments?post=1484"}],"version-history":[{"count":4,"href":"https:\/\/zupitex.in\/index.php\/wp-json\/wp\/v2\/pages\/1484\/revisions"}],"predecessor-version":[{"id":1497,"href":"https:\/\/zupitex.in\/index.php\/wp-json\/wp\/v2\/pages\/1484\/revisions\/1497"}],"wp:attachment":[{"href":"https:\/\/zupitex.in\/index.php\/wp-json\/wp\/v2\/media?parent=1484"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}