{% extends 'layout.html.twig' %}

{% block title %}Buchung erfolgreich{% endblock %}

{% block content %}
    <div class="max-w-2xl mx-auto text-center py-12">
        <div class="mb-8">
            <svg class="w-24 h-24 text-green-500 mx-auto" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                      d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"></path>
            </svg>
        </div>

        <h1 class="text-3xl font-bold mb-4">Buchung erfolgreich abgeschlossen</h1>

        <p class="text-xl mb-8">
            Ihre Buchungsnummer: <strong class="font-mono">{{ bookingNumber }}</strong>
        </p>

        <div class="bg-blue-50 border border-blue-200 rounded-lg p-6 mb-8">
            <p class="text-gray-700">
                Sie erhalten in Kürze eine Bestätigungs-E-Mail mit allen Details zu Ihrer Buchung.
            </p>
        </div>

        <a href="https://www.ep-reisen.de" class="button bg-button bg-button--primary">
            Zurück zur Startseite
        </a>
    </div>
{% endblock %}