<%- include('../includes/head.ejs') %>
    </head>

    <body>
        <%- include('../includes/navigation.ejs') %>
        <div class="loader" id="loader">
            <section>
              <div class="overlay__content">
                <span class="spinner"></span>
              </div>
            </section>
          </div>
            <div class="container">
                <!-- ======= Contact Us Section ======= -->
                <section id="contact" class="contact">
                    <div class="container">

                        <div class="section-title">
                            <h2>
                                <%= __('menu.contact') %>
                            </h2>
                            <div class="d-flex justify-content-center section-title" >
                                <h2 id="contact_messageSent">
                                    <%= __('landing.form-sent-succsess') %>
                                </h2>
                            </div>
                        </div>
                        <div class="pb-5">
                            <div class="container-map map-responsive">
                                <!-- <agm-map [latitude]="lat" [longitude]="lng" [zoom]="zoom" [scrollwheel]="false">
                <agm-marker [latitude]="lat" [longitude]="lng"></agm-marker>
              </agm-map> -->
                                <iframe
                                    src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2767.7725227645396!2d23.5737608513559!3d46.075576800357915!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x474ea9cae66cbd3f%3A0x6f61e9132b16747e!2sK9%20Univet!5e0!3m2!1sen!2sro!4v1636661152969!5m2!1sen!2sro"
                                    width="1100" height="450" style="border:0;" allowfullscreen=""
                                    loading="lazy"></iframe>
                            </div>
                        </div>
                        <div class="row">

                            <div class="col-lg-6 d-flex align-items-stretch">
                                <div class="info-box">
                                    <i class="bx bx-map"></i>
                                    <h3>
                                        <%= __('landing.contact-adresa') %>
                                    </h3>
                                    <p>
                                        <%= __('landing.cabinet-adresa') %>
                                    </p>
                                </div>
                            </div>

                            <div class="col-lg-3 d-flex align-items-stretch">
                                <a class="width-full" href="mailto:contact@k9univet.ro">
                                    <div class="info-box">
                                        <i class="bx bx-envelope"></i>
                                        <h3>
                                            <%= __('landing.contact-email') %>
                                        </h3>
                                        <p>
                                            <%= __('landing.cabinet-email') %>
                                        </p>
                                    </div>
                                </a>
                            </div>

                            <div class="col-lg-3 d-flex align-items-stretch">
                                <a class="width-full" href="tel:+40755894339">
                                    <div class="info-box ">
                                        <i class="bx bx-phone-call"></i>
                                        <h3>
                                            <%= __('landing.contact-telefon') %>
                                        </h3>
                                        <p>
                                            <%= __('landing.cabinet-telefon') %>
                                        </p>
                                    </div>
                                </a>
                            </div>


                        </div>

                    </div>
                    <div class="row">
                        <div class="col-lg-12">

                            <form action="contact/sendMailAjax" method="POST" id="formContact" novalidate
                                class="php-email-form">
                                <div class="form-row">
                                    <div class="col-lg-6 form-group">
                                        <input id="contact_name" name="name" class="form-control"
                                            placeholder="<%= __('landing.contact-form-nume') %>" />
                                            <p id="err_name" class="error">
                                                <%= __('landing.ErrNume') %>
                                              </p>
                                    </div>
                                    <div class="col-lg-6 form-group">
                                        <input id="contact_email" class="form-control" name="email" required
                                            type="email" placeholder="<%= __('landing.contact-form-email') %>" />
                                            <p id="err_email" class="error">
                                                <%= __('landing.ErrEmail') %>
                                              </p>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <textarea class="form-control" name="message" id="contact_message" cols="30"
                                        rows="8" placeholder="<%= __('landing.contact-form-mesaj') %>"></textarea>
                                        <p id="err_msg" class="error">
                                               <%= __('landing.ErrMsg') %>
                                          </p>
                                </div>
                                <p id="resolveCaptcha" class="error">
                                    <%= __('landing.ErrRecaptcha') %>
                                </p>
                                <div class="d-flex justify-content-center pb-5">
                                    <div class="g-recaptcha" data-sitekey="6LfwpqQkAAAAACsl_0qAaj8dlBlat5FzRZmeIRH4">
                                    </div>
                                </div>
                                <div class="text-center">
                                    <div id="contact_submit"><button type="submit" class="btn btn-primary">
                                            <%= __('landing.contact-form-btn') %>
                                        </button>
                                        <p id="resolveErrors" class="error">
                                           <%= __('landing.ErrSubmit') %>
                                          </p>
                                    </div>
                                </div>
                                <input type="hidden" name="_csrf" id="contact__csrf" class="valid"
                                    value="<%= csrfToken %>">
                            </form>

                            
                        </div>
                    </div>
            </div>
      
            </section><!-- End Contact Us Section -->
    
            <%- include('../includes/end.ejs') %>
