@extends('layouts.app')

@section('title', 'Order Confirmed')

@section('content')
<div class="container py-5 text-center">
    <h2 class="mb-3">Thank you, {{ $order->customer_name }}!</h2>
    <p class="text-muted mb-1">Your order has been placed successfully.</p>
    <p class="mb-4">Order Number: <strong>{{ $order->order_number }}</strong></p>

    <div class="row justify-content-center">
        <div class="col-md-6">
            <ul class="list-group mb-3 text-start">
                @foreach($order->items as $item)
                    <li class="list-group-item d-flex justify-content-between">
                        <span>{{ $item->product_name }} &times; {{ $item->quantity }}</span>
                        <span>Rs {{ number_format($item->subtotal, 2) }}</span>
                    </li>
                @endforeach
            </ul>
            <h5 class="text-end">Total: Rs {{ number_format($order->total, 2) }}</h5>
        </div>
    </div>

    <a href="{{ route('home') }}" class="btn btn-dark px-4 py-2 mt-4">Continue Shopping</a>
</div>
@endsection