{{-- v4.2.0 §C1 — Les panneaux de saisie de la fiche, EN LIGNE : jamais une seconde page.
     Même grammaire de champs que partout ailleurs — les composants Filament. --}}
@php
    use App\Enums\EspaceClient\CanalDecision;
    use App\Enums\EspaceClient\CanalDemande;
    use App\Enums\EspaceClient\FamilleDocument;
    use App\Enums\EspaceClient\ModeAcces;
    use App\Enums\EspaceClient\ModeLettre;
    use App\Enums\EspaceClient\RoleAcces;
    use App\Enums\EspaceClient\TypeDecision;
    use App\Models\EspaceClient\DocumentClient;
@endphp

@if ($panneau === 'livrable')
    <x-filament::section>
        <x-slot name="heading">＋ Nouveau livrable</x-slot>
        <x-slot name="description">
            L'échéance se calcule depuis le poste quand il porte une règle de délai ; elle reste modifiable.
        </x-slot>

        <div class="grid gap-3 sm:grid-cols-2 lg:grid-cols-3">
            <div class="lg:col-span-3">
                <label for="el-titre" class="{{ $etiquette }}">Titre</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="el-titre" type="text" wire:model="saisie.titre" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="el-poste" class="{{ $etiquette }}">Poste du marché</label>
                <x-filament::input.wrapper class="mt-1">
                    <x-filament::input.select id="el-poste" wire:model="saisie.poste">
                        <option value="">— aucun —</option>
                        @foreach ($espace->postes as $poste)
                            <option value="{{ $poste->id }}">{{ $poste->numero }} · {{ $poste->libelle }}</option>
                        @endforeach
                    </x-filament::input.select>
                </x-filament::input.wrapper>
            </div>
            <div>
                <label for="el-resp" class="{{ $etiquette }}">Responsable</label>
                <x-filament::input.wrapper class="mt-1">
                    <x-filament::input.select id="el-resp" wire:model="saisie.responsable">
                        <option value="">— aucun —</option>
                        @foreach ($this->collaborateurs() as $id => $nom)
                            <option value="{{ $id }}">{{ $nom }}</option>
                        @endforeach
                    </x-filament::input.select>
                </x-filament::input.wrapper>
            </div>
            <div>
                <label for="el-valideur" class="{{ $etiquette }}">Valideur attendu</label>
                <x-filament::input.wrapper class="mt-1">
                    <x-filament::input.select id="el-valideur" wire:model="saisie.valideur">
                        <option value="">— aucun —</option>
                        @foreach ($this->acces() as $acces)
                            <option value="{{ $acces->id }}">{{ $acces->user?->name }} ({{ $acces->titreAffiche() }})</option>
                        @endforeach
                    </x-filament::input.select>
                </x-filament::input.wrapper>
            </div>
            <div>
                <label for="el-echeance" class="{{ $etiquette }}">Échéance</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="el-echeance" type="date" wire:model="saisie.echeance" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="el-type" class="{{ $etiquette }}">Type</label>
                <x-filament::input.wrapper class="mt-1">
                    <x-filament::input.select id="el-type" wire:model="saisie.type">
                        @foreach (['document' => 'Document', 'video' => 'Vidéo', 'photo' => 'Photo', 'publication' => 'Publication', 'rapport' => 'Rapport', 'autre' => 'Autre'] as $cle => $libelle)
                            <option value="{{ $cle }}">{{ $libelle }}</option>
                        @endforeach
                    </x-filament::input.select>
                </x-filament::input.wrapper>
            </div>
            <label class="flex items-end gap-2 pb-1 text-sm text-gray-700 dark:text-gray-300">
                <input type="checkbox" wire:model="saisie.avec_tache"
                       class="fi-checkbox-input h-5 w-5 rounded border-gray-300 text-primary-600 focus:ring-primary-500 dark:border-white/20 dark:bg-white/5" />
                Créer aussi la tâche interne du responsable
            </label>
            <div class="lg:col-span-3">
                <label for="el-notes" class="{{ $etiquette }}">Notes internes <span class="font-normal normal-case text-gray-400">· jamais montrées au client</span></label>
                <x-filament::input.wrapper class="mt-1">
                    <textarea id="el-notes" rows="2" wire:model="saisie.notes" class="fi-input block w-full border-none bg-transparent px-3 py-1.5 text-base outline-none sm:text-sm"></textarea>
                </x-filament::input.wrapper>
            </div>
        </div>

        <div class="mt-4 flex gap-2">
            <x-filament::button wire:click="creerLeLivrable">Créer</x-filament::button>
            <x-filament::button color="gray" wire:click="fermerLePanneau">Fermer</x-filament::button>
        </div>
    </x-filament::section>
@endif

@if ($panneau === 'remise')
    <x-filament::section>
        <x-slot name="heading">Remettre au client</x-slot>
        <x-slot name="description">
            Une remise crée une VERSION neuve — jamais un écrasement — et envoie l'e-mail au valideur
            et au référent, avec la date de réponse souhaitée.
        </x-slot>

        <div class="grid gap-3 sm:grid-cols-2">
            <div>
                <label for="er-bordereau" class="{{ $etiquette }}">Référence du bordereau de transmission</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="er-bordereau" type="text" wire:model="saisie.bordereau" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="er-lien" class="{{ $etiquette }}">Lien du dossier ou du fichier</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="er-lien" type="url" wire:model="saisie.lien" /></x-filament::input.wrapper>
            </div>
            <div class="sm:col-span-2">
                <label for="er-message" class="{{ $etiquette }}">Message</label>
                <x-filament::input.wrapper class="mt-1">
                    <textarea id="er-message" rows="3" wire:model="saisie.message" class="fi-input block w-full border-none bg-transparent px-3 py-1.5 text-base outline-none sm:text-sm"></textarea>
                </x-filament::input.wrapper>
            </div>
        </div>

        <div class="mt-4 flex gap-2">
            <x-filament::button wire:click="remettre">Remettre</x-filament::button>
            <x-filament::button color="gray" wire:click="fermerLePanneau">Fermer</x-filament::button>
        </div>
    </x-filament::section>
@endif

@if ($panneau === 'decision')
    <x-filament::section>
        <x-slot name="heading">Reporter une décision reçue</x-slot>
        <x-slot name="description">
            La décision est tracée avec SON auteur et SON canal, et la mention de qui l'a reportée :
            une décision reportée ne se fait jamais passer pour une décision prononcée.
        </x-slot>

        <div class="grid gap-3 sm:grid-cols-2 lg:grid-cols-4">
            <div>
                <label for="ed-decision" class="{{ $etiquette }}">Décision</label>
                <x-filament::input.wrapper class="mt-1">
                    <x-filament::input.select id="ed-decision" wire:model="saisie.decision">
                        @foreach ([TypeDecision::Valide, TypeDecision::ValideAvecModifications, TypeDecision::Corrections, TypeDecision::Refus] as $decision)
                            <option value="{{ $decision->value }}">{{ $decision->label() }}</option>
                        @endforeach
                    </x-filament::input.select>
                </x-filament::input.wrapper>
            </div>
            <div>
                <label for="ed-canal" class="{{ $etiquette }}">Canal</label>
                <x-filament::input.wrapper class="mt-1">
                    <x-filament::input.select id="ed-canal" wire:model="saisie.canal">
                        @foreach ([CanalDecision::WhatsappReporte, CanalDecision::Email, CanalDecision::Reunion] as $canal)
                            <option value="{{ $canal->value }}">{{ $canal->label() }}</option>
                        @endforeach
                    </x-filament::input.select>
                </x-filament::input.wrapper>
            </div>
            <div class="lg:col-span-2">
                <label for="ed-auteur" class="{{ $etiquette }}">Auteur de la décision</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="ed-auteur" type="text" wire:model="saisie.auteur" /></x-filament::input.wrapper>
            </div>
            <div class="sm:col-span-2 lg:col-span-4">
                <label for="ed-commentaire" class="{{ $etiquette }}">Commentaire</label>
                <x-filament::input.wrapper class="mt-1">
                    <textarea id="ed-commentaire" rows="3" wire:model="saisie.commentaire" class="fi-input block w-full border-none bg-transparent px-3 py-1.5 text-base outline-none sm:text-sm"></textarea>
                </x-filament::input.wrapper>
            </div>
        </div>

        <div class="mt-4 flex gap-2">
            <x-filament::button wire:click="enregistrerLaDecisionReportee">Enregistrer</x-filament::button>
            <x-filament::button color="gray" wire:click="fermerLePanneau">Fermer</x-filament::button>
        </div>
    </x-filament::section>
@endif

@if ($panneau === 'demande')
    <x-filament::section>
        <x-slot name="heading">＋ Saisir une demande reçue</x-slot>
        <x-slot name="description">Le même formulaire que celui du client, avec le canal et la date de réception.</x-slot>

        <div class="grid gap-3 sm:grid-cols-2 lg:grid-cols-3">
            <div class="lg:col-span-3">
                <label for="ede-objet" class="{{ $etiquette }}">Objet</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="ede-objet" type="text" wire:model="saisie.objet" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="ede-canal" class="{{ $etiquette }}">Canal</label>
                <x-filament::input.wrapper class="mt-1">
                    <x-filament::input.select id="ede-canal" wire:model="saisie.canal">
                        @foreach (CanalDemande::cases() as $canal)
                            <option value="{{ $canal->value }}">{{ $canal->label() }}</option>
                        @endforeach
                    </x-filament::input.select>
                </x-filament::input.wrapper>
            </div>
            <div>
                <label for="ede-demandeur" class="{{ $etiquette }}">Demandeur</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="ede-demandeur" type="text" wire:model="saisie.demandeur" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="ede-date" class="{{ $etiquette }}">Date de la prestation</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="ede-date" type="date" wire:model="saisie.date_prestation" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="ede-lieu" class="{{ $etiquette }}">Lieu</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="ede-lieu" type="text" wire:model="saisie.lieu" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="ede-lettre" class="{{ $etiquette }}">Lettre de commande</label>
                <x-filament::input.wrapper class="mt-1">
                    <x-filament::input.select id="ede-lettre" wire:model="saisie.mode_lettre">
                        @foreach (ModeLettre::cases() as $mode)
                            <option value="{{ $mode->value }}">{{ $mode->label() }}</option>
                        @endforeach
                    </x-filament::input.select>
                </x-filament::input.wrapper>
            </div>
            <div class="lg:col-span-3">
                <label for="ede-attendus" class="{{ $etiquette }}">Ce qui est attendu</label>
                <x-filament::input.wrapper class="mt-1">
                    <textarea id="ede-attendus" rows="2" wire:model="saisie.attendus" class="fi-input block w-full border-none bg-transparent px-3 py-1.5 text-base outline-none sm:text-sm"></textarea>
                </x-filament::input.wrapper>
            </div>
        </div>

        <div class="mt-4 flex gap-2">
            <x-filament::button wire:click="enregistrerLaDemandeRecue">Enregistrer</x-filament::button>
            <x-filament::button color="gray" wire:click="fermerLePanneau">Fermer</x-filament::button>
        </div>
    </x-filament::section>
@endif

@if ($panneau === 'lettre')
    <x-filament::section>
        <x-slot name="heading">Préparer la lettre de commande</x-slot>
        <x-slot name="description">Les quantités commandées, poste par poste. Le montant est figé à l'écriture.</x-slot>

        <div class="space-y-2">
            @foreach ($espace->postes as $poste)
                <div class="flex flex-wrap items-center gap-3 rounded-lg border border-gray-200 p-2 dark:border-white/10">
                    <div class="min-w-0 flex-1">
                        <p class="text-sm text-gray-900 dark:text-white">{{ $poste->numero }} · {{ $poste->libelle }}</p>
                        <p class="text-xs text-gray-500 dark:text-gray-400">
                            {{ $poste->unite ?: 'unité' }} · {{ $poste->pu_ht !== null ? number_format((float) $poste->pu_ht, 2, ',', ' ').' DH' : 'sans prix' }}
                        </p>
                    </div>
                    <x-filament::input.wrapper class="w-28">
                        <x-filament::input type="number" step="0.01" min="0"
                                           aria-label="Quantité — {{ $poste->numero }}"
                                           wire:model="saisie.lignes.{{ $poste->id }}" />
                    </x-filament::input.wrapper>
                </div>
            @endforeach
        </div>

        <div class="mt-4 flex gap-2">
            <x-filament::button wire:click="preparerLaLettre">Préparer</x-filament::button>
            <x-filament::button color="gray" wire:click="fermerLePanneau">Fermer</x-filament::button>
        </div>
    </x-filament::section>
@endif

{{-- v4.4.2 §3 — Un poste du bordereau, saisi à la main : un marché sans appel d'offres a droit
     à ses postes, sans quoi tout l'onglet « Commandes » reste mort. --}}
@if ($panneau === 'poste')
    <x-filament::section>
        <x-slot name="heading">{{ ($saisie['poste'] ?? null) ? 'Modifier le poste' : '＋ Poste du bordereau' }}</x-slot>
        <x-slot name="description">
            Le montant du poste est quantité prévue × prix unitaire HT. Un poste sans prix ni quantité est un poste de pilotage : il se suit, il ne se facture pas.
        </x-slot>

        <div class="grid gap-3 sm:grid-cols-2 lg:grid-cols-6">
            <div>
                <label for="epo-numero" class="{{ $etiquette }}">Numéro</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="epo-numero" type="text" wire:model="saisie.numero" /></x-filament::input.wrapper>
            </div>
            <div class="lg:col-span-3">
                <label for="epo-libelle" class="{{ $etiquette }}">Libellé</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="epo-libelle" type="text" wire:model="saisie.libelle" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="epo-unite" class="{{ $etiquette }}">Unité</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="epo-unite" type="text" wire:model="saisie.unite" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="epo-quantite" class="{{ $etiquette }}">Quantité prévue</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="epo-quantite" type="number" step="0.01" min="0" wire:model="saisie.quantite" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="epo-pu" class="{{ $etiquette }}">PU HT (DH)</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="epo-pu" type="number" step="0.01" min="0" wire:model="saisie.pu_ht" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="epo-famille" class="{{ $etiquette }}">Famille</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="epo-famille" type="text" wire:model="saisie.famille" /></x-filament::input.wrapper>
            </div>
            <div class="lg:col-span-4">
                <label for="epo-famille-libelle" class="{{ $etiquette }}">Libellé de la famille</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="epo-famille-libelle" type="text" wire:model="saisie.famille_libelle" /></x-filament::input.wrapper>
            </div>
        </div>

        <div class="mt-4 flex gap-2">
            <x-filament::button wire:click="enregistrerLePoste">Enregistrer</x-filament::button>
            <x-filament::button color="gray" wire:click="fermerLePanneau">Fermer</x-filament::button>
        </div>
    </x-filament::section>
@endif

@if ($panneau === 'creneau')
    <x-filament::section>
        <x-slot name="heading">Proposer un créneau</x-slot>
        <x-slot name="description">Le client confirme, ou en propose un autre, depuis son espace.</x-slot>

        <div class="grid gap-3 sm:grid-cols-2 lg:grid-cols-4">
            <div>
                <label for="ecr-type" class="{{ $etiquette }}">Type</label>
                <x-filament::input.wrapper class="mt-1">
                    <x-filament::input.select id="ecr-type" wire:model="saisie.type">
                        @foreach (['hebdo' => 'Hebdomadaire', 'comite' => 'Comité de suivi', 'cadrage' => 'Cadrage', 'autre' => 'Autre'] as $cle => $libelle)
                            <option value="{{ $cle }}">{{ $libelle }}</option>
                        @endforeach
                    </x-filament::input.select>
                </x-filament::input.wrapper>
            </div>
            <div>
                <label for="ecr-date" class="{{ $etiquette }}">Date</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="ecr-date" type="date" wire:model="saisie.date" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="ecr-heure" class="{{ $etiquette }}">Heure</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="ecr-heure" type="time" wire:model="saisie.heure" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="ecr-duree" class="{{ $etiquette }}">Durée (minutes)</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="ecr-duree" type="number" min="5" wire:model="saisie.duree" /></x-filament::input.wrapper>
            </div>
            <div class="sm:col-span-2 lg:col-span-4">
                <label for="ecr-lieu" class="{{ $etiquette }}">Lieu</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="ecr-lieu" type="text" wire:model="saisie.lieu" /></x-filament::input.wrapper>
            </div>
            <div class="sm:col-span-2 lg:col-span-4">
                <label for="ecr-odj" class="{{ $etiquette }}">Ordre du jour</label>
                <x-filament::input.wrapper class="mt-1">
                    <textarea id="ecr-odj" rows="3" wire:model="saisie.ordre_du_jour" class="fi-input block w-full border-none bg-transparent px-3 py-1.5 text-base outline-none sm:text-sm"></textarea>
                </x-filament::input.wrapper>
            </div>
        </div>

        <div class="mt-4 flex gap-2">
            <x-filament::button wire:click="proposerLeCreneau">Proposer</x-filament::button>
            <x-filament::button color="gray" wire:click="fermerLePanneau">Fermer</x-filament::button>
        </div>
    </x-filament::section>
@endif

@if ($panneau === 'compte-rendu')
    <x-filament::section>
        <x-slot name="heading">Compte rendu de la réunion</x-slot>
        <x-slot name="description">
            Envoyé, il apparaît chez le client dans « À valider ». Sans remarque dans le délai convenu,
            il sera réputé approuvé. La réunion suivante est créée si vous en fixez la date.
        </x-slot>

        <div class="grid gap-3 sm:grid-cols-2">
            <div class="sm:col-span-2">
                <label for="ecrr-contenu" class="{{ $etiquette }}">Contenu (Markdown)</label>
                <x-filament::input.wrapper class="mt-1">
                    <textarea id="ecrr-contenu" rows="8" wire:model="saisie.contenu" class="fi-input block w-full border-none bg-transparent px-3 py-1.5 text-base outline-none sm:text-sm"></textarea>
                </x-filament::input.wrapper>
            </div>
            <div>
                <label for="ecrr-date" class="{{ $etiquette }}">Prochaine réunion — date</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="ecrr-date" type="date" wire:model="saisie.prochaine_date" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="ecrr-heure" class="{{ $etiquette }}">Heure</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="ecrr-heure" type="time" wire:model="saisie.prochaine_heure" /></x-filament::input.wrapper>
            </div>
        </div>

        <div class="mt-4 flex gap-2">
            <x-filament::button wire:click="envoyerLeCompteRendu">Envoyer au client</x-filament::button>
            <x-filament::button color="gray" wire:click="fermerLePanneau">Fermer</x-filament::button>
        </div>
    </x-filament::section>
@endif

@if ($panneau === 'document')
    <x-filament::section>
        <x-slot name="heading">＋ Ajouter un document</x-slot>
        <x-slot name="description">Un lien ou un fichier : au choix, document par document. Le client ne voit que les pièces partagées.</x-slot>

        <div class="grid gap-3 sm:grid-cols-2 lg:grid-cols-4">
            <div class="lg:col-span-2">
                <label for="edo-titre" class="{{ $etiquette }}">Titre</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="edo-titre" type="text" wire:model="saisie.titre" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="edo-famille" class="{{ $etiquette }}">Famille</label>
                <x-filament::input.wrapper class="mt-1">
                    <x-filament::input.select id="edo-famille" wire:model="saisie.famille">
                        @foreach (FamilleDocument::cases() as $famille)
                            <option value="{{ $famille->value }}">{{ $famille->label() }}</option>
                        @endforeach
                    </x-filament::input.select>
                </x-filament::input.wrapper>
            </div>
            <div>
                <label for="edo-visibilite" class="{{ $etiquette }}">Visibilité</label>
                <x-filament::input.wrapper class="mt-1">
                    <x-filament::input.select id="edo-visibilite" wire:model="saisie.visibilite">
                        <option value="{{ DocumentClient::VISIBILITE_PARTAGE }}">Partagé avec le client</option>
                        <option value="{{ DocumentClient::VISIBILITE_INTERNE }}">Interne</option>
                    </x-filament::input.select>
                </x-filament::input.wrapper>
            </div>
            <div class="lg:col-span-3">
                <label for="edo-lien" class="{{ $etiquette }}">Lien</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="edo-lien" type="url" wire:model="saisie.lien" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="edo-version" class="{{ $etiquette }}">Version</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="edo-version" type="text" wire:model="saisie.version" /></x-filament::input.wrapper>
            </div>
        </div>

        <div class="mt-4 flex gap-2">
            <x-filament::button wire:click="enregistrerLeDocument">Ajouter</x-filament::button>
            <x-filament::button color="gray" wire:click="fermerLePanneau">Fermer</x-filament::button>
        </div>
    </x-filament::section>
@endif

@if ($panneau === 'message')
    <x-filament::section>
        <x-slot name="heading">Message de la semaine</x-slot>
        <x-slot name="description">
            Cinq lignes, relues et modifiables. Rien ne part vers une messagerie extérieure : on copie,
            ou on envoie par courriel au référent.
        </x-slot>

        <x-filament::input.wrapper>
            <textarea rows="8" aria-label="Message de la semaine" wire:model="saisie.texte"
                      class="fi-input block w-full border-none bg-transparent px-3 py-1.5 font-mono text-sm outline-none"></textarea>
        </x-filament::input.wrapper>

        <div class="mt-4 flex flex-wrap gap-2">
            <x-filament::button color="gray" wire:click="enregistrerLeMessage">Enregistrer le brouillon</x-filament::button>
            <x-filament::button wire:click="envoyerLeMessage">Envoyer par e-mail au référent</x-filament::button>
            <x-filament::button color="gray" wire:click="fermerLePanneau">Fermer</x-filament::button>
        </div>
    </x-filament::section>
@endif

@if ($panneau === 'invitation')
    <x-filament::section>
        <x-slot name="heading">Inviter une personne du client</x-slot>
        <x-slot name="description">
            Un compte nominatif, un mot de passe temporaire envoyé par courriel, changé à la première
            connexion. Le mot de passe n'apparaît jamais ici.
        </x-slot>

        <div class="grid gap-3 sm:grid-cols-2 lg:grid-cols-3">
            <div>
                <label for="ei-nom" class="{{ $etiquette }}">Nom</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="ei-nom" type="text" wire:model="saisie.name" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="ei-email" class="{{ $etiquette }}">Adresse e-mail</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="ei-email" type="email" wire:model="saisie.email" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="ei-role" class="{{ $etiquette }}">Rôle</label>
                <x-filament::input.wrapper class="mt-1">
                    <x-filament::input.select id="ei-role" wire:model="saisie.role">
                        @foreach (RoleAcces::cases() as $role)
                            <option value="{{ $role->value }}">{{ $role->label() }}</option>
                        @endforeach
                    </x-filament::input.select>
                </x-filament::input.wrapper>
            </div>
            <div>
                <label for="ei-titre" class="{{ $etiquette }}">Titre affiché</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="ei-titre" type="text" wire:model="saisie.titre" /></x-filament::input.wrapper>
            </div>
            <div class="sm:col-span-2">
                <label for="ei-familles" class="{{ $etiquette }}">Familles validées <span class="font-normal normal-case text-gray-400">· séparées par des virgules, vide = toutes</span></label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="ei-familles" type="text" wire:model="saisie.familles" /></x-filament::input.wrapper>
            </div>
        </div>

        <div class="mt-4 flex gap-2">
            <x-filament::button wire:click="inviter">Inviter</x-filament::button>
            <x-filament::button color="gray" wire:click="fermerLePanneau">Fermer</x-filament::button>
        </div>
    </x-filament::section>
@endif

@if ($panneau === 'reglages')
    <x-filament::section>
        <x-slot name="heading">Réglages de l'espace</x-slot>
        <x-slot name="description">
            Identité du client, mode d'accès, règles de délai, canaux et adresses d'envoi. Vides, les
            adresses retombent sur celles de l'installation.
        </x-slot>

        <div class="grid gap-3 sm:grid-cols-2 lg:grid-cols-3">
            <div>
                <label for="eg-nom" class="{{ $etiquette }}">Nom de l'espace</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="eg-nom" type="text" wire:model="saisie.nom" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="eg-client" class="{{ $etiquette }}">Nom du client</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="eg-client" type="text" wire:model="saisie.client_nom" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="eg-court" class="{{ $etiquette }}">Nom court</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="eg-court" type="text" wire:model="saisie.client_court" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="eg-ref" class="{{ $etiquette }}">Référence du marché</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="eg-ref" type="text" wire:model="saisie.reference_marche" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="eg-mode" class="{{ $etiquette }}">Mode d'accès</label>
                <x-filament::input.wrapper class="mt-1">
                    <x-filament::input.select id="eg-mode" wire:model="saisie.mode">
                        @foreach (ModeAcces::cases() as $mode)
                            <option value="{{ $mode->value }}">{{ $mode->label() }}</option>
                        @endforeach
                    </x-filament::input.select>
                </x-filament::input.wrapper>
            </div>
            <label class="flex items-end gap-2 pb-1 text-sm text-gray-700 dark:text-gray-300">
                <input type="checkbox" wire:model="saisie.afficher_montants"
                       class="fi-checkbox-input h-5 w-5 rounded border-gray-300 text-primary-600 focus:ring-primary-500 dark:border-white/20 dark:bg-white/5" />
                Afficher les montants au client
            </label>
            <div>
                <label for="eg-primaire" class="{{ $etiquette }}">Couleur primaire du client</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="eg-primaire" type="text" placeholder="#0B1F3A" wire:model="saisie.couleur_primaire" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="eg-accent" class="{{ $etiquette }}">Couleur d'accent</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="eg-accent" type="text" placeholder="#C9A227" wire:model="saisie.couleur_accent" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="eg-delai" class="{{ $etiquette }}">Délai de validation (jours ouvrés)</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="eg-delai" type="number" min="1" wire:model="saisie.delai" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="eg-rappel" class="{{ $etiquette }}">Rappel avant (jours ouvrés)</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="eg-rappel" type="number" min="0" wire:model="saisie.rappel" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="eg-tacite" class="{{ $etiquette }}">Approbation tacite du compte rendu (jours ouvrés)</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="eg-tacite" type="number" min="1" wire:model="saisie.tacite" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="eg-debut" class="{{ $etiquette }}">Début d'exécution</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="eg-debut" type="date" wire:model="saisie.date_debut" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="eg-fin" class="{{ $etiquette }}">Fin d'exécution</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="eg-fin" type="date" wire:model="saisie.date_fin" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="eg-groupe" class="{{ $etiquette }}">Lien du groupe de discussion</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="eg-groupe" type="url" wire:model="saisie.whatsapp_groupe_url" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="eg-ligne" class="{{ $etiquette }}">Ligne projet</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="eg-ligne" type="text" wire:model="saisie.whatsapp_ligne_projet" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="eg-exp" class="{{ $etiquette }}">Expéditeur des e-mails</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="eg-exp" type="email" wire:model="saisie.email_expediteur" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="eg-copie" class="{{ $etiquette }}">Copie des e-mails</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="eg-copie" type="email" wire:model="saisie.email_copie" /></x-filament::input.wrapper>
            </div>
        </div>

        <div class="mt-4 flex gap-2">
            <x-filament::button wire:click="enregistrerLesReglages">Enregistrer</x-filament::button>
            <x-filament::button color="gray" wire:click="fermerLePanneau">Fermer</x-filament::button>
        </div>
    </x-filament::section>
@endif

{{-- ═══════════════════════════════════════════════════════════════════════════════════════
     v4.3.0 — LES PANNEAUX DU LOT 2 : publications, événements, indicateurs, décomptes.
     Même grammaire que ceux du lot 1 : en ligne, jamais une seconde page.
     ═══════════════════════════════════════════════════════════════════════════════════════ --}}

@if ($panneau === 'publication')
    <x-filament::section>
        <x-slot name="heading">{{ filled($saisie['publication'] ?? null) ? 'Publication' : '＋ Nouvelle publication' }}</x-slot>
        <x-slot name="description">
            Une publication validée par le client est FIGÉE : pour la changer, on l'annule et on la recrée.
        </x-slot>

        <div class="grid gap-3 sm:grid-cols-2 lg:grid-cols-3">
            <div class="lg:col-span-2">
                <label for="pb-titre" class="{{ $etiquette }}">Titre</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="pb-titre" type="text" wire:model="saisie.titre" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="pb-type" class="{{ $etiquette }}">Format</label>
                <x-filament::input.wrapper class="mt-1">
                    <x-filament::input.select id="pb-type" wire:model="saisie.type">
                        @foreach (\App\Enums\EspaceClient\TypePublication::cases() as $type)
                            <option value="{{ $type->value }}">{{ $type->label() }}</option>
                        @endforeach
                    </x-filament::input.select>
                </x-filament::input.wrapper>
            </div>
            <div>
                <label for="pb-liv" class="{{ $etiquette }}">Livrable du mois <span class="font-normal normal-case text-gray-400">· facultatif</span></label>
                <x-filament::input.wrapper class="mt-1">
                    <x-filament::input.select id="pb-liv" wire:model="saisie.livrable">
                        <option value="">— aucun —</option>
                        @foreach ($this->livrables() as $livrable)
                            <option value="{{ $livrable->id }}">{{ $livrable->reference }} · {{ $livrable->titre }}</option>
                        @endforeach
                    </x-filament::input.select>
                </x-filament::input.wrapper>
            </div>
            <div class="lg:col-span-2">
                <label for="pb-visuel" class="{{ $etiquette }}">Lien du visuel</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="pb-visuel" type="url" wire:model="saisie.visuel_lien" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="pb-date" class="{{ $etiquette }}">Date de publication</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="pb-date" type="date" wire:model="saisie.prevue_le" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="pb-heure" class="{{ $etiquette }}">Heure</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="pb-heure" type="time" wire:model="saisie.prevue_a" /></x-filament::input.wrapper>
            </div>
            <div class="lg:col-span-2">
                <label class="{{ $etiquette }}">Canaux</label>
                <div class="mt-2 flex flex-wrap gap-3">
                    @foreach ($espace->reseauxConfigures() as $reseau)
                        <label class="flex items-center gap-2 text-sm text-gray-700 dark:text-gray-300">
                            <input type="checkbox" value="{{ $reseau['cle'] }}" wire:model="saisie.canaux"
                                   class="fi-checkbox-input h-5 w-5 rounded border-gray-300 text-primary-600 focus:ring-primary-500 dark:border-white/20 dark:bg-white/5" />
                            {{ $reseau['libelle'] }}
                        </label>
                    @endforeach
                </div>
            </div>
            <div class="lg:col-span-3">
                <label for="pb-fr" class="{{ $etiquette }}">Texte FR</label>
                <x-filament::input.wrapper class="mt-1">
                    <textarea id="pb-fr" rows="4" wire:model="saisie.texte_fr" class="fi-input block w-full border-none bg-transparent px-3 py-1.5 text-base outline-none sm:text-sm"></textarea>
                </x-filament::input.wrapper>
            </div>
            <div class="lg:col-span-3">
                <label for="pb-ar" class="{{ $etiquette }}">Texte AR <span class="font-normal normal-case text-gray-400">· facultatif</span></label>
                <x-filament::input.wrapper class="mt-1">
                    <textarea id="pb-ar" rows="4" dir="rtl" wire:model="saisie.texte_ar" class="fi-input block w-full border-none bg-transparent px-3 py-1.5 text-base outline-none sm:text-sm"></textarea>
                </x-filament::input.wrapper>
            </div>
            <div class="lg:col-span-3">
                <label for="pb-notes" class="{{ $etiquette }}">Notes internes <span class="font-normal normal-case text-gray-400">· jamais montrées au client</span></label>
                <x-filament::input.wrapper class="mt-1">
                    <textarea id="pb-notes" rows="2" wire:model="saisie.notes" class="fi-input block w-full border-none bg-transparent px-3 py-1.5 text-base outline-none sm:text-sm"></textarea>
                </x-filament::input.wrapper>
            </div>
        </div>

        <div class="mt-4 flex flex-wrap gap-2">
            <x-filament::button wire:click="enregistrerLaPublication">Enregistrer</x-filament::button>
            @if (filled($saisie['publication'] ?? null))
                <x-filament::button color="gray" wire:click="envoyerLaPublication({{ (int) $saisie['publication'] }})">Envoyer au client</x-filament::button>
            @endif
            <x-filament::button color="gray" wire:click="fermerLePanneau">Fermer</x-filament::button>
        </div>
    </x-filament::section>
@endif

@if ($panneau === 'publication-lien')
    <x-filament::section>
        <x-slot name="heading">Marquer publiée</x-slot>
        <x-slot name="description">
            Le lien est obligatoire : sans lui, « publié » est une affirmation ; avec lui, c'est une pièce.
        </x-slot>

        <div>
            <label for="pl-lien" class="{{ $etiquette }}">Lien de la publication en ligne</label>
            <x-filament::input.wrapper class="mt-1"><x-filament::input id="pl-lien" type="url" wire:model="saisie.lien" /></x-filament::input.wrapper>
        </div>

        <div class="mt-4 flex gap-2">
            <x-filament::button wire:click="marquerLaPublicationPubliee">Enregistrer</x-filament::button>
            <x-filament::button color="gray" wire:click="fermerLePanneau">Fermer</x-filament::button>
        </div>
    </x-filament::section>
@endif

@if ($panneau === 'publication-annulation')
    <x-filament::section>
        <x-slot name="heading">Annuler la publication</x-slot>
        <x-slot name="description">
            Le motif est obligatoire et journalisé. Si le client l'avait vue passer, il est prévenu.
        </x-slot>

        <div>
            <label for="pa-motif" class="{{ $etiquette }}">Motif</label>
            <x-filament::input.wrapper class="mt-1">
                <textarea id="pa-motif" rows="3" wire:model="saisie.motif" class="fi-input block w-full border-none bg-transparent px-3 py-1.5 text-base outline-none sm:text-sm"></textarea>
            </x-filament::input.wrapper>
        </div>

        <div class="mt-4 flex gap-2">
            <x-filament::button color="danger" wire:click="annulerLaPublication">Annuler la publication</x-filament::button>
            <x-filament::button color="gray" wire:click="fermerLePanneau">Fermer</x-filament::button>
        </div>
    </x-filament::section>
@endif

@if ($panneau === 'publication-decision')
    <x-filament::section>
        <x-slot name="heading">Décision reçue sur une publication</x-slot>
        <x-slot name="description">
            Une décision REPORTÉE : la trace dira qui l'a prononcée, par quel canal, et qui l'a saisie.
        </x-slot>

        <div class="grid gap-3 sm:grid-cols-2 lg:grid-cols-3">
            <div>
                <label for="pd-decision" class="{{ $etiquette }}">Décision</label>
                <x-filament::input.wrapper class="mt-1">
                    <x-filament::input.select id="pd-decision" wire:model="saisie.decision">
                        @foreach ([TypeDecision::Valide, TypeDecision::ValideAvecModifications, TypeDecision::Corrections] as $decision)
                            <option value="{{ $decision->value }}">{{ $decision->label() }}</option>
                        @endforeach
                    </x-filament::input.select>
                </x-filament::input.wrapper>
            </div>
            <div>
                <label for="pd-canal" class="{{ $etiquette }}">Canal</label>
                <x-filament::input.wrapper class="mt-1">
                    <x-filament::input.select id="pd-canal" wire:model="saisie.canal">
                        @foreach (CanalDecision::cases() as $canal)
                            <option value="{{ $canal->value }}">{{ $canal->label() }}</option>
                        @endforeach
                    </x-filament::input.select>
                </x-filament::input.wrapper>
            </div>
            <div>
                <label for="pd-auteur" class="{{ $etiquette }}">Qui a décidé</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="pd-auteur" type="text" wire:model="saisie.auteur" /></x-filament::input.wrapper>
            </div>
            <div class="lg:col-span-3">
                <label for="pd-commentaire" class="{{ $etiquette }}">Commentaire</label>
                <x-filament::input.wrapper class="mt-1">
                    <textarea id="pd-commentaire" rows="2" wire:model="saisie.commentaire" class="fi-input block w-full border-none bg-transparent px-3 py-1.5 text-base outline-none sm:text-sm"></textarea>
                </x-filament::input.wrapper>
            </div>
        </div>

        <div class="mt-4 flex gap-2">
            <x-filament::button wire:click="enregistrerLaDecisionDeLaPublication">Enregistrer</x-filament::button>
            <x-filament::button color="gray" wire:click="fermerLePanneau">Fermer</x-filament::button>
        </div>
    </x-filament::section>
@endif

@if ($panneau === 'evenement' || $panneau === 'evenement-qualification')
    <x-filament::section>
        <x-slot name="heading">{{ $panneau === 'evenement-qualification' ? 'Qualifier l\'événement signalé' : '＋ Planifier un événement' }}</x-slot>
        <x-slot name="description">
            La chronologie du tableau de bord est recopiée avec ses échéances, calculées depuis la date
            et l'heure de début. Sans heure : 09:00.
        </x-slot>

        <div class="grid gap-3 sm:grid-cols-2 lg:grid-cols-3">
            <div class="lg:col-span-3">
                <label for="ev-titre" class="{{ $etiquette }}">Titre</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="ev-titre" type="text" wire:model="saisie.titre" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="ev-date" class="{{ $etiquette }}">Date</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="ev-date" type="date" wire:model="saisie.date" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="ev-heure" class="{{ $etiquette }}">Heure</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="ev-heure" type="time" wire:model="saisie.heure" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="ev-zone" class="{{ $etiquette }}">Zone</label>
                <x-filament::input.wrapper class="mt-1">
                    <x-filament::input.select id="ev-zone" wire:model="saisie.zone">
                        <option value="">— aucune —</option>
                        @foreach ($espace->zonesConfigurees() as $zone)
                            <option value="{{ $zone['code'] }}">{{ $zone['code'] }} · {{ $zone['libelle'] }}</option>
                        @endforeach
                    </x-filament::input.select>
                </x-filament::input.wrapper>
            </div>
            <div>
                <label for="ev-lieu" class="{{ $etiquette }}">Lieu</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="ev-lieu" type="text" wire:model="saisie.lieu" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="ev-org" class="{{ $etiquette }}">Organisateur</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="ev-org" type="text" wire:model="saisie.organisateur" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="ev-disp" class="{{ $etiquette }}">Dispositif <span class="font-normal normal-case text-gray-400">· séparé par des virgules</span></label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="ev-disp" type="text" wire:model="saisie.dispositif" placeholder="photo, live, vidéo" /></x-filament::input.wrapper>
            </div>
            <div class="lg:col-span-2">
                <label class="{{ $etiquette }}">Équipe</label>
                <div class="mt-2 flex flex-wrap gap-3">
                    @foreach ($this->affectations() as $id => $nom)
                        <label class="flex items-center gap-2 text-sm text-gray-700 dark:text-gray-300">
                            <input type="checkbox" value="{{ $id }}" wire:model="saisie.equipe"
                                   class="fi-checkbox-input h-5 w-5 rounded border-gray-300 text-primary-600 focus:ring-primary-500 dark:border-white/20 dark:bg-white/5" />
                            {{ $nom }}
                        </label>
                    @endforeach
                </div>
            </div>
            <div>
                <label for="ev-lc" class="{{ $etiquette }}">Lettre de commande</label>
                <x-filament::input.wrapper class="mt-1">
                    <x-filament::input.select id="ev-lc" wire:model="saisie.lettre">
                        <option value="">— aucune —</option>
                        @foreach ($this->lettres() as $lettre)
                            <option value="{{ $lettre->id }}">{{ $lettre->reference }} · {{ $lettre->objet }}</option>
                        @endforeach
                    </x-filament::input.select>
                </x-filament::input.wrapper>
            </div>
            <label class="flex items-end gap-2 pb-1 text-sm text-gray-700 dark:text-gray-300">
                <input type="checkbox" wire:model.live="saisie.voie_express"
                       class="fi-checkbox-input h-5 w-5 rounded border-gray-300 text-primary-600 focus:ring-primary-500 dark:border-white/20 dark:bg-white/5" />
                Voie express — couverture sans lettre de commande
            </label>
            @if ($saisie['voie_express'] ?? false)
                <div class="lg:col-span-2">
                    <label for="ev-motif" class="{{ $etiquette }}">Motif de la décision</label>
                    <x-filament::input.wrapper class="mt-1"><x-filament::input id="ev-motif" type="text" wire:model="saisie.motif_voie_express" /></x-filament::input.wrapper>
                </div>
            @endif
            <div class="lg:col-span-3">
                <label for="ev-notes" class="{{ $etiquette }}">Notes internes <span class="font-normal normal-case text-gray-400">· jamais montrées au client</span></label>
                <x-filament::input.wrapper class="mt-1">
                    <textarea id="ev-notes" rows="2" wire:model="saisie.notes" class="fi-input block w-full border-none bg-transparent px-3 py-1.5 text-base outline-none sm:text-sm"></textarea>
                </x-filament::input.wrapper>
            </div>
        </div>

        <div class="mt-4 flex gap-2">
            <x-filament::button wire:click="enregistrerLEvenement">{{ $panneau === 'evenement-qualification' ? 'Qualifier' : 'Planifier' }}</x-filament::button>
            <x-filament::button color="gray" wire:click="fermerLePanneau">Fermer</x-filament::button>
        </div>
    </x-filament::section>
@endif

@if ($panneau === 'evenement-etape')
    <x-filament::section>
        <x-slot name="heading">Marquer l'étape faite</x-slot>
        <x-slot name="description">
            L'heure est enregistrée, et l'e-mail part aux deux parties avec le lien. C'est ce message-là
            qui tient la promesse, pas la case cochée.
        </x-slot>

        <div>
            <label for="ee-lien" class="{{ $etiquette }}">Lien de ce qui a été livré <span class="font-normal normal-case text-gray-400">· facultatif</span></label>
            <x-filament::input.wrapper class="mt-1"><x-filament::input id="ee-lien" type="url" wire:model="saisie.lien" /></x-filament::input.wrapper>
        </div>

        <div class="mt-4 flex gap-2">
            <x-filament::button wire:click="marquerLEtape">Marquer faite</x-filament::button>
            <x-filament::button color="gray" wire:click="fermerLePanneau">Fermer</x-filament::button>
        </div>
    </x-filament::section>
@endif

@if ($panneau === 'evenement-galerie')
    <x-filament::section>
        <x-slot name="heading">Lien de la galerie</x-slot>
        <x-slot name="description">Le client le lit avec son QR code, depuis la vue « Événements ».</x-slot>

        <div>
            <label for="eg-lien" class="{{ $etiquette }}">Lien de la galerie complète</label>
            <x-filament::input.wrapper class="mt-1"><x-filament::input id="eg-lien" type="url" wire:model="saisie.lien" /></x-filament::input.wrapper>
        </div>

        <div class="mt-4 flex gap-2">
            <x-filament::button wire:click="enregistrerLaGalerie">Enregistrer</x-filament::button>
            <x-filament::button color="gray" wire:click="fermerLePanneau">Fermer</x-filament::button>
        </div>
    </x-filament::section>
@endif

@if ($panneau === 'indicateurs')
    <x-filament::section>
        <x-slot name="heading">Saisir les indicateurs digitaux du mois</x-slot>
        <x-slot name="description">
            Ces chiffres viennent du rapport de performance : ils ne se recalculent pas, et le calcul
            ne les efface jamais.
        </x-slot>

        <div class="overflow-x-auto">
            <table class="w-full text-sm">
                <thead>
                    <tr class="border-b border-gray-200 text-left text-[11px] font-semibold uppercase tracking-wide text-gray-500 dark:border-white/10 dark:text-gray-400">
                        <th class="py-2 pr-3">Réseau</th>
                        <th class="px-2 py-2">Abonnés</th>
                        <th class="px-2 py-2">Publications</th>
                        <th class="px-2 py-2">Portée</th>
                        <th class="px-2 py-2">Engagement</th>
                        <th class="px-2 py-2">Modération (h)</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach ($espace->reseauxConfigures() as $reseau)
                        <tr class="border-t border-gray-100 dark:border-white/5">
                            <td class="py-2 pr-3 font-medium text-gray-900 dark:text-white">{{ $reseau['libelle'] }}</td>
                            @foreach (['abonnes', 'publications', 'portee', 'engagement', 'delai_moderation_h'] as $champ)
                                <td class="px-2 py-2">
                                    <x-filament::input.wrapper>
                                        <x-filament::input type="number" step="0.01"
                                            wire:model="saisie.reseaux.{{ $reseau['cle'] }}.{{ $champ }}" />
                                    </x-filament::input.wrapper>
                                </td>
                            @endforeach
                        </tr>
                    @endforeach
                </tbody>
            </table>
        </div>

        <div class="mt-3 grid gap-3 sm:grid-cols-2">
            <div>
                <label for="in-det" class="{{ $etiquette }}">Pages non officielles détectées</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="in-det" type="number" wire:model="saisie.pages_detectees" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="in-tra" class="{{ $etiquette }}">Pages non officielles traitées</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="in-tra" type="number" wire:model="saisie.pages_traitees" /></x-filament::input.wrapper>
            </div>
            <div class="sm:col-span-2">
                <label for="in-com" class="{{ $etiquette }}">Commentaire du mois</label>
                <x-filament::input.wrapper class="mt-1">
                    <textarea id="in-com" rows="3" wire:model="saisie.commentaire" class="fi-input block w-full border-none bg-transparent px-3 py-1.5 text-base outline-none sm:text-sm"></textarea>
                </x-filament::input.wrapper>
            </div>
        </div>

        <div class="mt-4 flex gap-2">
            <x-filament::button wire:click="enregistrerLaSaisieDigitale">Enregistrer</x-filament::button>
            <x-filament::button color="gray" wire:click="fermerLePanneau">Fermer</x-filament::button>
        </div>
    </x-filament::section>
@endif

@if ($panneau === 'recalcul')
    <x-filament::section>
        <x-slot name="heading">Recalculer les indicateurs</x-slot>
        <x-slot name="description">
            Si le mois est clôturé, le rouvrir exige un motif — il a peut-être déjà été présenté en comité.
            La saisie digitale, elle, n'est jamais touchée.
        </x-slot>

        <div>
            <label for="rc-motif" class="{{ $etiquette }}">Motif <span class="font-normal normal-case text-gray-400">· obligatoire si le mois est clôturé</span></label>
            <x-filament::input.wrapper class="mt-1"><x-filament::input id="rc-motif" type="text" wire:model="saisie.motif" /></x-filament::input.wrapper>
        </div>

        <div class="mt-4 flex gap-2">
            <x-filament::button wire:click="recalculer">Recalculer</x-filament::button>
            <x-filament::button color="gray" wire:click="fermerLePanneau">Fermer</x-filament::button>
        </div>
    </x-filament::section>
@endif

@if ($panneau === 'decompte')
    <x-filament::section>
        <x-slot name="heading">Préparer le décompte</x-slot>
        <x-slot name="description">
            Les lignes sont calculées depuis les livrables VALIDÉS de la période, non déjà comptés
            ailleurs. Les pénalités sont reprises du simulateur et restent modifiables.
        </x-slot>

        <div class="grid gap-3 sm:grid-cols-2 lg:grid-cols-4">
            <div>
                <label for="dc-retenue" class="{{ $etiquette }}">Retenue d'avance</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="dc-retenue" type="number" step="0.01" wire:model="saisie.retenue" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="dc-jours" class="{{ $etiquette }}">Pénalités — jours</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="dc-jours" type="number" min="0" wire:model="saisie.penalites_jours" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="dc-montant" class="{{ $etiquette }}">Pénalités — montant</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="dc-montant" type="number" step="0.01" wire:model="saisie.penalites_montant" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="dc-motif" class="{{ $etiquette }}">Motif des pénalités</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="dc-motif" type="text" wire:model="saisie.penalites_motif" /></x-filament::input.wrapper>
            </div>
        </div>

        <div class="mt-4 flex gap-2">
            <x-filament::button wire:click="preparerLeDecompte">Préparer</x-filament::button>
            <x-filament::button color="gray" wire:click="fermerLePanneau">Fermer</x-filament::button>
        </div>
    </x-filament::section>
@endif

@if ($panneau === 'pv')
    <x-filament::section>
        <x-slot name="heading">PV signé</x-slot>
        <x-slot name="description">
            La pièce est archivée dans les documents du client, famille « Commandes et réceptions »,
            et partagée : c'est une pièce qui l'engage.
        </x-slot>

        <div class="grid gap-3 sm:grid-cols-2">
            <div>
                <label for="pv-fichier" class="{{ $etiquette }}">Lien ou référence du PV signé</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="pv-fichier" type="text" wire:model="saisie.fichier" /></x-filament::input.wrapper>
            </div>
            <div>
                <label for="pv-date" class="{{ $etiquette }}">Date de signature</label>
                <x-filament::input.wrapper class="mt-1"><x-filament::input id="pv-date" type="date" wire:model="saisie.date" /></x-filament::input.wrapper>
            </div>
        </div>

        <div class="mt-4 flex gap-2">
            <x-filament::button wire:click="enregistrerLePv">Enregistrer</x-filament::button>
            <x-filament::button color="gray" wire:click="fermerLePanneau">Fermer</x-filament::button>
        </div>
    </x-filament::section>
@endif

@if ($panneau === 'facture')
    <x-filament::section>
        <x-slot name="heading">Créer la facture</x-slot>
        <x-slot name="description">
            La facture est celle du socle, créée en BROUILLON : elle attend d'être relue et émise depuis
            le module de facturation. « Réglée » se lira ensuite de la facture, jamais d'ici.
        </x-slot>

        <div>
            <label for="fc-jalon" class="{{ $etiquette }}">Décompte du marché <span class="font-normal normal-case text-gray-400">· facultatif, pour rester cohérent avec la trésorerie</span></label>
            <x-filament::input.wrapper class="mt-1">
                <x-filament::input.select id="fc-jalon" wire:model="saisie.milestone">
                    <option value="">— aucun —</option>
                    @foreach ($this->jalons() as $id => $libelle)
                        <option value="{{ $id }}">{{ $libelle }}</option>
                    @endforeach
                </x-filament::input.select>
            </x-filament::input.wrapper>
        </div>

        <div class="mt-4 flex gap-2">
            <x-filament::button wire:click="creerLaFacture">Créer la facture</x-filament::button>
            <x-filament::button color="gray" wire:click="fermerLePanneau">Fermer</x-filament::button>
        </div>
    </x-filament::section>
@endif

@if ($panneau === 'parametres-avances')
    <x-filament::section>
        <x-slot name="heading">Zones, réseaux, chronologie, pénalités et réceptions</x-slot>
        <x-slot name="description">
            Les listes se collent depuis un document du marché : une ligne par entrée, plutôt que
            huit formulaires à remplir un par un.
        </x-slot>

        <div class="grid gap-3 lg:grid-cols-3">
            <div>
                <label for="pa-zones" class="{{ $etiquette }}">Zones <span class="font-normal normal-case text-gray-400">· une par ligne, « CODE = Libellé »</span></label>
                <x-filament::input.wrapper class="mt-1">
                    <textarea id="pa-zones" rows="8" wire:model="saisie.zones" class="fi-input block w-full border-none bg-transparent px-3 py-1.5 font-mono text-xs outline-none"></textarea>
                </x-filament::input.wrapper>
            </div>
            <div>
                <label for="pa-reseaux" class="{{ $etiquette }}">Réseaux <span class="font-normal normal-case text-gray-400">· « clé | Libellé | référence | objectif | date »</span></label>
                <x-filament::input.wrapper class="mt-1">
                    <textarea id="pa-reseaux" rows="8" wire:model="saisie.reseaux" class="fi-input block w-full border-none bg-transparent px-3 py-1.5 font-mono text-xs outline-none"></textarea>
                </x-filament::input.wrapper>
            </div>
            <div>
                <label for="pa-chrono" class="{{ $etiquette }}">Chronologie <span class="font-normal normal-case text-gray-400">· « clé | Libellé | heures | promesse »</span></label>
                <x-filament::input.wrapper class="mt-1">
                    <textarea id="pa-chrono" rows="8" wire:model="saisie.chronologie" class="fi-input block w-full border-none bg-transparent px-3 py-1.5 font-mono text-xs outline-none"></textarea>
                </x-filament::input.wrapper>
            </div>
        </div>

        <div class="mt-3 grid gap-3 sm:grid-cols-2 lg:grid-cols-4">
            @foreach ([
                ['cible_delais', 'Cible — délais tenus (%)', 'number'],
                ['cible_premier_passage', 'Cible — premier passage (%)', 'number'],
                ['cible_retour', 'Cible — délai de retour (j ouvrés)', 'number'],
                ['cible_moderation', 'Cible — modération (h)', 'number'],
                ['penalite_taux', 'Pénalité — taux ‰ par jour', 'number'],
                ['penalite_plafond', 'Pénalité — plafond (%)', 'number'],
                ['montant_ht', 'Montant du marché HT', 'number'],
                ['montant_ttc', 'Montant du marché TTC', 'number'],
                ['taux_tva', 'Taux de TVA (%)', 'number'],
                ['nb_periodes', 'Nombre de périodes de réception', 'number'],
                ['prochaine_reception', 'Prochaine réception (repli saisi)', 'date'],
            ] as [$champ, $libelle, $type])
                <div>
                    <label for="pa-{{ $champ }}" class="{{ $etiquette }}">{{ $libelle }}</label>
                    <x-filament::input.wrapper class="mt-1">
                        <x-filament::input id="pa-{{ $champ }}" type="{{ $type }}" step="0.01" wire:model="saisie.{{ $champ }}" />
                    </x-filament::input.wrapper>
                </div>
            @endforeach
            <div>
                <label for="pa-base" class="{{ $etiquette }}">Base de la pénalité</label>
                <x-filament::input.wrapper class="mt-1">
                    <x-filament::input.select id="pa-base" wire:model="saisie.penalite_base_type">
                        <option value="ttc">Montant TTC du marché</option>
                        <option value="ht">Montant HT du marché</option>
                    </x-filament::input.select>
                </x-filament::input.wrapper>
            </div>
            <label class="flex items-end gap-2 pb-1 text-sm text-gray-700 dark:text-gray-300">
                <input type="checkbox" wire:model="saisie.derniere_definitive"
                       class="fi-checkbox-input h-5 w-5 rounded border-gray-300 text-primary-600 focus:ring-primary-500 dark:border-white/20 dark:bg-white/5" />
                La dernière période vaut réception définitive
            </label>
        </div>

        <div class="mt-4 flex gap-2">
            <x-filament::button wire:click="enregistrerLesParametresAvances">Enregistrer</x-filament::button>
            <x-filament::button color="gray" wire:click="fermerLePanneau">Fermer</x-filament::button>
        </div>
    </x-filament::section>
@endif