<div class="main-page">
    <div class="middle-content">
        <div class="body-content">
            <div class="title-content"><h1>Renombrar Hermandad</h1></div>
            <div class="box-content">
                <div class="title-box-content">
                    <h2>Información</h2>
                    <a class="back-to-account" href="{% url 'my-account' %}">Regresar a mi cuenta</a>
                    <a class="back-to-account-responsive" href="{% url 'my-account' %}">Regresar</a>
                </div>
                <div class="body-box-content justified">
                    <br>
                    <p>La herramienta <span>Renombrar hermandad</span> te permite cambiar de nombre a una hermandad de la cual seas Maestro de Hermandad.</p>
                    <br>
                    <p>A la hora de escoger un nuevo nombre, ten en cuenta:</p>
                    <p>- La longitud máxima es de 24 caracteres.</p>
                    <p>- Los caracteres permitidos son A-Za-z y el espacio.</p>
                    <br>
                    <fieldset>
                        <legend>NOTA</legend>
                        <div class="separate2">
                            <p>Por favor, asegúrate de haber elegido el nombre correcto ya que esta acción no es reversible una vez realizada.</p>
                        </div>
                    </fieldset>
                    <div class="centered">
                        <br>
                        <p>Requiere <span>{{ rename_cost }}</span> <span class="yellow-info">EUR</span></p>
                        <br>

                        {% if no_guild_leader_message %}
                            <span class="red-form-response">{{ no_guild_leader_message }}</span>
                        {% else %}
                            {% load django_vite %}
                            <!-- Isla React (Vite): renombrar hermandad (guild + campos -> Stripe). -->
                            <div id="rename-guild-app"
                                 data-csrf="{{ csrf_token }}"
                                 data-url="{% url 'rename-guild' %}"></div>
                            {{ guild_names|json_script:"rename-guild-data" }}
                            {% vite_asset 'src/entries/rename_guild.tsx' %}
                        {% endif %}
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
