{{-- Reusable read-only data table with search & export --}}

<div class="card-flat">
    <div class="d-flex justify-content-between align-items-center mb-3 flex-wrap gap-2">
        <h6 class="fw-bold mb-0">{{ $title ?? 'Data' }} <span class="badge bg-secondary ms-1" style="font-size:10px;">{{ method_exists($rows ?? [], 'total') ? $rows->total() : count($rows ?? []) }}</span></h6>
        
        <div class="d-flex gap-2 align-items-center flex-wrap">
            <form method="GET" action="" class="position-relative m-0 p-0">
                <i class="bi bi-search position-absolute" style="left:10px; top:50%; transform:translateY(-50%); color:#94a3b8; font-size:12px;"></i>
                <input type="text" name="search" class="form-control form-control-sm" placeholder="Cari data..."
                       style="font-size:12px; border-radius:6px; padding-left:30px; width:200px; border:1px solid #e2e8f0;"
                       value="{{ request('search') }}">
            </form>

            @if(isset($exportType))
            <div class="dropdown d-inline-block">
                <button class="btn btn-sm btn-outline-secondary dropdown-toggle" type="button" data-bs-toggle="dropdown" style="font-size:12px; border-radius:6px; border-color:#e2e8f0; color:#475569;">
                    <i class="bi bi-download me-1"></i> Export
                </button>
                <ul class="dropdown-menu dropdown-menu-end shadow-sm" style="font-size: 13px; border-radius:8px; border:none;">
                    <li>
                        <a class="dropdown-item py-2" target="_blank" href="{{ route('admin.laporan.export', ['type' => $exportType, 'format' => 'pdf'] + request()->query()) }}">
                            <i class="bi bi-file-earmark-pdf text-danger me-2"></i>Cetak / Save PDF
                        </a>
                    </li>
                    <li>
                        <a class="dropdown-item py-2" href="{{ route('admin.laporan.export', ['type' => $exportType, 'format' => 'csv'] + request()->query()) }}">
                            <i class="bi bi-file-earmark-excel text-success me-2"></i>Download Excel (CSV)
                        </a>
                    </li>
                </ul>
            </div>
            @endif
        </div>
    </div>

    <div class="table-responsive">
        <table class="table table-sm table-hover align-middle mb-0" id="roTable_{{ Str::slug($title ?? 'data') }}" style="font-size: 13px;">
            <thead class="table-light">
                <tr>
                    <th style="width: 40px;">No</th>
                    @foreach($headers as $header)
                        <th>{{ $header }}</th>
                    @endforeach
                </tr>
            </thead>
            <tbody>
                @forelse($rows as $i => $row)
                    <tr>
                        <td class="text-muted">{{ method_exists($rows, 'firstItem') && $rows->firstItem() ? $rows->firstItem() + $i : $i + 1 }}</td>
                        @foreach($columns as $col)
                            <td>{{ data_get($row, $col, '-') }}</td>
                        @endforeach
                    </tr>
                @empty
                    <tr>
                        <td colspan="{{ count($headers) + 1 }}" class="text-center text-muted py-4">
                            <i class="bi bi-inbox" style="font-size: 24px;"></i>
                            <div class="mt-1">{{ $emptyMsg ?? 'Belum ada data.' }}</div>
                        </td>
                    </tr>
                @endforelse
            </tbody>
        </table>
    </div>

    @if(isset($rows) && method_exists($rows, 'links'))
    <div class="mt-3 d-flex justify-content-end">
        {{ $rows->withQueryString()->links() }}
    </div>
    @endif
</div>