{# templates/account/delete_confirm.html.twig #}
{% extends 'account/base_account.html.twig' %}

{% block page_title %}Supprimer mon compte{% endblock %}

{% block content %}
<div class="page-header">
    <h1 class="page-title">🗑️ Supprimer mon compte</h1>
    <p class="page-subtitle">Droit à l'effacement — Art. 17 RGPD</p>
</div>

{% if existingRequest %}

    <div class="card">
        <div class="alert alert-warning">
            <strong>⏳ Une demande est déjà en cours de traitement.</strong><br>
            Référence : <strong>#{{ existingRequest.id }}</strong> —
            soumise le {{ existingRequest.requestedAt|date('d/m/Y à H:i') }}<br>
            Échéance légale : <strong>{{ existingRequest.deadlineAt|date('d/m/Y') }}</strong>
        </div>
        <div class="form-actions">
            <a href="{{ path('app_account_profil') }}" class="btn btn-secondary">← Retour à mon profil</a>
        </div>
    </div>

{% else %}

    <div class="card">
        <div class="card-title">Ce qui sera supprimé</div>
        <div class="detail-grid">
            <div class="detail-item">
                <div class="detail-label">Données personnelles</div>
                <div class="detail-value" style="color:#ff3b30;">✗ Nom, email, téléphone, adresse</div>
            </div>
            <div class="detail-item">
                <div class="detail-label">Vos cartes NUM-ECARD</div>
                <div class="detail-value" style="color:#ff3b30;">✗ Contenu et accès aux cartes</div>
            </div>
            <div class="detail-item">
                <div class="detail-label">Notifications push</div>
                <div class="detail-value" style="color:#ff3b30;">✗ Abonnements supprimés</div>
            </div>
            <div class="detail-item">
                <div class="detail-label">Accès au compte</div>
                <div class="detail-value" style="color:#ff3b30;">✗ Connexion impossible après suppression</div>
            </div>
        </div>
    </div>

    <div class="card" style="border-left: 3px solid #ff9500;">
        <div class="card-title" style="color:#ff9500;">⚠️ Ce qui sera conservé (obligation légale)</div>
        <div class="detail-grid">
            <div class="detail-item">
                <div class="detail-label">Commandes & factures</div>
                <div class="detail-value">Conservées <strong>10 ans</strong> — Code de commerce Art. L.123-22</div>
            </div>
            <div class="detail-item">
                <div class="detail-label">Historique consentements</div>
                <div class="detail-value">Conservé comme preuve de conformité RGPD</div>
            </div>
        </div>
    </div>

    <div class="card">
        <div class="alert alert-warning">
            <strong>ℹ️ Traitement sous 5 jours ouvrés</strong><br>
            Votre demande sera vérifiée manuellement avant exécution.
            Vous recevrez un email de confirmation dès que votre compte aura été supprimé.
            Délai maximum légal : <strong>30 jours</strong>.
        </div>
    </div>

    <div class="card" style="border: 1px solid rgba(255,59,48,0.3);">
        <div class="card-title" style="color:#ff3b30;">Confirmer la demande</div>
        <p style="font-size:14px; color:#6e6e73; margin-bottom:20px; line-height:1.6;">
            En soumettant ce formulaire, vous demandez la suppression définitive de votre compte.
            Cette action est <strong>irréversible</strong>.
        </p>

        <form method="post" action="{{ path('account_delete_request') }}">
            <input type="hidden" name="_token" value="{{ csrf_token('account_delete_' ~ app.user.id) }}">

            <div style="display:flex;align-items:flex-start;gap:12px;margin-bottom:24px;
                        padding:16px;background:#fff5f5;border-radius:10px;
                        border:1px solid rgba(255,59,48,0.2);">
                <input type="checkbox" id="confirmCheck" required
                       style="margin-top:3px;flex-shrink:0;width:18px;height:18px;accent-color:#ff3b30;">
                <label for="confirmCheck" style="font-size:14px;color:#1d1d1f;line-height:1.5;cursor:pointer;">
                    Je comprends que cette demande entraînera la suppression irréversible de mon compte
                    et de mes données personnelles.
                </label>
            </div>

            <div class="form-actions">
                <button type="submit" id="submitBtn" disabled
                        style="background:#ff3b30;color:white;border:none;padding:14px 28px;
                               border-radius:10px;font-size:15px;font-weight:600;cursor:not-allowed;
                               opacity:0.4;transition:all 0.2s;">
                    📤 Envoyer ma demande de suppression
                </button>
                <a href="{{ path('app_account_profil') }}" class="btn btn-secondary">Annuler</a>
            </div>
        </form>
    </div>

    <p style="font-size:12px;color:#86868b;text-align:center;margin-top:4px;">
        Contact RGPD : <a href="mailto:rgpd@num-ecard.com" style="color:#667eea;">rgpd@num-ecard.com</a>
        — SAS SANAGENCY — SIREN 932 944 242
    </p>

{% endif %}

<script>
const cb = document.getElementById('confirmCheck');
const btn = document.getElementById('submitBtn');
if (cb && btn) {
    cb.addEventListener('change', function () {
        btn.disabled = !this.checked;
        btn.style.opacity = this.checked ? '1' : '0.4';
        btn.style.cursor = this.checked ? 'pointer' : 'not-allowed';
    });
}
</script>
{% endblock %}