{{-- Dieselben drei Schritte, für die Stelle, an der noch nichts angelegt ist:
     die Host-Liste. Dort ist es eine Auskunft und kein Ablauf — also Zeilen mit
     je einem Satz, nicht die Schiene mit Zustand.

     Eine Zeile je Schritt, nach dem Muster von `x-ui.row`: links wozu, rechts
     was. Der Schritt beim Anbieter trägt eine Plakette, sonst liest sich die
     Liste, als könne man oben anfangen und sich durcharbeiten.

     Waren sechs, zwei davon „Rettungssystem". Sie beschrieben den
     Bootstrap-Weg; gefahren wird beim Anlegen die Provisionierungs-Pipeline,
     die sich selbst an einer laufenden Debian-Maschine anmeldet. Mit den
     Schritten fiel auch `archiveUrl` weg — die Adresse gehörte zur
     Befehlszeile, die es hier nicht mehr gibt. --}}

@php
    $steps = [
        1 => [__('hosts.takeover.s1_title'), __('hosts.takeover.s1_body'), true],
        2 => [__('hosts.takeover.s2_title'), __('hosts.takeover.s2_body'), false],
        3 => [__('hosts.takeover.s3_title'), __('hosts.takeover.s3_body'), false],
    ];
@endphp

<ol {{ $attributes->merge(['class' => 'divide-y divide-line']) }}>
    @foreach ($steps as $number => [$title, $body, $atProvider])
        <li class="grid gap-x-6 gap-y-1 px-6 py-3.5 sm:grid-cols-[minmax(0,220px)_minmax(0,1fr)] sm:items-baseline">
            <div class="flex items-center gap-2.5">
                <span class="flex size-5 shrink-0 items-center justify-center rounded-full border border-line text-[11px] font-bold tabular-nums text-muted">{{ $number }}</span>
                <span class="text-sm font-medium text-ink">{{ $title }}</span>
                @if ($atProvider)
                    <x-ui.badge status="warning">{{ __('hosts.takeover.badge_before') }}</x-ui.badge>
                @endif
            </div>
            <p class="text-sm leading-relaxed text-muted">
                {{ $body }}
            </p>
        </li>
    @endforeach
</ol>