@extends('reachassuree_web/layouts.main')
@section('title', $data['title'])
@section('content')

    <style>
        .input-group-addon {
            padding: 10px 10px;
            font-size: 16px;
            font-weight: 400;
            line-height: 1;
            height: 40px;
            color: #555;
            text-align: center;
            background-color: #eee;
            border: 1px solid #ccc;
            white-space: nowrap;
            vertical-align: middle;
            display: table-cell;
            border-radius: 0.6rem;
        }

        .prefix input {
            border-radius: 0.6rem
        }

        button.swal2-confirm.swal2-styled {
            font-family: 'Inter';
            padding: 10px 22px;
            line-height: 20px;
            margin-top: 10px;
        }

        h2#swal2-title {
            font-family: 'Inter';
            font-weight: 700;
            color: #373737;
        }

        div#swal2-content {
            font-family: inter;
            font-weight: 500;
            color: #252525;
        }

    .swal2-styled.swal2-confirm{
            background-color: #023E8A;
        }

        input[type="radio"] {
            display: none;
        }

        input[type="radio"]+label {
            display: inline-block;
            padding: 5px 20px;
            background-color: #f1f5fe;
            border-radius: 0.8rem;
            cursor: pointer;
        }

        input[type="radio"]:checked+label {
            background-color: #023e8a;
            color: #fff;
        }

        #agent_sub_domain_url_bottom {
            display: none;
        }

        #modalOtpVerificationLabel span {
            font-size: 15px;
            font-weight: 600;
        }

        .form-check {
            display: block;
            min-height: 1.5rem;
            padding-left: 0.8em !important;
            margin-bottom: 0.125rem;
        }

        button#btnOtpVerify {
            margin-left: 10px;
        }

        button#changeDetailSubmitBtn {
            margin-left: 10px;
        }

        .help-block.with-errors.mobileotpError,
        .help-block.with-errors.emailotpError,
        .help-block.with-errors.mobileErrors,
        .help-block.with-errors.usernameError,
        .help-block.with-errors.passwordError,
        .help-block.with-errors.agentPasswordError,
        .help-block.with-errors.subdomainError,
        .help-block.with-errors.emailError,
        .help-block.with-errors.subDomainError,
        .help-block.with-errors.userNameErrors,
        .help-block.with-errors.emailErrors,
        .help-block.with-errors.testErrors {
            color: #dc3545;
            margin-top: 0px;
            font-size: 14px;
            /* margin-bottom: 1rem; */
        }

        .user-form-content {
            max-width: 75% !important;
            border: 1px solid #dbdbdb;
        }

        .modal-body#successPopup {
            position: unset;
            flex: 1 1 auto;
            padding: 0rem;
        }

        .form-control {
            margin-bottom: 5px;
            background: white;
            height: 40px;
        }

        tr td:nth-child(2) {
            color: black;
        }

        tr th:nth-child(3),
        tr th:nth-child(4),
        tr th:nth-child(5),
        tr th:nth-child(6),
        tr td:nth-child(3),
        tr td:nth-child(4),
        tr td:nth-child(5),
        tr td:nth-child(6),
        tr td:nth-child(7),
        tr td:nth-child(8),
        tr td:nth-child(9),
        tr td:nth-child(10) {
            color: #7f8387;
            background-color: #e4e4e4;
            border: 0.5px solid #bdbcbc;
        }

        .accordion-item:last-of-type .accordion-button.collapsed,
        .accordion-button:not(.collapsed),
        .accordion-button:focus {
            box-shadow: none;
            color: #616161;
            font-weight: 700;
            background-color: #F1F5FE;
        }

        tbody tr:last-child td {
            background-color: transparent;
        }

        .register-form {
            text-align: center;
        }

        .form-label {
            margin-bottom: 0.3rem;
            font-weight: 500;
            font-size: 18px;
            color: #213438;
        }

        .copy-right-content {
            border-top: 0px;
            font-weight: 700;
            border-top: 1px solid #e9e9e9;
        }

        .highlight-column {
            color: #060607;
        }

        td.table_title {
            color: #4A148C;
            text-align: right;
            padding-right: 5px;
        }

        td {
            text-align: center;
        }

        .second-button {
            display: flex;
            align-items: center;
            justify-content: space-between;
        }

        .form-control:disabled,
        .form-control[readonly]:focus {
            background-color: #f4f4f4;
        }

        tr td:first-child {
            white-space: nowrap;
        }

        #registerSubmitBtn {
            float: right;
        }

        /* gautam start new css add */
        #registerSubmitBtn:disabled {
            cursor: not-allowed;
            opacity: 0.6;
            pointer-events: none !important;
        }

        #registerSubmitBtn.btn-disabled {
            background-color: #226dcf;
            color: #ffffff;
            cursor: not-allowed;
            pointer-events: none;
        }

        #activationSuccessMsg {
            margin-top: 10px;
            font-weight: 500;
        }

        /* gautam end new css add */

        .line-heighlight {
            font-size: 14px;
            color: #023E8A;
            font-weight: 500;
        }

        button.btn.btn-light {
            padding: 0 10px;
            height: 36px;
        }

        .payNowBtn {
            color: white;
        }

        .pricing-table-header1 th {
            color: #ffffff;
            text-align: center;
            background: #023E8A !important;
        }

        .pricing-table-header2 tr {
            color: #ffffff;
            text-align: left;
            background: #1a62be !important;
        }

        .pricing-detail-title-1 {
            text-align: center;
            border: 1px solid;
            color: #023E8A;
            font-weight: bold;
        }

        .pricing-detail-title-2 {
            text-align: center;
            border: 1px solid;
            color: #023E8A;
            font-weight: bold;
            background-color: #f1f5fe !important;
        }

        .pricing-detail-title-3 {
            text-align: center;
            border: 1px solid;
            color: #023E8A !important;
            font-weight: bold;
        }

        .far-fa-eye {
            margin-left: -30px;
            cursor: pointer;
        }

        select#agent_gender_id {
            padding: 6px 15px;
        }

        .form-control[readonly] {
            background-color: transparent !important;
        }

        .domainurl {
            background-color: transparent;
            height: 20px;
            width: 295px;
            color: #023E8A;
            font-size: 14px;
        }

        .terms-condition .form-group {
            display: flex;
            margin: 5px 0;
            align-items: baseline;
        }

        .modal-content {
            border-radius: 1rem;
        }

        .btn-primary {
            border-color: #023E8A;
            background-color: #023E8A;
        }

        .btn-primary:hover {
            color: #fff;
            background-color: #023E8A;
            border-color: #023E8A;
        }

        .btn-primary.disabled,
        .btn-primary:disabled {
            color: #fff;
            background-color: #023E8A;
            border-color: #023E8A;
        }

        p#msgformOtpVerification,
        p#msgformChangeVerification {
            text-align: center;
            font-size: 14px;
            color: #e12d2d;
            margin-bottom: 5px;
        }

        @media (max-width:1199px) {
            #agent_sub_domain_url {
                display: none;
            }

            #agent_sub_domain_url_bottom {
                display: block;
            }
        }

        @media (max-width:992px) {
            #modalDemoPlanDetail .modal-content {
                width: unset;
            }

            tr td:first-child {
                white-space: unset;
            }

            .modal#modalDemoPlanDetail {
                overflow-x: unset;
            }
        }

        @media (max-width:575px) {
            #agent_sub_domain_url {
                display: block;
            }

            #agent_sub_domain_url_bottom {
                display: none;
            }

            #formOtpVerification h6 {
                text-align: center;
            }
        }

        @media (max-width:520px) {
            button#btnOtpVerify {
                margin: 5px 0 0;
            }
        }

        @media (max-width:496px) {
            .second-button {
                font-size: 14px;
            }

            .second-button .btn {
                font-size: 0.9rem;
            }
        }

        button#confirmPaymentBtn {
            background-color: #1e7e34;
            border-color: #1e7e34;
            padding: 5px 25px;
            border-radius: 10px;
        }

        p#msgformChangeVerificationData {
            font-size: 14px;
        }

        .payment {
            border: unset;
            height: unset;
            border-radius: unset;
            background: unset;
        }

        .payment_header {
            background: #1e7e34;
            padding: 20px;
            border-radius: 15px 15px 0px 0px;
        }

        .check {
            margin: 0px auto;
            width: 50px;
            height: 50px;
            border-radius: 100%;
            background: #fff;
            text-align: center;
        }

        .list-unstyled {
            margin-bottom: 0;
        }

        .check i {
            vertical-align: middle;
            line-height: 50px;
            font-size: 30px;
        }

        .content {
            text-align: center;
            margin: 10px 10px 35px 10px;
        }

        .content h1 {
            font-size: 25px;
            padding-top: 25px;
        }

        .content a {
            width: 200px;
            height: 35px;
            color: #fff !important;
            border-radius: 30px;
            padding: 5px 10px;
            background: #1e7e34;
            transition: all ease-in-out 0.3s;
        }

        .content a:hover {
            text-decoration: none;
            background: #000;
        }

        .invalid-feedback {
            display: block;
        }

        .modal-dialog .modal-footer {
            padding: 1rem 0px 0px 0px;
        }

        .modal-dialog .modal-footer .changedet {
            margin: 0px;
        }

        .modal-dialog .modal-footer p.h4 {
            margin-right: 12px;
            margin-bottom: 0px;
        }

        .btn-youtube-pulse {
            background: #ff0000;
            color: white;
            position: fixed;
            bottom: 20px;
            right: 30px;
            font-size: 30px;
            display: flex;
            justify-content: center;
            align-items: center;
            z-index: 99;
            width: 0;
            height: 0;
            line-height: 20px;
            padding: 20px;
            text-decoration: none;
            border-radius: 50%;
            animation-name: pulse;
            animation-duration: 1.5s;
            animation-timing-function: ease-out;
            animation-iteration-count: infinite;
        }

        .btn-youtube-pulse-border {
            bottom: 120px;
            left: 27px;
            animation-play-state: paused;
        }

        .btn-youtube-pulse-border::before {
            content: "";
            position: absolute;
            border-radius: 50%;
            padding: 15px;
            border: 5px solid #ff0000;
            opacity: 0.75;
            animation-name: youtube-pulse-border;
            animation-duration: 1.3s;
            animation-timing-function: ease-out;
            animation-iteration-count: infinite;
        }

        .btn-youtube-pulse:hover {
            color: white !important;
        }

        #msgSubmit {
            margin-top: 0 !important;
        }

        #agent_email::placeholder,
        #agent_username::placeholder,
        #agent_sub_domain::placeholder {
            text-transform: none;
            /* Reset the text-transform for placeholder */
        }

        @media (max-width:1199px) {
            .setYMargin {
                margin: 0 !important;
            }
        }

        @media (max-width:768px) {
            .imageSection {
                display: none !important;
            }
        }

        @media (max-width:640px) {
            .user-form-content {
                max-width: 90% !important;
            }

            .setYMargin {
                padding: 10px !important;
            }
        }

        @keyframes youtube-pulse-border {
            0% {
                opacity: 0;
            }

            75% {
                opacity: 0;
            }

            100% {
                opacity: 0;
            }
        }
    </style>

    <div class="page-title-area">
        <div class="container">
            <div class="page-title-content">
                <h2>Free Registration</h2>
                <ul>
                    <li><a href="{{ route('home.page') }}">Home</a></li>
                    <li class="active">Free Registration</li>
                </ul>
            </div>
        </div>

        <img src="{{ asset('rassets/images/subscribe-shape-1.png') }}" alt="Image" class="shape shape-1" data-speed="0.04"
            data-revert="true">
        <img src="{{ asset('rassets/images/subscribe-shape-2.png') }}" alt="Image" class="shape shape-2"
            data-speed="0.04" data-revert="true">
    </div>

    <div class="row justify-content-end">
        <a href="javascript:void(0);" onclick="return learningVideo()" class="btn-youtube-pulse btn-youtube-pulse-border">
            <i class="mdi mdi-youtube"></i>
        </a>
    </div>

    {{-- gautam starting changes in old code --}}
    <!-- Start Contact Area -->
    <div class="container">
        <section class="pb-100 pt-100">
            <form id="register-Form" autocomplete="off" method="POST">
                @csrf
                <input type="hidden" id="agent_id" name="agent_id" />
                <input type="hidden" id="register_form_type" name="register_form_type" value="demo" />
                <input type="hidden" id="register_code" name="register_code" value="{{ $data['code'] }}" />
                {{-- gautam add new hidden filed  --}}
                <input type="hidden" id="user_ipv4" name="user_ipv4" value="">
                <input type="hidden" id="user_ipv6" name="user_ipv6" value="">
                <input type="hidden" id="user_region" name="user_region">
                <input type="hidden" id="user_country" name="user_country">
                <input type="hidden" id="user_isp" name="user_isp">
                {{-- gautam end new hidden filed  --}}
                <input type="hidden" name="cf-turnstile-response" id="cf-turnstile-response">
                <div class="user-form-content p-4">
                    <div class="row" style="align-items: center;">
                        <div class="col-6 p-4 imageSection">
                            <img src="{{ asset('assets/images/register_vector.svg') }}" alt="">
                        </div>
                        <div class="col-6 p-4 my-5 setYMargin" style="display: grid;">
                            <div class="form-group mb-2">
                                <label for="agent_mobile_number" class="form-label">Mobile Number<span
                                        class="text-danger">*</span></label>
                                <div class="input-group prefix">
                                    <span class="input-group-addon rounded-start">+91</span>
                                    <input type="text" name="agent_mobile_number" id="agent_mobile_number"
                                        onkeypress="return isNumber(event);" class="form-control rounded-end"
                                        placeholder="Mobile number" autocomplete="off">
                                    <div id="mobileSuccessMessage" class="invalid-feedback help-block with-errors mobileErrors"></div>
                                </div>
                            </div>

                            <div class="form-group mb-2">
                                <label for="agent_email" class="form-label">Email Address<span
                                        class="text-danger">*</span></label>
                                <input type="text" name="agent_email" id="agent_email" class="form-control rounded-3"
                                    placeholder="Enter Your E-Mail" autocomplete="off" style="text-transform: lowercase;">
                                <div class="invalid-feedback help-block with-errors emailErrors"></div>
                            </div>
                            
                            <div class="form-group mb-2">
                                <div class="cf-turnstile" data-sitekey="{{ config('services.turnstile.site_key') }}" data-theme="light" data-size="normal" data-callback="onTurnstileSuccess"></div>
                                <div class="invalid-feedback help-block with-errors testErrors"></div>
                            </div>
                            
                            <div class="form-group">
                                <button type="submit" class="default-btn w-100 justify-content-center mt-3 rounded"
                                    id="registerSubmitBtn">Register</button>
                            </div>
                        </div>
                        <div id="activationSuccessMsg" class="alert alert-success text-center" style="display: none;"></div>
                    </div>
                </div>
            </form>
        </section>
    </div>
    {{-- gautam starting changes in old code --}}

    <div class="modal fade" id="modalOtpVerification" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1"
        role="dialog" aria-labelledby="modalOtpVerificationLabel" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered modal-xl" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="modalOtpVerificationLabel">OTP Verify <span>(You can verify with either your
                            Mobile number or email. Feel free to fill both details if you prefer<span
                                class="text-danger">*</span>)</span></h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"
                        id="closeModal"></button>
                </div>

                <form id="formOtpVerification">
                    <input type="hidden" id="mobile_otp_id" name="mobile_otp_id" class="form-control">
                    <input type="hidden" id="form_type" name="form_type" value="demo" />
                    <input type="hidden" id="code" name="code" value="{{ $data['code'] }}" />
                    @csrf
                    <div class="modal-body">
                        <div class="mb-3 row pt-1 radiobtn">
                            <div class="col-md-4">
                                <input class="form-check-inline" type="radio" name="select_one" id="check_mobile"
                                    value="1" checked>
                                <label class="form-check-label me-2" for="check_mobile">Mobile</label>
                                <input class="form-check-inline" type="radio" name="select_one" id="check_email"
                                    value="2">
                                <label class="form-check-label me-2" for="check_email">Email</label>
                            </div>
                            <div class="col-md-8" style="display: flex; align-items: center; justify-content: end;">
                                <h6 class="mb-0"
                                    style="font-size: 15px;text-align: right;font-weight: 700;background-color: #f1f5fe;padding: 2px 15px;border-radius: 6px;color: #023e8a;">
                                    You can verify with your Mobile number or email. You can also provide both details.</h6>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-lg-12 col-sm-12" id="mobileOtpArea">
                                <div class="form-group">
                                    <input type="text" name="mobile_otp" id="mobile_otp" maxLength="4"
                                        data-value="1" class="form-control form-control-lg text-center two-step"
                                        data-error="Mobile number otp" placeholder="Mobile OTP" value=""
                                        onkeypress="return isNumber(event);" autocomplete="off">
                                    <div class="invalid-feedback help-block with-errors"></div>

                                </div>
                            </div>
                            <div class="col-lg-12 col-sm-12" id="emailOtpArea">
                                <div class="form-group">
                                    <input type="text" name="email_otp" id="email_otp" data-value="2" maxLength="4"
                                        class="form-control form-control-lg text-center two-step"
                                        data-error="Please enter your email otp" placeholder="Email OTP" value=""
                                        onkeypress="return isNumber(event);" autocomplete="off">
                                    <div class="invalid-feedback help-block with-errors"></div>
                                </div>
                            </div>
                        </div>

                        <p id="msgformOtpVerification"></p>

                        <div class="row">
                            <div class="col-lg-12 bt-1">
                                <div class="second-button">
                                    <a href="javascript:void(0);" onclick="changeVerificationData();">Want to change email
                                        or mobile ?</a>
                                    <div class="d-flex">
                                        <button class="btn btn-primary clear-search d-flex" id="ResendOTP"><i
                                                class="ri-arrow-right-s-line"></i>Resend OTP</button>
                                        <button type="submit" class="btn btn-primary d-flex" id="btnOtpVerify"><i
                                                class="ri-arrow-right-s-line"></i>Verify</button>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="d-flex">
                                <div class="clearfix"></div>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <div class="modal fade" id="modalChangeVerificationData" data-bs-backdrop="static" data-bs-keyboard="false"
        tabindex="-1" role="dialog" aria-labelledby="modalChangeVerificationDataLabel" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered modal-lg" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="modalChangeVerificationDataLabel">Change Detail</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>

                <form id="formChangeVerificationData" class="needs-validation" novalidate>
                    @csrf
                    <input type="hidden" id="agent_change_id" name="agent_change_id" class="form-control">
                    <div class="modal-body">
                        <div class="row">
                            <div class="col-lg-6 col-sm-6">
                                <h6>New Email Address</h6>
                                <div class="form-group">
                                    <input type="text" name="agent_change_email" id="agent_change_email" required
                                        data-error="Please enter your email" class="form-control"
                                        placeholder="Email address" onkeypress="return emailvalidation(event);">
                                    <div class="invalid-feedback help-block with-errors"
                                        id="invalid_feedback_change_email"></div>
                                </div>
                            </div>
                            <div class="col-lg-6 col-sm-6">
                                <h6>New Mobile number</h6>
                                <div class="form-group">
                                    <input type="text" name="agent_change_mobile_number"
                                        id="agent_change_mobile_number" required data-error="Mobile number"
                                        class="form-control" minlength="5" maxlength="10" placeholder="Mobile number"
                                        onkeypress="return isNumber(event);">
                                    <div class="invalid-feedback help-block with-errors change-mobile-errors"></div>
                                </div>
                            </div>
                        </div>

                        <p id="msgformChangeVerificationData" class="h3 text-danger text-center"></p>

                        <div class="modal-footer">
                            <div class="d-flex">
                                <a class="btn btn-primary clear-search d-flex" onclick="closeChangeDetail()"><i
                                        class="ri-arrow-right-s-line"></i>Close</a>
                                <button type="submit" class="btn btn-primary d-flex" id="changeDetailSubmitBtn"
                                    style="margin-left: 10px;pointer-events: all; cursor: pointer;"><i
                                        class="ri-arrow-right-s-line"></i>Save</button>
                            </div>
                            <div class="clearfix"></div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <div class="modal fade" id="modalDemoPlanDetail" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1"
        role="dialog" aria-labelledby="modalDemoPlanDetailLabel" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered modal" role="document">
            <div class="modal-content">
                <div class="modal-body" id="successPopup">
                    <div class="payment">
                        <div class="payment_header">
                            <div class="check"><i class="ri-check-line"></i></div>
                        </div>
                        <div class="content">
                            <h1>Congratulations, your account has been successfully created.</h1>
                            <p>Credential sent to your mail</p>

                            @if ($data['hasPayment'] == 1)
                                <a id="confirmPaymentBtn">Check out your agent admin panel</a>
                            @endif
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

@endsection

@section('custom-scripts')
    <script src="{{ asset('rassets/js/bootstrap.bundle.min.js') }}"></script>
    <script src="{{ asset('rassets/js/register-form-script.js') }}"></script>
    <script src="https://challenges.cloudflare.com/turnstile/v0/api.js" async defer></script>
    <script>
        let turnstileVerified = false;
        function onTurnstileSuccess(token) {
            turnstileVerified = true;
            document.getElementById('cf-turnstile-response').value = token;
            $(".testErrors").text("").hide();
        }
    </script>

    <script type="text/javascript">
        var routeUrl = "{{ route('manage.main.site.cron') }}";
        var ajaxRegistationURL = "{{ route('save') }}";
        var saveVisitorUserData = "{{ route('store.visitor.users.data') }}";
        var ajaxRegistationmodel = "{{ route('otp.verification') }}";
        var ajaxRegistationChang = "{{ route('change.verification.data') }}";
        var ajaxchangedataget = "{{ route('change.verification.data.get') }}";
        var ajaxRedirectToFreeRegister = "{{ route('reachassuree.registration.demo') }}";
        var ajaxRegistationURLSearchPin = "{{ route('pin.search') }}";
        var ajaxResendOTP = "{{ route('resend.otp') }}";
        var ajaxAutoSugestion = "{{ route('auto.suggest') }}";
        var paymentURL = "";
        var loginURL = "";
        var email = "";
        var mobile = "";
        var is_valid_username = false;
        var is_valid_mobile = false;
        var is_valid_email = false;

        // Gautam starting changes in old code
        function validateEmail(email) {
            const regex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
            return regex.test(email);
        }
        // Gautam ending changes in old code

        // Gautam starting add code
        function isValidMobile(mobile) {
            return /^[0-9]{10}$/.test(mobile);
        }
        // Gautam ending add code

        let suppressValidation = false;
        var is_valid_email = false;
        var is_valid_mobile = false;
        var emailFieldBlurred = false;
        let isFormSubmission = false;

        // gautam starting add new code
            function toggleRegisterButton() {
                // button enable and disable
                const noEmailError = $('.emailErrors').is(':hidden');
                const noMobileError = $('.mobileErrors').is(':hidden');

                const shouldEnable = is_valid_email && is_valid_mobile && noEmailError && noMobileError;

                $('#registerSubmitBtn')
                    .prop('disabled', !shouldEnable)
                    .toggleClass('btn-disabled', !shouldEnable);
            }

            // Re-evaluate on input
            $('#agent_email, #agent_mobile_number').on('input keyup blur change', toggleRegisterButton);

            // Call once on page load
            toggleRegisterButton();
        // gautam ending add new code

        $(document).ready(function() {

            // email.exits

            // gautam starting commit old code
            // $('#agent_email').on('keyup blur', function(e) {
            //     var agent_email = $(this).val().trim(); // Trim whitespace

            //     if (agent_email !== '') {
            //         if (!validateEmail(agent_email)) {
            //             $('#agent_email').addClass('is-invalid');
            //             $(".emailErrors").html('Please enter a valid email address');
            //         } else {
            //             // Perform AJAX check for existing email
            //             $.get("{{ route('email.exits') }}", {
            //                 agent_email: agent_email
            //             }, function(resultData) {
            //                 if (resultData['status'] == 0) {
            //                     $('#agent_email').addClass('is-invalid');
            //                     $(".emailErrors").html(resultData['msg']);
            //                 } else {
            //                     $('#agent_email').removeClass('is-invalid').addClass('is-valid');
            //                     $(".emailErrors").html('');
            //                 }
            //                 saveVisitorData(); // Function to save data if needed
            //             });
            //         }
            //     } else {
            //         // Show error if email is empty
            //         $('#agent_email').addClass('is-invalid');
            //         $(".emailErrors").html('Please enter an email address');
            //     }
            // });
            // gautam ending commit old code

            // guatam add new code
            function checkEmailExists() {
                // if (isFormSubmitted) return;
                const email = $('#agent_email').val().trim();

                if (email === '') {
                    showEmailError('Please enter an email address');
                    is_valid_email = false;
                    toggleRegisterButton();
                    return;
                }

                if (!validateEmail(email)) {
                    showEmailError('Please enter a valid email address');
                    is_valid_email = false;
                    toggleRegisterButton();
                    return;
                }

                $.get("{{ route('email.exits') }}", { agent_email: email }, function (res) {
                    if (res.status === 0) {
                        showEmailError(res.msg);
                        is_valid_email = false;
                        toggleRegisterButton(); // Don't save visitor data for existing emails
                    } else {
                        clearEmailError();
                        is_valid_email = true;
                        saveVisitorData(); // Only save when email is valid and new
                        toggleRegisterButton();
                    }
                }).fail(function () {
                    $('#agent_email').addClass('is-invalid');
                    showEmailError("Server error while checking email.");
                    is_valid_email = false;
                    toggleRegisterButton();
                });
            }


            function validateEmailField() {
                const email = $('#agent_email').val().trim();

                if (email === '') {
                    showEmailError('Please enter an email address');
                    return false;
                }

                if (!validateEmail(email)) {
                    showEmailError('Please enter a valid email address');
                    return false;
                }

                // If we have an existence error, return false
                if (emailExistsErrorShown && email === lastProcessedEmail) {
                    return false;
                }

                clearEmailError();
                return true;
            }

            function showEmailError(msg) {
                $('#agent_email')
                    .addClass('is-invalid')
                    .removeClass('is-valid');
                $('.emailErrors').html(msg).show();
            }

            function clearEmailError() {
                $('#agent_email')
                    .removeClass('is-invalid'); // Only remove invalid class
                $('.emailErrors').text('').hide();
            }

            $(".emailErrors").html('').hide();
            $('#agent_email').removeClass('is-invalid is-valid');
            
            $('#agent_email').on('input blur', function () {
                checkEmailExists();
            });

            // ✅ In your main JavaScript file
            function resetFormValidationUI() {
                // Your reset logic
                $('#register-Form')[0].reset();
                $('#agent_email, #agent_mobile_number').removeClass('is-valid is-invalid').val('');
                $('.mobileErrors, .emailErrors').text('').hide();
                is_valid_email = false;
                is_valid_mobile = false;
                toggleRegisterButton();
            }

            $('form').on('submit', function(e) {
                isFormSubmission = true;
                
                if (!is_valid_email || !is_valid_mobile) {
                    e.preventDefault();
                    checkEmailExists();
                    mobileNumberAjax();
                    isFormSubmitted = false;
                    return;
                }
            });
            // gautam ending add new code

            window.handlSubmit = function(e) {
                e.preventDefault(); // Prevent the default form submission behavior
                $('#agent_email').removeClass('is-valid');

            }

            $('#emailOtpArea').hide();
            $("#tab_get_demo").addClass("hightlight-tab");

            localStorage.clear();

            const displayTime = $(".display-time");

            function showTime() {
                displayTime.text(new Date().toLocaleTimeString("en-US", {
                    hour12: true
                }));
                setTimeout(showTime, 1000);
            }

            showTime();

            function updateDate() {
                const today = new Date();
                const [dayNum, month, year] = [today.getDate(), today.getMonth(), today.getFullYear()];
                const months = ["January", "February", "March", "April", "May", "June", "July", "August",
                    "September", "October", "November", "December"
                ];
                const IDCollection = ["daynum", "month", "year"];

                $.each(IDCollection, function(i, id) {
                    $("#" + id).text([dayNum, months[month], year][i]);
                });
            }

            updateDate();

            $("#agent_mobile_number").bind('keyup blur', function() {
                mobileNumberAjax();
            });

            // gautam start mobile and email add new code
            $('#agent_mobile_number').on('paste', function () {
                setTimeout(() => {
                    let cleaned = $(this).val().replace(/\D/g, '');
                    cleaned = cleaned.substring(0, 10);
                    $(this).val(cleaned);

                    if (cleaned.length === 10) {
                        mobileNumberAjax(true); // 👈 force validation
                    } else if (cleaned.length === 0) {
                        showMobileError('Please enter your mobile number.');
                        is_valid_mobile = false;
                        toggleRegisterButton();
                    }
                }, 50); // Short delay to let paste complete
            });

            $('#agent_email').on('input paste', function () {
                setTimeout(() => {
                    let cleaned = $(this).val().replace(/\s+/g, ''); // remove all spaces
                    $(this).val(cleaned);

                    if (cleaned !== '') {
                        checkEmailExists(); // re-check existence after cleaning
                    } else {
                        showEmailError('Please enter an email address');
                        is_valid_email = false;
                        toggleRegisterButton();
                    }
                }, 50); // slight delay for paste event to complete
            });
            // gautam end mobile and email add new code

            // $("#agent_email").on('keyup blur', function(e) {
            //     var agent_email = $(this).val();

            //     if(agent_email != ''){
            //         if (!validateEmail(agent_email)) {
            //             $('#agent_email').addClass('is-invalid');
            //         } else {
            //             $.get("{{ route('email.exits') }}", {
            //                 agent_email: agent_email
            //             }, function(resultData) {
            //                 if (resultData['status'] == 0) {
            //                     $('#agent_email').addClass('is-invalid')
            //                     $(".emailErrors").html(resultData['msg']);
            //                 } else {
            //                     $('#agent_email').removeClass('is-invalid');
            //                     $(".emailErrors").html('');
            //                 }

            //                 saveVisitorData();
            //             });
            //         }
            //         $(".emailErrors").html('');
            //     }else{
            //         $('#agent_email').addClass('is-invalid')
            //     }
            // });

            // gautam starting changes old code 
            $('#agent_username').on('keyup', function () {
                const agent_username = $(this).val().trim();
                const alphanumericRegex = /^[a-zA-Z][a-zA-Z0-9]*$/;

                // Clear previous state
                $(".userNameErrors").text('');
                $('#agent_username').removeClass('is-valid is-invalid');

                // Clear subdomain previews
                if (agent_username === '' || !alphanumericRegex.test(agent_username)) {
                    $(this).val('');
                    $('#agent_username').addClass('is-invalid');
                    $("#agent_sub_domain, #agent_sub_domain_url, #agent_sub_domain_url_bottom").val('');
                    is_valid_username = false;
                    toggleRegisterButton(); // if you're using it
                    return;
                }

                // Set subdomain previews
                const subdomain = agent_username.toLowerCase();
                $("#agent_sub_domain").val(subdomain);
                $("#agent_sub_domain_url").val(`https://${subdomain}.reachassuree.com`);
                $("#agent_sub_domain_url_bottom").val(subdomain);
                $('#agent_sub_domain').removeClass('is-invalid');
                $(".subDomainError").text('');

                // Ajax: check if username exists
                $.ajax({
                    type: "GET",
                    url: "{{ route('username.exits') }}",
                    data: { agent_username: agent_username },
                    success: function (resultData) {
                        if (resultData.status === 0) {
                            is_valid_username = false;
                            $('#agent_username').addClass('is-invalid');
                            $(".userNameErrors").html(resultData.msg);
                        } else {
                            is_valid_username = true;
                            $('#agent_username').removeClass('is-invalid').addClass('is-valid');
                            $(".userNameErrors").html('');
                        }

                        // ✅ Ensure these always run
                        saveVisitorData();
                        toggleRegisterButton();
                    },
                    error: function () {
                        is_valid_username = false;
                        $('#agent_username').addClass('is-invalid');
                        $(".userNameErrors").html("Server error while checking username.");
                        toggleRegisterButton();
                    }
                });
            });
            // gautam ending changes old code 


            $("#agent_sub_domain").bind('keyup blur', function() {
                subDomainAjax();
            });

            $("#agent_sub_domain").on('change', function() {
                var agent_sub_domain = $(this).val();

                if (agent_sub_domain !== '') {
                    $.ajax({
                        type: "GET",
                        url: "{{ route('subdomain.exits') }}",
                        data: {
                            agent_sub_domain: agent_sub_domain,
                        },
                        success: function(resultData) {
                            if (resultData['status'] == 0) {
                                $('#agent_sub_domain').addClass('is-invalid');
                                $(".subDomainError").html(resultData['msg']);
                            } else {
                                $(".subDomainError").html('');
                                $('#agent_sub_domain').removeClass('is-invalid');
                            }
                        }
                    });
                }
            });

            $("#agent_password").bind('keyup', function(e) {
                var agent_confirm_password = $('#agent_confirm_password').val();
                var agent_password = $(this).val();

                var keyCode = e.which;

                if (keyCode === 32) {
                    e.preventDefault();
                }

                $(this).val(agent_password);

                if (agent_password.length != 0 && (agent_password.length < 6 || agent_password.length >
                        14)) {
                    $(".agentPasswordError").html("Password should be between 6 and 14 characters.");
                    $("#agent_password").addClass('is-invalid');
                } else {
                    $(".agentPasswordError").html('');
                    $("#agent_password").removeClass('is-invalid');
                }

                if (agent_confirm_password.length > 0) {
                    if (agent_password === agent_confirm_password) {
                        $(".passwordError").html("");
                        $("#agent_password , #agent_confirm_password").removeClass('is-invalid');

                    } else {
                        $(".passwordError").html("Password does not match.");
                        $("#agent_password , #agent_confirm_password").addClass('is-invalid');
                    }
                }
            });

            $("#agent_password").on('paste', function(e) {
                e.preventDefault();
                $(".agentPasswordError").html("Pasting is not allowed in this field.");
            });

            $('#eye2').click(function() {
                if ($("#eye2 i").hasClass('mdi-eye-off-outline')) {
                    $("#eye2 i").removeClass('mdi-eye-off-outline').addClass('mdi-eye-outline');
                    $('#agent_password').attr('type', 'text');

                } else {
                    $("#eye2 i").removeClass('mdi-eye-outline').addClass('mdi-eye-off-outline');
                    $('#agent_password').attr('type', 'password');
                }
            });

            $("#agent_confirm_password").bind('keyup', function(e) {
                var errorElement = $(".agentPasswordError");
                var specificContent = "Pasting is not allowed in this field.";

                if (errorElement.html() === specificContent) {
                    errorElement.html("");
                }

                var agent_password = $('#agent_password').val();
                var agent_confirm_password = $(this).val();

                var keyCode = e.which;

                if (keyCode === 32) {
                    e.preventDefault();
                }

                $(this).val(agent_confirm_password);

                if (agent_password === agent_confirm_password) {
                    $(".passwordError").html("");
                    $("#agent_password , #agent_confirm_password").removeClass('is-invalid');
                } else if (agent_confirm_password != '') {
                    $(".passwordError").html("Password does not match.");
                    $("#agent_password , #agent_confirm_password").addClass('is-invalid');
                } else {
                    $("#agent_confirm_password").addClass('is-invalid');
                }
            });

            $("#agent_confirm_password").on('paste', function(e) {
                e.preventDefault();
                $(".passwordError").html("Pasting is not allowed in this field.");
            });

            $('#eye3').click(function() {
                if ($("#eye3 i").hasClass('mdi-eye-off-outline')) {
                    $("#eye3 i").removeClass('mdi-eye-off-outline').addClass('mdi-eye-outline');
                    $('#agent_confirm_password').attr('type', 'text');
                } else {
                    $("#eye3 i").removeClass('mdi-eye-outline').addClass('mdi-eye-off-outline');
                    $('#agent_confirm_password').attr('type', 'password');
                }
            });

            $("input[type=radio][name=select_one]").on("change", function() {
                var checkedvlaue = $(this).val();

                if (checkedvlaue == 1) {
                    $('#mobileOtpArea').show();
                    $('#emailOtpArea').hide();
                } else {
                    $('#emailOtpArea').show();
                    $('#mobileOtpArea').hide();
                }
            });

            $("#ResendOTP").click(function(e) {
                e.preventDefault();

                $("#ResendOTP").prop("disabled", true).html(
                    '<i class="ri-arrow-right-s-line"></i> Processing...');

                var csrfToken = $("[name=_token]").val();
                var mobile_otp_id = $('#mobile_otp_id').val();

                $.ajax({
                    type: "POST",
                    url: ajaxResendOTP,
                    dataType: 'json',
                    data: {
                        "mobile_otp_id": mobile_otp_id,
                        "_token": csrfToken,
                    },
                    success: function(response) {
                        if (response['status'] == 1) {
                            $("#ResendOTP").prop("disabled", false).html(
                                '<i class="ri-arrow-right-s-line"></i> Resend OTP');
                            toastr["success"](resultData['msg']);
                        }
                    }
                });
            });

            function resetFields() {
                $("#agent_sub_domain, #agent_sub_domain_url, #agent_sub_domain_url_bottom").val('');
            }

            $("#confirmPaymentBtn").click(function() {
                $(this).attr("href", loginURL);
            });

            $("#agent_change_mobile_number").on("change", function() {
                var agent_change_mobile_number = $('#agent_change_mobile_number').val();
                var mobileNumberPattern = /^[0-9]{10}$/;

                if (mobileNumberPattern.test(agent_change_mobile_number)) {
                    $(".change-mobile-errors").html('');
                } else {
                    $(".change-mobile-errors").html('Please enter a valid 10-digit Mobile number.');
                }
            });

            $("#mobile_otp").on('input', function() {
                var mobile_otp = $(this).val();
                var mobile_otp_id = $('#mobile_otp_id').val();

                if (mobile_otp.trim() == '') {
                    $('#mobile_otp').removeClass('is-invalid').next('.invalid-feedback').text('');
                }

                if (mobile_otp.trim() !== '') {
                    $.ajax({
                        type: "GET",
                        url: "{{ route('mobileotp.exits') }}",
                        data: {
                            mobile_otp: mobile_otp,
                            mobile_otp_id: mobile_otp_id
                        },
                        success: function(resultData) {
                            if (resultData['status'] == 1) {
                                $('#msgformOtpVerification').hide();
                                $('#mobile_otp').removeClass('is-invalid').next(
                                    '.invalid-feedback').text('');
                            } else {
                                $('#mobile_otp').addClass('is-invalid').next(
                                    '.invalid-feedback').text('The mobile OTP is invalid.');
                            }
                        }
                    });
                }
            });

            $("#email_otp").on('input', function() {
                var email_otp = $(this).val();
                var mobile_otp_id = $('#mobile_otp_id').val();

                if (email_otp.trim() == '') {
                    $('#email_otp').removeClass('is-invalid').next('.invalid-feedback').text('');
                }

                if (email_otp.trim() !== '') {
                    $.ajax({
                        type: "GET",
                        url: "{{ route('emailotp.exits') }}",
                        data: {
                            email_otp: email_otp,
                            mobile_otp_id: mobile_otp_id
                        },
                        success: function(resultData) {
                            if (resultData['status'] == 1) {
                                $('#msgformOtpVerification').hide();
                                $('#email_otp').removeClass('is-invalid').next(
                                    '.invalid-feedback').text('');
                            } else {
                                $('#email_otp').addClass('is-invalid').next('.invalid-feedback')
                                    .text('The email OTP is invalid.');
                            }
                        }
                    });
                }
            });

            // gautam changing starting in old code
            $("#agent_change_mobile_number").on('input', function() {
                let agent_change_mobile_number = $(this).val().replace(/\s+/g, ''); // remove spaces
                $(this).val(agent_change_mobile_number);

                if (agent_change_mobile_number !== '') {
                    $.ajax({
                        type: "GET",
                        url: "{{ route('mobile.exits') }}",
                        data: {
                            agent_mobile_number: agent_change_mobile_number
                        },
                        success: function(resultData) {
                            if (resultData['status'] == 1) {
                                $('#agent_change_mobile_number')
                                    .addClass('is-invalid')
                                    .next('.invalid-feedback')
                                    .text(resultData['msg']); // ✅ use your dynamic message
                            } else {
                                $('#agent_change_mobile_number')
                                    .removeClass('is-invalid')
                                    .next('.invalid-feedback')
                                    .text('');
                            }
                        }
                    });
                }
            });
            // gautam ending starting in old code

            $("#agent_change_email").on('input', function() {
                var agent_change_email = $(this).val();

                if (agent_change_email !== '') {
                    $.ajax({
                        type: "GET",
                        url: "{{ route('email.exits') }}",
                        data: {
                            agent_email: agent_change_email
                        },
                        success: function(resultData) {
                            if (resultData['status'] == 1) {
                                $('#agent_change_email').removeClass('is-invalid').next(
                                    '.invalid-feedback').text('');
                            } else {
                                $('#agent_change_email').addClass('is-invalid').next(
                                    '.invalid-feedback').text('Email already exists.');
                            }
                        }
                    });
                }
            });

           getPublicIP(); // gautam add
        });

        // gautam starting add resend activation link on sms email
        function resendActivation(type, visitorId) {
            const routes = {
                'sms': "{{ route('activation.send.sms') }}",
                'mail': "{{ route('activation.send.mail') }}"
            };

            const messages = {
                'sms': {
                    success: "Activation SMS sent successfully.",
                    error: "Failed to resend activation SMS."
                },
                'mail': {
                    success: "Activation link sent successfully to your email.",
                    error: "Failed to resend activation email."
                }
            };

            $('#activationSuccessMsg')
                .removeClass('alert-success alert-danger')
                .addClass('alert-info')
                .html('<i class="fas fa-spinner fa-spin"></i> Sending activation link...')
                .fadeIn();

            const csrfToken = $("[name=_token]").val();

            $.ajax({
                type: "GET",
                url: routes[type],
                data: {
                    id: visitorId,
                    _token: csrfToken
                },
                dataType: 'json',
                headers: {
                    'Accept': 'application/json',
                    'X-Requested-With': 'XMLHttpRequest'
                },
                success: function(response) {
                    if (typeof response === 'string' && response.startsWith('<!DOCTYPE html>')) {
                        showMessage('danger', 'Your session expired. Please refresh the page.');
                        console.error('Received HTML instead of JSON');
                        return;
                    }

                    if (response.status === 1) {
                        showMessage('success', response.message || response.msg || messages[type].success);
                    } else {
                        showMessage('danger', response.message || response.msg || messages[type].error);
                    }
                },

                error: function(xhr) {
                    let errorMsg = messages[type].error;

                    if (xhr.responseJSON && xhr.responseJSON.message) {
                        errorMsg = xhr.responseJSON.message;
                    } else if (xhr.status === 401) {
                        errorMsg = 'Please login again to perform this action';
                    } else if (xhr.status === 404) {
                        errorMsg = 'Requested resource not found';
                    }

                    showMessage('danger', errorMsg);
                    console.error(`${type.toUpperCase()} Error:`, xhr);
                }
            });
        }

        // Helper function to show messages
        function showMessage(type, message) {
            $('#activationSuccessMsg')
                .removeClass('alert-success alert-danger alert-info')
                .addClass(`alert-${type}`)
                .html(message)
                .fadeIn()
                .delay(5000)
                .fadeOut();
        }

        // Specific functions for better readability
        function resendActivationSMS(visitorId) {
            resendActivation('sms', visitorId);
        }

        function resendActivationMail(visitorId) {
            resendActivation('mail', visitorId);
        }
        // gautam ending add resend activation link on sms email

        // gautam starting new code
        // validation for mobile number
        let mobileFieldTouched = false;
        let lastProcessedMobile = '';
        let isProcessing = false;

        function mobileNumberAjax(forceValidation = false) {
            if (isProcessing) return;
            
            var agent_mobile_number = $('#agent_mobile_number').val().replace(/\s+/g, '');
            var mobileNumberPattern = /^[0-9]{10}$/;

            // If number hasn't changed and we're not forcing validation, don't process again
            if (agent_mobile_number === lastProcessedMobile && !forceValidation) {
                return;
            }

            $('#agent_mobile_number').val(agent_mobile_number);

            // Case: Field is empty - only validate if field was touched
            if (agent_mobile_number === '') {
                if (mobileFieldTouched || forceValidation) {
                    $('#agent_mobile_number').addClass('is-invalid');
                    $(".mobileErrors").html('Please enter your mobile number.').show();
                    is_valid_mobile = false;
                }
                lastProcessedMobile = '';
                toggleRegisterButton();
                return;
            }

            // Rest of your validation logic remains the same
            if (!mobileNumberPattern.test(agent_mobile_number)) {
                $('#agent_mobile_number').addClass('is-invalid');
                $(".mobileErrors").html('Please enter a valid 10-digit Mobile number.').show();
                lastProcessedMobile = '';
                is_valid_mobile = false;
                toggleRegisterButton();
                return;
            }

            // Clear errors for valid format
            $('#agent_mobile_number').removeClass('is-invalid');
            $(".mobileErrors").html('').hide();

            isProcessing = true;
            lastProcessedMobile = agent_mobile_number;

            $.ajax({
                type: "GET",
                url: "{{ route('mobile.exits') }}",
                data: { agent_mobile_number: agent_mobile_number },
                success: function(resultData) {
                    isProcessing = false;
                    if (resultData.status == 0) {
                        is_valid_mobile = false;
                        $('#agent_mobile_number').addClass('is-invalid');
                        $(".mobileErrors").html(resultData.msg).show();
                    } else {
                        is_valid_mobile = true;
                        $('#agent_mobile_number').removeClass('is-invalid');
                        $(".mobileErrors").html('').hide();
                        saveVisitorData();
                    }
                    toggleRegisterButton();
                },
                error: function() {
                    isProcessing = false;
                    is_valid_mobile = false;
                    $(".mobileErrors").html('Error validating mobile number').show();
                    toggleRegisterButton();
                }
            });
        }

        function showMobileError(msg) {
            $('#agent_mobile_number')
                .addClass('is-invalid')
                .removeClass('is-valid');
            $('.mobileErrors').html(msg).show();
        }

        function clearMobileError() {
            $('#agent_mobile_number')
                .removeClass('is-invalid');
            $('.mobileErrors').html('').hide();
        }

        // Init mobile field state
        $(".mobileErrors").html('').hide();
        $('#agent_mobile_number').removeClass('is-invalid is-valid');

        $('#agent_mobile_number')
        .on('focus', function() {
            mobileFieldTouched = true; // Mark as touched when focused
        })
        .on('blur', function() {
            // Force validation on blur if field is empty
            if ($(this).val().trim() === '') {
                mobileNumberAjax(true);
            } else {
                mobileNumberAjax();
            }
        })
        .on('input', function() {
            let cleaned = $(this).val().replace(/\D/g, '');
            if (cleaned.length > 10) {
                cleaned = cleaned.substring(0, 10);
            }
            $(this).val(cleaned);
            
            // Validate only if we have 10 digits or empty
            if (cleaned.length === 10 || cleaned.length === 0) {
                mobileNumberAjax();
            }
        });

        // ✨ Input and Blur listener like email
        $('#agent_mobile_number').on('input blur', function () {
            let cleaned = $(this).val().replace(/\D/g, '');
            cleaned = cleaned.substring(0, 10); // Max 10 digits
            $(this).val(cleaned);

            if (cleaned.length === 10) {
                mobileNumberAjax();
            } else if (cleaned.length === 0) {
                showMobileError('Please enter your mobile number.');
                is_valid_mobile = false;
                toggleRegisterButton();
            }
        });
        // gautam ending new code

        function checkWidth() {
            if ($(window).width() <= 768) {
                $('.setYMargin').removeClass('col-6').addClass('col-12');
            } else {
                $('.setYMargin').removeClass('col-12').addClass('col-6');
            }
        }

        checkWidth();

        $(window).resize(checkWidth);

        // gautam starting comment old code
        // function mobileNumberAjax() {

        //     var agent_mobile_number = $('#agent_mobile_number').val().replace(/\s+/g, '');
        //     var mobileNumberPattern = /^[0-9]{10}$/;

        // $('#agent_mobile_number').val(agent_mobile_number);

        // if (agent_mobile_number === '') {
        //     $('#agent_mobile_number').removeClass('is-valid').addClass('is-invalid');
        //     $(".mobileErrors").html('Please enter your mobile number.');
        //     return;
        // }

        // // Case: Invalid format (not 10 digits)
        // if (!mobileNumberPattern.test(agent_mobile_number)) {
        //     $('#agent_mobile_number').removeClass('is-valid').addClass('is-invalid');
        //     $(".mobileErrors").html('Please enter a valid 10-digit Mobile number.');
        //     return;
        // }

        // Case: Valid number format → check via AJAX
        // $('#agent_mobile_number').removeClass('is-invalid');
        // $(".mobileErrors").html('');

        //     if (agent_mobile_number.length == 10) {
        //         $.ajax({
        //             type: "GET",
        //             url: "{{ route('mobile.exits') }}",
        //             data: {
        //                 agent_mobile_number: agent_mobile_number
        //             },
        //             success: function(resultData) {
        //                 if (resultData['status'] == 0) {
        //                     is_valid_mobile = false
        //                     $('#agent_mobile_number').addClass('is-invalid').next('.invalid-feedback').text(
        //                         resultData['msg']);
        //                 } else {
        //                     is_valid_mobile = true
        //                     $('#agent_mobile_number').removeClass('is-invalid').next('.invalid-feedback').text(
        //                         '');

        //                 }
        //                 saveVisitorData();
        //             }
        //         });
        //         $(".mobileErrors").html('');
        //     } else {
        //         $(".mobileErrors").html('Please enter a valid 10-digit Mobile number.');
        //     }
        // }
        // gautam starting comment old code

        function subDomainAjax() {
            var agent_sub_domain = $("#agent_sub_domain").val();

            var url = '(https://' + agent_sub_domain + '.reachassuree.com)';
            $("#agent_sub_domain_url, #agent_sub_domain_url_bottom").val(url.toLowerCase());

            var alphanumericRegex = /^[a-zA-Z][a-zA-Z0-9]*$/;

            if (agent_sub_domain !== '') {
                if (alphanumericRegex.test(agent_sub_domain)) {
                    $.ajax({
                        type: "GET",
                        url: "{{ route('subdomain.exits') }}",
                        data: {
                            "agent_sub_domain": agent_sub_domain,
                        },
                        dataType: 'json',
                        success: function(response) {
                            if (response['status'] == 0) {
                                $('#agent_sub_domain').addClass('is-invalid');
                                $(".subDomainError").html(response['msg']);
                            } else {
                                $(".subDomainError").html('');
                                $('#agent_sub_domain').removeClass('is-invalid');
                            }
                        }
                    });

                    $('#agent_sub_domain').removeClass('is-invalid');
                } else {
                    $(this).val('');
                    $('#agent_sub_domain').addClass('is-invalid');
                    $("#agent_sub_domain , #agent_sub_domain_url , #agent_sub_domain_url_bottom").val('');
                    $(".subDomainError").html("Sub Domain must be alphanumeric");
                }
            } else {
                $('#agent_sub_domain').addClass('is-invalid');
                $("#agent_sub_domain , #agent_sub_domain_url , #agent_sub_domain_url_bottom").val('');
            }
        }

        function learningVideo() {
            var currentUrl = window.location.href;
            var pathParts = currentUrl.split('/');
            var basename = pathParts[pathParts.length - 1];

            var ajaxTabChange = "{{ route('learning.videos', ['slug' => 'tab']) }}".replace('tab', basename);

            var updatedUrl = ajaxTabChange.replace(/\/\/\w+\./, "//www.");

            $.ajax({
                type: 'GET',
                url: ajaxTabChange,
                success: function(response) {
                    window.open(updatedUrl, '_blank');
                }
            });
        }

        
        // gautam start new code for fatching ip details
        let visitorDataSaved = false;
        
        function getPublicIP() {
            // Get IPv4 from ipify
            $.get("https://api.ipify.org?format=json", function (data) {
                if (data && data.ip) {
                    $('#user_ipv4').val(data.ip);
                }
            });

            // Get IPv6 from ipify
            $.get("https://api64.ipify.org?format=json", function (data) {
                if (data && data.ip) {
                    $('#user_ipv6').val(data.ip);
                }
            });

            // ✅ Fetch ISP only (no IP override)
            $.get("https://ipapi.co/json/", function (data) {
                if (data) {
                    if (data.org) {
                        $('#user_isp').val(data.org); // ISP
                    }
                    if (data.country_name) {
                        $('#user_country').val(data.country_name); // Country
                    }
                    if (data.region) {
                        $('#user_region').val(data.region); // Region/State
                    }
                }
            });
        }
        // gautam end new code for fatching ip details

        // gautam start change old code
        function saveVisitorData() {
            // gautam commit code
            // var agent_email = $('#agent_email').val();
            // var agent_mobile = $('#agent_mobile_number').val();
            // var mobilePattern = /^[0-9]{10}$/;
            // var emailPattern = /^[A-Za-z0-9._%+-]+@gmail.com$/;

            // if (agent_email !== '' && emailPattern.test(agent_email)) {
            //     callAjax();
            // } else if (agent_mobile !== '' && mobilePattern.test(agent_mobile)) {
            //     callAjax();
            // }
            // gautam end commit code

            if (visitorDataSaved) return; // Prevent duplicate storage

            const agent_email = $('#agent_email').val().trim();
            const agent_mobile = $('#agent_mobile_number').val().trim();

            const ipv4 = $('#user_ipv4').val();
            const ipv6 = $('#user_ipv6').val();
            const region = $('#user_region').val();
            const country = $('#user_country').val();
            const isp = $('#user_isp').val();

            const emailPattern = /^[A-Za-z0-9._%+-]+@gmail.com$/;
            const mobilePattern = /^[0-9]{10}$/;

            const noEmailError = $('.emailErrors').is(':hidden');
            const noMobileError = $('.mobileErrors').is(':hidden');

            const isValidEmail = agent_email !== '' && emailPattern.test(agent_email) && noEmailError;
            const isValidMobile = agent_mobile !== '' && mobilePattern.test(agent_mobile) && noMobileError;

            if ((isValidEmail || isValidMobile) && noEmailError && noMobileError) {
                callAjax(agent_email, agent_mobile, ipv4, ipv6, isp, region, country);
            }
        }

        function callAjax(email, mobile, ipv4, ipv6, isp, region, country) {
            $.ajax({
                type: "GET",
                url: saveVisitorUserData, // This variable should hold the correct route URL
                data: {
                    agent_id: $('input[name="agent_id"]').val(),
                    register_form_type: $('input[name="register_form_type"]').val(),
                    register_code: $('input[name="register_code"]').val(),
                    agent_email: email,
                    agent_mobile_number: mobile,
                    ipv4: ipv4,
                    ipv6: ipv6,
                    region: region,
                    country: country,
                    isp: isp
                }
            });
        }
        // gautam end change old code

        function closeChangeDetail() {
            $("#formChangeVerificationData").trigger("reset");
            $("#modalChangeVerificationData").modal("hide");
            $("#modalOtpVerification").modal("show");

            var ajaxchangedataget = "{{ route('change.verification.data.get') }}";
            var csrfToken = $("[name=_token]").val();
            var id = $('#agent_change_id').val();

            $.ajax({
                type: "POST",
                url: ajaxchangedataget,
                dataType: 'json',
                data: {
                    "agent_change_id": id,
                    "_token": csrfToken,
                },
                success: function(response) {
                    $("#agent_change_email").val(response["data"]["agent_change_email"]);
                    $("#agent_change_mobile_number").val("" + response["data"]["agent_change_mobile_number"] +
                        "");
                }
            });
        }

        $("#closeModal").click(function() {
            window.location.href = ajaxRedirectToFreeRegister;
        });
    </script>

@endsection