{# templates/emails/security/critical_error.html.twig #}
{% extends 'emails/admin/alert.html.twig' %}

{% block title %}Erreur Critique Système{% endblock %}

{% block content %}
    <h2 style="color: #DC2626; margin: 0 0 20px 0;">
        <i class="fa fa-circle-exclamation"></i> Erreur Critique
    </h2>

    <div style="background: #FEE2E2; border: 2px solid #DC2626; padding: 15px; margin: 20px 0; border-radius: 4px;">
        <p style="margin: 0; color: #7F1D1D; font-weight: bold; font-size: 16px;">
            Une erreur critique s'est produite sur {{ system_name }}
        </p>
    </div>

    <table style="width: 100%; margin: 20px 0; border-collapse: collapse;">
        {% if data.error_message %}
            <tr style="background: #FEF2F2;">
                <td style="padding: 12px; font-weight: bold; border-bottom: 1px solid #E5E7EB; width: 30%;">Message</td>
                <td style="padding: 12px; border-bottom: 1px solid #E5E7EB;">
                    <code style="background: #FEE2E2; padding: 4px 8px; border-radius: 4px; color: #991B1B;">
                        {{ data.error_message }}
                    </code>
                </td>
            </tr>
        {% endif %}
        {% if data.error_file %}
            <tr>
                <td style="padding: 12px; font-weight: bold; border-bottom: 1px solid #E5E7EB;">Fichier</td>
                <td style="padding: 12px; border-bottom: 1px solid #E5E7EB;">
                    <code style="font-size: 12px;">{{ data.error_file }}</code>
                </td>
            </tr>
        {% endif %}
        {% if data.error_line %}
            <tr style="background: #FEF2F2;">
                <td style="padding: 12px; font-weight: bold; border-bottom: 1px solid #E5E7EB;">Ligne</td>
                <td style="padding: 12px; border-bottom: 1px solid #E5E7EB;"><strong>{{ data.error_line }}</strong></td>
            </tr>
        {% endif %}
        <tr>
            <td style="padding: 12px; font-weight: bold; border-bottom: 1px solid #E5E7EB;">Timestamp</td>
            <td style="padding: 12px; border-bottom: 1px solid #E5E7EB;">{{ formatted_timestamp }}</td>
        </tr>
    </table>

    {% if data.stack_trace %}
        <h3 style="color: #374151; margin: 30px 0 15px 0;">Stack Trace</h3>
        <div style="background: #F9FAFB; padding: 15px; border-radius: 4px; border: 1px solid #E5E7EB; max-height: 300px; overflow-y: auto;">
            <pre style="margin: 0; white-space: pre-wrap; word-wrap: break-word; font-size: 11px; color: #374151;">{{ data.stack_trace }}</pre>
        </div>
    {% endif %}
{% endblock %}