@php
    $steps = ['Profil', 'Marka', 'Hizmetler', 'Domain', 'Önizleme'];
@endphp

<ol class="mb-8 flex items-center justify-between">
    @foreach ($steps as $index => $label)
        @php
            $stepNumber = $index + 1;
            $isActive = $stepNumber === $current;
            $isDone = $stepNumber < $current;
        @endphp
        <li class="flex flex-1 flex-col items-center text-center">
            <span
                @class([
                    'flex h-8 w-8 items-center justify-center rounded-full text-sm font-semibold',
                    'bg-brand-600 text-white' => $isActive,
                    'bg-brand-100 text-brand-700' => $isDone,
                    'bg-paper-100 text-ink-700 border border-brand-100' => ! $isActive && ! $isDone,
                ])
            >
                {{ $isDone ? '✓' : $stepNumber }}
            </span>
            <span @class([
                'mt-1.5 text-xs',
                'font-semibold text-brand-700' => $isActive,
                'text-ink-700' => ! $isActive,
            ])>
                {{ $label }}
            </span>
        </li>
        @if (! $loop->last)
            <li class="mx-1 h-px flex-1 {{ $stepNumber < $current ? 'bg-brand-400' : 'bg-brand-100' }}" aria-hidden="true"></li>
        @endif
    @endforeach
</ol>