{% form_theme form with admin_form_themes() only %}
{% import '@extends/SerenityAdmin/macros/form_errors.html.twig' as formMacros %}
<div {{ attributes }}>
    {{ form_start(form, { attr: {
        'data-action': 'live#action:prevent',
        'data-live-action-param': 'debounce(200)|files|save',
        'novalidate': 'true'
    }}) }}
    <div class="flex flex-col gap-6">
        <div class="flex justify-end gap-4">
            <a href="{{ path('admin_config_super_admin') }}" data-turbo-method
               data-turbo-confirm="En annulant, vos modifications ne seront pas prise en compte. souhaitez-vous continuer ?"
               title="Configuration de l'administration"
               class="rounded-md bg-accent px-3 py-2 text-sm font-semibold text-white shadow-sm hover:bg-accent-hover focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary cursor-pointer">
                Annuler
            </a>
            <button type="submit"
                    class="rounded-md bg-primary px-3 py-2 text-sm font-semibold text-white shadow-sm hover:bg-primary-hover focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary cursor-pointer"
                    data-loading="addClass(opacity-50 disabled cursor-not-allowed)"
            >
                Enregistrer
            </button>
        </div>
        {% if not form.vars.valid %}
            <div class="rounded-md p-4 bg-red-100 text-red-800 dark:bg-red-900 dark:text-red-200">
                <div class="flex">
                    <svg class="w-5 h-5 mr-2 shrink-0" fill="currentColor" viewBox="0 0 20 20">
                        <path
                            d="M18 10A8 8 0 11.999 10 8 8 0 0118 10zm-8-4a1 1 0 00-.993.883L9 7v4a1 1 0 001.993.117L11 11V7a1 1 0 00-1-1zm0 8a1.25 1.25 0 100-2.5 1.25 1.25 0 000 2.5z"/>
                    </svg>
                    {{ formMacros.recursive_errors(form) }}
                </div>
            </div>
        {% endif %}
        {{ form_row(form, { label : false}) }}
    </div>
    {{ form_rest(form) }}
    {{ form_end(form) }}
</div>
