@extends('layouts.front')

@section('content')
<!-- Inner Section Start -->
  <section class="inner-area parallax-bg" data-background="{{asset('front/images/contact.jpeg')}}" data-type="parallax" data-speed="3">
    <div class="container">
      <div class="section-content">
        <div class="row">
          <div class="col-12">
            <h4>{{$contact_us->title}}</h4>
            <p>Home <a href="#">contact</a></p>
          </div>
        </div>
      </div>
    </div>
  </section>
<!-- Inner Section End -->

<section class="contact-details pb-70">
    <div class="container">
        <div class="section-content">
            <div class="row">
                <div class="col-12 col-sm-12 col-md-7 col-lg-7">
                    @if ($errors->any())
                        <div class="alert alert-danger">
                            <ul>
                                @foreach ($errors->all() as $error)
                                    <li>{{ $error }}</li>
                                @endforeach
                            </ul>
                        </div>
                    @endif
                    <h3 class="title">Contact <span>us</span></h3>
                    <form method="POST" action="{{route('home.contact')}}">
                    {{ csrf_field() }}
                    <div class="form-row">
                        <div class="form-group col-md-12">
                            <input type="text" name="name" id="name" class="form-control" placeholder="First Name" onfocus="this.placeholder = ''" onblur="this.placeholder = 'enter your Name'" / required>
                        </div>
                        <div class="form-group col-md-12">
                            <input type="email" name="email" id="email" class="form-control" placeholder="Your Email" onfocus="this.placeholder = ''" onblur="this.placeholder = 'enter your Email'" / required>
                        </div>

                        <div class="form-group col-md-12">
                            <input type="text" name="number" id="number" class="form-control" placeholder="Your Mobile" onfocus="this.placeholder = ''" onblur="this.placeholder = 'enter your Mobile'" />
                        </div>

                        <div class="form-group col-md-12">
                            
                        </div>

                        <div class="form-group col-md-12">
                            <div class="contact-textarea">
                                <textarea class="form-control" rows="6" placeholder="write Message" onfocus="this.placeholder = ''" onblur="this.placeholder = 'enter your Message'" / id="message" name="message" required></textarea>
                                <div class="clearfix"></div>
                                
                                <!-- <div class="g-recaptcha" data-sitekey="{{env('CAPTCHA_KEY')}}">
                                    @if($errors->has('g-recaptcha-response'))
                                        <span class="invalid-feedback">
                                            <strong>{{$errors->first('g-recaptcha-response')}}</strong>
                                        </span>
                                    @endif
                                </div> -->
                                <button class="btn btn-theme mt-4" type="submit" value="Submit Form">Send Message</button>
                            </div>
                        </div>

                        
                    </div>
                </form>
                </div>
                <div class="col-12 col-sm-12 col-md-5 col-lg-5">
                    <h3 class="title">Get in <span>Touch</span></h3>
                    <div class="service-item style-1 border-1px">
                        <div class="service-icon">
                            <i class="pe-7s-map"></i>
                        </div>
                        <div class="content">
                            <h5><a href="#">Address</a></h5>
                            <p> {{$settings->address}}</p>
                        </div>
                    </div>
                    <div class="service-item style-1 border-1px">
                        <div class="">
                            <i class="pe-7s-clock"></i>
                        </div>
                        <div class="content">
                            <h5><a href="#">Contact Number</a></h5>
                            <p>{{$settings->mobile}}</p>
                        </div>
                    </div>
                    <div class="service-item style-1 border-1px">
                        <div class="">
                            <i class="pe-7s-mail-open"></i>
                        </div>
                        <div class="content">
                            <h5><a href="#">Email</a></h5>
                            <p>{{$settings->email}}</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

@endsection