@if ($orderdata && $orderdata->count() > 0)
    <div class="orders-grid">
        @foreach ($orderdata as $item)
            @php
                $productData = DB::table('product')
                    ->join('product_color', 'product.id', '=', 'product_color.product_id')
                    ->select(
                        'product.id',
                        'product.product_name',
                        'product.product_image',
                        'product.product_price',
                        'product_color.color_image'
                    )
                    ->where('product.id', $item->product_id)
                    ->where('product.status', 1)
                    ->where('product_color.product_color', $item->color)
                    ->first();
                $totalAmount = $item->total + $item->service_fee;
            @endphp

            <div class="order-card-modern">
                <div class="order-card-header">
                    <div class="order-id-badge">
                        <i class="fas fa-hashtag me-1"></i> {{ $item->order_id ?? 'N/A' }}
                    </div>
                    <div class="order-date-badge">
                        <i class="far fa-calendar-alt me-1"></i> {{ \Carbon\Carbon::parse($item->created_at)->format('M j, Y') }}
                    </div>
                </div>
                <div class="order-card-body">
                    <div class="product-thumb">
                        @if($productData && $productData->color_image)
                            <img src="{{ asset('admin/assets/img/product/' . $productData->color_image) }}" alt="{{ $productData->product_name ?? 'Product' }}">
                        @else
                            <img src="https://images.macrumors.com/article-new/2019/04/guest-user-250x250.jpg" alt="Default Product">
                        @endif
                    </div>
                    <div class="order-summary-details">
                        <h4 class="product-name-title">{{ $productData->product_name ?? 'Product' }}</h4>
                        <div class="product-meta-row mt-2">
                            <span class="meta-item"><strong class="text-dark">Qty:</strong> {{ $item->quantity ?? '1' }}</span>
                            <span class="meta-separator">•</span>
                            <span class="meta-item"><strong class="text-dark">Color:</strong> {{ $item->color ?? 'Default' }}</span>
                        </div>
                        <div class="order-price-val mt-3">
                            Rs. {{ number_format($totalAmount, 2) }}
                        </div>
                    </div>
                </div>
                <div class="order-card-footer">
                    <a href="{{ route('american.plastic.view.order', ['id' => $item->id]) }}" class="order-action-btn">
                        <span>View Details</span> <i class="fas fa-chevron-right ms-2"></i>
                    </a>
                </div>
            </div>
        @endforeach
    </div>

    <!-- Pagination Links -->
    <div class="pagination-wrapper mt-4">
        {{ $orderdata->links() }}
    </div>
@else
    <div class="no-orders-state text-center py-5">
        <div class="empty-icon-box mb-3">
            <i class="fas fa-file-invoice"></i>
        </div>
        <h4>No Orders Found</h4>
        <p class="text-muted">
            @if(request()->has('search') && !empty(request()->input('search')))
                We couldn't find any orders matching "{{ request()->input('search') }}".
            @else
                You haven't placed any orders yet.
            @endif
        </p>
    </div>
@endif