@extends('frontend.layouts.default')

@section('title', 'Bienvenue')

@section('content')
<div class="container-fluid p-0 pt-5 bg-light">
    <div class="row">
        <div class="col-md-5 p-0">
            <div style="background: url({{ url('assets/images/back.png') }});">
                <iframe width="100%" height="526" src="https://www.youtube.com/embed/DC2--cO_5_4"
                    title="Investir en Guinée grâce au Portail des Investissements" frameborder="0"
                    allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
                    referrerpolicy="strict-origin-when-cross-origin" allowfullscreen>
                </iframe>
            </div>
        </div>
        <div class="col-md-7 bg-primary">
            <div class="procedures">
                <div class="mb-3">
                    <h3>Comment faire une demande en ligne ?</h3>
                    <p>
                        Lorem ipsum dolor sit amet consectetur, adipisicing elit. Ut nam quibusdam magnam? Officia
                        dolorum ipsam, beatae a quae veritatis dignissimos! Est libero inventore perferendis nostrum,
                        nulla in itaque repellat dolore?
                    </p>
                </div>
                <div class="accordion mb-3" id="accordionExample">
                    <div class="accordion-item mb-3">
                        <h2 class="accordion-header">
                            <button class="accordion-button" type="button" data-bs-toggle="collapse"
                                data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
                                <span class="fw-bold"><span class="text-danger">01 - </span>S'inscrire</span>
                            </button>
                        </h2>
                        <div id="collapseOne" class="accordion-collapse collapse show"
                            data-bs-parent="#accordionExample">
                            <div class="accordion-body">
                                <ul>
                                    <li>Cliquez sur le bouton <strong><a class="text-secondary"
                                                href="{{ route('register') }}">S'inscrire</a></strong></li>
                                    <li>Remplir le formulaire d'inscription.</li>
                                    <li>Un e-mail de confirmation sera envoyé à l'adresse fournie.</li>
                                    <li>Ouvrez votre boîte e-mail et cliquez sur le lien de vérification dans le message
                                        pour activer votre compte</li>
                                    <li>Connexion au compte
                                        Une fois votre compte activé, retournez sur le site. Cliquez sur <strong><a
                                                class="text-secondary" href="login">Se Connecter</a></strong></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <div class="accordion-item mb-3">
                        <h2 class="accordion-header">
                            <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse"
                                data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
                                <span class="fw-bold"><span class="text-danger">02 - </span>Se connecter</span>
                            </button>
                        </h2>
                        <div id="collapseTwo" class="accordion-collapse collapse" data-bs-parent="#accordionExample">
                            <div class="accordion-body">
                                <ul>
                                    <li>Cliquez sur le bouton <strong><a class="text-secondary"
                                                href="{{ route('login') }}">Se
                                                Connecter</a></strong></li>
                                    <li>Entrer vos informations de connexion.</li>
                                    <li><strong>Mot de passe oublié ?</strong>
                                        <ul>
                                            <li>Si vous avez oublié votre mot de passe, cliquez sur le lien <a
                                                    href="{{ route('password.request') }}" class="text-secondary">Mot de
                                                    passe oublié</a> sur le formulaire de connexion</li>
                                            <li>Entrez votre adresse e-mail pour recevoir un lien de réinitialisation de
                                                mot de passe</li>
                                            <li>Consultez votre e-mail, cliquez sur le lien, puis suivez les
                                                instructions
                                                pour créer un nouveau mot de passe</li>
                                        </ul>

                                    </li>
                                    <li>Ouvrez votre boîte e-mail et cliquez sur le lien de vérification dans le message
                                        pour activer votre compte</li>
                                    <li>Connexion au compte
                                        Une fois votre compte activé, retournez sur le site. Cliquez sur <strong><a
                                                class="text-secondary" href="login">Se Connecter</a></strong></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <div class="accordion-item mb-3">
                        <h2 class="accordion-header">
                            <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse"
                                data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
                                <span class="fw-bold"><span class="text-danger">03 - </span>Faire une demande</span>
                            </button>
                        </h2>
                        <div id="collapseThree" class="accordion-collapse collapse" data-bs-parent="#accordionExample">
                            <div class="accordion-body">
                                <ul>
                                    <li>Accéder à la page de demande à travers ce lien <a class="text-secondary"
                                            href="{{ route('demande.add') }}">Faire une demande</a></li>
                                    <li><strong>Remplir le formulaire de demande</strong>
                                        <ul>
                                            <li><strong>Nom de la demande : </strong>Décrivez en quelques mots
                                                l’objet de votre
                                                demande.</li>
                                            <li><strong>Type document : </strong>Choisissez le type de demande que
                                                vous souhaitez
                                                effectuer dans le menu déroulant.</li>
                                            <li><strong>Documents joints : </strong>Joindre les documents demandes
                                                (formats acceptés
                                                : PDF, DOC, DOCX, XLS, XLSX, JPG, JPEG, PNG).</li>
                                            <li><strong>Description : </strong>Fournissez une description détaillée
                                                de votre demande.
                                                Plus vous êtes précis, plus il sera facile de traiter votre demande.
                                            </li>
                                        </ul>
                                    </li>
                                    <li><strong>Vérifier les informations</strong>
                                        <ul>
                                            <li>Avant de soumettre la demande, relisez toutes les informations pour vous
                                                assurer qu'elles sont correctes.</li>
                                        </ul>
                                    </li>
                                    <li><strong>Effectuer le paiement</strong>
                                        <ul>
                                            <li>Choisir un mode de paiement.</li>
                                        </ul>
                                    </li>
                                    <li><strong>Soumettre la demande</strong>
                                        <ul>
                                            <li>Cliquez sur le bouton Soumettre pour envoyer votre demande.</li>
                                            <li>Un message de confirmation apparaîtra, indiquant que votre demande a été
                                                reçue.</li>
                                        </ul>
                                    </li>
                                    <li><strong>Suivi de la demande</strong>
                                        <ul>
                                            <li>Vous pouvez suivre l'état de votre demande dans l'onglet Mes demandes.
                                            </li>
                                            <li>Vous recevrez des notifications par e-mail à chaque mise à jour
                                                concernant votre demande.</li>
                                        </ul>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <div>
                        <a class="btn btn-lg bg-white border w-100" href="#">Télécharger le guide en PDF</a>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div style="background: #d1e7dd; height: 300px;">
                <iframe
                    src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3934.945494493166!2d-13.7152814!3d9.5134653!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0xf1cd1e30d869301%3A0xda4c498e615c45ad!2sMinist%C3%A8re%20de%20l&#39;Industrie%20et%20des%20Petites%20et%20Moyennes%20Entreprises!5e0!3m2!1sfr!2s!4v1726966111913!5m2!1sfr!2s"
                    width="100%" height="100%" style="border:0;" allowfullscreen="" loading="lazy"
                    referrerpolicy="no-referrer-when-downgrade"></iframe>
            </div>
        </div>
        {{-- <div class="row">
            <div class="d-flex align-items-center justify-content-center" style="background: #d1e7dd; height: 50vh;">
                <div class="text-center">
                    <h3>Appelez-nous pour une demande</h3>
                    <p>Nous sommes disponible pour toutes vos demandes.</p>
                    <a class="btn btn-secondary" href="tel:">Appelez nous</a>
                </div>
            </div>
        </div> --}}
        <div class="container py-5">
            <div class="row">
                <div class="container">
                    <div class="col-md-12">
                        <div class="container mb-3">
                            <h3 class="text-uppercase text-secondary">Nous contacter</h3>
                        </div>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-md-6">
                    <div class="container">
                        <div class="bg-white shadow text-center p-4 mb-3">
                            <div class="text-center">
                                <i class="fa fa-map-marker fs-3"></i>
                            </div>
                            <h5>Adresse</h5>
                            <p>Almamya 13 Conakry, République de Guinée</p>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-6">
                            <div class="bg-white shadow text-center p-4 mb-3">
                                <div class="text-center">
                                    <i class="fa fa-envelope fs-3"></i>
                                </div>
                                <h5>Email</h5>
                                <p>info@mcipme.gov.gn</p>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="bg-white shadow text-center p-4 mb-3">
                                <div class="text-center">
                                    <i class="fa fa-phone fs-3"></i>
                                </div>
                                <h5>Téléphone</h5>
                                <p>(+224) 625 67 71 07</p>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- Contact Form -->
                <div class="col-md-6">
                    <div class="container">
                        <div class="row">
                            <div class="bg-white shadow text-center p-4 mb-3">
                                <form action="" method="POST">
                                    @csrf
                                    <div class="row">
                                        <div class="col-md-6">
                                            <div class="form-floating mb-3">
                                                <input required type="text" name="name" value="{{ old('name') }}"
                                                    class="form-control @error('name') is-invalid @enderror"
                                                    id="floatingText" placeholder="">
                                                <label for="floatingText">Nom : *</label>
                                                @error('name')
                                                <span class="invalid-feedback">
                                                    {{ $message }}
                                                </span>
                                                @enderror
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="form-floating mb-3">
                                                <input required type="email" name="email" value="{{ old('email') }}"
                                                    class="form-control @error('email') is-invalid @enderror"
                                                    id="floatingText" placeholder="">
                                                <label for="floatingText">Email : *</label>
                                                @error('email')
                                                <span class="invalid-feedback">
                                                    {{ $message }}
                                                </span>
                                                @enderror
                                            </div>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="col-md-12">
                                            <div class="form-floating mb-3">
                                                <input required type="text" name="subject" value="{{ old('subject') }}"
                                                    class="form-control @error('subject') is-invalid @enderror"
                                                    id="floatingText" placeholder="">
                                                <label for="floatingText">Sujet : *</label>
                                                @error('subject')
                                                <span class="invalid-feedback">
                                                    {{ $message }}
                                                </span>
                                                @enderror
                                            </div>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="col-md-12">
                                            <div class="mb-3">
                                                <textarea required name="message" cols="30" rows="5"
                                                    class="form-control @error('message') is-invalid @enderror"
                                                    placeholder="Message : *">{{ old('message') }}</textarea>
                                                @error('message')
                                                <span class="invalid-feedback">
                                                    {{ $message }}
                                                </span>
                                                @enderror
                                            </div>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="col-md-12">
                                            <button class="btn btn-secondary btn-lg" type="submit"><i
                                                    class="fa fa-location-arrow"></i> Envoyer</button>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    @endsection