{# ========================================
   FORM CRÉATION BATEAU
   Formulaire de création d'un bateau — infos, checkboxes booléens, tarifs par formule
   ======================================== #}
<form method="post" action="/admin/bateaux/create" class="mt-3 grid gap-3 md:grid-cols-2">
    <input type="text" name="nom" placeholder="Nom" class="rounded-lg border-2 border-abyss-900 bg-sand-100 px-3 py-2 text-sm" required>
    <input type="number" name="capacite" placeholder="Capacité" min="1" class="rounded-lg border-2 border-abyss-900 bg-sand-100 px-3 py-2 text-sm" required>
    <input type="text" name="slogan" placeholder="Slogan" class="rounded-lg border-2 border-abyss-900 bg-sand-100 px-3 py-2 text-sm md:col-span-2">
    <input type="url" name="photo_url" placeholder="URL photo" class="rounded-lg border-2 border-abyss-900 bg-sand-100 px-3 py-2 text-sm md:col-span-2">
    <textarea name="description" placeholder="Description" class="rounded-lg border-2 border-abyss-900 bg-sand-100 px-3 py-2 text-sm md:col-span-2"></textarea>
    <select name="id_type_bateau" class="rounded-lg border-2 border-abyss-900 bg-sand-100 px-3 py-2 text-sm" required>
        <option value="">Type de bateau</option>
        {% for type in form_data.id_type_bateau|default([]) %}
            <option value="{{ type.value }}">{{ type.label }}</option>
        {% endfor %}
    </select>
    <select name="id_port" class="rounded-lg border-2 border-abyss-900 bg-sand-100 px-3 py-2 text-sm" required>
        <option value="">Port</option>
        {% for port in form_data.id_port|default([]) %}
            <option value="{{ port.value }}">{{ port.label }}</option>
        {% endfor %}
    </select>
    <div class="md:col-span-2 grid gap-2 sm:grid-cols-2 text-sm font-semibold">
        <label class="flex items-center justify-between rounded-lg border-2 border-abyss-900 bg-sand-100 px-3 py-2"><span>Permis requis</span><input class="h-5 w-5 accent-coral-500" type="checkbox" name="permis_requis" value="1"></label>
        <label class="flex items-center justify-between rounded-lg border-2 border-abyss-900 bg-sand-100 px-3 py-2"><span>Familial</span><input class="h-5 w-5 accent-coral-500" type="checkbox" name="familial" value="1"></label>
        <label class="flex items-center justify-between rounded-lg border-2 border-abyss-900 bg-sand-100 px-3 py-2"><span>Skipper</span><input class="h-5 w-5 accent-coral-500" type="checkbox" name="skipper_disponible" value="1"></label>
    </div>
    <div class="md:col-span-2 rounded-xl border-2 border-abyss-900 bg-sand-100 p-4">
        <h4 class="mb-3 text-xs font-black uppercase tracking-widest text-abyss-700">Tarifs par formule</h4>
        <div class="grid gap-3 sm:grid-cols-2">
            {% for formule in form_data.formules|default([]) %}
                <label class="flex items-center justify-between gap-3">
                    <span class="text-sm font-semibold">{{ formule.label }}</span>
                    <input type="number" name="prix[{{ formule.value }}]" step="0.01" min="1" placeholder="Prix €" class="w-32 rounded-lg border-2 border-abyss-900 bg-white px-3 py-2 text-sm" required>
                </label>
            {% endfor %}
        </div>
    </div>
    <button class="rounded-lg border-2 border-abyss-900 bg-coral-500 px-3 py-2 text-xs font-black uppercase text-white shadow-[3px_3px_0_0_#041824] md:col-span-2">Ajouter</button>
</form>