@php
    /**
     * Renderiza el funnel post-lanzamiento de 6 etapas para un misil launched.
     *
     * Variables esperadas:
     *   $m        — MissileDraft (con launchedProject cargado)
     *   $steps    — opcional, $m->funnelProgress() si no se pasa
     */
    $steps = $steps ?? $m->funnelProgress();
    $tp    = $m->launchedProject;
    $tenantUrl = $tp && $tp->domain ? "https://{$tp->domain}" : null;

    // CTA dinámica: primer paso pendiente (no done) que tenga meta accionable
    $nextActionStep = null;
    foreach ($steps as $s) {
        if (!$s['done'] && !empty($s['meta']) && str_starts_with($s['meta'], '/')) {
            $nextActionStep = $s;
            break;
        }
    }
@endphp

<div class="cd-funnel-progress py-3 px-4"
     style="background:#fafbfc; border-top:1px solid #eef0f5;">
    <div class="d-flex align-items-center justify-content-between mb-2">
        <div class="d-flex align-items-center gap-2">
            <span class="fs-8 fw-bold text-uppercase text-muted">Funnel post-lanzamiento</span>
            @if($tp)
                <span class="badge badge-light-secondary fs-8">tenant #{{ $tp->id }}</span>
            @endif
        </div>
        @if($nextActionStep && $tenantUrl)
            <a href="{{ $tenantUrl . $nextActionStep['meta'] }}" target="_blank" rel="noopener"
               class="btn btn-sm btn-light-primary fs-8">
                <i class="fas {{ $nextActionStep['icon'] }} me-1"></i>
                Abrir {{ $nextActionStep['meta'] }} <i class="fas fa-external-link-alt ms-1 fs-9"></i>
            </a>
        @endif
    </div>

    <div class="d-flex align-items-stretch gap-1 cd-funnel-steps">
        @foreach($steps as $i => $s)
            @php
                $isExpired = ($s['key'] === 'grace') && !empty($s['expired']);
                $isWarn    = ($s['key'] === 'grace') && !$s['done'] && is_string($s['meta']) && str_ends_with($s['meta'], 'd')
                             && (int) rtrim($s['meta'], 'd') <= 3;
                $bg = $s['done']
                    ? ($isExpired ? '#f1416c' : '#1bc5bd')
                    : ($isWarn ? '#ffa800' : '#e4e6ef');
                $color = $s['done'] || $isWarn ? '#fff' : '#7e8299';
                $border = $bg;
            @endphp
            <div class="flex-grow-1 d-flex flex-column align-items-center text-center position-relative"
                 style="min-width:60px;">
                <div class="d-flex align-items-center justify-content-center mb-1"
                     style="width:32px;height:32px;border-radius:50%;
                            background:{{ $bg }}; color:{{ $color }};
                            border:2px solid {{ $border }}; font-size:13px;">
                    @if($s['done'] && !$isExpired)
                        <i class="fas fa-check"></i>
                    @elseif($isExpired)
                        <i class="fas fa-times"></i>
                    @else
                        <i class="fas {{ $s['icon'] }}"></i>
                    @endif
                </div>
                <div class="fs-8 fw-bold text-gray-800">{{ $s['label'] }}</div>
                @if(!empty($s['meta']))
                    @if(str_starts_with($s['meta'], '/'))
                        <div class="fs-9 text-muted" style="font-family:monospace;">{{ $s['meta'] }}</div>
                    @else
                        <div class="fs-9 {{ $isExpired ? 'text-danger fw-bold' : ($isWarn ? 'text-warning fw-bold' : 'text-muted') }}">
                            {{ $s['meta'] }}
                        </div>
                    @endif
                @elseif($s['at'])
                    <div class="fs-9 text-muted">{{ $s['at']->format('d/m') }}</div>
                @else
                    <div class="fs-9 text-muted">—</div>
                @endif

                {{-- Conector entre steps (línea horizontal) --}}
                @if($i < count($steps) - 1)
                    <div class="position-absolute"
                         style="top:15px; left:calc(50% + 16px); right:calc(-50% + 16px); height:2px;
                                background: {{ $s['done'] ? '#1bc5bd' : '#e4e6ef' }}; z-index:0;"></div>
                @endif
            </div>
        @endforeach
    </div>
</div>