@extends('layouts.app')

@section('title', 'Contact - EquitAssistance')
@section('meta_description', 'Une question sur nos garanties ou votre contrat ? Contactez l’équipe Equitassistance pour obtenir des réponses rapides et personnalisées')
@section('robots', 'index follow')

@push('scripts')
    <script src="{{ asset('assets/js/ville.js') }}"></script>
@endpush

@section('content')
    <div class="page-header parallaxie">
        <div class="container">
            <div class="row">
                <div class="col-lg-12">
                    <div class="page-header-box">
                        <h1 class="" data-cursor="-opaque">Contacter EquitAssistance</h1>
                        <nav class="wow fadeInUp">
                            <ol class="breadcrumb">
                                <li class="breadcrumb-item"><a href="{{ url('/') }}">Accueil</a></li>
                                <li class="breadcrumb-item active" aria-current="page">Contacter Equitassistance</li>
                            </ol>
                        </nav>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="page-contact-us">
        <div class="container">
            <div class="row">
                <div class="col-12 contact-information">
                    @if(session('success'))
                        <div class="alert alert-success">
                            {{ session('success') }}
                        </div>
                    @endif

                    @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="section-title">
                        <p class="wow fadeInUp">contact</p>
                        <h2>Des questions ? Contactez nous !</h2>
                    </div>
                    <p class="wow fadeInUp" data-wow-delay="0.2s">
                        Si vous avez une question concernant le produit ou sur la souscription du contrat, nous vous invitons à remplir le formulaire afin que notre service clientèle vous réponde dans les meilleurs délais.<br>
                        Pour toute demande d'intervetion et d'assistance, nous vous laissons le soins d'appeler notre plateforme d'assistance.
                    </p>
                </div>


                <div class="col-lg-7">
                    <div class="contact-us-form">
                        <div class="contact-form">
                            <form id="contactForm" action="{{ route('contact.store') }}" method="POST" data-toggle="validator" class="wow fadeInUp" data-wow-delay="0.5s">
                                @csrf
                                <input type="text" name="website" class="d-none" tabindex="-1" autocomplete="off">
                                <div class="row">
                                    <div class="form-group col-md-6 mb-3">
                                        <input type="text" name="nom" class="form-control" id="nom" placeholder="Nom" required>
                                        <div class="help-block with-errors"></div>
                                    </div>
                                    <div class="form-group col-md-6 mb-3">
                                        <input type="text" name="prenom" class="form-control" id="prenom" placeholder="Prénom" required>
                                        <div class="help-block with-errors"></div>
                                    </div>
                                    <div class="form-group col-12 mb-3">
                                        <input type="text" name="adresse" class="form-control" id="adresse" placeholder="Adresse" required>
                                        <div class="help-block with-errors"></div>
                                    </div>
                                    <div class="form-group col-md-6 mb-3">
                                        <input type="text" name="cp" class="form-control" id="cp" placeholder="Code postal" required>
                                        <div class="help-block with-errors"></div>
                                    </div>
                                    <div class="form-group col-md-6 mb-3">
                                        <input type="text" name="ville" class="form-control" id="ville" placeholder="Ville" required>
                                        <div class="help-block with-errors"></div>
                                    </div>
                                    <div class="col-sm-12">
                                        <div class="position-relative">
                                            <ul class="list-group custom-list" id="listLocation">
                                            </ul>
                                        </div>
                                    </div>
                                    <div class="form-group col-md-6 mb-3">
                                        <input type="email" name="email" class="form-control" id="email" placeholder="Email" required>
                                        <div class="help-block with-errors"></div>
                                    </div>
                                    <div class="form-group col-md-6 mb-3">
                                        <input type="text" name="telephone" class="form-control" id="telephone" placeholder="Téléphone" required>
                                        <div class="help-block with-errors"></div>
                                    </div>
                                    <div class="form-group col-md-12 mb-3">
                                        <textarea name="message" class="form-control" id="message" rows="4" placeholder="Message"></textarea>
                                        <div class="help-block with-errors"></div>
                                    </div>
                                    <div class="col-12 mb-5">
                                        <span class="d-block fw-bold mb-1">Vous êtes :</span>
                                        <div class="form-check form-check-inline">
                                            <input class="form-check-input" type="radio" name="type-client" id="particulier" checked>
                                            <label class="form-check-label" for="particulier">
                                                Particulier
                                            </label>
                                        </div>
                                        <div class="form-check form-check-inline">
                                            <input class="form-check-input" type="radio" name="type-client" id="professionnel">
                                            <label class="form-check-label" for="professionnel">
                                                Professionnel
                                            </label>
                                        </div>
                                        <div class="form-check form-check-inline">
                                            <input class="form-check-input" type="radio" name="type-client" id="proTransport">
                                            <label class="form-check-label" for="proTransport">
                                                Pro du transport
                                            </label>
                                        </div>
                                    </div>

                                    @php
                                        $a = random_int(2, 9);
                                        $b = random_int(2, 9);
                                        session(['captcha_sum' => $a + $b]);
                                    @endphp

                                    <div class="col-md-12">
                                        <div class="form-group col-md-12 mb-3">
                                            <label for="captcha">Anti-spam : Combien font {{ $a }} + {{ $b }} ?</label>
                                            <input type="number" name="captcha" id="captcha" class="form-control" required>
                                        </div>
                                    </div>

                                    <div class="col-md-12">
                                        <button type="submit" class="btn-default">Envoyer message</button>
                                        <div id="msgSubmit" class="h3 hidden"></div>
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>

                <div class="col-lg-5">
                    <div class="contact-information">
                        @include('partials.coordonnees', ['col' => 'col-12'])
                    </div>
                </div>
            </div>
        </div>
    </div>

    @include('partials.faq')

    {{--<div class="google-map">
        <div class="container-flude">
            <div class="row">
                <div class="col-lg-12">
                    <div class="google-map-iframe">
                        <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2776.797545295912!2d4.4338724768355995!3d45.89536207108438!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x47f464270cca934d%3A0x9c85593616173598!2s4%20Rue%20Pelletier%2C%2069170%20Tarare!5e0!3m2!1sfr!2sfr!4v1752756885807!5m2!1sfr!2sfr" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
                    </div>
                </div>
            </div>
        </div>
    </div>--}}
@endsection