{% extends 'base.html.twig' %}

{% block title %}Mon espace — CARTECADEAU{% endblock %}

{% block body %}
<section class="container admin-shell">
    <div class="catalog-headline">
        <p class="kicker">Espace Utilisateur</p>
        <h1>Bonjour, <span class="accent">{{ app.user.userIdentifier }}</span></h1>
        <p>Gerez votre profil, suivez vos achats et accedez rapidement au catalogue.</p>
    </div>

    <div class="grid">
        <div class="card account-orders-card">
            <h3>Mes commandes</h3>
            <form method="get" action="{{ path('app_account') }}" class="catalog-search account-order-filters" style="margin-bottom:16px;">
                <input type="search" name="order_q" value="{{ orderSearch }}" placeholder="Rechercher une reference...">
                <select name="status">
                    <option value="all" {{ orderStatus == 'all' ? 'selected' : '' }}>Tous les statuts</option>
                    <option value="pending_payment" {{ orderStatus == 'pending_payment' ? 'selected' : '' }}>En attente paiement</option>
                    <option value="paid" {{ orderStatus == 'paid' ? 'selected' : '' }}>Payees</option>
                    <option value="fulfilling" {{ orderStatus == 'fulfilling' ? 'selected' : '' }}>En livraison</option>
                    <option value="fulfilled" {{ orderStatus == 'fulfilled' ? 'selected' : '' }}>Livrees</option>
                    <option value="payment_failed" {{ orderStatus == 'payment_failed' ? 'selected' : '' }}>Paiement echoue</option>
                    <option value="fulfillment_failed" {{ orderStatus == 'fulfillment_failed' ? 'selected' : '' }}>Livraison echouee</option>
                </select>
                <select name="period">
                    <option value="0" {{ orderPeriod == 0 ? 'selected' : '' }}>Toute periode</option>
                    <option value="7" {{ orderPeriod == 7 ? 'selected' : '' }}>7 jours</option>
                    <option value="30" {{ orderPeriod == 30 ? 'selected' : '' }}>30 jours</option>
                    <option value="90" {{ orderPeriod == 90 ? 'selected' : '' }}>90 jours</option>
                </select>
                <button type="submit" class="btn">Filtrer</button>
                {% if orderSearch or orderStatus != 'all' or orderPeriod != 0 %}
                    <a href="{{ path('app_account') }}" class="chip">Reinitialiser</a>
                {% endif %}
            </form>
            {% if orders is empty %}
                <p>Aucune commande pour le moment.</p>
            {% else %}
                <ul class="order-list">
                    {% for order in orders %}
                        <li>
                            <a href="{{ path('app_account_order', {reference: order.reference}) }}">
                                <strong>{{ order.reference }}</strong>
                                <span class="meta">{{ order.totalXof|number_format(0, ',', ' ') }} XOF · {{ order.status == 'fulfilled' ? 'Voir mes codes →' : order.status }}</span>
                            </a>
                        </li>
                    {% endfor %}
                </ul>
            {% endif %}
        </div>
        <div class="card">
            <h3>Mes points</h3>
            <p><strong>{{ app.user.pointsBalance }}</strong> points disponibles.</p>
            {% if pointsTransactions is not empty %}
                <ul>
                    {% for tx in pointsTransactions %}
                        <li>{{ tx.description }} : +{{ tx.points }} pts</li>
                    {% endfor %}
                </ul>
            {% endif %}
        </div>
        <div class="card">
            <h3>Parrainage</h3>
            <p>Votre code: <strong>{{ app.user.referralCode ?: 'N/A' }}</strong></p>
            <p class="meta">Partagez ce lien: {{ referralLink }}</p>
        </div>
        <div class="card">
            <h3>Acheter</h3>
            <p>Parcourez le catalogue de cartes-cadeaux et de recharges.</p>
            <p style="margin-top:16px"><a href="{{ path('app_catalog_index') }}" class="btn">Voir le catalogue</a></p>
        </div>
        <div class="card">
            <h3>Mon profil</h3>
            <p>Mettez a jour votre email et les informations de votre compte.</p>
            <p style="margin-top:16px"><a href="{{ path('app_account_profile') }}" class="btn btn-ghost">Modifier mon profil</a></p>
        </div>
        {% if isAdmin %}
        <div class="card">
            <h3>Acces admin</h3>
            <p>Vous etes administrateur: ouvrez les reglages de tarification.</p>
            <p style="margin-top:16px"><a href="{{ path('app_admin_pricing') }}" class="btn">Parametrage admin</a></p>
        </div>
        {% endif %}
    </div>
</section>
{% endblock %}