@extends('includes.layouts')

@section('content')
    <div class="iq-breadcrumb-one iq-bg-over iq-over-dark-50" style="background-image: url({{ asset('images/banner/sondage.jpg') }});">
        <div class="container-fluid">
            <div class="row align-items-center">
                <div class="col-sm-12">
                    <nav aria-label="breadcrumb" class="text-center iq-breadcrumb-two">
                        <h2 class="title">Sondage</h2>
                        <ol class="breadcrumb main-bg">
                            <li class="breadcrumb-item"><a href="{{ route('home') }}">Accueil</a></li>
                            <li class="breadcrumb-item active">Sondage</li>
                        </ol>
                    </nav>
                </div>
            </div>
        </div>
    </div>
    <main id="main" class="site-main watchlist-contens">
        <div class="container-fluid">
            <p>Chèr(e) passager</p>
            <p>Dans le but de rendre votre voyage plus agréable, Nous développons actuellement une plateforme de streaming interactive Moov Screen qui vous permet de profiter de contenus exclusifs tout le long du trajet.
                Merci de bien vouloir participer à cette enquête de satisfaction en remplissant quelques informations.
                </p>
            <div>Nb :
                <ul>
                    <li>La durée estimative de cette enquête est de 3 minutes.</li>
                    <li>Toutes vos réponses à cette enquête sont anonymes, personnelles et confidentielles.</li>
                </ul>
            </div>
            <form method="post" action="#">
                <ol>
                    <li class="form-group">
                        <label>Quel est votre sexe ?</label>
                        <div class="col-md-10 row">
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="gender" id="customRadio1" value="Homme" class="custom-control-input">
                                <label class="custom-control-label" for="customRadio1">Homme</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="gender" id="customRadio2" value="Femme" class="custom-control-input">
                                <label class="custom-control-label" for="customRadio2">Femme</label>
                            </div>
                        </div>
                    </li>
                    <li class="form-group">
                        <label>Quel âge avez-vous ?</label>
                        <div class="col-md-10 row">
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" id="customRadio3" name="age_range" class="custom-control-input" value="15-29ans">
                                <label class="custom-control-label" for="customRadio3">15-29ans</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" id="customRadio4" name="age_range" class="custom-control-input" value="30-39ans">
                                <label class="custom-control-label" for="customRadio4">30-39ans</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" id="customRadio5" name="age_range" class="custom-control-input" value="40-49ans">
                                <label class="custom-control-label" for="customRadio5">40-49ans</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" id="customRadio6" name="age_range" class="custom-control-input" value="50ans et +">
                                <label class="custom-control-label" for="customRadio6">50ans et +</label>
                            </div>
                        </div>
                    </li>
                    <li class="form-group">
                        <label>Quel est votre catégorie socioprofessionnelle ?</label>
                        <div class="col-md-10 row">
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" id="customRadio7" name="professional_category" class="custom-control-input" value="Agriculteurs exploitants">
                                <label class="custom-control-label" for="customRadio7">Agriculteurs exploitants</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-5">
                                <input type="radio" name="professional_category" id="customRadio8" class="custom-control-input" value="Artisans, commerçants et chefs d'entreprise">
                                <label class="custom-control-label" for="customRadio8">Artisans, commerçants et chefs d'entreprise</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-5">
                                <input type="radio" name="professional_category" id="customRadio9" class="custom-control-input" value="Cadres et professions intellectuelles supérieures">
                                <label class="custom-control-label" for="customRadio9">Cadres et professions intellectuelles supérieures</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="professional_category" id="customRadio10" class="custom-control-input" value="Employés">
                                <label class="custom-control-label" for="customRadio10">Employés</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="professional_category" id="customRadio11" class="custom-control-input" value="Ouvriers">
                                <label class="custom-control-label" for="customRadio11">Ouvriers</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="professional_category" id="customRadio12" class="custom-control-input" value="Retraités">
                                <label class="custom-control-label" for="customRadio12">Retraités</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-4">
                                <input type="radio" name="professional_category" id="customRadio13" class="custom-control-input" value="Autres personnes sans activité">
                                <label class="custom-control-label" for="customRadio13">Autres personnes sans activité</label>
                            </div>
                        </div>
                    </li>
                    <li class="form-group">
                        <label>Connaissez-vous le concept de plate-forme de vidéo à la demande ?</label>
                        <div class="col-md-10 row">
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="know_concept" id="customRadio14" class="custom-control-input" value="Oui">
                                <label class="custom-control-label" for="customRadio14">Oui</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="know_concept" id="customRadio15" class="custom-control-input" value="Non">
                                <label class="custom-control-label" for="customRadio15">Non</label>
                            </div>
                        </div>
                        <label>Si Oui, seriez-vous intéressés par l’utilisation de notre plate-forme Moov Screen durant les voyages :</label>
                        <div class="col-md-10 row">
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="interested_travel_period" id="customRadio16" class="custom-control-input" value="Du matin">
                                <label class="custom-control-label" for="customRadio16">Du matin</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="interested_travel_period" id="customRadio17" class="custom-control-input" value="De midi">
                                <label class="custom-control-label" for="customRadio17">De midi</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="interested_travel_period" id="customRadio18" class="custom-control-input" value="Du soir">
                                <label class="custom-control-label" for="customRadio18">Du soir</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-4">
                                <input type="radio" name="interested_travel_period" id="customRadio19" class="custom-control-input" value="Tous les voyages">
                                <label class="custom-control-label" for="customRadio19">Tous les voyages</label>
                            </div>
                        </div>
                    </li>
                    <li class="form-group">
                        <label>Comment avez-vous trouvé le processus d’inscription et de connexion à notre plate-forme de vidéo à la demande Moov Screen ?</label>
                        <div class="col-md-10 row">
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="registration_process" id="customRadio20" class="custom-control-input" value="Simple">
                                <label class="custom-control-label" for="customRadio20">Simple</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="registration_process" id="customRadio21" class="custom-control-input" value="Compliqué">
                                <label class="custom-control-label" for="customRadio21">Compliqué</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="registration_process" id="customRadio22" class="custom-control-input" value="Très compliqué">
                                <label class="custom-control-label" for="customRadio22">Très compliqué</label>
                            </div>
                        </div>
                    </li>
                    <li class="form-group">
                        <label>Quel modèle de téléphone utilisez-vous pour vous connecter sur notre plate-forme Moov Screen ?</label>
                        <div class="col-md-10 row">
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="phone_model" id="customRadio23" class="custom-control-input" value="IPhone">
                                <label class="custom-control-label" for="customRadio23">IPhone</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="phone_model" id="customRadio24" class="custom-control-input" value="Samsung">
                                <label class="custom-control-label" for="customRadio24">Samsung</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="phone_model" id="customRadio25" class="custom-control-input" value="Tecno ou Infinix">
                                <label class="custom-control-label" for="customRadio25">Tecno ou Infinix</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="phone_model" id="customRadio26" class="custom-control-input" value="Autres Android">
                                <label class="custom-control-label" for="customRadio26">Autres Android</label>
                            </div>
                        </div>
                    </li>
                    <li class="form-group">
                        <label>Sur quel navigateur regardez-vous notre plate-forme Moov Screen ?</label>
                        <div class="col-md-10 row">
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="used_navigator" id="customRadio27" class="custom-control-input" value="Opéra Mini">
                                <label class="custom-control-label" for="customRadio27">Opéra Mini</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="used_navigator" id="customRadio28" class="custom-control-input" value="Safari">
                                <label class="custom-control-label" for="customRadio28">Safari</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="used_navigator" id="customRadio29" class="custom-control-input" value="Chrome">
                                <label class="custom-control-label" for="customRadio29">Chrome</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="used_navigator" id="customRadio30" class="custom-control-input" value="Firefox">
                                <label class="custom-control-label" for="customRadio30">Firefox</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="used_navigator" id="customRadio31" class="custom-control-input" value="Autre">
                                <label class="custom-control-label" for="customRadio31">Autre</label>
                            </div>
                        </div>
                    </li>
                    <li class="form-group">
                        <label>Sur la base de votre récente connexion sur notre plate-forme, pouvez-vous évaluer votre satisfaction sur la qualité globale de Moov Screen ?</label>
                        <div class="col-md-10 row">
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="global_satisfaction" id="customRadio32" class="custom-control-input" value="Pas du tout satisfait">
                                <label class="custom-control-label" for="customRadio32">Pas du tout satisfait</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="global_satisfaction" id="customRadio33" class="custom-control-input" value="Peu satisfait">
                                <label class="custom-control-label" for="customRadio33">Peu satisfait</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="global_satisfaction" id="customRadio34" class="custom-control-input" value="Neutre">
                                <label class="custom-control-label" for="customRadio34">Neutre</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="global_satisfaction" id="customRadio35" class="custom-control-input" value="Plutôt satisfait">
                                <label class="custom-control-label" for="customRadio35">Plutôt satisfait</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="global_satisfaction" id="customRadio36" class="custom-control-input" value="Très satisfait">
                                <label class="custom-control-label" for="customRadio36">Très satisfait</label>
                            </div>
                        </div>
                    </li>
                    <li class="form-group">
                        <label>Quel genre de musique vous intéresse ?</label>
                        <div class="col-md-10 row">
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="interested_music_type" id="customRadio37" class="custom-control-input" value="Bikutsi">
                                <label class="custom-control-label" for="customRadio37">Bikutsi</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="interested_music_type" id="customRadio38" class="custom-control-input" value="Bend skin">
                                <label class="custom-control-label" for="customRadio38">Bend skin</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="interested_music_type" id="customRadio39" class="custom-control-input" value="Makossa">
                                <label class="custom-control-label" for="customRadio39">Makossa</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="interested_music_type" id="customRadio40" class="custom-control-input" value="Afro-pop">
                                <label class="custom-control-label" for="customRadio40">Afro-pop</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="interested_music_type" id="customRadio41" class="custom-control-input" value="Afro-beats">
                                <label class="custom-control-label" for="customRadio41">Afro-beats</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="interested_music_type" id="customRadio42" class="custom-control-input" value="Hip-Hop">
                                <label class="custom-control-label" for="customRadio42">Hip-Hop</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="interested_music_type" id="customRadio43" class="custom-control-input" value="Rap">
                                <label class="custom-control-label" for="customRadio43">Rap</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="interested_music_type" id="customRadio44" class="custom-control-input" value="Jazz">
                                <label class="custom-control-label" for="customRadio44">Jazz</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="interested_music_type" id="customRadio45" class="custom-control-input" value="Classique">
                                <label class="custom-control-label" for="customRadio45">Classique</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="interested_music_type" id="customRadio46" class="custom-control-input" value="Autres">
                                <label class="custom-control-label" for="customRadio46">Autres</label>
                            </div>
                        </div>
                        <label>De quelle région du monde ?</label>
                        <div class="col-md-10 row">
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="interested_music_region" id="customRadio47" class="custom-control-input" value="Exclusivement camerounaise">
                                <label class="custom-control-label" for="customRadio47">Exclusivement camerounaise</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="interested_music_region" id="customRadio48" class="custom-control-input" value="Exclusivement africaine">
                                <label class="custom-control-label" for="customRadio48">Exclusivement africaine</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="interested_music_region" id="customRadio49" class="custom-control-input" value="Africaine et internationale">
                                <label class="custom-control-label" for="customRadio49">Africaine et internationale</label>
                            </div>
                        </div>
                    </li>
                    <li class="form-group">
                        <label>Quel genre de film vous intéresse ?</label>
                        <div class="col-md-10 row">
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="interested_movie_type" id="customRadio50" class="custom-control-input" value="Action, Aventure">
                                <label class="custom-control-label" for="customRadio50">Action, Aventure</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="interested_movie_type" id="customRadio51" class="custom-control-input" value="Comédie">
                                <label class="custom-control-label" for="customRadio51">Comédie</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="interested_movie_type" id="customRadio52" class="custom-control-input" value="Drame">
                                <label class="custom-control-label" for="customRadio52">Drame</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="interested_movie_type" id="customRadio53" class="custom-control-input" value="Fantastique">
                                <label class="custom-control-label" for="customRadio53">Fantastique</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="interested_movie_type" id="customRadio54" class="custom-control-input" value="Policier, Triller">
                                <label class="custom-control-label" for="customRadio54">Policier, Triller</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="interested_movie_type" id="customRadio55" class="custom-control-input" value="Science-fiction">
                                <label class="custom-control-label" for="customRadio55">Science-fiction</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="interested_movie_type" id="customRadio56" class="custom-control-input" value="Histoire">
                                <label class="custom-control-label" for="customRadio56">Histoire</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="interested_movie_type" id="customRadio57" class="custom-control-input" value="Romance">
                                <label class="custom-control-label" for="customRadio57">Romance</label>
                            </div>
                        </div>
                        <label>De quelle région du monde ?</label>
                        <div class="col-md-10 row">
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="interested_movie_region" id="customRadio58" class="custom-control-input" value="Exclusivement camerounaise">
                                <label class="custom-control-label" for="customRadio58">Exclusivement camerounaise</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="interested_movie_region" id="customRadio59" class="custom-control-input" value="Exclusivement africaine">
                                <label class="custom-control-label" for="customRadio59">Exclusivement africaine</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="interested_movie_region" id="customRadio60" class="custom-control-input" value="Africaine et internationale">
                                <label class="custom-control-label" for="customRadio60">Africaine et internationale</label>
                            </div>
                        </div>
                    </li>
                    <li class="form-group">
                        <label>Quels activités faites vous généralement pendant le voyage ?</label>
                        <div class="col-md-10 row">
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="activity_during_journey" id="customRadio61" class="custom-control-input" value="Lecture">
                                <label class="custom-control-label" for="customRadio61">Lecture</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="activity_during_journey" id="customRadio62" class="custom-control-input" value="Repos">
                                <label class="custom-control-label" for="customRadio62">Repos</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="activity_during_journey" id="customRadio63" class="custom-control-input" value="Activités sur le téléphone">
                                <label class="custom-control-label" for="customRadio63">Activités sur le téléphone</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="activity_during_journey" id="customRadio64" class="custom-control-input" value="Autre">
                                <label class="custom-control-label" for="customRadio64">Autre</label>
                            </div>
                        </div>
                    </li>
                    <li class="form-group">
                        <label>Pour quelle fourchette de prix seriez-vous prêt à souscrire à un abonnement par voyage ?</label>
                        <div class="col-md-10 row">
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="price_range" id="customRadio65" class="custom-control-input" value="100 Fcfa">
                                <label class="custom-control-label" for="customRadio65">100 Fcfa</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="price_range" id="customRadio66" class="custom-control-input" value="Entre 101 et 199 Fcfa">
                                <label class="custom-control-label" for="customRadio66">Entre 101 et 199 Fcfa</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="price_range" id="customRadio67" class="custom-control-input" value="Entre 200 et 299 Fcfa">
                                <label class="custom-control-label" for="customRadio67">Entre 200 et 299 Fcfa</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="price_range" id="customRadio68" class="custom-control-input" value="Plus de 300 Fcfa">
                                <label class="custom-control-label" for="customRadio68">Plus de 300 Fcfa</label>
                            </div>
                        </div>
                    </li>
                    <li class="form-group">
                        <label>Quelle est la probabilité pour que vous recommandiez notre service à votre entourage ?</label>
                        <div class="col-md-10 row">
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="probability_to_recommend" id="customRadio69" class="custom-control-input" value="Très faible">
                                <label class="custom-control-label" for="customRadio69">Très faible</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="probability_to_recommend" id="customRadio70" class="custom-control-input" value="Faible">
                                <label class="custom-control-label" for="customRadio70">Faible</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="probability_to_recommend" id="customRadio71" class="custom-control-input" value="Forte">
                                <label class="custom-control-label" for="customRadio71">Forte</label>
                            </div>
                            <div class="custom-control custom-radio mt-2 col-md-2">
                                <input type="radio" name="probability_to_recommend" id="customRadio72" class="custom-control-input" value="Très forte">
                                <label class="custom-control-label" for="customRadio72">Très forte</label>
                            </div>
                        </div>
                    </li>
                    <li class="form-group">
                        <label>Quels éléments pourriez-vous ajouter à ce service pour qu'il soit le plus optimal ?</label>
                        <textarea class="form-control col-7" name="element_to_add_to_service"></textarea>
                    </li>
                </ol>
                <div class="form-group" style="margin-left: 25px;margin-top: 25px;">
                    <button type="submit" class="btn btn-hover">Enregistrer</button>
                </div>
            </form>
        </div>
    </main>
@endsection