@extends('layouts.app')

@section('title', 'Your Cart')

@section('content')

<div class="hhd-breadcrumb">
    <div class="container small">
        <a href="{{ route('home') }}" class="text-muted-soft">Home</a> / <span class="text-charcoal">Cart</span>
    </div>
</div>

<div class="container py-5">
    <h1 class="font-serif mb-4" style="font-size:1.8rem;">Your Shopping Cart</h1>

    @if(!$cart || $cart->items->isEmpty())
        <div class="text-center py-5">
            <i class="bi bi-bag-x fs-1 text-muted-soft"></i>
            <p class="mt-3 text-muted-soft">Your cart is empty.</p>
            <a href="{{ route('shop.index') }}" class="btn btn-terracotta mt-2">Continue Shopping</a>
        </div>
    @else
        <div class="row g-4">
            <div class="col-lg-8">
                <div class="table-responsive">
                    <table class="table align-middle">
                        <thead>
                            <tr class="text-muted-soft small text-uppercase">
                                <th>Product</th>
                                <th>Price</th>
                                <th>Quantity</th>
                                <th>Total</th>
                                <th></th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach($cart->items as $item)
                                <tr>
                                    <td>
                                        <div class="d-flex align-items-center gap-3">
                                            <img src="{{ $item->imageUrl() ?? 'https://placehold.co/100x100/f0e8dc/2b2622' }}" class="cart-item-img" alt="{{ $item->product->name }}">
                                            <div>
                                                <a href="{{ route('shop.show', $item->product->slug) }}" class="text-charcoal fw-semibold text-decoration-none">{{ $item->product->name }}</a>
                                                @if($item->variantLabel())
                                                    <div class="small text-muted-soft">{{ $item->variantLabel() }}</div>
                                                @endif
                                            </div>
                                        </div>
                                    </td>
                                    <td>Rs. {{ number_format($item->unitPrice()) }}</td>
                                    <td>
                                        <form action="{{ route('cart.update', $item->id) }}" method="POST" class="d-flex align-items-center">
                                            @csrf
                                            @method('PATCH')
                                            <input type="number" name="quantity" value="{{ $item->quantity }}" min="1" max="{{ $item->availableStock() }}" class="form-control qty-input" onchange="this.form.submit()">
                                        </form>
                                    </td>
                                    <td class="fw-semibold">Rs. {{ number_format($item->quantity * $item->unitPrice()) }}</td>
                                    <td>
                                        <form action="{{ route('cart.remove', $item->id) }}" method="POST">
                                            @csrf
                                            @method('DELETE')
                                            <button type="submit" class="btn btn-sm btn-outline-danger"><i class="bi bi-trash"></i></button>
                                        </form>
                                    </td>
                                </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>
                <a href="{{ route('shop.index') }}" class="btn btn-outline-terracotta"><i class="bi bi-arrow-left me-1"></i> Continue Shopping</a>
            </div>

            <div class="col-lg-4">
                <div class="border rounded p-4 bg-white">
                    <h5 class="font-serif mb-3">Order Summary</h5>
                    <div class="d-flex justify-content-between mb-2">
                        <span class="text-muted-soft">Subtotal</span>
                        <span class="fw-semibold">Rs. {{ number_format($cart->total) }}</span>
                    </div>
                    @php($freeShippingThreshold = (float) \App\Models\SiteSetting::get('free_shipping_threshold', 5000))
                    @if($freeShippingThreshold > 0 && $cart->total >= $freeShippingThreshold)
                        <p class="small text-sage fw-semibold mb-3"><i class="bi bi-truck me-1"></i>You've unlocked free delivery!</p>
                    @elseif($freeShippingThreshold > 0)
                        <p class="small text-muted-soft mb-3">Add Rs. {{ number_format($freeShippingThreshold - $cart->total) }} more for free delivery. Shipping calculated at checkout.</p>
                    @else
                        <p class="small text-muted-soft mb-3">Shipping fee calculated at checkout.</p>
                    @endif
                    <a href="{{ route('checkout.index') }}" class="btn btn-terracotta w-100">Proceed to Checkout</a>
                </div>
            </div>
        </div>
    @endif
</div>

@endsection
