<?php /* Template Name: Contact Us Page */
get_header();
?>

<section class="get-in-touch-wrap">
    <div class="container custom-container">

      <div class="head-wrap">
        <h2 class="title">Get In Touch</h2>
        <p class="para">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been
          the industry's standard dummy text ever since the 1500s, when an unknown</p>
      </div>

      <div class="contact-wrap">

        <div class="box location">
          <figure class="ico">
            <img src="<?php echo get_template_directory_uri(); ?>/img/ico-1.svg" alt="">
          </figure>
          <p>
            <span>Location</span>
            Schnitzler St 23, Tel Aviv-Yafo, Israel, 68165
          </p>
        </div>

        <div class="box contact-number">
          <figure class="ico">
            <img src="<?php echo get_template_directory_uri(); ?>/img/ico-2.svg" alt="">
          </figure>
          <p>
            <span>Contact Number</span>
            03-683-7398
          </p>
        </div>

        <div class="box email-address">
          <figure class="ico">
            <img src="<?php echo get_template_directory_uri(); ?>/img/ico-3.svg" alt="">
          </figure>
          <p>
            <span>Email Address</span>
            info@gmail.com
          </p>
        </div>

      </div>

      <div class="form-white-bg">
  <form id="contactForm" data-parsley-validate>
    <div class="row row-align">
      <div class="col-md-6">
        <div class="input-wrap">
          <label for="fname" class="label-text">First Name<span class="star-red">*</span></label>
          <input type="text" class="text" id="fname" name="fname" placeholder="Enter Your First Name" required data-parsley-required="true" data-parsley-error-message="First Name is required">
        </div>
      </div>
      <div class="col-md-6">
        <div class="input-wrap">
          <label for="lname" class="label-text">Last Name<span class="star-red">*</span></label>
          <input type="text" class="text" id="lname" name="lname" placeholder="Enter Your Last Name" required data-parsley-required="true" data-parsley-error-message="Last Name is required">
        </div>
      </div>
    </div>

    <div class="row row-align">
      <div class="col-md-6">
        <div class="input-wrap">
          <label for="pnum" class="label-text">Phone Number<span class="star-red">*</span></label>
          <input type="text" class="text" id="pnum" name="pnum" 
       placeholder="Enter Your Phone Number" 
       required 
       data-parsley-required="true" 
       data-parsley-pattern="^\d{10}$" 
       data-parsley-error-message="Please enter a valid 10-digit phone number"
       onkeypress="return event.charCode >= 48 && event.charCode <= 57" 
       maxlength="10">
</div>
      </div>
      <div class="col-md-6">
        <div class="input-wrap">
          <label for="mailid" class="label-text">Email ID<span class="star-red">*</span></label>
          <input type="email" class="text" id="mailid" name="mailid" placeholder="Enter Your Email ID" required data-parsley-required="true" data-parsley-type="email" data-parsley-error-message="Please enter a valid email address">
        </div>
      </div>
    </div>

    <div class="row row-align">
      <div class="col-md-12">
        <div class="input-wrap">
          <label for="msg" class="label-text">Message<span class="star-red">*</span></label>
          <textarea id="msg" name="msg" placeholder="Enter Your Message" class="textarea" required data-parsley-required="true" data-parsley-error-message="Message is required"></textarea>
        </div>
      </div>
    </div>
    <div id="form-response" class="alert alert-success sucess-box" style="display:none;"></div>
    <div class="row">
      <div class="col-md-12">
        <div class="btn-wrap">
          <button type="submit" class="btn">
            <span>Send</span> 
            <img src="<?php echo get_template_directory_uri(); ?>/img/send-stright.svg" alt="" class="img">
          </button>
        </div>
      </div>
    </div>
  </form>
  <div id="form-response"></div> <!-- Response Message -->
</div>




    </div>
  </section>


  <div class="getin-blank-space"></div>


  <section class="newsletter-section">
    <div class="container custom-container">
        <div class="subtitle">Subscribe to our Newsletter </div>
        <div class="sub-content"> Sign up for our weekly updates to be the first to receive inspiring content, news, events, and downloads.</div>
        <div class="form-sec">
            <form id="newsletter-form">
                <div class="row form-inner">
                <div class="col-md-4">
                        <input type="text" id="name" class="form-control" placeholder="Name*" required>
                         
                    </div>
                    <div class="col-md-4">
                        <input type="email" id="email" class="form-control" placeholder="Email*" required>
                        
                    </div>
                    <div class="col-md-2">
                        <button type="submit" class="btn btn-submit btn-subscribe w-100">Subscribe</button>
                    </div>
                </div>
            </form>
            <div id="subAlert" class="alert alert-success" role="alert" style="text-align: center; display: none;top: 10px;"></div>      </div>
          
        </div>
    </div>
</section>

<?php get_footer(); ?>