<div @if ($polling) wire:poll.4s @endif>
    @if ($active)
        <div class="rounded-lg border border-line bg-surface p-5 shadow-xs animate-rise">
            <div class="flex items-center gap-2">
                <span class="size-2 rounded-pill {{ $failed ? 'bg-danger' : 'bg-info animate-pulse' }}" aria-hidden="true"></span>
                <h2 class="font-semibold text-ink">{{ __('dashboard.provisioning_title') }}</h2>
            </div>
            <p class="mb-4 mt-1 text-sm text-muted">
                {{ $failed ? __('dashboard.provisioning_failed') : __('dashboard.provisioning_sub') }}
            </p>
            <x-ui.progress-stepper :steps="$steps" />
        </div>
    @endif
</div>
