{{--
    Bandeau de progression de l'analyse IA, en tête de l'étape « Vérifier ».
    La lecture des pièces n'est pas une étape : c'est une attente. Elle vit
    donc sur l'écran de vérification, s'interroge toutes les deux secondes
    tant qu'elle tourne, et reporte les valeurs extraites dans les champs
    ci-dessous dès qu'elles arrivent — sans écraser ce qui a été saisi à la
    main pendant ce temps. En cas d'échec, la raison est donnée en français
    clair et la saisie manuelle continue. Jamais de cul-de-sac.
--}}
@php
    $analyse = $this->analyse();
    $lecture = $this->lectureParPiece();
    $enCours = $analyse && $analyse->estEnCours();
@endphp

{{-- Pas d'analyse (saisie manuelle choisie, aucune pièce analysable, IA absente) : rien à afficher. --}}
@if ($analyse)
<div @if ($enCours) wire:poll.2s="rafraichirAnalyse" @endif class="space-y-4">

    {{-- Analyse en cours : barre de progression réelle, fondée sur les pièces traitées. --}}
    @if ($enCours)
        @php
            $pourcent = $analyse->progression();
        @endphp

        <div class="space-y-3 rounded-xl border border-gray-200 bg-white p-4 dark:border-white/10 dark:bg-white/5">
            <div class="flex items-center justify-between">
                <p class="text-sm font-semibold text-gray-900 dark:text-gray-100">
                    L'IA lit vos pièces…
                </p>
                <span class="text-sm tabular-nums text-gray-500 dark:text-gray-400">
                    {{ $analyse->nb_pieces_traitees }} / {{ $analyse->nb_pieces }} pièce(s)
                </span>
            </div>

            <div class="h-2 w-full overflow-hidden rounded-full bg-gray-200 dark:bg-white/10">
                <div
                    class="h-full rounded-full bg-primary-600 transition-all duration-500"
                    style="width: {{ max(4, $pourcent) }}%"
                ></div>
            </div>

            <p class="text-sm text-gray-600 dark:text-gray-400">
                Les champs ci-dessous se rempliront tout seuls à mesure de la lecture.
                Vous pouvez aussi commencer à saisir sans attendre&nbsp;: rien de ce que
                vous écrivez ne sera écrasé.
            </p>
        </div>

    {{-- Échec : la raison en français clair, et la saisie continue en dessous. --}}
    @elseif ($analyse->aEchoue())
        <div class="rounded-xl border border-danger-300 bg-danger-50 p-4 dark:border-danger-500/40 dark:bg-danger-500/10">
            <p class="text-sm font-semibold text-danger-800 dark:text-danger-300">
                L'analyse n'a pas abouti.
            </p>
            <p class="mt-1 text-sm text-danger-700 dark:text-danger-400">
                {{ $analyse->erreur_lisible }}
            </p>
            <p class="mt-2 text-sm text-danger-700 dark:text-danger-400">
                Vos pièces sont conservées et seront rattachées au client.
                Saisissez les champs ci-dessous à la main.
            </p>

            @if (filled($analyse->message_erreur))
                <details class="mt-3">
                    <summary class="cursor-pointer text-xs text-danger-600 dark:text-danger-400">
                        Détail technique
                    </summary>
                    <p class="mt-1 break-words font-mono text-xs text-danger-700 dark:text-danger-400">
                        {{ $analyse->message_erreur }}
                    </p>
                </details>
            @endif
        </div>

    {{-- Terminée : ce qui a été lu, et le rappel que rien n'est encore enregistré. --}}
    @else
        <div class="rounded-xl border border-success-300 bg-success-50 p-4 dark:border-success-500/40 dark:bg-success-500/10">
            <p class="text-sm font-semibold text-success-800 dark:text-success-300">
                Lecture terminée&nbsp;:
                {{ $analyse->extractions()->count() }} champ(s) extrait(s).
            </p>
            <p class="mt-1 text-sm text-success-700 dark:text-success-400">
                Rien n'est encore enregistré. Vérifiez chaque valeur ci-dessous avant de créer le dossier.
            </p>
        </div>
    @endif

    {{-- Détail par pièce, dès qu'il y a quelque chose à montrer. --}}
    @if ($lecture !== [])
        <ul class="space-y-2">
            @foreach ($lecture as $piece)
                <li class="flex items-start gap-3 rounded-lg border border-gray-200 bg-white p-3 dark:border-white/10 dark:bg-white/5">
                    <x-filament::icon
                        :icon="$piece['champs'] === [] ? 'heroicon-o-clock' : 'heroicon-o-check-circle'"
                        @class([
                            'mt-0.5 h-5 w-5 shrink-0',
                            'text-gray-400' => $piece['champs'] === [],
                            'text-success-600 dark:text-success-400' => $piece['champs'] !== [],
                        ])
                    />
                    <div class="min-w-0">
                        <p class="text-sm font-medium text-gray-900 dark:text-gray-100">
                            {{ $piece['type'] }} — {{ $piece['libelle'] }}
                        </p>
                        <p class="text-sm text-gray-600 dark:text-gray-400">
                            @if ($piece['champs'] === [])
                                en attente de lecture…
                            @else
                                lu&nbsp;: {{ implode(', ', $piece['champs']) }}
                            @endif
                        </p>
                    </div>
                </li>
            @endforeach
        </ul>
    @endif
</div>
@endif