@php
    $runs = $runs ?? collect();
    $overflowCount = (int) ($overflowCount ?? 0);
    $tenant = $tenant ?? null;
@endphp

{{-- Cleanup is delegated to the shared poller helper, which uses teardownObserver and new MutationObserver. --}}

{{-- Widget must always be mounted, even when empty, so it can receive Livewire events --}}
<div 
    x-data="opsUxProgressWidgetPoller()" 
    x-init="init()" 
    wire:key="ops-ux-progress-widget"
    @if (! $disabled && $hasActiveRuns)
        wire:poll.10s="refreshRuns"
    @endif
>
    @if($runs->isNotEmpty())
        <div class="fixed bottom-4 right-4 z-[999999] w-96 space-y-2" style="pointer-events: auto;">
            @foreach ($runs->take(5) as $run)
                @php
                    $statusSpec = \App\Support\Badges\BadgeRenderer::spec(
                        \App\Support\Badges\BadgeDomain::OperationRunStatus,
                        [
                            'status' => (string) $run->status,
                            'freshness_state' => $run->freshnessState()->value,
                        ],
                    );
                    $lifecycleAttention = \App\Support\OpsUx\OperationUxPresenter::lifecycleAttentionSummary($run);
                    $guidance = \App\Support\OpsUx\OperationUxPresenter::surfaceGuidance($run);
                @endphp
                <div class="bg-white dark:bg-gray-800 rounded-lg shadow-xl border-2 border-primary-500 dark:border-primary-400 p-4 transition-all animate-in slide-in-from-right duration-300"
                    wire:key="run-{{ $run->id }}">
                    <div class="flex items-start justify-between gap-4">
                        <div class="min-w-0">
                            <h4 class="text-sm font-semibold text-gray-900 dark:text-gray-100">
                                {{ \App\Support\OperationCatalog::label((string) $run->type) }}
                            </h4>
                            <p class="mt-0.5 text-xs text-gray-500 dark:text-gray-400">
                                @if($run->status === 'queued')
                                    Queued • {{ ($run->started_at ?? $run->created_at)?->diffForHumans(null, true, true) }}
                                @else
                                    Running • {{ ($run->started_at ?? $run->created_at)?->diffForHumans(null, true, true) }}
                                @endif
                            </p>
                            <div class="mt-2 flex flex-wrap items-center gap-2">
                                <x-filament::badge :color="$statusSpec->color" size="sm">
                                    {{ $statusSpec->label }}
                                </x-filament::badge>
                                @if ($lifecycleAttention)
                                    <span class="inline-flex items-center rounded-full border border-warning-200 bg-warning-50 px-2 py-0.5 text-xs font-medium text-warning-800 dark:border-warning-600/40 dark:bg-warning-500/10 dark:text-warning-100">
                                        {{ $lifecycleAttention }}
                                    </span>
                                @endif
                            </div>
                            @if ($guidance)
                                <p class="mt-2 text-xs leading-5 text-gray-600 dark:text-gray-300">
                                    {{ $guidance }}
                                </p>
                            @endif
                        </div>

                        @if ($tenant)
                            <a
                                href="{{ \App\Support\OpsUx\OperationRunUrl::view($run, $tenant) }}"
                                class="shrink-0 text-xs font-medium text-primary-700 hover:text-primary-800 dark:text-primary-300 dark:hover:text-primary-200"
                            >
                                Open operation
                            </a>
                        @endif
                    </div>
                </div>
            @endforeach

            @if($overflowCount > 0 && $tenant)
                <a
                    href="{{ \App\Support\OpsUx\OperationRunUrl::index($tenant) }}"
                    class="block rounded-lg bg-white/90 dark:bg-gray-800/90 px-4 py-2 text-center text-xs font-medium text-gray-700 hover:text-gray-900 dark:text-gray-200 dark:hover:text-white shadow"
                >
                    +{{ $overflowCount }} more
                </a>
            @endif
        </div>
    @endif
</div>