@php
    $items = $record->items()->with(['product', 'warehouse', 'location'])->get();
    $isEditable = $editable ?? false;
@endphp

<div class="fi-ta-table-wrapper overflow-x-auto">
    <table class="fi-ta-table w-full table-auto divide-y divide-gray-200 text-start dark:divide-white/5">
        <thead class="bg-gray-50 dark:bg-white/5">
            <tr>
                <th class="fi-ta-header-cell px-3 py-3.5 text-left text-sm font-semibold text-gray-950 dark:text-white">Type</th>
                <th class="fi-ta-header-cell px-3 py-3.5 text-left text-sm font-semibold text-gray-950 dark:text-white">Product ID</th>
                <th class="fi-ta-header-cell px-3 py-3.5 text-left text-sm font-semibold text-gray-950 dark:text-white">Description</th>
                <th class="fi-ta-header-cell px-3 py-3.5 text-left text-sm font-semibold text-gray-950 dark:text-white">Brand</th>
                <th class="fi-ta-header-cell px-3 py-3.5 text-left text-sm font-semibold text-gray-950 dark:text-white">Warehouse</th>
                <th class="fi-ta-header-cell px-3 py-3.5 text-left text-sm font-semibold text-gray-950 dark:text-white">Location</th>
                <th class="fi-ta-header-cell px-3 py-3.5 text-center text-sm font-semibold text-gray-950 dark:text-white">Qty</th>
                <th class="fi-ta-header-cell px-3 py-3.5 text-center text-sm font-semibold text-gray-950 dark:text-white">Unit</th>
                <th class="fi-ta-header-cell px-3 py-3.5 text-right text-sm font-semibold text-gray-950 dark:text-white">Unit Price</th>
                <th class="fi-ta-header-cell px-3 py-3.5 text-right text-sm font-semibold text-gray-950 dark:text-white">Total</th>
            </tr>
        </thead>
        <tbody class="divide-y divide-gray-200 whitespace-nowrap dark:divide-white/5">
            @forelse($items as $item)
                <tr class="fi-ta-row">
                    {{-- Type --}}
                    <td class="fi-ta-cell px-3 py-4">
                        <div class="flex items-center gap-1.5">
                            @if($item->is_return)
                                <div class="fi-badge flex items-center justify-center gap-x-1 rounded-md text-xs font-medium px-2 py-1" style="background-color: rgb(251, 191, 36); color: rgb(255, 255, 255);">
                                    Return
                                </div>
                            @else
                                <div class="fi-badge flex items-center justify-center gap-x-1 rounded-md text-xs font-medium px-2 py-1" style="background-color: rgb(34, 197, 94); color: rgb(255, 255, 255);">
                                    Purchase
                                </div>
                            @endif
                        </div>
                    </td>

                    {{-- Product ID --}}
                    <td class="fi-ta-cell px-3 py-4">
                        <div class="fi-ta-text text-sm text-gray-950 dark:text-white">
                            {{ $item->product_id_raw }}
                        </div>
                    </td>

                    {{-- Description --}}
                    <td class="fi-ta-cell px-3 py-4">
                        <div class="fi-ta-text text-sm text-gray-950 dark:text-white">
                            {{ $item->description ?: '-' }}
                        </div>
                    </td>

                    {{-- Brand --}}
                    <td class="fi-ta-cell px-3 py-4">
                        <div class="fi-ta-text text-sm text-gray-950 dark:text-white">
                            {{ $item->brand ?: '-' }}
                        </div>
                    </td>

                    {{-- Warehouse --}}
                    <td class="fi-ta-cell px-3 py-4">
                        <div class="fi-ta-text text-sm text-gray-950 dark:text-white">
                            {{ $item->warehouse->name ?? 'Go-Parts GA' }}
                        </div>
                    </td>

                    {{-- Location --}}
                    <td class="fi-ta-cell px-3 py-4">
                        <div class="fi-ta-text text-sm text-gray-950 dark:text-white">
                            {{ $item->location->location ?? 'Default' }}
                        </div>
                    </td>

                    {{-- Quantity --}}
                    <td class="fi-ta-cell px-3 py-4 text-center">
                        <div class="fi-ta-text text-sm font-medium text-gray-950 dark:text-white">
                            {{ $item->quantity }}
                        </div>
                    </td>

                    {{-- Unit --}}
                    <td class="fi-ta-cell px-3 py-4 text-center">
                        <div class="fi-ta-text text-sm text-gray-950 dark:text-white">
                            {{ $item->unit }}
                        </div>
                    </td>

                    {{-- Unit Price --}}
                    <td class="fi-ta-cell px-3 py-4 text-right">
                        <div class="fi-ta-text text-sm text-gray-950 dark:text-white">
                            ${{ number_format($item->unit_price, 2) }}
                        </div>
                    </td>

                    {{-- Total --}}
                    <td class="fi-ta-cell px-3 py-4 text-right">
                        <div class="fi-ta-text text-sm font-semibold text-gray-950 dark:text-white">
                            ${{ number_format($item->total_price, 2) }}
                        </div>
                    </td>
                </tr>
            @empty
                <tr>
                    <td colspan="10" class="fi-ta-cell px-3 py-4 text-center">
                        <div class="fi-ta-text text-sm text-gray-500 dark:text-gray-400">
                            No items found
                        </div>
                    </td>
                </tr>
            @endforelse
        </tbody>
    </table>
</div>