

{% block name_and_dob_widget %}

    <div class="-space-y-px rounded-md bg-white shadow-sm">
        <div class="flex -space-x-px">
            <div class="w-1/2 min-w-0 flex-1">
                <label for="{{ form.firstname.vars.id }}"
                       class="sr-only">{{ form.firstname.vars.label_format|replace({'%name%': form.firstname.vars.name})|trans(label_translation_parameters, translation_domain) }}</label>
                <input type="text"
                       class="relative block w-full rounded-none rounded-tl-md border-0 bg-transparent py-1.5 text-gray-900 ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:z-10 focus:ring-2 focus:ring-inset focus:ring-primary-600 sm:text-sm sm:leading-6"
                       id="{{ form.firstname.vars.id }}" name="{{ form.firstname.vars.full_name }}"
                        {%- if form.firstname.vars.disabled %} disabled="disabled"{% endif -%}
                        {%- if form.firstname.vars.required %} required="required"{% endif -%}
                       placeholder="{{ form.firstname.vars.label_format|replace({'%name%': form.firstname.vars.name})|trans(label_translation_parameters, translation_domain) }}"
                       value="{{ form.firstname.vars.value }}">
            </div>
            <div class="min-w-0 flex-1">
                <label for="{{ form.lastname.vars.id }}"
                       class="sr-only">{{ form.lastname.vars.label_format|replace({'%name%': form.lastname.vars.name})|trans(label_translation_parameters, translation_domain) }}</label>
                <input type="text"
                       class="relative block w-full rounded-none rounded-tr-md border-0 bg-transparent py-1.5 text-gray-900 ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:z-10 focus:ring-2 focus:ring-inset focus:ring-primary-600 sm:text-sm sm:leading-6"
                       id="{{ form.lastname.vars.id }}" name="{{ form.lastname.vars.full_name }}"
                        {%- if form.lastname.vars.disabled %} disabled="disabled"{% endif -%}
                        {%- if form.lastname.vars.required %} required="required"{% endif -%}
                       placeholder="{{ form.lastname.vars.label_format|replace({'%name%': form.lastname.vars.name})|trans(label_translation_parameters, translation_domain) }}"
                       value="{{ form.lastname.vars.value }}">
            </div>
        </div>
        <div>
            <label for="{{ form.dateOfBirth.vars.id }}"
                   class="sr-only">{{ form.dateOfBirth.vars.label_format|replace({'%name%': form.dateOfBirth.vars.name})|trans(label_translation_parameters, translation_domain) }}</label>
            <input type="date"
                   class="relative block w-full rounded-none rounded-b-md border-0 bg-transparent py-1.5 text-gray-900 ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:z-10 focus:ring-2 focus:ring-inset focus:ring-primary-600 sm:text-sm sm:leading-6"
                   id="{{ form.dateOfBirth.vars.id }}" name="{{ form.dateOfBirth.vars.full_name }}"
                    {%- if form.dateOfBirth.vars.disabled %} disabled="disabled"{% endif -%}
                    {%- if form.dateOfBirth.vars.required %} required="required"{% endif -%}
                   placeholder="{{ form.dateOfBirth.vars.label_format|replace({'%name%': form.dateOfBirth.vars.name})|trans(label_translation_parameters, translation_domain) }}"
                   value="{{ form.dateOfBirth.vars.value }}"
            >
        </div>
    </div>

    {{ form_errors(form.firstname) }}
    {{ form_errors(form.lastname) }}
    {{ form_errors(form.dateOfBirth) }}

{% endblock %}

{% block postal_address_widget %}
    <div class="grid grid-cols-1 gap-x-6 gap-y-8 sm:grid-cols-6">
        <div class="sm:col-span-3">
            {{ form_row(form.street) }}
        </div>
        <div class="sm:col-span-1">
            {{ form_row(form.postalCode) }}
        </div>
        <div class="sm:col-span-2">
            {{ form_row(form.city) }}
        </div>
        <div class="sm:col-span-3">
            {{ form_row(form.country) }}
        </div>
    </div>
{% endblock %}
