@extends('front_master')
@section('front_content')
<main class="main">
        <!-- Start of Page Header -->
        <div class="page-header">
          <div class="container">
            <h1 class="page-title mb-0">Contact Us</h1>
          </div>
        </div>
        <!-- End of Page Header -->

        <!-- Start of Breadcrumb -->
        <nav class="breadcrumb-nav mb-10 pb-1">
          <div class="container">
            <ul class="breadcrumb">
              <li><a href="{{ route('home') }}">Home</a></li>
              <li>Contact Us</li>
            </ul>
          </div>
        </nav>
        <!-- End of Breadcrumb -->

        <!-- Start of PageContent -->
        <div class="page-content contact-us">
          <div class="container">
            <section class="content-title-section mb-10">
              <h3 class="title title-center mb-3">Contact Information</h3>
              <p class="text-center">
                {{-- {{ $setting && $setting->phone ? $setting->phone : '' }} --}}
              </p>
</section>
<!-- End of Contact Title Section -->

<section class="contact-information-section mb-10">
<div
class="swiper-container swiper-theme"
data-swiper-options="{
            'spaceBetween': 20,
            'slidesPerView': 1,
            'breakpoints': {
                '480': {
                    'slidesPerView': 2
                },
                '768': {
                    'slidesPerView': 3
                },
                '992': {
                    'slidesPerView': 4
                }
            }
        }"
>
<div
  class="swiper-wrapper row cols-xl-4 cols-md-3 cols-sm-2 cols-1"
>
  <div
    class="swiper-slide icon-box text-center icon-box-primary"
  >
    <span class="icon-box-icon icon-email">
      <i class="w-icon-envelop-closed"></i>
    </span>
    <div class="icon-box-content">
      <h4 class="icon-box-title">E-mail Address</h4>
      <p>
          {{ $setting && $setting->email ? $setting->email : '' }}
      </p>
    </div>
  </div>
  <div
    class="swiper-slide icon-box text-center icon-box-primary"
  >
    <span class="icon-box-icon icon-headphone">
      <i class="w-icon-headphone"></i>
    </span>
    <div class="icon-box-content">
      <h4 class="icon-box-title">Phone Number</h4>
      <p>{{ $setting && $setting->phone ? $setting->phone : '' }}</p>
    </div>
  </div>
  <div
    class="swiper-slide icon-box text-center icon-box-primary"
  >
    <span class="icon-box-icon icon-map-marker">
      <i class="w-icon-map-marker"></i>
    </span>
    <div class="icon-box-content">
      <h4 class="icon-box-title">Address</h4>
      <p>{{ $setting && $setting->address ? $setting->address : '' }}</p>
    </div>
  </div>
  <div
    class="swiper-slide icon-box text-center icon-box-primary"
  >
    <span class="icon-box-icon icon-fax">
      <i class="w-icon-fax"></i>
    </span>
    <div class="icon-box-content">
      <h4 class="icon-box-established">Established</h4>
      <p>{{ $setting && $setting->established ? $setting->established : '' }}</p>
    </div>
  </div>
</div>
</div>
</section>
<!-- End of Contact Information section -->

<hr class="divider mb-10 pb-1" />

<section class="contact-section">
<div class="row gutter-lg pb-3">
<div class="col-lg-6 mb-8">
  <img
      src="{{ $setting && $setting->contact_us_img ? $setting->contact_us_img : '' }}"
      alt="contact"
      width="500"
      height="400"
  />
</div>
<div class="col-lg-6 mb-8">
  <h4 class="title mb-3">Send Us a Message</h4>
{{--  <form class="form contact-us-form" action="#" method="post">--}}
  <form class="form contact-us-form">
    <div class="form-group">
      <label for="username">Your Name</label>
      <input
        type="text"
        id="username"
        name="username"
        class="form-control"
      />
    </div>
    <div class="form-group">
      <label for="email_1">Your Email</label>
      <input
        type="email"
        id="email_1"
        name="email_1"
        class="form-control"
      />
    </div>
    <div class="form-group">
      <label for="message">Your Message</label>
      <textarea
        id="message"
        name="message"
        cols="30"
        rows="5"
        class="form-control"
      ></textarea>
    </div>
    <button type="submit" class="btn btn-dark btn-rounded">
      Send Now
    </button>
  </form>
</div>
</div>
</section>
<!-- End of Contact Section -->
</div>
</div>
<!-- End of PageContent -->
</main>
@endsection