@if ($orders->isEmpty())
    <div class="text-center py-5">
        <i class="fas fa-inbox fa-3x text-muted mb-3"></i>
        <h5 class="text-muted">No records found</h5>
        <p class="text-muted">Try adjusting your search or filters</p>
    </div>
@else
    <!-- Desktop view -->
    <div class="table-responsive d-none d-lg-block">
        <table class="table table-hover mb-0">
            <thead class="table-light">
                <tr>
                    <th scope="col">Order Code</th>
                    <th scope="col">Vendor</th>
                    <th scope="col">Amount</th>
                    <th scope="col">Delivery Status</th>
                    <th scope="col">Payment Status</th>
                    <th scope="col">Created At</th>
                    <th scope="col">Order Status</th>
                </tr>
            </thead>
            <tbody>
                @foreach($orders as $order)
                    <tr>
                        <td><a href="{{ route('purchase.orders.view', ['id' => $order->id]) }}" class="text-decoration-none">
                                {{ $order->code }}
                            </a>
                        </td>
                        <td>{{ $order->user ? $order->user->first_name . ' ' . $order->user->last_name : 'N/A' }}</td>
                        <td>${{ number_format($order->amount, 2) }}</td>
                        <td>
                            {!! purchase_delivery_status_badge($order->delivery_status) !!}
                        </td>
                        <td>
                            {!! purchase_payment_status_badge($order->payment_status) !!}
                        </td>
                        <td>{{ \Carbon\Carbon::parse($order->created_at)->format('M d, Y') }}</td>
                        <td>
                            {!! purchase_order_status_badge($order->status) !!}
                        </td>
                    </tr>
                @endforeach
            </tbody>
        </table>
    </div>

    <!-- Mobile/Tablet view -->
    <div class="d-lg-none">
        @foreach($orders as $order)
            <div class="card mb-3">
                <div class="card-body">
                    <div class="d-flex justify-content-between mb-2">
                        <a href="{{ route('purchase.orders.view', ['id' => $order->id]) }}" class="text-decoration-none">
                            {{ $order->code }}
                        </a>
                        <span class="text-white badge bg-{{ $order->status == 'completed' ? 'success' : 'info' }}">
                            {{ ucfirst($order->status) }}
                        </span>
                    </div>
                    <p class="card-text">
                        <strong>Vendor:</strong>
                        {{ $order->user ? $order->user->first_name . ' ' . $order->user->last_name : 'N/A' }}<br>
                        <strong>Amount:</strong> ${{ number_format($order->amount, 2) }}<br>
                        <strong>Delivery Status:</strong>
                        <span class="text-white badge bg-{{ $order->delivery_status == 'delivered' ? 'success' : 'warning' }}">
                            {{ ucfirst($order->delivery_status) }}
                        </span><br>
                        <strong>Payment Status:</strong>
                        <span class="text-white badge bg-{{ $order->payment_status == 'completed' ? 'success' : 'warning' }}">
                            {{ ucfirst($order->payment_status) }}
                        </span><br>
                        <strong>Created At:</strong> {{ \Carbon\Carbon::parse($order->created_at)->format('M d, Y') }}
                    </p>
                </div>
            </div>
        @endforeach
    </div>
@endif