{{--Auth connected Country--}}
<input type="hidden" value="{{\Illuminate\Support\Facades\Auth::guest() ? 'not' : (isset(\Illuminate\Support\Facades\Auth::user()->country) ? \Illuminate\Support\Facades\Auth::user()->country : 'not')}}" id="userConnectedCountry">

<div id="gloablReclamationModal" class="modal fade">
    <div class="modal-dialog modal-lg">
        <form name="gloablReclamationForm" method="post" id="reclamation_form" enctype="multipart/form-data"
              action="{{route("reclamation.add_up")}}">
            @csrf

            <div class="modal-content" style="border-radius: 0px;">
                <div class="modal-header">
                    <h4 class="modal-title"><i class="fa fa-plus"></i>
                         Faire une reclamation </h4>
                </div>
                <div class="modal-body">

                    <div>
                        <div class="row">

                            <div class="form-group col-md-12 col-xs-12">
                                <label>Votre Nom et Prenom Client.</label><span style="color: red"> (requis)</span><br>
                                <input type="text" id="name"
                                       name="name" class="form-control"
                                       placeholder="Nom" style="width: 100%;" value="">
                            </div>
                            <div class="form-group col-md-6 col-sm-12 col-xs-12">
                                <label class="text-uppercase">Téléphone <span style="color: red"> (requis)</span></label>
                                <input type="text" id="telephone"
                                name="telephone" class="form-control"
                                placeholder="Téléphone" style="width: 100%;" value="">
                            </div>

                            <div class="form-group col-md-6 col-sm-12 col-xs-12">
                                <label class="text-uppercase">Votre adresse email <span style="color: red"> (requis)</span></label>
                                <input type="text" id="email"
                                name="email" class="form-control"
                                placeholder="Email" style="width: 100%;" value="">
                            </div>
                            <div class="form-group col-md-6 col-sm-12 col-xs-12">
                                <label class="text-uppercase">Quand est ce que vous avez effectué la transaction? <span style="color: red"> (requis)</span></label>
                                <input type="datetime-local" id="date"
                                name="date" class="form-control"
                                placeholder="Chosir la date"  style="width: 100%;">
                            </div>
                            <div class="form-group col-md-6 col-sm-12 col-xs-12">
                                <label class="text-uppercase">Type <span style="color: red"> (requis)</span></label>
                                <select id="type"  name="type" class="form-control" placeholder="Type" style="width: 100%;" value="">
                                    <option value="commande">Commande</option>
                                    <option value="mib">MIB</option>
                                </select>
                            </div>


                            <div class="form-group col-md-6 col-sm-12 col-xs-12">
                                <label class="text-uppercase">Référence de paiement : Sur Mobile money, ceci represente l'ID externe de la transaction. <span style="color: red"> (requis)</span></label>
                                <input type="text" id="reference"
                                name="reference" class="form-control"
                                placeholder="La reference" max="10" style="width: 100%;" value="">
                            </div>

                            <div class="form-group col-md-6 col-sm-12 col-xs-12">
                                <label class="text-uppercase">Insérer la capture d'écran de votre paiement <span style="color: red"> (requis)</span></label>
                                <input type="file" id="image"
                                name="image" class="form-control"
                                placeholder="Chosir l'image" style="width: 100%;">
                            </div>

                            <div class="form-group col-md-12 col-sm-12 col-xs-12">
                                <label class="text-uppercase">Veuillez s'il vous plaît être explicite sur le problème que vous rencontrer.
                                    <ul>
                                        <li>Commande :  veuillez s'il vous plait déclarer les produits de votre commande et le prix total que vous avez payé</li>
                                        <li>Panier MIB : Veillez à décrire les mensualités que vous avez payer et les contexte de l'erreur. A quelle étape le process à t'il été défaillant ?</li>
                                    </ul>
                                </label>

                                <textarea rows="3" id="message"
                                name="message" class="form-control"
                                placeholder="Votre message" style="width: 100%;"></textarea>
                            </div>

                        </div>
                    </div>
                    <div class="row">
                        <div class="modal-footer">
                            <button type="button" class="btn btn-default btn-sm" data-dismiss="modal">Fermer</button>
                            <input type="submit" name="action" id="action_add_article"
                                   class="btn btn-sm btn-primary"
                                   value="Reclammer"/>
                        </div>
                    </div>
                </div>
            </div>
        </form>
    </div>
</div>


       <div class="modal fade" data-backdrop="static" data-keyboard="false" id="user-welcome" tabindex="-1" role="dialog">
        <div class="modal-dialog modal-md modal-dialog-centered "  role="document">
            <div class="modal-content" style="background: #fff;border-radius: 0">
                <div class="modal-body">
                    <span class="countryModalClose" data-dismiss="modal" style="display: none"><i class="fa fa-close"></i></span>
                    <div class="col-lg-12 col-md-12">
                        <div class="row" style="color: #000">
                            <div class="col-lg-12 col-md-12 text-center pt-5">
                                <h2 class="welcomeText">BIENVENUE SUR SUNGROCERY</h2>
                                <h3 class="col-lg-12 col-md-12 text-center pb-3 pt-5 countryText">Dans quel pays résidez vous ?</h3>
                                <div class="col-lg-12 pb-4 text-left" style="padding-bottom: 20px;">
                                    <label style="border: none">Cliquez pour sélectionner un pays</label>
                                    <select name="country" id="countrySlect" class="form-control"  style="color: #0f0f0f"></select>
                                </div>
                                <div class="text-justify alert alert-light col-lg-12 pb-0 mb-0"><strong> <i class="fa fa-exclamation-triangle"></i> NB :</strong>
                                    <p>  Les moyens de paiments que vous utiliserez serons proposé suivant votre pays de localisation</p>
                                    <p>Les boutiques que vous consulterez serons affichés en fonction de votre pays de résidence.</p>
                                </div>

                                <p class="pt-4 pb-4 welcomeText" >Accedez au profil puis enregistrez votre pays pour ne plus revoir cette notification à chaque fois que la page se recharge </p>
                                <p class="pt-4 welcomeText" >Vous n'avez pas encore votre propre boutique ? </p>
                                <p class="pt-3 welcomeText"><a href="{{route('register')}}" style="color: #88b121">Inscrivez vous gratuitement  et créez votre espace de vente.</a> </p>

                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

<div class="localisation_panel pulse" title="cliquer pour changer de pays">
    Localisation: <span class="country_show"></span>
</div>