<section>
<div class="mx-auto max-w-[450px] px-4 py-12 font-sans">
<h1
class="text-lg leading-tight sm:text-xl md:text-2xl lg:text-3xl font-medium"
>
Thank you for your order!
</h1>
<div class="mt-8 space-y-2">
<p class="text-base leading-normal text-base-500">
<span class="font-medium text-black">Order #:</span> 98876248
</p>
<p class="text-base leading-normal text-base-500">
<span class="font-medium text-black">Date:</span> 29 Dec 2024, 19:55
</p>
</div>
<div class="space-y-3 border-b border-gray-200 py-6">
<div class="flex justify-between">
<p class="text-base leading-normal">Subtotal</p>
<p class="text-base leading-normal text-base-600">$149.00</p>
</div>
<div class="flex justify-between">
<p class="text-base leading-normal">Discount</p>
<p class="text-base leading-normal text-base-600">-$81.95</p>
</div>
<div class="flex justify-between font-bold">
<p class="text-base leading-normal">Total</p>
<p class="text-base leading-normal">$67.05</p>
</div>
</div>
<button
class="flex items-center justify-center transition-all duration-200 focus:ring-2 focus:outline-none text-white bg-accent-600 hover:bg-accent-700 focus:ring-accent-500/50 h-12 px-6 py-3 text-base font-medium rounded-lg w-full"
>
Download your files
</button>
<div class="flex gap-2 border-t border-gray-200 py-4 mt-4">
<a
class="text-sm leading-normal text-blue-600 hover:underline"
href="https://oxbowui.com/support"
>
Contact support
</a>
<a
class="text-sm leading-normal text-blue-600 hover:underline"
href="https://billing.stripe.com/p/login/fZefZe38O7mhbhC8ww"
>
Request an invoice
</a>
</div>
</div>
</section>
