{{--
    Vista LAUNCH QUEUE — palanca operativa por core.

    Lectura: cada fila = 1 core. Las columnas describen el funnel de variantes.
    La acción única es "activar bulk" (idempotente, con dry-run preview).

    Filosofía: el método se aplica por core, no por variante.
--}}
@push('styles')
<style>
    /* Top KPI cards */
    .launch-kpi-card { background: #fff; border: 1px solid #e5e7eb; border-radius: 10px; padding: 16px 14px; height: 100%; transition: box-shadow 120ms; }
    .launch-kpi-card:hover { box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
    .launch-kpi-card.highlight { background: linear-gradient(135deg, #ecfdf5 0%, #fff 100%); border-color: #10b981; }
    .launch-kpi-num { font-size: 32px; font-weight: 800; line-height: 1; }
    .launch-kpi-label { font-size: 12px; color: #4b5563; font-weight: 600; margin-top: 6px; }
    .launch-kpi-sub { font-size: 11px; color: #9ca3af; margin-top: 2px; }

    /* Tabla */
    .launch-table-wrap { padding: 4px; }
    .launch-table { font-size: 13px; border-collapse: separate; border-spacing: 0; width: 100%; }
    .launch-table thead th {
        background: #f9fafb; font-size: 10px; text-transform: uppercase; letter-spacing: 0.06em;
        color: #6b7280; font-weight: 700;
        padding: 12px 14px; border-bottom: 2px solid #e5e7eb;
        position: sticky; top: 0; z-index: 1;
    }
    .launch-table tbody td {
        padding: 14px 14px; vertical-align: middle;
        border-bottom: 1px solid #f1f5f9;
    }
    .launch-table tbody tr:hover { background: #fafafa; }
    .launch-table tbody tr:last-child td { border-bottom: none; }

    /* Celdas del funnel */
    .funnel-cell { text-align: center; font-weight: 700; font-size: 15px; }
    .funnel-cell.ok    { color: #059669; }
    .funnel-cell.gap   { color: #dc2626; }
    .funnel-cell.warn  { color: #d97706; }
    .funnel-cell.muted { color: #9ca3af; font-weight: 500; }
    .funnel-bar { height: 5px; border-radius: 3px; background: #e5e7eb; overflow: hidden; margin: 6px auto 0; }
    .funnel-bar > div { height: 100%; transition: width 200ms; }

    /* Pills de próxima acción */
    .next-action-pill {
        display: inline-flex; gap: 6px; align-items: center;
        padding: 6px 12px; border-radius: 16px;
        font-size: 12px; font-weight: 600;
        white-space: nowrap;
    }
    .next-action-pill.tone-success { background: #d1fae5; color: #065f46; }
    .next-action-pill.tone-warning { background: #fef3c7; color: #92400e; }
    .next-action-pill.tone-info    { background: #dbeafe; color: #1e40af; }
    .next-action-pill.tone-secondary { background: #f3f4f6; color: #6b7280; }

    /* Bloque acciones por core */
    .core-name-cell { min-width: 180px; }
    .core-name-link { font-weight: 700; font-size: 14px; color: #111827; text-decoration: none; }
    .core-name-link:hover { color: #0d6efd; }
    .core-meta { font-size: 11px; color: #6b7280; margin-top: 3px; line-height: 1.4; }

    .cmd-hint { font-family: ui-monospace, monospace; font-size: 10px; color: #9ca3af; margin-top: 4px; display: block; }
    .blockers-list { font-size: 10px; color: #6b7280; line-height: 1.4; margin-top: 4px; padding-left: 14px; }

    .launch-actions-cell { white-space: nowrap; min-width: 200px; }
    .launch-actions-cell .btn { font-size: 11px; padding: 6px 10px; margin-left: 4px; }

    /* Cert badge */
    .cert-badge { display: inline-block; min-width: 40px; padding: 3px 6px; border-radius: 8px; font-size: 11px; font-weight: 700; text-align: center; }
    .cert-badge.cert-ok   { background: #d1fae5; color: #059669; }
    .cert-badge.cert-warn { background: #fef3c7; color: #b45309; }
    .cert-badge.cert-gap  { background: #f3f4f6; color: #6b7280; }
</style>
@endpush

{{-- Top KPIs --}}
<div class="row g-3 mb-4">
    <div class="col-md-2 col-6">
        <div class="launch-kpi-card text-center">
            <div class="launch-kpi-num text-primary">{{ $data['totals']['pipeline'] }}</div>
            <div class="launch-kpi-label">Pipeline total</div>
            <div class="launch-kpi-sub">shop variants en concepts</div>
        </div>
    </div>
    <div class="col-md-2 col-6">
        <div class="launch-kpi-card text-center">
            <div class="launch-kpi-num text-info">{{ $data['totals']['with_row'] }}</div>
            <div class="launch-kpi-label">Con row</div>
            <div class="launch-kpi-sub">products DB</div>
        </div>
    </div>
    <div class="col-md-2 col-6">
        <div class="launch-kpi-card text-center">
            <div class="launch-kpi-num text-info">{{ $data['totals']['with_stripe'] }}</div>
            <div class="launch-kpi-label">Con Stripe</div>
            <div class="launch-kpi-sub">price configurado</div>
        </div>
    </div>
    <div class="col-md-2 col-6">
        <div class="launch-kpi-card text-center">
            <div class="launch-kpi-num text-success">{{ $data['totals']['active'] }}</div>
            <div class="launch-kpi-label">Live</div>
            <div class="launch-kpi-sub">vendibles ahora</div>
        </div>
    </div>
    <div class="col-md-4 col-6">
        <div class="launch-kpi-card highlight text-center">
            <div class="launch-kpi-num text-success">{{ $data['totals']['activatable_now'] }}</div>
            <div class="launch-kpi-label" style="color:#059669;">🟢 Activables AHORA</div>
            <div class="launch-kpi-sub">cumplen TODOS los gates</div>
        </div>
    </div>
</div>

<div class="alert alert-info border-info py-3 mb-4 fs-8" style="border-radius: 10px;">
    <i class="fas fa-info-circle me-1"></i>
    <strong>Método:</strong> ordenado por <em>activatable_now</em> desc. Si hay número verde → click "Activar bulk".
    Si no hay activables → la columna "Próxima acción" te dice el comando exacto (certificar, agregar Stripe, etc).
    Operás <strong>por core como bundle</strong>, no por variante individual.
</div>

{{-- Tabla principal --}}
<div class="card shadow-sm" style="border-radius: 10px;">
    <div class="card-body p-0 launch-table-wrap">
        <div class="table-responsive">
            <table class="launch-table">
                <thead>
                    <tr>
                        <th class="core-name-cell">Core</th>
                        <th class="text-center">Cert</th>
                        <th class="text-center">Pipeline</th>
                        <th class="text-center">Con row</th>
                        <th class="text-center">Con Stripe</th>
                        <th class="text-center">Active</th>
                        <th class="text-center" style="background: #ecfdf5;">Activable ahora</th>
                        <th>Próxima acción</th>
                        <th class="text-end launch-actions-cell">Bulk activate</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach($data['cores'] as $row)
                        @php
                            $progressPct = $row['pipeline'] > 0 ? (int) round(($row['active'] / $row['pipeline']) * 100) : 0;
                            $certClass   = $row['cert_score'] === 100 ? 'cert-ok' : ($row['cert_score'] >= 80 ? 'cert-warn' : 'cert-gap');
                        @endphp
                        <tr>
                            <td class="core-name-cell">
                                <a href="{{ route('reseller.factory.product.show', $row['core']) }}" class="core-name-link">
                                    <i class="fas fa-cube text-primary me-1 fs-9"></i>{{ $row['core'] }}
                                </a>
                                <div class="core-meta">
                                    @if($row['industry'])🏷 {{ $row['industry'] }}@endif
                                    @if($row['demo']) · <code>{{ $row['demo'] }}</code>@endif
                                </div>
                            </td>
                            <td class="text-center">
                                <span class="cert-badge {{ $certClass }}">
                                    {{ $row['cert_score'] !== null ? $row['cert_score'] : '—' }}
                                </span>
                            </td>
                            <td class="funnel-cell">{{ $row['pipeline'] }}</td>
                            <td class="funnel-cell {{ $row['with_row'] === $row['pipeline'] ? 'ok' : 'muted' }}">
                                {{ $row['with_row'] }}
                            </td>
                            <td class="funnel-cell {{ $row['with_stripe'] === $row['pipeline'] ? 'ok' : ($row['with_stripe'] === 0 ? 'gap' : 'warn') }}">
                                {{ $row['with_stripe'] }}
                            </td>
                            <td class="funnel-cell {{ $row['active'] > 0 ? 'ok' : 'muted' }}">
                                {{ $row['active'] }}
                                <div class="funnel-bar" style="width: 70px;">
                                    <div style="width:{{ $progressPct }}%; background:#10b981;"></div>
                                </div>
                            </td>
                            <td class="text-center" style="background: {{ $row['activatable_now'] > 0 ? '#ecfdf5' : 'transparent' }};">
                                @if($row['activatable_now'] > 0)
                                    <span style="font-size: 22px; font-weight: 800; color: #059669;">{{ $row['activatable_now'] }}</span>
                                @else
                                    <span class="text-muted fs-3">—</span>
                                @endif
                            </td>
                            <td>
                                <span class="next-action-pill tone-{{ $row['next_action']['tone'] }}">
                                    {{ $row['next_action']['text'] }}
                                </span>
                                @if($row['next_action']['cmd'] !== '—' && !str_starts_with($row['next_action']['cmd'], '—'))
                                    <code class="cmd-hint">{{ $row['next_action']['cmd'] }}</code>
                                @endif
                                @if(!empty($row['blockers']))
                                    <ul class="blockers-list">
                                        @foreach($row['blockers'] as $b)<li>{{ $b }}</li>@endforeach
                                    </ul>
                                @endif
                            </td>
                            <td class="text-end launch-actions-cell">
                                @if($row['activatable_now'] > 0)
                                    <form method="POST" action="{{ route('reseller.factory.core.bulk-activate', $row['core']) }}" class="d-inline">
                                        @csrf
                                        <input type="hidden" name="dry_run" value="1">
                                        <button type="submit" class="btn btn-sm btn-light-info" title="Preview (no escribe)">
                                            <i class="fas fa-eye me-1"></i>Dry-run
                                        </button>
                                    </form>
                                    <form method="POST" action="{{ route('reseller.factory.core.bulk-activate', $row['core']) }}" class="d-inline"
                                          onsubmit="return confirm('Activar {{ $row['activatable_now'] }} variante(s) del core {{ $row['core'] }}?\n\nEsto las hace VENDIBLES en el marketplace.');">
                                        @csrf
                                        <input type="hidden" name="dry_run" value="0">
                                        <button type="submit" class="btn btn-sm btn-success">
                                            <i class="fas fa-rocket me-1"></i>Activar {{ $row['activatable_now'] }}
                                        </button>
                                    </form>
                                @else
                                    <button class="btn btn-sm btn-light" disabled>
                                        <i class="fas fa-lock me-1"></i>—
                                    </button>
                                @endif
                            </td>
                        </tr>
                    @endforeach
                </tbody>
            </table>
        </div>
    </div>
</div>

{{-- Flash de output del bulk-activate (si vino del POST) --}}
@if(session('info') || session('success'))
    <div class="card mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">
                <i class="fas fa-terminal me-1"></i>Output del comando
            </h6>
            <pre class="bg-dark text-white p-3 rounded fs-9" style="max-height: 400px; overflow-y: auto;">{{ session('info') ?? session('success') }}</pre>
        </div>
    </div>
@endif