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

<p class="text-sm text-gray-700 dark:text-gray-200">
    {{ $panel['intro'] }}
</p>

<ul class="list-disc space-y-1 pl-5 text-sm text-gray-600 dark:text-gray-300">
    @foreach ($panel['guidance_lines'] ?? [] as $line)
        <li>{{ $line }}</li>
    @endforeach
</ul>

<p @class([
    'text-sm',
    'font-medium text-amber-900 dark:text-amber-100' => ! ($panel['commands_ready'] ?? false),
    'text-gray-600 dark:text-gray-300' => (bool) ($panel['commands_ready'] ?? false),
])>
    {{ $panel['execution_hint'] }}
</p>

@if ($panel['commands_ready'] ?? false)
    @if (filled($panel['php_hint'] ?? null))
        <p class="text-xs text-gray-500 dark:text-gray-400">
            {{ $panel['php_hint'] }}
        </p>
    @endif

    <div class="space-y-3">
        <div class="space-y-1">
            <p class="text-xs font-medium uppercase tracking-wide text-gray-500 dark:text-gray-400">
                {{ $panel['combined_label'] }}
            </p>
            <pre class="overflow-x-auto rounded-lg border border-gray-200 bg-white px-3 py-2 text-sm text-gray-900 select-all dark:border-gray-600 dark:bg-gray-950 dark:text-gray-100"><code>{{ $panel['combined_command'] }}</code></pre>
        </div>

        <details class="text-sm text-gray-600 dark:text-gray-300">
            <summary class="cursor-pointer font-medium text-gray-700 dark:text-gray-200">
                {{ __('dberp.system_update_center.terminal.advanced_commands_label') }}
            </summary>
            <div class="mt-3 space-y-3">
                <div class="space-y-1">
                    <p class="text-xs font-medium text-gray-500 dark:text-gray-400">{{ $panel['cd_label'] }}</p>
                    <pre class="overflow-x-auto rounded-lg border border-gray-200 bg-white px-3 py-2 text-sm select-all dark:border-gray-600 dark:bg-gray-950 dark:text-gray-100"><code>{{ $panel['cd_command'] }}</code></pre>
                </div>
                <div class="space-y-1">
                    <p class="text-xs font-medium text-gray-500 dark:text-gray-400">{{ $panel['run_label'] }}</p>
                    <pre class="overflow-x-auto rounded-lg border border-gray-200 bg-white px-3 py-2 text-sm select-all dark:border-gray-600 dark:bg-gray-950 dark:text-gray-100"><code>{{ $panel['run_command'] }}</code></pre>
                </div>
            </div>
        </details>
    </div>

    @if (filled($panel['copy_hint'] ?? null))
        <p class="text-xs text-gray-500 dark:text-gray-400">
            {{ $panel['copy_hint'] }}
        </p>
    @endif
@else
    @if (filled($panel['cd_command'] ?? null))
        <div class="space-y-1">
            <p class="text-xs font-medium text-gray-500 dark:text-gray-400">
                {{ $panel['cd_label'] }}
            </p>
            <pre class="overflow-x-auto rounded-lg border border-gray-200 bg-white px-3 py-2 text-sm text-gray-900 select-all dark:border-gray-600 dark:bg-gray-950 dark:text-gray-100"><code>{{ $panel['cd_command'] }}</code></pre>
        </div>
    @endif

    @if (filled($panel['copy_hint'] ?? null))
        <p class="text-xs text-gray-500 dark:text-gray-400">
            {{ $panel['copy_hint'] }}
        </p>
    @endif
@endif
