@props([
    'panel' => null,
])

@if (is_array($panel))
    <div class="mt-4 space-y-4 rounded-xl border border-danger-200 bg-danger-50/60 p-4 dark:border-danger-500/30 dark:bg-danger-500/10">
        <p class="text-sm font-semibold text-danger-800 dark:text-danger-200">
            {{ $panel['title'] }}
        </p>

        @if (filled($panel['execution_error'] ?? null))
            <p class="text-sm text-gray-700 dark:text-gray-200">
                <span class="font-medium">{{ __('dberp.system_update_center.rows.execution_error') }}：</span>
                {{ $panel['execution_error'] }}
            </p>
        @endif

        <ol class="list-decimal space-y-2 pl-5 text-sm text-gray-700 dark:text-gray-200">
            @foreach ($panel['steps'] as $step)
                <li>{{ $step }}</li>
            @endforeach
        </ol>

        @if ($panel['suggest_terminal'] ?? false)
            <p class="text-sm text-gray-600 dark:text-gray-300">
                {{ $panel['terminal_note'] }}
            </p>

            @if (filled($panel['combined_command'] ?? null))
                <details class="group rounded-lg border border-gray-200 bg-white dark:border-gray-600 dark:bg-gray-950">
                    <summary class="cursor-pointer px-3 py-2 text-sm font-medium text-gray-800 dark:text-gray-100">
                        {{ __('dberp.system_update_center.terminal.combined_label') }}
                    </summary>
                    <pre class="overflow-x-auto border-t border-gray-200 px-3 py-2 text-sm text-gray-900 dark:border-gray-600 dark:text-gray-100"><code>{{ $panel['combined_command'] }}</code></pre>
                </details>
            @endif
        @endif
    </div>
@endif
