{% extends 'base.html.twig' %}
{% block title %}Mi perfil – HuertosCastellon.es{% endblock %}
{% block meta_robots %}noindex, nofollow{% endblock %}

{% block body %}

<header class="page-header">
    <div class="container">
        <nav aria-label="breadcrumb"><ol class="breadcrumb">
            <li class="breadcrumb-item"><a href="{{ path('app_mi_area') }}">Mi área</a></li>
            <li class="breadcrumb-item active">Mi perfil</li>
        </ol></nav>
        <h1><i class="bi bi-person-gear me-2" style="opacity:.8"></i>Mi perfil</h1>
    </div>
</header>

<div class="container" style="padding-top:1.5rem; padding-bottom:4rem;">
<div class="row justify-content-center">
<div class="col-md-7 col-lg-6">

    <div class="content-card p-4 p-md-5">
        <div class="section-header-sm mb-1">Datos personales</div>
        <p class="text-muted small mb-4">Los cambios se aplican inmediatamente.</p>

        {{ form_start(form) }}
        <div class="row g-3">
            <div class="col-md-6">
                {{ form_label(form.nombre) }}
                {{ form_widget(form.nombre, {'attr': {'class': 'form-control'}}) }}
                {{ form_errors(form.nombre) }}
            </div>
            <div class="col-md-6">
                {{ form_label(form.apellidos) }}
                {{ form_widget(form.apellidos, {'attr': {'class': 'form-control'}}) }}
                {{ form_errors(form.apellidos) }}
            </div>
            <div class="col-12">
                {{ form_label(form.email) }}
                {{ form_widget(form.email, {'attr': {'class': 'form-control'}}) }}
                {{ form_errors(form.email) }}
            </div>
            <div class="col-12">
                {{ form_label(form.telefono) }}
                {{ form_widget(form.telefono, {'attr': {'class': 'form-control'}}) }}
                {{ form_errors(form.telefono) }}
            </div>
        </div>
        <div class="d-flex gap-2 mt-4">
            <button type="submit" class="btn-primary-green" style="border-radius:50px; padding:.6rem 1.6rem">
                <i class="bi bi-floppy me-1"></i>Guardar cambios
            </button>
            <a href="{{ path('app_mi_area') }}" class="btn-ghost-green" style="border-radius:50px">Cancelar</a>
        </div>
        {{ form_end(form) }}
    </div>

    <div class="content-card p-4 mt-3">
        <div class="d-flex justify-content-between align-items-center">
            <div>
                <div class="section-header-sm">Seguridad</div>
                <p class="text-muted small mb-0">Cambia tu contraseña de acceso</p>
            </div>
            <a href="{{ path('app_perfil_password') }}" class="btn-ghost-green" style="border-radius:50px; font-size:.82rem">
                <i class="bi bi-shield-lock me-1"></i>Cambiar contraseña
            </a>
        </div>
    </div>

</div>
</div>
</div>
{% endblock %}