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

{% block title %}Vorschau: {{ definition.label }}{% endblock %}

{% block content %}
    <div class="pb-4">
        <span class="font-bold">Betreff:</span> {{ text.subject }}
    </div>
    {# The renderer escaped everything before it added a tag, see RenderedEmailTextDto. #}
    <div class="border border-gray-200 rounded-md p-4">
        {% if text.headline is not empty %}
            <h1 class="text-xl font-bold pb-2">{{ text.headline | raw }}</h1>
        {% endif %}
        {# The paragraphs come from the mail body, where email/layout.html.twig styles every
           <p> with padding-bottom:16px - pb-4 is the same spacing, so the preview matches. #}
        <div class="[&>p]:pb-4 [&_a]:underline">
            {{ text.bodyHtml | raw }}
        </div>
        <p>
            <span class="btn inline-block">Zum Portal</span>
        </p>
    </div>
    <div class="pt-4 text-sm text-gray-500">
        Platzhalter sind als <code>[name]</code> dargestellt und werden beim Versand durch
        die echten Werte ersetzt. Logo und Fußzeile der E-Mail sind hier nicht abgebildet.
    </div>
{% endblock %}