@props([
  'headers' => [],
  'striped' => true,
  'empty' => null,
])
<div {{ $attributes->merge(['class' => 'cmu-card p-0 overflow-hidden']) }}>
  <div class="overflow-x-auto">
    <table class="w-full text-sm">
      @if(count($headers) > 0)
        <thead class="bg-cmu-green-800 text-white">
          <tr>
            @foreach($headers as $h)
              @php
                $isArray = is_array($h);
                $label = $isArray ? ($h['label'] ?? '') : (string) $h;
                $align = $isArray ? ($h['align'] ?? 'left') : 'left';
                $width = $isArray ? ($h['width'] ?? null) : null;
              @endphp
              <th scope="col"
                  @if($width) style="width: {{ $width }}" @endif
                  class="text-{{ $align }} px-4 py-3 font-semibold text-xs tracking-[0.1em] uppercase">
                {{ $label }}
              </th>
            @endforeach
          </tr>
        </thead>
      @endif
      <tbody class="divide-y divide-gray-100 {{ $striped ? '[&_tr:nth-child(even)]:bg-cmu-green-50/40' : '' }}">
        {{ $slot }}
      </tbody>
    </table>
  </div>
  @if($empty !== null)
    <div class="px-6 py-10 text-center text-sm text-cmu-ink border-t border-gray-100">
      {{ $empty }}
    </div>
  @endif
</div>