@extends('web.layouts.front')
@section('title')
    {{ __('messages.contact_us') }}
@endsection
@section('page_css')
    {{--    <link rel="stylesheet" href="{{ mix('web_front/css/contact.css') }}"> --}}
@endsection
@php
    $enquiry = request()->query('enquiry');
    $settingValue = getSettingValue();
@endphp
@section('content')
    <!--
                                                    =============================================
                                                        Contact Section Four
                                                    ==============================================
                                                    -->
    <div class="contact-section-four pt-180 md-pt-150">
        <div class="container">
            <div class="row">
                <div class="col-xxl-7 col-lg-6 col-md-7 m-auto">
                    <div class="title-style-fourteen text-center wow fadeInUp mb-100 lg-mb-50">
                        <div class="sc-title">CONTACTEZ-NOUS</div>
                        <h2 class="main-title fw-normal tx-dark">Notre <span class="position-relative">équipe<img
                                    src="images/shape/shape_186.svg" alt=""></span> est là pour vous aider.</h2>
                    </div> <!-- /.title-style-fourteen -->
                </div>
            </div>

            <div class="row">
                <div class="col-md-4">
                    <div class="address-block-two text-center mb-40 wow fadeInUp">
                        <div class="icon border rounded-circle d-flex align-items-center justify-content-center m-auto">
                            <img src="images/icon/icon_178.svg" alt="">
                        </div>
                        <h5 class="title">Notre Adresse</h5>
                        <p>{{ $settingValue['hospital_address']['value'] }}</p>
                    </div> <!-- /.address-block-two -->
                </div>
                <div class="col-md-4">
                    <div class="address-block-two text-center mb-40 wow fadeInUp">
                        <div class="icon border rounded-circle d-flex align-items-center justify-content-center m-auto">
                            <img src="images/icon/icon_179.svg" alt="">
                        </div>
                        <h5 class="title">Coordonnées</h5>
                        <p>Ouvrez un chat ou appelez-nous au <br><a
                                href="tel:{{ $settingValue['hospital_phone']['value'] }}"
                                class="call">{{ $settingValue['hospital_phone']['value'] }}</a></p>
                    </div> <!-- /.address-block-two -->
                </div>
                <div class="col-md-4">
                    <div class="address-block-two text-center mb-40 wow fadeInUp">
                        <div class="icon border rounded-circle d-flex align-items-center justify-content-center m-auto">
                            <img src="images/icon/icon_180.svg" alt="">
                        </div>
                        <h5 class="title">Support en Direct</h5>
                        <p>Service de chat en direct <br><a href="mailto:{{ $settingValue['hospital_email']['value'] }}"
                                class="webaddress">{{ $settingValue['hospital_email']['value'] }}</a></p>
                    </div> <!-- /.address-block-two -->
                </div>
            </div>
        </div>

        <div class="contact-meta mt-110 lg-mt-40 border-top">
            <div class="row gx-0">
                <div class="col-lg-6 order-lg-last d-flex">
                    <div class="form-wrapper pt-60 lg-pt-40 pb-85 lg-pb-50 w-100">
                        <div class="form-style-five">
                            <h3 class="form-title fw-normal pb-30 lg-pb-20">Envoyer un message.</h3>
                            <form id="enquiryCreateForm">
                                @csrf
                                @method('POST')
                                <div class="ajax-message"></div>
                                @if ($errors->any())
                                    <div class="alert alert-danger">
                                        <ul class="mb-0">
                                            @foreach ($errors->all() as $error)
                                                <li>{{ $error }}</li>
                                            @endforeach
                                        </ul>
                                    </div>
                                @endif
                                <div class="messages"></div>
                                <div class="row controls">
                                    <div class="col-12">
                                        <div class="input-group-meta form-group mb-30">
                                            <label>Nom*</label>
                                            <input type="text" placeholder="John Doe" name="full_name" id="full_name"
                                                class="form-control"
                                                data-error="{{ __('messages.web_contact.enter_your_name') }}"
                                                required="required">
                                            <div class="help-block with-errors"></div>
                                        </div>
                                    </div>
                                    <div class="col-12">
                                        <div class="input-group-meta form-group mb-45">
                                            <label>Email*</label>
                                            <input type="email" placeholder="johndoe@gmail.com" name="email"
                                                id="email" class="form-control"
                                                data-error="{{ __('messages.web_contact.enter_your_email') }}"
                                                required="required" data-error="Valid email is required.">
                                            <div class="help-block with-errors"></div>
                                        </div>
                                    </div>
                                    <div class="col-12">
                                        <div class="input-group-meta form-group mb-45">
                                            <label>Type*</label>
                                            <div class="contact-form__input-block">
                                                <select name="type" class="contactUsGeneral selectized"
                                                    id="contactUsGeneral">
                                                    <option value="1">{{ \App\Models\Enquiry::TYPE_GENERAL }}</option>
                                                    <option value="2">{{ \App\Models\Enquiry::TYPE_FEEDBACK }}
                                                    </option>
                                                    <option value="3">{{ \App\Models\Enquiry::TYPE_RESIDENTIAL }}
                                                    </option>
                                                </select>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-12">
                                        <div class="input-group-meta form-group mb-45">
                                            <textarea placeholder="Votre message*" name="message" required="required"
                                                data-error="Veuillez nous laisser un message."></textarea>
                                            <div class="help-block with-errors"></div>
                                        </div>
                                    </div>
                                    <div class="col-12">
                                        <input type="hidden" value="{{ config('app.recaptcha.sitekey') }}"
                                            id="adminRecaptcha">
                                        @if (config('app.recaptcha.sitekey'))
                                            <div class="form-group mb-4 captcha-customize">
                                                <div class="g-recaptcha" id="g-recaptcha"
                                                    data-sitekey="{{ config('app.recaptcha.sitekey') }}">
                                                </div>
                                            </div>
                                        @endif
                                    </div>
                                    <div class="col-12"><button
                                            class="btn-twentyTwo w-100 fw-500 tran3s text-uppercase">Envoyer
                                            le message</button></div>
                                </div>
                            </form>
                        </div> <!-- /.form-style-five -->
                    </div> <!-- /.form-wrapper -->
                </div>
                <div class="col-lg-6 order-lg-first d-flex">
                    <div class="map-area-two h-100 w-100">
                        <div class="mapouter">
                            <div class="gmap_canvas">
                                <iframe class="gmap_iframe"
                                    src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d1714.5071994510079!2d-7.632833526846829!3d33.586942125763194!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0xda7d39947436b21%3A0x9688036bdc4fa60b!2sDigital%20Partnership%20Group!5e0!3m2!1sen!2sma!4v1713350986911!5m2!1sen!2sma"
                                    width="600" height="450" style="border:0;" allowfullscreen="" loading="lazy"
                                    referrerpolicy="no-referrer-when-downgrade"></iframe>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div> <!-- /.contact-meta -->
    </div> <!-- /.contact-section-four -->



    <button class="scroll-top">
        <i class="bi bi-arrow-up-short"></i>
    </button>
@endsection
@section('page_scripts')
    {{-- <script src='https://www.google.com/recaptcha/api.js'></script> --}}
    {{--    <script src="{{ asset('assets/js/int-tel/js/intlTelInput.min.js') }}"></script> --}}
    {{--    <script src="{{ asset('assets/js/int-tel/js/utils.min.js') }}"></script> --}}
    {{--    <script src="{{ mix('assets/js/custom/phone-number-country-code.js') }}"></script> --}}
    {{--    <script src="{{ mix('assets/js/custom/custom.js') }}"></script> --}}
    {{--    <script src="{{ mix('assets/js/front_settings/contact_us.js') }}"></script> --}}
@endsection