{% extends 'account/base_account.html.twig' %}

{% block title %}Mon profil{% endblock %}

{% block stylesheets %}
    {{ parent() }}
    <style>
        #qrBtn    { display: none !important; }
        #qrPanel  { display: none !important; }
        #userNavBtn { display: flex !important; }
    </style>
{% endblock %}

{% block content %}
<div class="page-header">
    <h1 class="page-title">👤 Mon profil</h1>
    <p class="page-subtitle">Gérez vos informations personnelles</p>
</div>

<div class="card">
    <div class="card-title">Informations personnelles</div>
    
    {{ form_start(form, {'attr': {'novalidate': 'novalidate'}}) }}
    
    <div class="form-row">
        <div class="form-group">
            {{ form_label(form.prenom) }}
            {{ form_widget(form.prenom) }}
            {{ form_errors(form.prenom) }}
        </div>
        <div class="form-group">
            {{ form_label(form.nom) }}
            {{ form_widget(form.nom) }}
            {{ form_errors(form.nom) }}
        </div>
    </div>

    <div class="form-row">
        <div class="form-group">
            {{ form_label(form.email) }}
            {{ form_widget(form.email) }}
            {{ form_errors(form.email) }}
        </div>
        <div class="form-group">
            {{ form_label(form.telephone) }}
            {{ form_widget(form.telephone) }}
            {{ form_errors(form.telephone) }}
        </div>
    </div>

    <div class="form-group">
        {{ form_label(form.entreprise) }}
        {{ form_widget(form.entreprise) }}
        {{ form_errors(form.entreprise) }}
    </div>

    <div class="form-group">
        {{ form_label(form.adresse) }}
        {{ form_widget(form.adresse) }}
        {{ form_errors(form.adresse) }}
    </div>

    <div class="form-actions">
        <button type="submit" class="btn btn-primary">
            💾 Enregistrer les modifications
        </button>
        <a href="{{ path('app_account_change_password') }}" class="btn btn-secondary">
            🔒 Changer le mot de passe
        </a>
    </div>

    {{ form_end(form) }}
</div>

<!-- INFORMATIONS COMPTE -->
<div class="card">
    <div class="card-title">📊 Informations du compte</div>
    
    <div class="detail-grid">
        <div class="detail-item">
            <div class="detail-label">Date d'inscription</div>
            <div class="detail-value"><span class="local-datetime" data-utc="{{ app.user.createdAt|date('Y-m-d\\TH:i:s', 'UTC') }}Z">{{ app.user.createdAt|date('d/m/Y à H:i') }}</span></div>
        </div>
        <div class="detail-item">
            <div class="detail-label">Email vérifié</div>
            <div class="detail-value">
                {% if app.user.isVerified %}
                    <span class="text-success">✅ Oui</span>
                {% else %}
                    <span class="text-error">❌ Non</span>
                {% endif %}
            </div>
        </div>
        <div class="detail-item">
            <div class="detail-label">Dernière connexion</div>
            <div class="detail-value">
                {{ app.user.lastLoginAt ? '<span class="local-datetime" data-utc="' ~ app.user.lastLoginAt|date('Y-m-d\\TH:i:s', 'UTC') ~ 'Z">' ~ app.user.lastLoginAt|date('d/m/Y à H:i') ~ '</span>' : 'Première connexion' }}
            </div>
        </div>
        <div class="detail-item">
            <div class="detail-label">Type de compte</div>
            <div class="detail-value">
                {% if is_granted('ROLE_ADMIN') %}
                    <span class="admin-badge">Administrateur</span>
                {% else %}
                    <span class="badge badge-paid">Client</span>
                {% endif %}
            </div>
        </div>
    </div>
</div>

<!-- RGPD -->
<div class="card">
    <div class="card-title">🛡️ Mes données personnelles</div>
    <div style="display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;">
        <div>
            <div style="font-size:15px;font-weight:600;color:#1d1d1f;margin-bottom:4px;">
                Exercer mes droits RGPD
            </div>
            <div style="font-size:13px;color:#6e6e73;line-height:1.5;">
                Accès, rectification, portabilité, opposition… Exercez vos droits sur vos données personnelles.
            </div>
        </div>
        <a href="{{ path('app_account_mes_donnees') }}" target="_blank"
           style="display:inline-block;background:linear-gradient(135deg,#667eea,#764ba2);
                  color:white;border-radius:10px;padding:10px 20px;font-size:14px;
                  font-weight:600;text-decoration:none;white-space:nowrap;flex-shrink:0;">
            🔒 Mes droits RGPD
        </a>
    </div>
</div>


{% endblock %}