<?php helper(['letter', 'logo']); ?>
<!-- KOP SURAT -->
<table style="width: 100%; border-collapse: collapse; margin-bottom: 4px;">
    <tr>
        <td style="width: 100px; text-align: center; vertical-align: middle; padding: 0;">
            <img src="<?= getLogo('kemenag') ?>" alt="Logo Kemenag" style="width: 85px; height: auto;">
        </td>
        <td style="text-align: center; padding: 0 8px; line-height: 1.15;">
            <div style="font-family: Arial, sans-serif; font-size: 14pt; font-weight: bold; text-transform: uppercase; margin: 0;">
                KEMENTERIAN AGAMA REPUBLIK INDONESIA
            </div>
            <div style="font-family: Arial, sans-serif; font-size: 13pt; font-weight: bold; text-transform: uppercase; margin: 0;">
                <?php
                    // Support dua kemungkinan key: dari LetterController (kemenag_office)
                    // atau dari print_grid/print_report yang memakai $school langsung (letter_kemenag_office)
                    $kemenagOffice = $letterSettings['kemenag_office']
                        ?? $letterSettings['letter_kemenag_office']
                        ?? 'Kantor Kementerian Agama';
                ?>
                <?= esc($kemenagOffice) ?>
            </div>
            <div style="font-family: Arial, sans-serif; font-size: 12pt; font-weight: bold; text-transform: uppercase; margin: 0;">
                <?php
                    $schoolNameDisplay = $letterSettings['letter_school_name']
                        ?? $letterSettings['school_name']
                        ?? 'MADRASAH';
                ?>
                <?= esc($schoolNameDisplay) ?>
            </div>
            <div style="font-family: Arial, sans-serif; font-size: 11pt; margin: 0; line-height: 1.2;">
                <?= esc(format_alamat_kop($schoolSettings)) ?>
                <br>
                Telp: <?= esc($schoolSettings['phone'] ?? '-') ?> | Email: <?= esc($schoolSettings['email'] ?? '-') ?>
            </div>
        </td>
        <td style="width: 100px; text-align: center; vertical-align: middle; padding: 0;">
            <img src="<?= getLogo('sekolah') ?>" alt="Logo Madrasah" style="width: 90px; height: auto;">
        </td>
    </tr>
</table>

<!-- GARIS PEMBATAS -->
<div style="border-top: 2px solid black; margin-bottom: 12px;"></div>