@extends('layout.template')
@section('title','Cusella Home Furnishing | Curtains, Sofas, Wallpapers & Interior Solutions')
@section('content')
<div class="cart-area pt-100 pb-100">
    <div class="container">
        <div class="row">
            <div class="col-12">
                <form action="#">
                    <div class="cart-table-content">
                        <div class="table-content table-responsive">
                            <table>
                                <thead>
                                    <tr>
                                        <th class="width-thumbnail"></th>
                                        <th class="width-name">Product</th>
                                        <th class="width-price"> Price</th>
                                        <th class="width-quantity">Quantity</th>
                                        <th class="width-subtotal">Subtotal</th>
                                        <th class="width-remove"></th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @foreach($cart['items'] as $item)
                                    <tr>
                                        <td class="product-thumbnail">
                                            <a href="{{ url('product-details/'.$item['product_id']) }}">
                                                <img src="{{ $item['variant']['image'] ?? 'assets/images/default-product.png' }}" alt="{{ $item['name'] }}">
                                            </a>
                                        </td>
                                        <td class="product-name">
                                            <h5>
                                                <a href="{{ url('product-details/'.$item['product_id']) }}">
                                                    {{ $item['name'] }}
                                                </a>
                                            </h5>
                                            @if(!empty($item['variant']['color']))
                                                <p>Color: {{ $item['variant']['color'] }}</p>
                                            @endif
                                        </td>
                                        <td class="product-cart-price">
                                            <span class="amount">${{ number_format($item['price'], 2) }}</span>
                                        </td>
                                        <td class="cart-quality">
                                            <div class="product-quality">
                                                <input class="cart-plus-minus-box input-text qty text" name="qty[{{ $item['cart_item_id'] }}]" value="{{ $item['quantity'] }}">
                                            </div>
                                        </td>
                                        <td class="product-total">
                                            <span>${{ number_format($item['subtotal'], 2) }}</span>
                                        </td>
                                        <td class="product-remove">
                                            <a href="{{ url('cart/remove/'.$item['cart_item_id']) }}"><i class="ti-trash"></i></a>
                                        </td>
                                    </tr>
                                    @endforeach
                                </tbody>
                            </table>
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-lg-12">
                            <div class="cart-shiping-update-wrapper">
                                <div class="cart-shiping-update btn-hover">
                                    <a href="{{ url('/') }}">Continue Shopping</a>
                                </div>
                                <div class="cart-clear-wrap">
                                    <div class="cart-clear btn-hover">
                                        <button type="submit">Update Cart</button>
                                    </div>
                                    <div class="cart-clear btn-hover">
                                        <a href="{{ url('cart/clear') }}">Clear Cart</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>

        <!-- Price & Discount Section -->
        <div class="row">
            <div class="col-lg-4 col-md-6 col-12">
                <div class="cart-calculate-discount-wrap mb-40">
                    <h4>Calculate shipping</h4>
                    <div class="calculate-discount-content">
                        <div class="select-style mb-15">
                            <select class="select-two-active">
                                <option>Bangladesh</option>
                                <option>Bahrain</option>
                                <option>Azerbaijan</option>
                                <option>Barbados</option>
                            </select>
                        </div>
                        <div class="select-style mb-15">
                            <select class="select-two-active">
                                <option>State / County</option>
                                <option>Bahrain</option>
                                <option>Azerbaijan</option>
                                <option>Barbados</option>
                            </select>
                        </div>
                        <div class="input-style">
                            <input type="text" placeholder="Town / City">
                        </div>
                        <div class="input-style">
                            <input type="text" placeholder="Postcode / ZIP">
                        </div>
                        <div class="calculate-discount-btn btn-hover">
                            <a class="btn theme-color" href="#">Update</a>
                        </div>
                    </div>
                </div>
            </div>

            <div class="col-lg-4 col-md-6 col-12">
                <div class="cart-calculate-discount-wrap mb-40">
                    <h4>Coupon Discount</h4>
                    <div class="calculate-discount-content">
                        <p>Enter your coupon code if you have one.</p>
                        <div class="input-style">
                            <input type="text" placeholder="Coupon code">
                        </div>
                        <div class="calculate-discount-btn btn-hover">
                            <a class="btn theme-color" href="#">Apply Coupon</a>
                        </div>
                    </div>
                </div>
            </div>

            <div class="col-lg-4 col-md-12 col-12">
                <div class="grand-total-wrap">
                    <div class="grand-total-content">
                        <h3>Subtotal <span>${{ number_format($cart['price_details']['sub_total'], 2) }}</span></h3>
                        <div class="grand-shipping">
                            <span>Shipping</span>
                            <ul>
                                <li><input type="radio" name="shipping" value="free" checked><label>Free shipping</label></li>
                                <li><input type="radio" name="shipping" value="flat"><label>Flat rate: <span>$100.00</span></label></li>
                                <li><input type="radio" name="shipping" value="pickup"><label>Local pickup: <span>$120.00</span></label></li>
                            </ul>
                        </div>
                        <div class="shipping-country">
                            <p>Shipping to Bangladesh</p>
                        </div>
                        <div class="grand-total">
                            <h4>Total <span>${{ number_format($cart['price_details']['total'], 2) }}</span></h4>
                        </div>
                    </div>
                    <div class="grand-total-btn btn-hover">
                        <a class="btn theme-color" href="{{ url('checkout') }}">Proceed to checkout</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection