<div class="modal fade" id="whatsapp" tabindex="-1" role="dialog">
    <div class="modal-dialog modal-sm">
        <div class="modal-content">
            <div class="modal-header">
                <div class="modal-title">Message on WhatsApp</div>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <form id="whatsapp_form" method="post" target="_blank">
                    <span class="text-danger wht_error_message"></span>
                    <span class="text-success wht_success_message"></span>

                    <div class="row">
                        <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                            <div class="form-group">
                                <input class="form-control" type="text" onkeyup="validateOnlyTextField(this)"
                                    pattern="[a-zA-Z\s]+" name="name" id="name" placeholder="Full Name*" value="" required>
                            </div>
                        </div>
                        <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                            <div class="form-group">
                                <input type="hidden" class="countryName" name="countryName" value="India">
                                <input type="hidden" name="code" class="code" value="+91">
                                <input class="form-control telePhone" type="tel" name="mobile" id="mobile" value=""
                                    onkeyup="this.value=this.value.replace(/[^0-9]/g,'')" minlength="10" maxlength="10" placeholder="Mobile Number*" required>
                            </div>
                        </div>
                        <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                            <button type="submit" name="whatsapp_submit" class="read_more_btn_2">Submit</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="myModal" tabindex="-1" role="dialog">
    <div class="modal-dialog modal-sm">
        <div class="modal-content">
            <div class="modal-header">
                <div class="modal-title">Quick Enquiry</div>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <form id="enq_pop_form1" method="post">
                    <div id="enq_pop_up"></div>

                    <!-- <div id="mail-status2"></div> -->



                    <!-- <?php if (!empty($errMsg)): ?><div class="alert alert-danger"><?php echo $errMsg; ?></div>
                    <?php endif; ?>
                    <?php if (!empty($succMsg)): ?><div class="alert alert-success"><?php echo $succMsg; ?></div>
                    <?php endif; ?> -->





                    <div class="form-group">
                        <input class="form-control" type="text" name="name" id="name" placeholder="Full Name*"
                            value="" onkeypress="return ValidateAlpha(event)" pattern="[a-z A-Z]+" required>
                    </div>

                    <div class="form-group">
                        <input class="form-control" type="email" name="email" id="email" value=""
                            placeholder="Email ID*" required>
                    </div>

                    <div class="form-group">
                        <input type="hidden" class="countryName" name="countryName" value="India">
                        <input type="hidden" name="code" class="code" value="+91">
                        <input class="form-control telePhone" type="tel" name="mobile" id="mobile" value=""
                            onkeyup="this.value=this.value.replace(/[^0-9]/g,'')"
                            oninput="this.value = this.value.replace(/[^0-9.]/g, '').replace(/(\..*)\./g, '$1');" minlength="10" maxlength="10" placeholder="Mobile Number*" required>
                    </div>

                    <div class="form-group">
                        <input class="form-control" type="text" name="location" id="location"
                            onkeypress="return ValidateAlpha(event)" value="" placeholder="Your Location*" required>
                    </div>

                    <div class="form-group">
                        <textarea class="form-control" name="message" id="message" placeholder="Your Message*"
                            required></textarea>
                    </div>

                    <div class="form-group" style="margin-bottom: 0;">
                        <div class="g-recaptcha" data-sitekey="<?= SITE_KEY; ?>"></div>
                    </div>

                    <button type="submit" name="submit_enq" id="submit_enq"
                        class="read_more_btn_2">Submit</button>
                </form>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="productID" tabindex="-1">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <div class="modal-title">Send Enquiry</div>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-xxl-7 col-xl-7 col-lg-7 col-md-7 col-sm-7 col-12">
                        <div class="product_popup">
                            <div class="product_popup_image">
                                <img class="img-responsive catImg" src="<?= site_url; ?>/designer/images/image4.jpg"
                                    alt="Steel Overseas" title="Steel Overseas">
                            </div>
                            <div class="catName"> Steel Overseas</div>
                        </div>
                    </div>
                    <div class="col-xxl-5 col-xl-5 col-lg-5 col-md-5 col-sm-5 col-12">

                        <form name="contact-form" method="post" id="product_pop_form">
                            <div id="cat_pop_up"></div>
                            <div class="form-group">
                                <input class="form-control" type="text" name="name" id="name"
                                    placeholder="Full Name*" value="" onkeypress="return ValidateAlpha(event)"
                                    pattern="[a-z A-Z]+" required>
                            </div>

                            <!-- <div class="form-group">
                                <input class="form-control" type="email" name="catemail_address" id="catemail_address" placeholder=" Email ID*" value="" onkeypress="return ValidateAlpha(event)" pattern="[a-z A-Z]+" required>
                            </div> -->
                            <div class="form-group">
                                <input class="form-control" type="email" name="email" id="email"
                                    placeholder=" Email ID*" value="" required>
                            </div>


                            <div class="form-group">
                                <input type="hidden" class="countryName" name="countryName" value="India">
                                <input type="hidden" name="code" class="code" value="+91">
                                <input class="form-control telePhone" type="tel" name="mobile" id="mobile"
                                    onkeyup="this.value=this.value.replace(/[^0-9]/g,'')"
                                    oninput="this.value = this.value.replace(/[^0-9.]/g, '').replace(/(\..*)\./g, '$1');" minlength="10" maxlength="10" placeholder=" Phone No*" value="" required>
                            </div>

                            <div class="form-group">
                                <input class="form-control" type="text" name="location" id="location"
                                    placeholder="Location*" value="" onkeypress="return ValidateAlpha(event)"
                                    pattern="[a-z A-Z]+" autocomplete="off" required>
                            </div>
                            <div class="form-group">
                                <textarea class="form-control" name="message" id="message"
                                    placeholder=" Message*" required></textarea>
                            </div>
                            <div class="form-group" style="margin-bottom: 0;">
                                <div class="g-recaptcha" data-sitekey="<?= SITE_KEY; ?>"></div>
                            </div>

                            <div class="form-group">
                                <button type="submit" name="submit_cat_popup"
                                    class="read_more_btn_2">Submit</button>
                            </div>
                        </form>

                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="callback" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <div class="modal-title">Get Callback Quickly</div>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-xxl-5 col-xl-5 col-lg-5 col-md-5 col-sm-5 col-12">
                        <div class="product_popup">
                            <div class="product_popup_image">
                                <img class="img-responsive catImg" src="designer/images/category1.jpg" alt="Product" title="Product">
                            </div>
                            <div class="catName">Product Heading One</div>
                        </div>
                    </div>
                    <div class="col-xxl-7 col-xl-7 col-lg-7 col-md-7 col-sm-7 col-12">

                        <form name="contact-form" method="post" id="callback_form">
                            <div id="cpop_up"></div>
                            <div class="form-group">
                                <input class="form-control" type="text" name="name" placeholder="Full Name*" value=""
                                    pattern="[a-z A-Z]+" required="">
                            </div>

                            <div class="form-group">
                                <input type="hidden" class="countryName" name="countryName" value="India">
                                <input type="hidden" name="code" class="code" value="+91">
                                <input class="form-control telePhone" type="tel" name="mobile" id="mobile"
                                    onkeyup="this.value=this.value.replace(/[^0-9]/g,'')"
                                    oninput="this.value = this.value.replace(/[^0-9.]/g, '').replace(/(\..*)\./g, '$1');" minlength="10" maxlength="10" placeholder=" Phone No*" value="" required>
                            </div>
                            <p>We will contact you on this number</p>

                            <div class="form-group">
                                <button type="submit" class="read_more_btn_2 read_more" name="submit_callback"><span>Submit</span></button>
                            </div>
                        </form>

                    </div>
                </div>
            </div>
        </div>
    </div>
</div>