@extends('base')
@section('title', 'Accueil | Plateforme Juridique des PME du Gabon')
@section('content')

    <!-- Carrousel -->
    <div id="carouselExampleAutoplaying" class="carousel slide" data-bs-ride="carousel">
        <div class="carousel-inner">
            <div class="carousel-item active">
                <img src="{{asset('assets/website/img/image_accueil1.jpeg')}}" class="d-block w-100" alt="Image 1">
                <div class="carousel-caption">
                    <h2 class="animated-text">Un accès rapide et structuré aux <span>textes juridiques</span></h2>
                    <p class="animated-text">Trouvez facilement les lois et réglementations adaptées aux PME et TPE.</p>
                </div>
            </div>
            <div class="carousel-item">
                <img src="{{asset('assets/website/img/image_accueil2.jpeg')}}" class="d-block w-100" alt="Image 2">
                <div class="carousel-caption">
                    <h2 class="animated-text">Répertoire des <span>institutions financières</span></h2>
                    <p class="animated-text">Découvrez les banques, fonds d’investissement et microfinances pour vos projets.</p>
                </div>
            </div>
            {{-- <div class="carousel-item">
                <img src="{{asset('assets/website/img/accueil5.jpg')}}" class="d-block w-100" alt="Image 3">
                <div class="carousel-caption">
                    <h2 class="animated-text">Restez informé des <span>nouvelles réglementations</span></h2>
                    <p class="animated-text">Abonnez-vous à notre newsletter pour ne rien manquer des mises à jour.</p>
                </div>
            </div> --}}
        </div>
        <button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleAutoplaying" data-bs-slide="prev">
            <span class="carousel-control-prev-icon" aria-hidden="true"></span>
            <span class="visually-hidden">Previous</span>
        </button>
        <button class="carousel-control-next" type="button" data-bs-target="#carouselExampleAutoplaying" data-bs-slide="next">
            <span class="carousel-control-next-icon" aria-hidden="true"></span>
            <span class="visually-hidden">Next</span>
        </button>
    </div>


    <!-- Principales Fonctionnalités de l'application -->
    <div class="container features-container" style="padding-top: 40px; padding-bottom: 40px;" data-aos="fade-up">

        <a href="{{url('textes-juridiques/administrations-publiques')}}" class="feature-link">
            <div class="feature-card">
                <i class="fas fa-balance-scale"></i>
                <h4>Textes législatifs et règlementaires des administrations publiques</h4>
                <p>Réglementations et lois encadrant les activités des administrations publiques.</p>
                <span class="btn-cta">Consulter</span>
            </div>
        </a>

        <a href="{{url('textes-juridiques/pme')}}" class="feature-link">
            <div class="feature-card">
                <i class="fas fa-briefcase"></i>
                <h4>Textes législatifs et règlementaires pour les PME</h4>
                <p>Normes et obligations légales spécifiques aux petites et moyennes entreprises.</p>
                <span class="btn-cta">Consulter</span>
            </div>
        </a>

        <a href="{{url('textes-juridiques/regionaux-internationaux')}}" class="feature-link">
            <div class="feature-card">
                <i class="fas fa-globe"></i>
                <h4>Textes juridiques régionaux et internationaux</h4>
                <p>Accords, conventions et traités influençant le droit des affaires au niveau mondial.</p>
                <span class="btn-cta">Consulter</span>
            </div>
        </a>

    </div>


    <section class="blocs-download py-5" data-aos1="fade-up">
        <div class="container">
            <h1 class="text-center">Les textes juridiques sur les PME récents</h1>
            <br>
            <nav class="text-center mb-3">
                {{-- <a href="#">Accueil</a> > <a href="#">Sur Les PME EP</a> --}}
            </nav>

            <div class="row">
                @if(!empty($texteJuridiques))
                    @foreach ($texteJuridiques as $tj)
                    <div class="col-12 col-sm-6 col-md-4 col-lg-4 mb-4">
                        <div class="document d-flex flex-column justify-content-between align-items-center p-3 shadow-sm rounded h-100">
                            <i class="fas fa-file-pdf fa-3x text-danger"></i>
                            <div class="info text-center">
                                <p class="mb-2">{{$tj->titre}}</p>
                            </div>
                            <a href="{{ route('download', ['filename' => $tj->fichier_pdf]) }}" class="btn btn-sm btn-success mt-auto">Télécharger</a>
                        </div>
                    </div>
                    @endforeach
                    <div class="text-center text-muted" style="padding-top: 20px;" data-aos="fade-up">
                        <a href="{{url('textes-juridiques')}}" class="btn btn-sm btn-success mt-auto">Voir plus</a>
                    </div>
                @else
                    <p class="text-center text-muted">Aucun texte juridique trouvé.</p>
                @endif
            </div>
        </div>
    </section>



    <section class="bloc-recherche py-5" data-aos="fade-up">
        <div class="container">
            <div class="search-filter-container text-center">
                <div style="padding-bottom: 20px">
                    <h3>Recherche de Textes Juridiques</h3>
                </div>
                <br>
                <div class="search-filter row justify-content-center">
                    <div class="col-md-3 col-12">
                        <input type="text" id="searchInput" class="form-control" placeholder="Rechercher un texte juridique...">
                    </div>
                    <div class="col-md-3 col-12 m-top">
                        <select id="categorySelect" class="form-select">
                            <option value="">Sélectionner une catégorie</option>
                            @if(!empty($categories))
                                @foreach($categories as $category)
                                    <option value="{{$category->nom}}">{{$category->nom}}</option>
                                @endforeach
                            @endif

                        </select>
                    </div>
                    <div class="col-md-3 col-12 m-top m-bot">
                        <select id="sous-categorySelect" class="form-select">
                            <option value="">Sélectionner une sous-catégorie</option>
                            @if(!empty($secteurs))
                                @foreach($secteurs as $category)
                                    <option value="{{$category->nom}}">{{$category->nom}}</option>
                                @endforeach
                            @endif

                        </select>
                    </div>
                    <div class="col-md-3 col-12 text-md-start text-center mt-2 mt-md-0">
                        <button id="searchButton" class="btn btn-success w-100">Rechercher</button>
                    </div>
                </div>
                <div id="searchResults" class="row mt-4">
                    <!-- Les résultats filtrés s'affichent ici -->
                </div>
            </div>
        </div>
    </section>




@stop