@extends('layouts.app')

@section('content')
<section class="py-16 md:py-24 bg-[#1a1614]">
    <div class="max-w-2xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
        <div class="w-16 h-16 mx-auto mb-6 rounded-full bg-green-500/10 flex items-center justify-center text-green-400">
            <svg class="w-8 h-8" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
                <path stroke-linecap="round" stroke-linejoin="round" d="M4.5 12.75l6 6 9-13.5"/>
            </svg>
        </div>
        <h1 class="text-3xl font-light text-white mb-4">{{ __('order_success') }}</h1>
        <p class="text-white/60 mb-8">{{ __('order_success_text') }}</p>
        <div class="bg-[#231e1b] rounded-xl p-6 mb-8">
            <p class="text-sm text-white/50 uppercase tracking-wider mb-2">{{ __('order_number') }}</p>
            <p class="text-2xl text-[#c77d4a] font-medium">{{ $order->order_number }}</p>
        </div>
        <a href="{{ localized_route('products.index') }}" class="inline-flex items-center justify-center bg-[#c77d4a] hover:bg-[#b06b3d] text-white px-10 py-4 rounded text-sm font-medium uppercase transition">{{ __('continue_shopping') }}</a>
    </div>
</section>
@endsection