@extends('front.layout.app')
@section('title', 'Contact Us')
@section('content')

    <section class="main-slider innerBanner p-0" id="mainSlider"
        style="background-image: url('{{ $data->cmsImages('banner_image') ?? '' }}');">
        <div class="container">
            <div class="row justify-content-end">
                <div class="col-lg-6">
                    <div class="slideOne">
                        <h1 class="mainHeading text-white">{{ $data->content['banner_heading'] ?? '' }}</h1>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <section class="aboutSec contactInner">
        <div class="container">
            <h2 class="mainHeading text-center">{{ $data->content['cont_info_heading'] ?? '' }}</h2>
            <div class="row">
                <div class="col-md-4">
                    <div class="contactBox">
                        <figure><i class="fas fa-map-marker-alt"></i></figure>
                        <h3>LOCATION</h3>
                        <a href="#">Get Location On Google map</a>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="contactBox">
                        <figure><i class="fas fa-phone-alt"></i></figure>
                        <h3>Call us</h3>
                        <a href="tel:{{ $setting->phone_num ?? '' }}"><span>Phone
                                Number:</span>{{ $setting->phone_num ?? '' }}</a>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="contactBox">
                        <figure><i class="fas fa-envelope"></i></figure>
                        <h3>CONTACT</h3>
                        <a href="mailto:{{ $setting->email ?? '' }}"><span>Email us:</span> {{ $setting->email ?? '' }}</a>
                    </div>
                </div>
                <div class="col-md-12">
                    <h2 class="mainHeading text-center mb-4">{{ $data->content['con_form_heading'] ?? '' }}</h2>
                    <form class="contactForm" method="POST" action="{{ route('front.contact.submit') }}">
                        @csrf
                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <input type="text" class="form-control" name="full_name" placeholder="Full name">
                                </div>
                                <small class='text-danger'>
                                    @error('full_name')
                                        {{ $message }}
                                    @enderror
                                </small>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <input type="text" class="form-control" name="email"
                                        value="{{ auth()->user()->email ?? '' }}" placeholder="Email address">
                                </div>
                                <small class='text-danger'>
                                    @error('email')
                                        {{ $message }}
                                    @enderror
                                </small>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <input type="text" class="form-control" name="phone_number" placeholder="Phone number">
                                </div>
                                <small class='text-danger'>
                                    @error('phone_number')
                                        {{ $message }}
                                    @enderror
                                </small>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <select>
                                        <option>Subject</option>
                                    </select>
                                </div>
                            </div>
                            <div class="col-md-12">
                                <div class="form-group">
                                    <textarea class="form-control" placeholder="Message" name="message" rows="4"></textarea>
                                    <small class='text-danger'>
                                        @error('message')
                                            {{ $message }}
                                        @enderror
                                    </small>
                                </div>
                            </div>
                            <div class="col-md-12 text-center">
                                <button class="themeBtn">{{ $data->content['con_form_btn'] ?? '' }}</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </section>
    <section class="helpSec aboutHelp">
        <div class="container">
            <div class="row">
                <div class="col-md-12">
                    <div class="helpWraps">
                        <figure>
                            <img src="{{ $data->cmsImages('reach') ?? '' }}" class="img-fluid" alt="">
                        </figure>
                        <div class="helpBox">
                            <h2>{{ $data->content['rec_sec_head1'] ?? '' }}
                                <br>{{ $data->content['rec_sec_head2'] ?? '' }}
                            </h2>
                            <p>{{ $data->content['rec_sec_des1'] ?? '' }}</p>
                            <a href="{{ route('front.donation') }}"
                                class="themeBtn">{{ $data->content['rec_sec_btn'] ?? '' }}</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

@endsection