{{-- v4.2.0 §C2 — L'espace du client : les modules de son marché, un par écran.
     Les partiels `espace-client/**` sont les MÊMES que ceux de la page publique : seule change la
     présence des boutons de décision. --}}
@php
    $dashboard = $this->dashboard();
    $acces = $this->acces();
    $module = $this->moduleCourant();
    $donnees = $this->donnees();
    $espaces = $this->mesEspaces();
    $champ = 'mt-1 block w-full';
    $etiquette = 'block text-xs font-semibold uppercase tracking-wide text-gray-500 dark:text-gray-400';

    // v4.11.0 §A/§D — LE MÊME LANGAGE QUE LA PAGE DE LECTURE. L'accent vient de l'espace courant,
    // et les modules actifs alimentent la barre du bas — la même liste, le même ordre, le même
    // composant que la page publique.
    $accent = $dashboard?->couleur_primaire ?: \App\Support\Identite::couleurPrimaire();
    $modulesActifs = $dashboard?->modulesActifs() ?? [];
    $lienDuModule = fn (string $cle): string => \App\Filament\Client\Pages\Espace::getUrl([
        'module' => $cle,
        'espace' => $dashboard?->id,
    ]);
@endphp

<x-filament-panels::page>
    @if ($dashboard === null)
        {{-- Plusieurs marchés, aucun choisi : on demande lequel. Un client rattaché à deux
             marchés du même acheteur ne doit pas avoir à deviner sur lequel il est. --}}
        <x-filament::section>
            <x-slot name="heading">Vos espaces</x-slot>
            @forelse ($espaces as $entree)
                <a href="{{ \App\Filament\Client\Pages\Espace::getUrl(['espace' => $entree->client_dashboard_id]) }}"
                   class="mt-2 flex items-center justify-between rounded-lg border border-gray-200 px-4 py-3 hover:bg-gray-50 dark:border-white/10 dark:hover:bg-white/5">
                    <span>
                        <span class="block text-sm font-medium text-gray-900 dark:text-white">{{ $entree->dashboard?->nom }}</span>
                        <span class="block text-xs text-gray-500 dark:text-gray-400">{{ $entree->dashboard?->client_nom }} · {{ $entree->titreAffiche() }}</span>
                    </span>
                    <span class="text-sm text-gray-400">Ouvrir →</span>
                </a>
            @empty
                <p class="py-6 text-center text-sm text-gray-500 dark:text-gray-400">
                    Aucun espace ne vous est ouvert pour le moment.
                </p>
            @endforelse
        </x-filament::section>
    @else
        {{-- v4.11.0 §D — L'accent de l'espace, sur un conteneur : le panneau Filament n'a pas de
             `:root` propre à cette page, et la charte de l'INSTALLATION n'est pas celle du client. --}}
        <div class="flex flex-col gap-5" style="--espace-primaire: {{ $accent }}">

        {{-- En-tête : la marque qui exécute, l'espace, son client, sa référence, le logo du client (v4.7.0 §E2). --}}
        @include('espace-client.en-tete', ['dashboard' => $dashboard, 'sousTitre' => $acces?->titreAffiche()])

        {{-- v4.11.0 §B — CE QUI ATTEND LE CLIENT EN TÊTE, avant tout le reste : c'est ce qu'il
             vient faire. Le rappel de la trace et l'activation des notifications passent après. --}}
        @include('espace-client.attendus', [
            'attendus' => $this->attendus(),
            'publique' => false,
            'lienDuModule' => $lienDuModule,
        ])

        <div class="rounded-xl border border-amber-200 bg-amber-50 px-4 py-3 text-sm text-amber-800 dark:border-amber-500/30 dark:bg-amber-500/10 dark:text-amber-300">
            Chaque action sur cette page envoie un e-mail automatique horodaté aux deux parties : c'est la trace.
        </div>

        {{-- v4.10.0 §B1 — Et, si vous le voulez, la même chose sur cet appareil. --}}
        @include('espace-client.notifications')

        @if ($module !== null)
            @include('espace-client.module', [
                'dashboard' => $dashboard,
                'module' => $module,
                'donnees' => $donnees,
                'publique' => false,
                'lienLivrable' => fn ($livrable): string => \App\Filament\Client\Pages\FicheLivrable::getUrl(['livrable' => $livrable->id]),
            ])
        @else
            <x-filament::section>
                <p class="py-6 text-center text-sm text-gray-500 dark:text-gray-400">
                    Aucun module n'est encore activé sur cet espace.
                </p>
            </x-filament::section>
        @endif

        {{-- ═══ Les panneaux de saisie, en ligne ══════════════════════════════════════════ --}}
        @if ($panneau === 'decision' || $panneau === 'cr' || $panneau === 'creneau')
            @php
                $titres = [
                    'decision' => 'Votre décision sur ce livrable',
                    'cr' => 'Votre décision sur ce compte rendu',
                    'creneau' => 'Votre réponse sur le créneau',
                ];
                $methodes = [
                    'decision' => 'enregistrerLaDecision',
                    'cr' => 'enregistrerLaDecisionDuCompteRendu',
                    'creneau' => 'enregistrerLaReponseAuCreneau',
                ];
                $exige = in_array($saisie['decision'] ?? '', ['corrections', 'refus', 'autre_creneau'], true);
            @endphp

            <x-filament::section>
                <x-slot name="heading">{{ $titres[$panneau] }}</x-slot>
                <x-slot name="description">
                    {{ \App\Enums\EspaceClient\TypeDecision::from($saisie['decision'])->label() }} —
                    un e-mail horodaté part aux deux parties dès l'enregistrement.
                </x-slot>

                <div>
                    <label for="ec-commentaire" class="{{ $etiquette }}">
                        Commentaire @unless ($exige) <span class="font-normal normal-case text-gray-400">· facultatif</span> @endunless
                    </label>
                    <x-filament::input.wrapper class="mt-1">
                        <textarea id="ec-commentaire" rows="4" 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 class="mt-4 flex gap-2">
                    <x-filament::button wire:click="{{ $methodes[$panneau] }}">Envoyer ma décision</x-filament::button>
                    <x-filament::button color="gray" wire:click="fermerLePanneau">Annuler</x-filament::button>
                </div>
            </x-filament::section>
        @endif

        {{-- ═══ v4.3.0 §C2 — Le panneau de publication : « Voir et modifier » ══════════════ --}}
        @if ($panneau === 'publication')
            @php
                $publication = \App\Models\EspaceClient\PublicationClient::find($saisie['publication']);
            @endphp

            <x-filament::section>
                <x-slot name="heading">Publication sur vos réseaux</x-slot>
                <x-slot name="description">
                    {{ $publication?->titre }} — modifiez le texte, la date ou les canaux si vous le
                    souhaitez : ce que vous validez est ce qui sera publié, et rien d'autre.
                </x-slot>

                @if ($publication?->visuel_lien)
                    <p class="mb-3 text-sm">
                        <a href="{{ $publication->visuel_lien }}" target="_blank" rel="noopener" class="underline">Voir le visuel ↗</a>
                    </p>
                @endif

                <div class="grid gap-3 sm:grid-cols-2">
                    <div class="sm:col-span-2">
                        <label for="pub-fr" class="{{ $etiquette }}">Texte FR</label>
                        <x-filament::input.wrapper class="mt-1">
                            <textarea id="pub-fr" rows="5" 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="sm:col-span-2">
                        <label for="pub-ar" class="{{ $etiquette }}">Texte AR <span class="font-normal normal-case text-gray-400">· à compléter si vous le souhaitez</span></label>
                        <x-filament::input.wrapper class="mt-1">
                            <textarea id="pub-ar" rows="5" 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>
                        <label for="pub-date" class="{{ $etiquette }}">Date de publication</label>
                        <x-filament::input.wrapper class="mt-1">
                            <x-filament::input id="pub-date" type="date" wire:model="saisie.prevue_le" />
                        </x-filament::input.wrapper>
                    </div>
                    <div>
                        <label for="pub-heure" class="{{ $etiquette }}">Heure</label>
                        <x-filament::input.wrapper class="mt-1">
                            <x-filament::input id="pub-heure" type="time" wire:model="saisie.prevue_a" />
                        </x-filament::input.wrapper>
                    </div>
                    <div class="sm:col-span-2">
                        <label class="{{ $etiquette }}">Canaux</label>
                        <div class="mt-2 flex flex-wrap gap-3">
                            @foreach ($dashboard->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="sm:col-span-2">
                        <label for="pub-com" class="{{ $etiquette }}">Commentaire <span class="font-normal normal-case text-gray-400">· obligatoire pour demander des modifications</span></label>
                        <x-filament::input.wrapper class="mt-1">
                            <textarea id="pub-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 flex-wrap gap-2">
                    <x-filament::button color="gray" wire:click="choisirLaDecisionDeLaPublication('corrections')">Demander des modifications</x-filament::button>
                    <x-filament::button color="gray" wire:click="choisirLaDecisionDeLaPublication('valide_avec_modifications')">Valider avec mes modifications</x-filament::button>
                    <x-filament::button wire:click="choisirLaDecisionDeLaPublication('valide')">Valider telle quelle</x-filament::button>
                    <x-filament::button color="gray" wire:click="fermerLePanneau">Fermer</x-filament::button>
                </div>
            </x-filament::section>
        @endif

        {{-- L'e-mail QUI VA PARTIR, montré avant d'envoyer : il n'y a pas de meilleure façon de
             dire ce qu'on est en train de signer. --}}
        @if ($panneau === 'publication-apercu')
            @php
                $apercu = $this->apercuDeLaPublication();
            @endphp

            <x-filament::section>
                <x-slot name="heading">L'e-mail qui va partir</x-slot>
                <x-slot name="description">
                    Il part aux deux parties et vaut trace écrite. Relisez-le avant de l'envoyer.
                </x-slot>

                <dl class="space-y-2 text-sm">
                    <div>
                        <dt class="{{ $etiquette }}">Destinataires</dt>
                        <dd class="mt-0.5 break-all text-gray-700 dark:text-gray-200">
                            {{ implode(', ', $apercu['destinataires']) ?: 'aucun destinataire enregistré' }}
                        </dd>
                    </div>
                    <div>
                        <dt class="{{ $etiquette }}">Objet</dt>
                        <dd class="mt-0.5 text-gray-700 dark:text-gray-200">{{ $apercu['sujet'] }}</dd>
                    </div>
                    <div>
                        <dt class="{{ $etiquette }}">Message</dt>
                        <dd class="mt-1 whitespace-pre-line rounded-lg border border-gray-200 bg-gray-50 px-3 py-2 text-gray-700 dark:border-white/10 dark:bg-white/5 dark:text-gray-200">{{ $apercu['corps'] }}</dd>
                    </div>
                </dl>

                <div class="mt-4 flex flex-wrap gap-2">
                    <x-filament::button wire:click="enregistrerLaDecisionDeLaPublication">Envoyer ma décision</x-filament::button>
                    <x-filament::button color="gray" wire:click="ouvrirLaPublication({{ (int) $saisie['publication'] }})">Revenir</x-filament::button>
                </div>
            </x-filament::section>
        @endif

        {{-- ═══ Proposer une publication ══════════════════════════════════════════════════ --}}
        @if ($panneau === 'proposer-publication')
            <x-filament::section>
                <x-slot name="heading">Proposer une publication</x-slot>
                <x-slot name="description">
                    Écrivez votre texte : nous complétons le visuel et vous la renvoyons pour validation.
                </x-slot>

                <div class="grid gap-3 sm:grid-cols-2">
                    <div class="sm:col-span-2">
                        <label for="pp-titre" class="{{ $etiquette }}">Titre</label>
                        <x-filament::input.wrapper class="mt-1"><x-filament::input id="pp-titre" type="text" wire:model="saisie.titre" /></x-filament::input.wrapper>
                    </div>
                    <div class="sm:col-span-2">
                        <label for="pp-fr" class="{{ $etiquette }}">Texte FR</label>
                        <x-filament::input.wrapper class="mt-1">
                            <textarea id="pp-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="sm:col-span-2">
                        <label for="pp-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="pp-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>
                        <label for="pp-date" class="{{ $etiquette }}">Date souhaitée</label>
                        <x-filament::input.wrapper class="mt-1"><x-filament::input id="pp-date" type="date" wire:model="saisie.prevue_le" /></x-filament::input.wrapper>
                    </div>
                    <div>
                        <label for="pp-heure" class="{{ $etiquette }}">Heure</label>
                        <x-filament::input.wrapper class="mt-1"><x-filament::input id="pp-heure" type="time" wire:model="saisie.prevue_a" /></x-filament::input.wrapper>
                    </div>
                    <div class="sm:col-span-2">
                        <label class="{{ $etiquette }}">Canaux</label>
                        <div class="mt-2 flex flex-wrap gap-3">
                            @foreach ($dashboard->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>

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

        {{-- ═══ Signaler un événement ═════════════════════════════════════════════════════ --}}
        @if ($panneau === 'signaler-evenement')
            <x-filament::section>
                <x-slot name="heading">Signaler un événement à couvrir</x-slot>
                <x-slot name="description">
                    Nous ouvrons en même temps la demande de commande : une couverture annoncée sans
                    commande est celle qu'on découvre non commandée la veille.
                </x-slot>

                <div class="grid gap-3 sm:grid-cols-2">
                    <div class="sm:col-span-2">
                        <label for="se-titre" class="{{ $etiquette }}">De quel événement s'agit-il ?</label>
                        <x-filament::input.wrapper class="mt-1"><x-filament::input id="se-titre" type="text" wire:model="saisie.titre" /></x-filament::input.wrapper>
                    </div>
                    <div>
                        <label for="se-date" class="{{ $etiquette }}">Date</label>
                        <x-filament::input.wrapper class="mt-1"><x-filament::input id="se-date" type="date" wire:model="saisie.date" /></x-filament::input.wrapper>
                    </div>
                    <div>
                        <label for="se-heure" class="{{ $etiquette }}">Heure</label>
                        <x-filament::input.wrapper class="mt-1"><x-filament::input id="se-heure" type="time" wire:model="saisie.heure" /></x-filament::input.wrapper>
                    </div>
                    @if ($dashboard->zonesConfigurees())
                        <div>
                            <label for="se-zone" class="{{ $etiquette }}">Zone</label>
                            <x-filament::input.wrapper class="mt-1">
                                <x-filament::input.select id="se-zone" wire:model="saisie.zone">
                                    <option value="">— à préciser —</option>
                                    @foreach ($dashboard->zonesConfigurees() as $zone)
                                        <option value="{{ $zone['code'] }}">{{ $zone['libelle'] }}</option>
                                    @endforeach
                                </x-filament::input.select>
                            </x-filament::input.wrapper>
                        </div>
                    @endif
                    <div>
                        <label for="se-lieu" class="{{ $etiquette }}">Lieu</label>
                        <x-filament::input.wrapper class="mt-1"><x-filament::input id="se-lieu" type="text" wire:model="saisie.lieu" /></x-filament::input.wrapper>
                    </div>
                    <div>
                        <label for="se-org" class="{{ $etiquette }}">Organisateur</label>
                        <x-filament::input.wrapper class="mt-1"><x-filament::input id="se-org" type="text" wire:model="saisie.organisateur" /></x-filament::input.wrapper>
                    </div>
                    <div>
                        <label for="se-disp" class="{{ $etiquette }}">Dispositif souhaité</label>
                        <x-filament::input.wrapper class="mt-1"><x-filament::input id="se-disp" type="text" wire:model="saisie.dispositif" placeholder="photo, vidéo, interviews" /></x-filament::input.wrapper>
                    </div>
                    <div class="sm:col-span-2">
                        <label for="se-prec" class="{{ $etiquette }}">Précisions</label>
                        <x-filament::input.wrapper class="mt-1">
                            <textarea id="se-prec" rows="3" wire:model="saisie.precisions" 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="enregistrerLeSignalement">Signaler</x-filament::button>
                    <x-filament::button color="gray" wire:click="fermerLePanneau">Annuler</x-filament::button>
                </div>
            </x-filament::section>
        @endif

        @if ($panneau === 'demande')
            <x-filament::section>
                <x-slot name="heading">Commander une prestation</x-slot>
                <x-slot name="description">
                    Décrivez votre besoin en quelques mots. Une demande n'engage rien tant que la lettre
                    de commande n'est pas signée.
                </x-slot>

                <div class="grid gap-3 sm:grid-cols-2">
                    <div class="sm:col-span-2">
                        <label for="ec-objet" class="{{ $etiquette }}">Objet</label>
                        <x-filament::input.wrapper class="mt-1">
                            <x-filament::input id="ec-objet" type="text" wire:model="saisie.objet" />
                        </x-filament::input.wrapper>
                    </div>
                    <div>
                        <label for="ec-type" class="{{ $etiquette }}">Type de prestation</label>
                        <x-filament::input.wrapper class="mt-1">
                            <x-filament::input id="ec-type" type="text" wire:model="saisie.type" />
                        </x-filament::input.wrapper>
                    </div>
                    <div>
                        <label for="ec-date" class="{{ $etiquette }}">Date souhaitée</label>
                        <x-filament::input.wrapper class="mt-1">
                            <x-filament::input id="ec-date" type="date" wire:model="saisie.date_prestation" />
                        </x-filament::input.wrapper>
                    </div>
                    <div>
                        <label for="ec-lieu" class="{{ $etiquette }}">Lieu</label>
                        <x-filament::input.wrapper class="mt-1">
                            <x-filament::input id="ec-lieu" type="text" wire:model="saisie.lieu" />
                        </x-filament::input.wrapper>
                    </div>
                    <div>
                        <label for="ec-lettre" class="{{ $etiquette }}">Lettre de commande</label>
                        <x-filament::input.wrapper class="mt-1">
                            <x-filament::input.select id="ec-lettre" wire:model="saisie.mode_lettre">
                                @foreach (\App\Enums\EspaceClient\ModeLettre::cases() as $mode)
                                    <option value="{{ $mode->value }}">{{ $mode->label() }}</option>
                                @endforeach
                            </x-filament::input.select>
                        </x-filament::input.wrapper>
                    </div>
                    <div class="sm:col-span-2">
                        <label for="ec-attendus" class="{{ $etiquette }}">Ce que vous attendez</label>
                        <x-filament::input.wrapper class="mt-1">
                            <textarea id="ec-attendus" rows="3" 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="enregistrerLaDemande">Envoyer la demande</x-filament::button>
                    <x-filament::button color="gray" wire:click="fermerLePanneau">Annuler</x-filament::button>
                </div>
            </x-filament::section>
        @endif

        {{-- v4.7.0 §B2 — « Nous écrire » : sujet, message ; la réponse arrive à l'adresse du compte. --}}
        @if ($panneau === 'ecrire')
            <x-filament::section>
                <x-slot name="heading">Nous écrire</x-slot>
                <x-slot name="description">
                    Votre message part à vos interlocuteurs de l'espace. Nous vous répondons à {{ auth()->user()?->email }}.
                </x-slot>

                <div class="grid gap-3">
                    <div>
                        <label for="ec-sujet" class="{{ $etiquette }}">Sujet</label>
                        <x-filament::input.wrapper class="mt-1">
                            <x-filament::input id="ec-sujet" type="text" maxlength="150" wire:model="saisie.sujet" />
                        </x-filament::input.wrapper>
                    </div>
                    <div>
                        <label for="ec-message" class="{{ $etiquette }}">Message</label>
                        <x-filament::input.wrapper class="mt-1">
                            <textarea id="ec-message" rows="5" maxlength="4000" 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="envoyerLeMessage">Envoyer</x-filament::button>
                    <x-filament::button color="gray" wire:click="fermerLePanneau">Annuler</x-filament::button>
                </div>
            </x-filament::section>
        @endif

        @if ($panneau === 'piece')
            <x-filament::section>
                <x-slot name="heading">Joindre une pièce</x-slot>
                <x-slot name="description">
                    Déposez le lien du document signé, ou sa référence. La pièce est archivée avec le
                    dossier de la commande, et un e-mail part aux deux parties.
                </x-slot>

                <div>
                    <label for="ec-piece" class="{{ $etiquette }}">Lien ou référence du document</label>
                    <x-filament::input.wrapper class="mt-1">
                        <x-filament::input id="ec-piece" type="text" wire:model="saisie.reference" />
                    </x-filament::input.wrapper>
                </div>

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

        {{-- Le pied : commander, le groupe, et le choix de l'espace quand il y en a plusieurs. --}}
        <div class="flex flex-wrap gap-2">
            <x-filament::button wire:click="ouvrirLaDemande" icon="heroicon-o-plus">Commander une prestation</x-filament::button>

            @if ($dashboard->whatsapp_groupe_url)
                <x-filament::button tag="a" color="gray" href="{{ $dashboard->whatsapp_groupe_url }}" target="_blank">
                    Groupe de discussion
                </x-filament::button>
            @endif

            @if ($espaces->count() > 1)
                <x-filament::button tag="a" color="gray" href="{{ \App\Filament\Client\Pages\Espace::getUrl() }}">
                    Changer d'espace
                </x-filament::button>
            @endif
        </div>

        {{-- v4.11.0 §A — LA BARRE DU BAS, la même que sur la page de lecture et dans l'application
             installée. Sur bureau, c'est la barre latérale DU PANNEAU qui porte déjà les modules,
             avec leurs icônes et leur état actif : en ajouter une seconde dans la page ferait deux
             navigations concurrentes pour la même chose. Ce composant ne se rend que sous 1024 px,
             là où la barre du panneau est repliée derrière un bouton. --}}
        @if ($modulesActifs !== [])
            <x-espace-client.barre-basse :modules="$modulesActifs" :courant="$module?->value" :lien="$lienDuModule" />
        @endif
        </div>
    @endif
</x-filament-panels::page>