{#
 Organisme — Modale de renommage uniforme
 =========================================
 Paramètres :
   title        string   Titre de la modale
   subtitle     string   Sous-titre (optionnel)
   placeholder  string   Placeholder du champ texte (défaut : "Nouveau nom...")
   confirmLabel string   Label du bouton de confirmation (défaut : "Enregistrer")
   color        object   {primary, secondary} — couleurs de l'outil pour le gradient
   modalAttr    object   Attributs HTML sur le container (ex: data-*-target="renameModal")
   inputAttr    object   Attributs HTML sur le champ texte (target + data-action)
   cancelAttr   object   Attributs HTML sur le bouton Annuler et le backdrop
   confirmAttr  object   Attributs HTML sur le bouton de confirmation

 Blocks :
   hiddenInputs — inputs hidden spécifiques à l'outil (CSRF, ID, etc.)
#}

<div class="hidden fixed inset-0 z-[60] items-center justify-center p-4"
     {% for k, v in (modalAttr ?? {}) %}{{ k }}="{{ v }}" {% endfor %}>

    {# Backdrop #}
    <div class="absolute inset-0 bg-black/40 backdrop-blur-sm"
         {% for k, v in (cancelAttr ?? {}) %}{{ k }}="{{ v }}" {% endfor %}></div>

    {# Panel #}
    <div class="relative bg-white rounded-2xl p-7 w-full max-w-md shadow-xl border border-gray-200 rename-modal-panel">

        <h3 class="text-xl font-bold text-gray-900 mb-1.5">{{ title }}</h3>
        {% if subtitle is defined and subtitle %}
            <p class="text-sm text-gray-500 mb-5">{{ subtitle }}</p>
        {% endif %}

        {% block hiddenInputs %}{% endblock %}

        <input type="text"
               class="w-full h-12 px-4 text-base border-2 border-gray-200 rounded-xl bg-gray-50 focus:outline-none focus:bg-white transition-colors {{ hint is defined and hint ? 'mb-1.5' : 'mb-5' }}"
               style="font-family: inherit;"
               placeholder="{{ placeholder ?? 'Nouveau nom...' }}"
               {% for k, v in (inputAttr ?? {}) %}{{ k }}="{{ v }}" {% endfor %}>

        {% if hint is defined and hint %}
            <p class="text-xs text-gray-400 mb-4 text-right">{{ hint }}</p>
        {% endif %}

        <div class="flex justify-end gap-2">
            {% include '_atoms/button/button.html.twig' with {
                label: 'Annuler',
                variant: 'ghost',
                size: 'md',
                type: 'button',
                attr: cancelAttr ?? {}
            } only %}
            {% include '_atoms/button/button.html.twig' with {
                label: confirmLabel ?? 'Enregistrer',
                variant: 'primary',
                size: 'md',
                gradientFrom: color.primary ?? null,
                gradientTo: color.secondary ?? null,
                attr: confirmAttr ?? {}
            } only %}
        </div>
    </div>
</div>

<style>
@keyframes renameModalIn {
    from { opacity: 0; transform: translateY(12px) scale(0.98); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}
.rename-modal-panel { animation: renameModalIn 0.2s ease both; }
</style>