<!DOCTYPE html>
<html lang="id">
<head>
    <?php helper('logo'); ?>
    <link rel="icon" type="image/png" href="<?= getLogo('sekolah') ?>">
<meta charset="UTF-8">
<title>Cetak Tata Tertib Peserta Asesmen</title>
<style>
* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

body {
    font-family: Arial, sans-serif;
    background: #e2e8f0;
    padding: 20px;
}

/* Preview Header */
.preview-header {
    background: #1e293b;
    color: white;
    padding: 12px 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-radius: 8px;
    margin-bottom: 20px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    position: sticky;
    top: 10px;
    z-index: 100;
}
.preview-header h2 {
    font-size: 1.1rem;
    margin: 0;
}
.preview-header p {
    font-size: 0.8rem;
    opacity: 0.8;
    margin-top: 4px;
}
.btn-back {
    background: #475569;
    color: white;
    border: none;
    padding: 8px 16px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.8rem;
    margin-right: 8px;
}
.btn-print {
    background: #0ea5e9;
    color: white;
    border: none;
    padding: 8px 20px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.8rem;
    font-weight: bold;
}

/* Page Setup: A4 Portrait */
@page {
    size: A4 portrait;
    margin: 0;
}

.a4-sheet {
    width: 210mm;
    height: 297mm;
    background: white;
    position: relative;
    margin: 0 auto 20px;
    padding: 12mm 15mm;
    box-shadow: 0 4px 10px rgba(0,0,0,0.15);
    display: flex;
    flex-direction: column;
    line-height: 1.6;
    font-size: 9.8pt;
}

.page-title {
    text-align: center;
    font-size: 12pt;
    font-weight: bold;
    text-transform: uppercase;
    margin-top: 2mm;
    margin-bottom: 5mm;
    text-decoration: underline;
    letter-spacing: 0.5px;
}

/* Rules list styling */
.rules-ol {
    margin-left: 6mm;
    margin-bottom: 6mm;
    text-align: justify;
}
.rules-ol li {
    margin-bottom: 2mm;
    padding-left: 1mm;
}

/* Footer Signature */
.footer-area {
    display: flex;
    justify-content: flex-end;
    margin-top: 10mm;
    padding-top: 6mm;
}
.sig-box {
    text-align: center;
    width: 60mm;
}
.sig-space {
    height: 18mm;
}
.sig-name {
    font-weight: bold;
    text-decoration: underline;
}

/* Print Overrides */
@media print {
    body {
        background: white;
        padding: 0;
        margin: 0;
    }
    .preview-header {
        display: none !important;
    }
    .a4-sheet {
        margin: 0;
        box-shadow: none;
        page-break-after: avoid;
    }
    * {
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }
}
</style>
</head>
<body>

<div class="preview-header">
    <div>
        <h2>📋 Cetak Tata Tertib Peserta</h2>
        <p>Tempelan Informasi Asesmen &nbsp;·&nbsp; Kertas A4 Portrait</p>
    </div>
    <div>
        <button class="btn-back" onclick="window.history.back()">← Kembali</button>
        <button class="btn-print" onclick="window.print()">🖨 Cetak / Simpan PDF</button>
    </div>
</div>

<div class="a4-sheet">
    <!-- Official Kop -->
    <?= view('letter/_kop', ['letterSettings' => $letterSettings, 'schoolSettings' => $schoolSettings]) ?>

    <div class="page-title">TATA TERTIB PESERTA ASESMEN</div>

    <ol class="rules-ol">
        <?php 
        $rulesText = $event['student_rules'] ?? '';
        if (!empty(trim($rulesText))) {
            $rulesArray = array_filter(array_map('trim', explode("\n", $rulesText)));
            foreach ($rulesArray as $r) {
                $rClean = preg_replace('/^\d+\.\s*/', '', $r);
                if (!empty($rClean)) {
                    echo "<li>" . $rClean . "</li>";
                }
            }
        } else {
            $defaultRules = [
                "Peserta hadir paling lambat 15 menit sebelum asesmen dimulai.",
                "Peserta wajib mengenakan seragam sesuai ketentuan madrasah/sekolah dan berpenampilan rapi serta sopan.",
                "Peserta menempati tempat duduk sesuai nomor yang telah ditentukan.",
                "Peserta wajib membawa kartu peserta atau identitas yang ditetapkan oleh madrasah/sekolah.",
                "Peserta hanya diperbolehkan membawa alat tulis dan perlengkapan yang diperlukan untuk asesmen.",
                "Peserta dilarang membawa atau menggunakan buku, catatan, telepon genggam, smartwatch, kamera, atau alat komunikasi lainnya selama asesmen berlangsung, kecuali atas izin panitia.",
                "Peserta wajib mengisi daftar hadir dan identitas pada lembar jawaban atau sistem asesmen yang digunakan.",
                "Peserta mulai mengerjakan soal setelah mendapat instruksi dari pengawas.",
                "Peserta wajib mengerjakan soal secara mandiri, jujur, dan bertanggung jawab.",
                "Peserta dilarang bekerja sama, memberi atau menerima bantuan, serta melakukan segala bentuk kecurangan.",
                "Peserta yang mengalami kendala teknis atau memerlukan bantuan harus melapor kepada pengawas dengan tertib.",
                "Peserta yang hendak meninggalkan ruang asesmen harus memperoleh izin dari pengawas.",
                "Peserta berhenti mengerjakan soal setelah ada instruksi dari pengawas.",
                "Peserta wajib menyerahkan lembar jawaban atau memastikan jawaban telah tersimpan dan terkirim sebelum meninggalkan ruang asesmen.",
                "Peserta yang melanggar tata tertib akan dikenakan sanksi sesuai ketentuan yang berlaku di madrasah/sekolah."
            ];
            foreach ($defaultRules as $r) {
                echo "<li>" . $r . "</li>";
            }
        }
        ?>
    </ol>

    <!-- Footer Signature -->
    <div class="footer-area">
        <div class="sig-box">
            <?php
            $cityName = ucwords(strtolower($schoolSettings['city'] ?? 'Wonogiri'));
            $months = [
                1 => 'Januari', 2 => 'Februari', 3 => 'Maret', 4 => 'April', 5 => 'Mei', 6 => 'Juni',
                7 => 'Juli', 8 => 'Agustus', 9 => 'September', 10 => 'Oktober', 11 => 'November', 12 => 'Desember'
            ];
            $start_time = strtotime($event['start_date']);
            $day = date('d', $start_time);
            $month_num = (int)date('m', $start_time);
            $year = date('Y', $start_time);
            $indonesian_date = $day . ' ' . $months[$month_num] . ' ' . $year;
            ?>
            <div><?= esc($cityName) ?>, <?= esc($indonesian_date) ?></div>
            <div>
                <?php 
                $schoolName = $schoolSettings['school_name'] ?? '';
                if (stripos($schoolName, 'Madrasah') !== false || stripos($schoolName, 'MTs') !== false || stripos($schoolName, 'MA') !== false || stripos($schoolName, 'MI') !== false) {
                    echo 'Kepala Madrasah,';
                } else {
                    echo 'Kepala Sekolah,';
                }
                ?>
            </div>
            <div class="sig-space"></div>
            <div class="sig-name"><?= esc($schoolSettings['principal_name'] ?? '') ?></div>
            <div>NIP. <?= esc($schoolSettings['principal_nip'] ?? '-') ?></div>
        </div>
    </div>
</div>

</body>
</html>
