<div>
    <div class="card">
        <div class="card-header">
            <h5 class="mb-0">WIP Campaign / Tranche Report</h5>
        </div>

        <div class="card-body">
            <div class="row g-3 mb-4">
                <div class="col-md-4">
                    <label class="form-label">Campaign</label>
                    <select class="form-select" wire:model.live="selectedSolicitorId">
                        <option value="">All Campaigns</option>
                        @foreach($solicitors as $solicitor)
                            <option value="{{ $solicitor->id }}">
                                {{ $solicitor->name }}
                            </option>
                        @endforeach
                    </select>
                </div>

                <div class="col-md-4">
                    <label class="form-label">Investment Tranche</label>
                    <select class="form-select" wire:model.live="selectedTrancheId">
                        <option value="">All Tranches</option>
                        @foreach($tranches as $tranche)
                            <option value="{{ $tranche->id }}">
                                {{ $tranche->tranche_name }}
                            </option>
                        @endforeach
                    </select>
                </div>
            </div>

            <div class="row g-3 mb-4">
                <div class="col-md-3">
                    <div class="border rounded p-3 bg-light">
                        <div class="text-muted small">Total Units</div>
                        <div class="fs-4 fw-bold">{{ number_format($totalUnits) }}</div>
                    </div>
                </div>

                <div class="col-md-3">
                    <div class="border rounded p-3 bg-light">
                        <div class="text-muted small">Total Hours</div>
                        <div class="fs-4 fw-bold">{{ number_format($totalHours, 2) }}</div>
                    </div>
                </div>
                <div class="col-md-3">
                    <div class="border rounded p-3 bg-light">
                        <div class="text-muted small">Total Value</div>
                        <div class="fs-4 fw-bold">£{{ number_format($totalValue, 2) }}</div>
                    </div>
                </div>
            </div>

            <div class="table-responsive">
                <table class="table table-sm table-bordered align-middle">
                    <thead>
                        <tr>
                            <th>Campaign</th>
                            <th>Tranche</th>
                            <th>Client</th>
                            <th>Value</th>
                            <th>Entries</th>
                            <th>Units</th>
                            <th>Hours</th>
                        </tr>
                    </thead>
                    <tbody>
                        @forelse($rows as $row)
                            <tr>
                                <td>{{ $row->solicitor_name ?? '-' }}</td>
                                <td>{{ $row->tranche_name ?? 'No Tranche' }}</td>
                                <td>
                                    <a href="{{ route('clients.show', $row->client_slug) }}">
                                        {{ trim($row->client_name_first . ' ' . $row->client_name_last) ?: 'Client #' . $row->client_id }}
                                    </a>
                                </td>
                                <td>£{{ number_format($row->total_value, 2) }}</td>
                                <td>{{ number_format($row->total_entries) }}</td>
                                <td>{{ number_format($row->total_units) }}</td>
                              
                                <td>{{ number_format($row->total_hours, 2) }}</td>
                            </tr>
                        @empty
                            <tr>
                                <td colspan="6" class="text-center text-muted">
                                    No WIP found for this campaign/tranche.
                                </td>
                            </tr>
                        @endforelse
                    </tbody>

                    <tfoot>
                        <tr class="fw-bold">
                            <td colspan="5" class="text-end">Total</td>
                            <td>{{ number_format($totalUnits) }}</td>
                            <td>{{ number_format($totalHours, 2) }}</td>
                        </tr>
                    </tfoot>
                </table>
            </div>
        </div>
    </div>
</div>