@php
    $surface = is_array($surface ?? null) ? $surface : [];
    $coreState = is_string($surface['coreState'] ?? null) ? (string) $surface['coreState'] : 'unavailable';
    $redactionNotes = is_array($redactionNotes ?? null)
        ? array_values(array_filter($redactionNotes, 'is_string'))
        : [];
    $canAcknowledge = (bool) ($canAcknowledge ?? false);
    $ackAction = $ackAction ?? null;
    $showAssist = (bool) ($showAssist ?? false);
    $assistActionName = is_string($assistActionName ?? null) && trim((string) $assistActionName) !== ''
        ? trim((string) $assistActionName)
        : 'wizardVerificationRequiredPermissionsAssist';
    $linkBehavior = $linkBehavior ?? app(\App\Support\Verification\VerificationLinkBehavior::class);
    $emptyState = is_array($surface['emptyState'] ?? null) ? $surface['emptyState'] : null;
@endphp

<div
    data-shared-detail-family="verification-report"
    data-host-kind="{{ (string) ($surface['hostKind'] ?? 'operation_run_detail') }}"
    class="space-y-4"
>
    @if ($coreState === 'unavailable')
        <div
            data-shared-zone="unavailable"
            class="rounded-lg border border-gray-200 bg-white p-4 text-sm text-gray-600 shadow-sm dark:border-gray-800 dark:bg-gray-900 dark:text-gray-300"
        >
            <div class="font-medium text-gray-900 dark:text-white">
                {{ $emptyState['title'] ?? 'Verification report unavailable' }}
            </div>
            <div class="mt-1">
                {{ $emptyState['message'] ?? 'This operation does not have a report yet.' }}
            </div>
            <div class="mt-2 text-xs text-gray-600 dark:text-gray-300">
                <span class="font-semibold">Read-only:</span> this view uses stored data and makes no external calls.
            </div>

            @if ($redactionNotes !== [])
                <div class="mt-3 rounded-lg border border-amber-200 bg-amber-50 px-3 py-2 text-xs text-amber-900 dark:border-amber-500/30 dark:bg-amber-500/10 dark:text-amber-100">
                    @foreach ($redactionNotes as $note)
                        <div>{{ $note }}</div>
                    @endforeach
                </div>
            @endif
        </div>
    @else
        @include('filament.components.verification-report.summary', [
            'surface' => $surface,
            'redactionNotes' => $redactionNotes,
        ])

        <div x-data="{ tab: 'issues' }" class="space-y-4">
            <x-filament::tabs label="Verification report tabs">
                <x-filament::tabs.item
                    :active="true"
                    alpine-active="tab === 'issues'"
                    x-on:click="tab = 'issues'"
                >
                    Issues
                </x-filament::tabs.item>
                <x-filament::tabs.item
                    :active="false"
                    alpine-active="tab === 'passed'"
                    x-on:click="tab = 'passed'"
                >
                    Passed
                </x-filament::tabs.item>
            </x-filament::tabs>

            <div x-show="tab === 'issues'">
                @include('filament.components.verification-report.issues', [
                    'surface' => $surface,
                    'canAcknowledge' => $canAcknowledge,
                    'ackAction' => $ackAction,
                    'showAssist' => $showAssist,
                    'assistActionName' => $assistActionName,
                    'linkBehavior' => $linkBehavior,
                ])
            </div>

            <div x-show="tab === 'passed'" style="display: none;">
                @include('filament.components.verification-report.passed', [
                    'surface' => $surface,
                ])
            </div>
        </div>

        @include('filament.components.verification-report.diagnostics', [
            'surface' => $surface,
        ])
    @endif
</div>