{% extends "v1/base_email.html" %}

{% block subject %}Invoice Bot – Processing summary{% endblock %}
{% block header_subtitle %}Processing summary{% endblock %}
{% block tag_text %}Summary{% endblock %}

{% block content %}
<!-- Intro -->
<p style="margin:0 0 14px 0;font-size:14px;line-height:1.5;color: {{ text_color }};">
    {{ intro_html | safe }}
</p>

{% if show_stats %}
<!-- Stats: 2 cajas lado a lado -->
<table role="presentation" width="100%" cellspacing="0" cellpadding="0" border="0" style="margin:0 0 18px 0;">
    <tr>
        <td width="50%" style="padding-right:4px;">
            <div style="background-color: {{ stat_bg }};border-radius:12px;padding:10px 12px;">
                <div style="font-size:11px;color: {{ secondary_text }};">Processed OK</div>
                <div style="font-size:18px;font-weight:600;color: {{ success_color }};">{{ n_ok }}</div>
            </div>
        </td>
        <td width="50%" style="padding-left:4px;">
            <div style="background-color: {{ stat_bg }};border-radius:12px;padding:10px 12px;">
                <div style="font-size:11px;color: {{ secondary_text }};">With errors</div>
                <div style="font-size:18px;font-weight:600;color: {{ error_color }};">{{ n_err }}</div>
            </div>
        </td>
    </tr>
</table>
{% endif %}

<!-- Título de tabla -->
<div style="font-size:13px;font-weight:600;margin:0 0 6px 0;color: {{ text_color }};">
    Per-invoice details
</div>

<!-- Tabla de detalles -->
<table width="100%" cellpadding="0" cellspacing="0" border="0" style="border-collapse:collapse;font-size:12px;">
    <thead>
        <tr>
            <th align="left" style="padding:6px 8px;border-bottom:1px solid {{ border_color }};
                   background-color: {{ table_header_bg }};color: {{ text_color }};font-weight:600;">
                #
            </th>
            <th align="left" style="padding:6px 8px;border-bottom:1px solid {{ border_color }};
                   background-color: {{ table_header_bg }};color: {{ text_color }};font-weight:600;">
                File
            </th>
            <th align="left" style="padding:6px 8px;border-bottom:1px solid {{ border_color }};
                   background-color: {{ table_header_bg }};color: {{ text_color }};font-weight:600;">
                Status
            </th>
            <th align="left" style="padding:6px 8px;border-bottom:1px solid {{ border_color }};
                   background-color: {{ table_header_bg }};color: {{ text_color }};font-weight:600;">
                Details
            </th>
        </tr>
    </thead>
    <tbody>
        {% for r in results_view %}
        <tr>
            <td valign="top"
                style="padding:6px 8px;border-bottom:1px solid {{ border_color }};color: {{ text_color }};">
                {{ r.index }}
            </td>
            <td valign="top"
                style="padding:6px 8px;border-bottom:1px solid {{ border_color }};color: {{ text_color }};">
                {{ r.filename }}
            </td>
            <td valign="top" style="padding:6px 8px;border-bottom:1px solid {{ border_color }};">
                {% if r.status == "Processed" %}
                <span style="display:inline-block;padding:2px 8px;border-radius:8px;
                       background-color: {{ stat_bg }};color: {{ success_color }};font-size:11px;">
                    {{ r.status }}
                </span>
                {% else %}
                <span style="display:inline-block;padding:2px 8px;border-radius:8px;
                       background-color: {{ stat_bg }};color: {{ error_color }};font-size:11px;">
                    {{ r.status }}
                </span>
                {% endif %}
            </td>
            <td valign="top"
                style="padding:6px 8px;border-bottom:1px solid {{ border_color }};color: {{ text_color }};">
                {% if r.details %}
                {% for line in r.details %}
                {{ line | safe }}{% if not loop.last %}<br />{% endif %}
                {% endfor %}
                {% else %}
                –
                {% endif %}
            </td>
        </tr>
        {% endfor %}
    </tbody>
</table>

<!-- Nota al final -->
<p style="margin:14px 0 0 0;font-size:12px;line-height:1.6;color: {{ secondary_text }};">
    {{ footer_note | safe }}
</p>
{% endblock %}