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



    <section class="institutions">
        <header>
            <h1>Struture d'Encadrement et d'Accompagnement</h1>
            {{-- <p>Trouvez l'institution financière adaptée à vos besoins</p> --}}
        </header>

        <div class="search-container">
            <input type="text" id="searchInput" placeholder="Rechercher une institution..." onkeyup="filterInstitutionsSea()">
            {{-- <select id="typeFilter" onchange="filterInstitutions()">
                <option value="">Type d'institution</option>
                @if(!empty($types))
                    @foreach($types as $type)
                        <option value="{{ strtolower($type->nom) }}">{{ $type->nom }}</option>
                    @endforeach
                @endif
            </select> --}}
        </div>

        <div class="container" id="institutionContainer" style="padding-top: 10px;">
            @include('website.partials.institution-items')
        </div>

        <div class="text-center mt-4">
            @if ($institutionFinancieres->hasMorePages())
                <button id="load-more-institutionsSea" class="btn btn-sm btn-success mt-auto" data-next-page="{{ $institutionFinancieres->currentPage() + 1 }}">Voir plus</button>
            @endif
        </div>

    </section>

    <style>
        h2 {
        margin: 0; /* Retirer les marges par défaut */
        padding: 0; /* Retirer les paddings par défaut */
        font-size: inherit; /* Annuler la taille de police par défaut */
        font-weight: inherit; /* Annuler la graisse de la police */
    }

    /* Réinitialisation du style pour le lien <a> */
    h2 a {
        text-decoration: none; /* Annuler le soulignement par défaut des liens */
        color: inherit; /* Annuler la couleur du lien, utiliser la couleur héritée du parent */
        font-size: inherit; /* Garder la taille de police héritée */
    }

    /* Si tu veux que le lien ait un effet au survol, tu peux le personnaliser comme suit : */
    h2 a:hover {
        color: #cfd09c; /* Changer la couleur au survol si tu veux */
        text-decoration: none; /* Ajouter un soulignement au survol si nécessaire */
    }
    </style>
   @stop