@extends('layout.index')

@section('content')
    <div class="container mx-auto px-4 py-20 text-center h-full justify-center items-center flex">
        <div>
            <svg class="mx-auto h-12 w-12 text-green-500" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
            </svg>
            <h2 class="text-3xl font-semibold text-gray-800">¡Compra Exitosa!</h2>
            <p class="text-gray-600 mt-4">{{ $order->customer->name }} Gracias por tu compra. Tu pedido {{ $order->sale_id }}
                esta siendo procesado.</p>
            <p class="text-gray-500 mt-2">Revise su correo electrónico (incluida la carpeta de spam), ya que hemos enviado información importante para seguir el proceso de su compra.</p>
            <div class="h-8"></div>
            <a href="{{ route('home') }}" class="mt-8 bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded">
                Volver al inicio
            </a>
        </div>
    </div>
@endsection