@extends('layouts.frontend.app')
@section('content')

<section class='about-section'>
    <div class="container">
        <div class="row">
            <div class="col-md-6 about-frist-row">
                <a href="/" class="back-btn">
                    <span class="svg-ic"><i class="bi bi-arrow-left-circle"></i></span>
                    Back to Home
                </a>
                <h1>Wishlist</h1>
            </div>
        </div>
    </div>
</section>

<section class='account setion-cform'>
    <div class="container">
        <div class="row">
            <div class="col-lg-3 col-md-4">
                @include('layouts.frontend.sidebar')
            </div>

            <div class="col-lg-9 col-md-8">
                <div class="leftsiderbar-account">
                  
                    <div class="container">
                               
                        @if(count($wishlist) > 0)
                            @foreach ($wishlist as $index => $pro)
                           
                            <div class="wishlist-card card p-3 shadow-sm mb-3 removeRowWithAjax" data-wishlist-id="{{$pro['id']}}" data-product-id="{{ $pro['product_id'] }}">
                                <div class="row align-items-start border-bottom pb-3 mb-3">

                                    <!-- Checkbox + Number -->
                                    <div class="col-md-1 d-flex align-items-center ">
                                           

                                        {{-- <span class="item-number me-2">{{ $index+1 }}.</span> --}}
                                    </div>

                                    <!-- Book Image -->
                                    <div class="col-md-3">
                                        <div class="book-image position-relative">
                                              <a href="{{route('product.details',['slug'=>$pro['slug']])}}"><img src="{{ $pro['product_image'] }}" alt="{{ $pro['product_name'] }}" class="book-cover img-fluid rounded"></a>
                                            @if(!empty($pro['product_discount_price']))
                                                <div class="discount-badge position-absolute bg-danger text-white px-2 py-1 small">{{ $pro['product_discount_price'] }}%</div>
                                            @endif
                                        </div>
                                    </div>

                                    <!-- Book Details -->
                                    <div class="col-md-4">
                                        <h3 class="book-title h6 fw-bold">{{ Str::limit($pro['product_name'] ?? '', 25, '..') }}</h3>
                                        <div class="book-meta">By: <span class="author">{{ $pro['product_book_author'] }}</span></div>
                                        <div class="book-meta">Publisher: {{ $pro['product_publisher_name'] }}</div>

                                        <div class="price-section my-2">
                                            @if(!empty($pro['total_discount_price']))
                                                <span class="current-price h6 text-success me-2">₹{{ number_format($pro['total_discount_price']), 2 }}</span>
                                                <span class="original-price text-muted text-decoration-line-through">₹{{ number_format($pro['product_price']), 2 }}</span>
                                            @else
                                                <span class="current-price h6 text-success me-2">₹{{ number_format($pro['product_price']), 2 }}</span>
                                            @endif
                                        </div>

                                        <div class="action-buttons">
                                            <button class="btn btn-primary btn-sm me-2" onclick="addToCart({{ $pro['product_id'] }})">ADD TO CART</button>
                                            <button class="btn btn-outline-danger btn-sm" onclick="removeFromWishlist({{ $pro['id'] }})">REMOVE</button>
                                        </div>
                                    </div>

                                    <!-- Item Info -->
                                    <div class="col-md-4">
                                        <div class="stock-status text-success fw-bold">
                                            {{ ($pro['product_available'] ?? 0) > 0 ? "In Stock" : "Out Of Stock" }}
                                        </div>
                                        <div class="shipping-info">Order now and get it in <strong>{{ $pro['ships_within'] }}</strong></div>
                                        <div class="binding-info"><strong>Binding:</strong> {{ $pro['product_format'] }}</div>
                                        <div class="language-info"><strong>Language:</strong> {{ $pro['product_language'] }}</div>
                                    </div>
                                </div>
                            </div>
                            @endforeach

                            {{-- <!-- ✅ Bottom Select All + Totals -->
                            <div class="wishlist-actions mt-4 d-flex justify-content-between align-items-center p-3 bg-light rounded shadow-sm">
                               <div class="wishlist-actions mb-3">
                                        <input type="checkbox" id="selectAll" class="form-check-input">
                                        <label for="selectAll" class="ms-2">Select All</label>

                                        <div class="bulk-actions ms-3 d-inline-block">
                                            <button type="button" class="btn btn-primary btn-sm me-2" onclick="bulkAddToCart()">ADD TO CART</button>
                                            <button type="button" class="btn btn-outline-danger btn-sm" onclick="bulkRemoveWishlist()">REMOVE</button>
                                        </div>
                                    </div>
                                     Total Items: <span id="totalItems">0</span> |
                                    Total Value: <span id="totalValue">₹0</span>
                                </div>
                            </div> --}}

                        @else
                            <p>Your wishlist is empty.</p>
                        @endif

                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

<script>

</script>
@endsection