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

{% block title %}Mise a jour de votre virement{% endblock %}

{% block content %}
    <h2>Bonjour {{ firstName }} !</h2>
    <p>Votre virement a ete mis a jour.</p>
    <table style="width:100%;border-collapse:collapse;margin:24px 0;">
        <thead>
            <tr>
                <th style="padding:8px 12px;font-weight:700;font-size:12px;color:#a1a1aa;text-align:left;text-transform:uppercase;letter-spacing:0.05em;border-bottom:2px solid #e4e4e7;">Detail</th>
                <th style="padding:8px 12px;font-weight:700;font-size:12px;color:#a1a1aa;text-align:left;text-transform:uppercase;letter-spacing:0.05em;border-bottom:2px solid #e4e4e7;">Valeur</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td style="padding:8px 12px;font-weight:700;font-size:14px;color:#18181b;border-bottom:1px solid #e4e4e7;">Reference</td>
                <td style="padding:8px 12px;font-size:14px;color:#3f3f46;border-bottom:1px solid #e4e4e7;font-family:monospace;">{{ payoutId }}</td>
            </tr>
            <tr>
                <td style="padding:8px 12px;font-weight:700;font-size:14px;color:#18181b;border-bottom:1px solid #e4e4e7;">Montant</td>
                <td style="padding:8px 12px;font-size:14px;color:#3f3f46;border-bottom:1px solid #e4e4e7;font-weight:700;">{{ amount }} {{ currency|upper }}</td>
            </tr>
            <tr>
                <td style="padding:8px 12px;font-weight:700;font-size:14px;color:#18181b;border-bottom:1px solid #e4e4e7;">Statut</td>
                <td style="padding:8px 12px;font-size:14px;border-bottom:1px solid #e4e4e7;">
                    {% if status == 'paid' %}
                        <span style="background:#d1fae5;padding:2px 8px;font-weight:700;">{{ status|upper }}</span>
                    {% elseif status == 'failed' or status == 'canceled' %}
                        <span style="background:#fee2e2;padding:2px 8px;font-weight:700;">{{ status|upper }}</span>
                    {% else %}
                        <span style="background:#fef3c7;padding:2px 8px;font-weight:700;">{{ status|upper }}</span>
                    {% endif %}
                </td>
            </tr>
            {% if arrivalDate %}
            <tr>
                <td style="padding:8px 12px;font-weight:700;font-size:14px;color:#18181b;">Date d'arrivee</td>
                <td style="padding:8px 12px;font-size:14px;color:#3f3f46;">{{ arrivalDate }}</td>
            </tr>
            {% endif %}
        </tbody>
    </table>
{% endblock %}
