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

{% block title %}Invitation organisateur - E-Ticket{% endblock %}

{% block content %}
    <h2>Vous etes invite !</h2>
    <p>Bonjour {{ invitation.firstName }},</p>
    <p>L'equipe <strong>E-Ticket by E-Cosplay</strong> vous invite a rejoindre la plateforme en tant qu'organisateur pour <strong>{{ invitation.companyName }}</strong>.</p>

    {% if invitation.offer or invitation.commissionRate is not null %}
    <div style="padding: 16px; background: #fabf04; border: 3px solid #111827; margin: 20px 0;">
        <p style="margin: 0; font-size: 14px; font-weight: 900; color: #111827; text-transform: uppercase;">
            L'equipe E-Ticket vous propose l'offre
            {% if invitation.offer == 'free' %}Gratuit{% elseif invitation.offer == 'basic' %}Basic{% elseif invitation.offer == 'custom' %}Sur-mesure{% else %}{{ invitation.offer }}{% endif %}
            {% if invitation.commissionRate is not null %}
                avec un taux de commission de {{ invitation.commissionRate }}%
            {% endif %}
        </p>
        {% if invitation.billingAmount is not null %}
        <p style="margin: 8px 0 0; font-size: 13px; font-weight: 700; color: #111827;">
            {% if invitation.billingAmount == 0 %}
                Aucun abonnement mensuel — utilisation gratuite de la plateforme.
            {% else %}
                Abonnement mensuel : <strong>{{ (invitation.billingAmount / 100)|number_format(2, ',', ' ') }} &euro;/mois</strong>
            {% endif %}
        </p>
        {% endif %}
        <p style="margin: 6px 0 0; font-size: 12px; font-weight: 700; color: #374151;">(hors frais de commission Stripe)</p>
    </div>
    {% endif %}

    {% if invitation.message %}
    <div style="padding: 16px; background: #f9fafb; border-left: 4px solid #fabf04; margin: 20px 0;">
        <p style="margin: 0; font-style: italic; color: #374151;">{{ invitation.message }}</p>
    </div>
    {% endif %}

    <p style="text-align: center; margin: 28px 0;">
        <a href="{{ viewUrl }}" class="btn">Voir l'invitation</a>
    </p>

    <div style="padding: 20px; background: #111827; color: #fff; margin: 24px 0;">
        <p style="margin: 0 0 12px; font-size: 16px; font-weight: 900; text-transform: uppercase; letter-spacing: 2px; color: #fabf04;">Decouvrir E-Ticket by E-Cosplay</p>
        <p style="margin: 0 0 8px; font-size: 14px; font-weight: 700; color: #e5e7eb;">La plateforme de billetterie en ligne qui vous permet de :</p>
        <table style="width: 100%; margin-top: 12px;">
            <tr>
                <td style="padding: 8px 0; font-size: 13px; font-weight: 700; color: #fabf04; vertical-align: top; width: 24px;">&#10003;</td>
                <td style="padding: 8px 0; font-size: 13px; font-weight: 700; color: #fff;">Creer et gerer vos evenements</td>
            </tr>
            <tr>
                <td style="padding: 8px 0; font-size: 13px; font-weight: 700; color: #fabf04; vertical-align: top;">&#10003;</td>
                <td style="padding: 8px 0; font-size: 13px; font-weight: 700; color: #fff;">Vendre des billets en ligne avec paiement securise via Stripe</td>
            </tr>
            <tr>
                <td style="padding: 8px 0; font-size: 13px; font-weight: 700; color: #fabf04; vertical-align: top;">&#10003;</td>
                <td style="padding: 8px 0; font-size: 13px; font-weight: 700; color: #fff;">Suivre vos ventes et statistiques en temps reel</td>
            </tr>
            <tr>
                <td style="padding: 8px 0; font-size: 13px; font-weight: 700; color: #fabf04; vertical-align: top;">&#10003;</td>
                <td style="padding: 8px 0; font-size: 13px; font-weight: 700; color: #fff;">Generer des billets PDF personnalises avec QR code</td>
            </tr>
            <tr>
                <td style="padding: 8px 0; font-size: 13px; font-weight: 700; color: #fabf04; vertical-align: top;">&#10003;</td>
                <td style="padding: 8px 0; font-size: 13px; font-weight: 700; color: #fff;">Envoyer des invitations et gerer vos reservations</td>
            </tr>
        </table>
    </div>

    <p style="text-align: center; font-size: 13px; color: #6b7280; margin-top: 16px;">
        Pas interesse ? <a href="{{ viewUrl }}" style="color: #6b7280; text-decoration: underline;">Repondre a l'invitation</a>
    </p>

    <p style="font-size: 11px; color: #9ca3af; margin-top: 24px;">Cette invitation a ete envoyee a {{ invitation.email }} le {{ invitation.createdAt|date('d/m/Y') }}.</p>
{% endblock %}
