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

{% block title %}{{ formulaire.title }}{% endblock %}

{% block body %}
    <div class="container mx-auto py-8 px-4 max-w-3xl">
        <h1 class="text-3xl font-bold mb-4">{{ formulaire.title }}</h1>

        {% if formulaire.description %}
            <p class="mb-6 text-gray-600">{{ formulaire.description }}</p>
        {% endif %}

        <form method="post" enctype="multipart/form-data" class="space-y-4">
            {% for champ in champs|sort((a,b) => a.position <=> b.position) %}
                <div class="form-group">
                    <label class="font-semibold block mb-1">
                        {{ champ.label }}
                        {% if champ.isRequired %}<span class="text-red-500">*</span>{% endif %}
                    </label>

                    {% set name = 'field_' ~ champ.id %}

                    {% if champ.type == 'text' %}
                        <input type="text" name="{{ name }}" class="form-control" {% if champ.isRequired %}required{% endif %}>
                    {% elseif champ.type == 'textarea' %}
                        <textarea name="{{ name }}" class="form-control" {% if champ.isRequired %}required{% endif %}></textarea>
                    {% elseif champ.type == 'email' %}
                        <input type="email" name="{{ name }}" class="form-control" {% if champ.isRequired %}required{% endif %}>
                    {% elseif champ.type == 'number' %}
                        <input type="number" name="{{ name }}" class="form-control" {% if champ.isRequired %}required{% endif %}>
                    {% elseif champ.type == 'checkbox' %}
                        <input type="checkbox" name="{{ name }}" class="form-checkbox">
                    {% elseif champ.type == 'radio' %}
                        {% for option in champ.options %}
                            <label class="block">
                                <input type="radio" name="{{ name }}" value="{{ option }}" {% if champ.isRequired %}required{% endif %}>
                                {{ option }}
                            </label>
                        {% endfor %}
                    {% elseif champ.type == 'select' %}
                        <select name="{{ name }}" class="form-control" {% if champ.isRequired %}required{% endif %}>
                            <option value="">-- Choisir --</option>
                            {% for option in champ.options %}
                                <option value="{{ option }}">{{ option }}</option>
                            {% endfor %}
                        </select>
                    {% elseif champ.type == 'file' %}
                        <input type="file" name="{{ name }}" class="form-control-file" {% if champ.isRequired %}required{% endif %}>
                    {% elseif champ.type == 'date' %}
                        <input type="date" name="{{ name }}" class="form-control" {% if champ.isRequired %}required{% endif %}>
                    {% endif %}
                </div>
            {% endfor %}

            <button type="submit" class="btn-primary mt-4">Envoyer</button>
        </form>
    </div>
{% endblock %}