{#
    Consent sheet (single declaration) exported to PDF via mPDF.

    Constraints worth remembering before touching this file:
      - mPDF has NO flexbox/grid. Every two-column layout below is a <table>.
      - The embedded Roboto has no ✓/✗ glyphs, so the decision "checkboxes"
        are filled/empty CSS boxes, not characters.
      - Running header/footer use mPDF's named <htmlpageheader>/<htmlpagefooter>
        referenced from @page; {PAGENO}/{nbpg}/{DATE} are mPDF placeholders.
#}
{% set cf = consent.consentForm %}
{% set subject = cf ? cf.subject : null %}
{% set doctypeLabel = {
    account: 'Konto-Einwilligung',
    participant: 'Teilnehmer-Einwilligung',
    host: 'Veranstalter-Einwilligung',
}[subject] ?? 'Einwilligung' %}
{% set title = (cf and cf.title) ? cf.title : 'Einwilligungserklärung' %}
{% set scope = consent.offer ? consent.offer.name : (consent.edition ? consent.edition.name : null) %}
{% set edition = consent.edition ? consent.edition.name : null %}
{% set contextLine = (scope and edition and scope != edition) ? scope ~ ' · ' ~ edition : (scope ?? edition) %}
{% set signee = consent.signedBy ?: (consent.user ? consent.user.name : null) %}
{% set participantName = consent.participant ? (consent.participant.firstname ~ ' ' ~ consent.participant.lastname)|trim : null %}
{% set agreed = consent.decision == 1 %}
{% set signedDate = consent.signedAt ?? consent.createdAt %}
{% set text = consent.consentText.text ?? (cf ? cf.text : null) %}

<style>
    @page {
        /* Do NOT set `size` here: combined with named html headers/footers it
           collapses mPDF's content height and explodes the doc to 1000+ pages.
           A4 is mPDF's default format anyway. */
        margin: 28mm 18mm 24mm 18mm;
        margin-header: 12mm;
        margin-footer: 12mm;
        header: html_docHeader;
        footer: html_docFooter;
    }
    /* Page 1 carries the full masthead, so suppress the slim running header there
       (it would just duplicate the edition); it still shows on overflow pages. */
    @page :first {
        header: html_blankHeader;
        footer: html_docFooter;
    }

    body {
        font-family: roboto, sans-serif;
        font-size: 10.5pt;
        line-height: 1.6;
        color: #1a1a18;
    }

    /* running header / footer */
    .runhead td { font-size: 8pt; color: #8f8d85; padding-bottom: 5px; border-bottom: 0.5px solid #eae8e2; }
    .runfoot td { font-size: 8pt; color: #8f8d85; padding-top: 5px; border-top: 0.5px solid #eae8e2; }
    .runfoot b { color: #64635d; }

    /* masthead */
    .mast td { vertical-align: top; }
    .brand-name { font-family: roboto-medium; font-size: 13pt; color: #1a1a18; }
    .brand-sub { font-size: 8.5pt; color: #8f8d85; padding-top: 1px; }
    .doctype { font-family: roboto-medium; font-size: 9.5pt; color: #64635d; }

    /* title block */
    .title { font-family: roboto-medium; font-size: 19pt; line-height: 1.2; margin: 26px 0 0; }
    .subtitle { font-size: 10.5pt; color: #64635d; margin: 6px 0 0; }

    /* identification line */
    .ident { border-top: 1px solid #dcdad4; border-bottom: 1px solid #dcdad4; margin: 22px 0; padding: 13px 0; color: #64635d; }
    .ident b { font-family: roboto-medium; color: #1a1a18; }

    /* revocation banner */
    .notice-revoked {
        margin: 0 0 22px; padding: 12px 14px; border: 1px solid #e7c9c9; border-radius: 6px;
        background: #fbf1f1; color: #8a3b3b; font-size: 9.5pt; line-height: 1.5;
    }
    .notice-revoked b { font-family: roboto-medium; color: #7a2e2e; }

    /* section heading */
    .shead { font-family: roboto-medium; font-size: 11.5pt; margin: 26px 0 11px; }

    /* declaration body (rendered from markdown) */
    .prose p { margin: 0 0 11px; color: #43423e; }
    .prose p:last-child { margin-bottom: 0; }
    .prose ul, .prose ol { margin: 0 0 11px; padding-left: 18px; color: #43423e; }
    .prose li { margin: 0 0 4px; }
    .prose strong, .prose b { font-family: roboto-medium; color: #1a1a18; }
    .prose h1, .prose h2, .prose h3, .prose h4 { font-family: roboto-medium; font-size: 11pt; margin: 14px 0 6px; color: #1a1a18; }
    .prose a { color: #1a1a18; }

    /* decision */
    .decision { border: 1px solid #dcdad4; margin-bottom: 26px; }
    .opts td { padding: 13px 16px; vertical-align: middle; }
    .opts tr.line td { border-top: 1px solid #eae8e2; }
    .opts tr.chosen td { background: #f7f6f3; }
    .opts .c-box { width: 26px; padding-right: 0; }
    .opts .c-tag { width: 90px; text-align: right; font-size: 8.5pt; color: #8f8d85; }
    .opts tr.chosen .c-tag { color: #64635d; }
    .opts .c-lab { color: #8f8d85; }
    .opts tr.chosen .c-lab { font-family: roboto-medium; color: #1a1a18; }
    /* Checkbox as a nested 1x1 table: a block <div> with a fixed width collapses
       to content-width inside a cell in mPDF, but a table cell keeps its
       dimensions. The &nbsp; stops the cell collapsing vertically. */
    table.cb { border-collapse: collapse; }
    .cb td { width: 16px; height: 16px; border: 1px solid #cbc9c2; font-size: 1pt; line-height: 16px; }
    .cb td.on { background: #1a1a18; border-color: #1a1a18; }

    /* signature */
    .sig td { vertical-align: bottom; }
    .sline { border-bottom: 1px solid #1a1a18; padding: 18px 2px 5px; font-family: roboto-medium; font-size: 11pt; }
    .cap { font-size: 8pt; color: #8f8d85; padding-top: 6px; }

    /* attestation */
    .attest {
        margin-top: 22px; padding: 12px 14px; border: 1px solid #dcdad4; border-radius: 6px;
        background: #f7f6f3; font-size: 8.5pt; line-height: 1.55; color: #64635d;
    }
    .attest b { font-family: roboto-medium; color: #43423e; }
</style>

<htmlpageheader name="blankHeader" style="display:none"></htmlpageheader>

<htmlpageheader name="docHeader" style="display:none">
    <table width="100%" class="runhead">
        <tr>
            <td align="left">{{ contextLine ?? 'Ferienpass' }}</td>
            <td align="right">Einwilligungserklärung</td>
        </tr>
    </table>
</htmlpageheader>

<htmlpagefooter name="docFooter" style="display:none">
    <table width="100%" class="runfoot">
        <tr>
            <td align="left">Dokument-ID <b>einwilligung-{{ consent.id }}</b></td>
            <td align="right">Export {DATE d.m.Y H:i} Uhr · Seite {PAGENO}/{nbpg}</td>
        </tr>
    </table>
</htmlpagefooter>

<table width="100%" class="mast">
    <tr>
        <td align="left">
            <div class="brand-name">Ferienpass</div>
            {% if edition %}<div class="brand-sub">{{ edition }}</div>{% endif %}
        </td>
        <td align="right">
            <div class="doctype">{{ doctypeLabel }}</div>
        </td>
    </tr>
</table>

<h1 class="title">{{ title }}</h1>
{% if contextLine %}<p class="subtitle">{{ contextLine }}</p>{% endif %}

<div class="ident">
    {%- if participantName -%}
        Erklärung im Namen von <b>{{ participantName }}</b>{% if signee %}, abgegeben von <b>{{ signee }}</b>{% endif %}.
    {%- elseif subject == 'host' -%}
        Erklärung als Veranstalter*in{% if signee %} für das Konto <b>{{ signee }}</b>{% endif %}.
    {%- else -%}
        Erklärung für das Konto <b>{{ signee ?? '—' }}</b>.
    {%- endif -%}
</div>

{% if consent.revoked %}
    <div class="notice-revoked">
        <b>Widerrufen.</b> Diese Einwilligung wurde am {{ consent.revokedAt|date('d.m.Y') }} um {{ consent.revokedAt|date('H:i') }} Uhr widerrufen und ist nicht mehr gültig.
    </div>
{% endif %}

<h2 class="shead">Erklärung</h2>
<div class="prose">{{ text|markdown_to_html }}</div>

<h2 class="shead">Entscheidung</h2>
<div class="decision">
    <table width="100%" cellpadding="0" cellspacing="0" class="opts">
        <tr class="{{ agreed ? 'chosen' }}">
            <td class="c-box"><table class="cb"><tr><td class="{{ agreed ? 'on' }}">&nbsp;</td></tr></table></td>
            <td class="c-lab">Ich stimme zu</td>
            <td class="c-tag">{{ agreed ? 'gewählt' }}</td>
        </tr>
        <tr class="line {{ not agreed ? 'chosen' }}">
            <td class="c-box"><table class="cb"><tr><td class="{{ not agreed ? 'on' }}">&nbsp;</td></tr></table></td>
            <td class="c-lab">Ich lehne ab</td>
            <td class="c-tag">{{ not agreed ? 'gewählt' }}</td>
        </tr>
    </table>
</div>

<table width="100%" class="sig" cellpadding="0" cellspacing="0">
    <tr>
        <td width="44%">
            <div class="sline">{{ signedDate|date('d.m.Y') }} · {{ signedDate|date('H:i') }} Uhr</div>
            <div class="cap">Datum{{ agreed ? ' der Zustimmung' : ' der Entscheidung' }}</div>
        </td>
        <td width="12%"></td>
        <td width="44%">
            <div class="sline">{{ signee ?? '—' }}</div>
            <div class="cap">Unterschrift · elektronisch bestätigt</div>
        </td>
    </tr>
</table>

<div class="attest">
    Diese Einwilligung wurde elektronisch erfasst und ist ohne handschriftliche Unterschrift gültig. Erfasst am
    {{ consent.createdAt|date('d.m.Y') }} um {{ consent.createdAt|date('H:i') }} Uhr.{% if consent.hash %}
    <br><b>Prüfsumme (SHA-256):</b> {{ consent.hash|slice(0, 32) }}…{% endif %}
</div>
