@extends('layout.template')
@section('title','Cusella Home Furnishing | Curtains, Sofas, Wallpapers & Interior Solutions')
@section('content')
<div class="wishlist-area pb-100 pt-100">
    <div class="container">
        <div class="row">
            @if(empty($wishlist) || count($wishlist) == 0)

    {{-- EMPTY WISHLIST DESIGN --}}
<div class="empty-wishlist-wrapper text-center py-5">

    <div class="empty-wishlist-box">

        <div class="empty-wishlist-icon">
            <i class="pe-7s-like"></i>
        </div>

        <h3>Your Wishlist is Empty</h3>
        <p>Save your favorite items here and revisit them anytime.</p>

        <a href="{{ url('/shop') }}" class="btn-shop">
            Explore Products
        </a>

    </div>

</div>
@else

    {{-- EXISTING TABLE DESIGN --}}
    <div class="col-12">
                <form action="#">
                    <div class="wishlist-table-content">
                        <div class="table-content table-responsive">
                            <table>
                                <thead>
                                    <tr>
                                        <th class="width-remove"></th>
                                        <th class="width-thumbnail"></th>
                                        <th class="width-name">Product</th>
                                        <th class="width-price"> Unit price </th>
                                        <th class="width-wishlist-cart"></th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @forelse($wishlist as $item)
                                    <tr>

                                        <!-- REMOVE -->
                                        <td class="product-remove">
                                            <a href="#" class="remove-wishlist"
                                                data-product="{{ $item['product_id'] }}"
                                                data-variant="{{ $item['variant_id'] }}">
                                                ×
                                            </a>
                                        </td>

                                        <!-- IMAGE -->
                                        <td class="product-thumbnail">
                                            <a href="{{ route('product', Str::slug($item['name']).'-'.$item['product_id']) }}">
                                                <img src="{{ $item['image'] ?? asset('assets/images/default.png') }}"
                                                    class="img-fluid rounded" style="width:80px;">
                                            </a>
                                        </td>

                                        <!-- NAME -->
                                        <td class="product-name">
                                            <h5>
                                                <a href="{{ route('product', Str::slug($item['name']).'-'.$item['product_id']) }}">
                                                    {{ $item['name'] }}
                                                </a>
                                            </h5>
                                        </td>

                                        <!-- PRICE -->
                                        <td class="product-wishlist-price">
                                            <span class="amount">₹{{ number_format($item['offer_price'], 2) }}</span>
                                        </td>

                  
                                        <!-- ADD TO CART -->
                                        <td>
                                            <a class="btn btn-primary " href="{{ route('product', Str::slug($item['name']).'-'.$item['product_id']) }}">
                                                Add to cart
                                            </a>

                                        </td>

                                    </tr>
                                    @empty
                                    <tr>
                                        <td colspan="6" class="text-center">No items in wishlist</td>
                                    </tr>
                                    @endforelse
                                </tbody>
                            </table>
                        </div>
                    </div>
                </form>
            </div>
@endif
        
        </div>
    </div>
</div>

<script>
    window.apiUrls = {
        removeWishlist: "{{ url('wishlist/remove') }}"
    };
</script>
@endsection