@extends('layouts.app')

@section('title', 'Validation de votre commande - #' . $order_reference)

@section('styles')
<style>
    


</style>
@endsection

@section('content')

<div class="ht__bradcaump__area mb-5" style="background: rgba(0, 0, 0, 0) url({{ asset('assets/images/bg/2.jpg') }}) no-repeat scroll center center / cover ;">
    <div class="ht__bradcaump__wrap_small">
        <div class="container">
            <div class="row">
                <div class="col-12">
                    <div class="bradcaump__inner text-center">
                        <h2 class="bradcaump-title">Commande n°{{ $order_reference }}</h2>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="container pb-5 fade-in">
    <div class="row justify-content-center">
        <div class="order-confirmation-wrapper">
            <div class="icon-circle">
                <svg viewBox="0 0 24 24">
                    <path d="M20.285 6.709l-11.01 11.01-5.57-5.57 1.414-1.414 4.156 4.156 9.596-9.596z" />
                </svg>
            </div>
            <h1>Merci pour votre commande ✨</h1>

            <div class="info-block">
                <p>Votre commande a été confirmée avec succès.</p>
                <p>Un email de confirmation a été envoyé à votre adresse.</p>
                <p>Notre équipe prépare votre colis avec soin.</p>
                <span class="order-code">Référence : #A78923FD</span>
                <p>Nous restons à votre disposition pour toute question.</p>
            </div>

            <div class="contact-btn mt-4">
                <a href="/" class="fv-btn btn rounded-0">Retour à la boutique</a>
            </div>
        </div>
    </div>
</div>
@endsection