@props(['model' => null, 'placeholder' => '', 'align' => 'left'])

{{--
    Second header row cell: a plain text input wired straight to a Livewire property,
    living directly under the sort header it filters - replaces the old "search box +
    dropdowns above the table" bar. For a column backed by a real fixed vocabulary
    (status, type, a bounded admin-curated list) use th-select-filter.blade.php or
    x-searchable-select instead - this one is only for genuinely open-ended text
    (name, phone, city, SKU, invoice/PO number...). Pass no `model` for a column
    that isn't filterable at all (e.g. Actions, a computed/derived numeric column)
    and the cell renders empty, keeping the grid aligned with the header row above it.
--}}
<th @class([
    'px-4 py-2 bg-gray-50 dark:bg-gray-900/40 border-t border-gray-100 dark:border-gray-700',
    'text-right' => $align === 'right',
])>
    @if ($model)
        <input
            type="text"
            wire:model.live.debounce.300ms="{{ $model }}"
            placeholder="{{ $placeholder }}"
            @class([
                'w-full rounded-md border-gray-300 dark:border-gray-600 dark:bg-gray-800 dark:text-gray-100 text-xs py-1 px-2 focus:border-indigo-500 focus:ring-indigo-500 placeholder:text-gray-400 dark:placeholder:text-gray-500',
                'text-right' => $align === 'right',
            ])
        />
    @endif
</th>