@extends('storefront.layouts.app')
@section('title', __('Order Confirmed'))

@section('content')
<div class="container">
    <div class="card border-0 shadow-sm mx-auto" style="max-width:720px">
        <div class="card-body text-center p-4 p-md-5">
            <i class="bi bi-check-circle-fill text-success" style="font-size:3.5rem"></i>
            <h1 class="h4 fw-bold mt-3">{{ __('Thank you for your order!') }}</h1>
            <p class="text-muted">{{ __('Your order number is') }} <strong class="text-primary">{{ $order->order_number }}</strong></p>

            <div class="text-start border rounded-3 p-3 my-4">
                <div class="d-flex justify-content-between small mb-1"><span class="text-muted">{{ __('Full Name') }}</span><span>{{ $order->customer_name }}</span></div>
                <div class="d-flex justify-content-between small mb-1"><span class="text-muted">{{ __('Phone Number') }}</span><span>{{ $order->customer_phone }}</span></div>
                <div class="d-flex justify-content-between small mb-1"><span class="text-muted">{{ __('Payment Method') }}</span><span class="text-uppercase">{{ $order->payment_method }}</span></div>
                <hr class="my-2">
                @foreach($order->items as $item)
                    <div class="d-flex justify-content-between small mb-1">
                        <span>{{ $item->product_name }} @if($item->variation_label)<em class="text-muted">({{ $item->variation_label }})</em>@endif × {{ $item->quantity }}</span>
                        <span>{{ money($item->subtotal) }}</span>
                    </div>
                @endforeach
                <hr class="my-2">
                <div class="d-flex justify-content-between small"><span>{{ __('Subtotal') }}</span><span>{{ money($order->subtotal) }}</span></div>
                @if($order->discount > 0)<div class="d-flex justify-content-between small text-success"><span>{{ __('Discount') }}</span><span>-{{ money($order->discount) }}</span></div>@endif
                <div class="d-flex justify-content-between small"><span>{{ __('Shipping Charge') }}</span><span>{{ money($order->shipping_cost) }}</span></div>
                <div class="d-flex justify-content-between fw-bold mt-1"><span>{{ __('Grand Total') }}</span><span class="text-primary">{{ money($order->total) }}</span></div>
            </div>

            <p class="small text-muted">{{ settings('contact_phone') ? __('Call to Order').': '.settings('contact_phone') : '' }}</p>
            <a href="{{ route('home') }}" class="btn btn-primary">{{ __('Continue Shopping') }}</a>
        </div>
    </div>
</div>
@endsection