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

{% block content %}
    <div class="grid md:grid-cols-2 gap-x-16 gap-y-4">
        <div>
            <h2 class="text-2xl font-semibold pb-4">
                Persönliche Daten
            </h2>
            {{ form_start(form) }}
            <div class="grid grid-cols-2 gap-x-8 gap-y-4 pb-4">
                {{ form_row(form.firstName) }}
                {{ form_row(form.name) }}
                {{ form_row(form.gender) }}
                {{ form_row(form.dateOfBirth) }}
            </div>
            <h3 class="text-xl font-semibold pb-2">
                Anschrift
            </h3>
            <div class="grid grid-cols-2 gap-x-8 gap-y-4 pb-4">
                <div class="col-span-2">
                    {{ form_row(form.street) }}
                </div>
                {{ form_row(form.postCode) }}
                {{ form_row(form.city) }}
                {{ form_row(form.country) }}
            </div>
            <h3 class="text-xl font-semibold pb-2">
                Kontakt
            </h3>
            <div class="grid grid-cols-2 gap-x-8 gap-y-4 pb-4">
                <div class="col-span-2">
                    {{ form_row(form.email) }}
                </div>
                {{ form_row(form.phone) }}
                {{ form_row(form.mobile) }}
            </div>
            <button type="submit" class="btn">
                Speichern
            </button>
            {{ form_rest(form) }}
            {{ form_end(form) }}
        </div>
        <div>
            <h2 class="text-2xl font-semibold pb-4">
                Newsletter
            </h2>
            <p class="pb-4">
                Du bist aktuell {% if not personalData.communication.newsletter %}<strong>nicht</strong> {% endif%} zum Newsletter
                angemeldet.
            </p>
            <button type="button" class="btn" hx-post="{{ path('app_personal_data_newsletter') }}" hx-target="#app">
                {% if personalData.communication.newsletter %}
                    vom Newsletter abmelden
                {% else %}
                    zum Newsletter anmelden
                {% endif %}
            </button>
        </div>
    </div>
{% endblock %}