@props(['caption' => null, 'dense' => false])

{{-- Tabela mais larga que o cartão é rolável e precisa ser alcançável pelo teclado
     (WCAG 2.1.1 / axe `scrollable-region-focusable`); o `tabindex` só entra no contêiner.
     O contêiner é também o `scrollport` do cabeçalho fixo: quando a tabela passa da altura
     máxima, o `<thead>` acompanha a rolagem (`cms-table-scroll` no CSS do shell). --}}
<div class="cms-table-scroll" tabindex="0">
    <table {{ $attributes->merge(['class' => 'table w-full'.($dense ? ' table-xs' : ' table-zebra')]) }}>
        @if (filled($caption))
            <caption class="pb-2 text-start text-sm font-medium">{{ $caption }}</caption>
        @endif

        {{ $slot }}
    </table>
</div>