@props(['title' => null, 'cols' => 'row g-2'])
{{-- Standard index filter bar. Inputs inside use data-filter="param"; the
     shared dtFilteredTable() helper wires them to the DataTable automatically. --}}
<div {{ $attributes->merge(['class' => 'card filter-card shadow-sm mb-3 index-filters']) }}>
    <div class="card-header d-flex justify-content-between align-items-center">
        <span><i class="bi bi-funnel me-1"></i> {{ $title ?? __('app.filters') }}</span>
        <button type="button" data-filter-reset class="btn btn-outline-secondary btn-sm">
            <i class="bi bi-arrow-counterclockwise"></i> {{ __('app.reset') }}
        </button>
    </div>
    <div class="card-body">
        <div class="{{ $cols }}">
            {{ $slot }}
        </div>
    </div>
</div>