<?php
/**
 * Super Admin — Certificate Templates List (Course-wise grouped)
 *
 * Shows templates grouped by:
 *   1. Document Type (Certificate, Marksheet, ID Card, etc.)
 *   2. Course (each course can have its own certificate + marksheet)
 *
 * Encourages Super Admin to create per-course templates:
 *   - ADCA Certificate Template
 *   - ADCA Marksheet Template
 *   - DCA Certificate Template
 *   - DCA Marksheet Template
 *   - etc.
 */
$bp = defined('BASE_PATH') ? BASE_PATH : '/gmind';
$templates = $templates ?? [];
$typeFilter = $typeFilter ?? '';
$fieldKeys = $fieldKeys ?? [];

$typeLabels = [
    'certificate' => 'Certificate', 'marksheet' => 'Marksheet',
    'affiliation' => 'Affiliation', 'authorization' => 'Authorization',
    'renewal' => 'Renewal Letter', 'franchise_agreement' => 'Franchise Agreement',
    'id_card' => 'ID Card', 'admit_card' => 'Admit Card',
];
$typeColors = [
    'certificate' => '#6c3fe8', 'marksheet' => '#27ae60', 'affiliation' => '#f39c12',
    'authorization' => '#e84118', 'renewal' => '#3498db', 'franchise_agreement' => '#9b59b6',
    'id_card' => '#16a085', 'admit_card' => '#d35400',
];

// Group templates by course
$grouped = [];
foreach ($templates as $t) {
    $courseName = $t['course_name'] ?? 'All Courses (Generic)';
    $grouped[$courseName][] = $t;
}
?>
<div class="admin-section">
    <div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:12px;">
        <form method="GET" action="<?= $bp ?>/super-admin/certificate-templates" style="display:flex;gap:8px;align-items:center;">
            <select name="type" onchange="this.form.submit()" style="padding:8px 12px;border:1px solid #ddd;border-radius:6px;font-size:0.85rem;">
                <option value="">All Types</option>
                <?php foreach ($typeLabels as $val => $label): ?>
                    <option value="<?= $val ?>" <?= $typeFilter === $val ? 'selected' : '' ?>><?= $label ?></option>
                <?php endforeach; ?>
            </select>
        </form>
        <a href="<?= $bp ?>/super-admin/certificate-templates/create" class="admin-btn admin-btn-primary" style="background:#27ae60;color:#fff;text-decoration:none;padding:10px 20px;border-radius:8px;font-size:0.88rem;font-weight:600;">+ New Template</a>
    </div>

    <!-- Info banner -->
    <div style="background:#eaf0fb;border-left:4px solid #6c3fe8;padding:14px 18px;border-radius:6px;margin-bottom:20px;font-size:0.85rem;color:#2c1e4a;">
        <strong>📋 Course-wise Templates:</strong> Each course should have its own Certificate AND Marksheet template.
        Example: ADCA needs 2 templates (ADCA Certificate + ADCA Marksheet). Generic templates (no course linked) apply to all courses.
    </div>

    <?php if (empty($templates)): ?>
        <div style="text-align:center;padding:60px 20px;color:#999;background:#fff;border-radius:12px;box-shadow:0 2px 8px rgba(0,0,0,0.06);">
            <p style="font-size:16px;margin:0 0 6px;">No templates found</p>
            <p style="font-size:13px;margin:0;">Upload a JPG template to get started. Each course needs a certificate + marksheet template.</p>
        </div>
    <?php else: ?>
        <?php foreach ($grouped as $courseName => $courseTemplates): ?>
        <!-- Course Group -->
        <div style="margin-bottom:24px;">
            <h3 style="font-family:'Poppins',sans-serif;font-size:1rem;color:#2c1e4a;margin:0 0 12px;padding-bottom:6px;border-bottom:2px solid #eaf0fb;">
                📚 <?= htmlspecialchars($courseName, ENT_QUOTES, 'UTF-8') ?>
                <span style="font-size:0.78rem;color:#999;font-weight:400;margin-left:6px;"><?= count($courseTemplates) ?> template(s)</span>
            </h3>
            <div style="display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px;">
                <?php foreach ($courseTemplates as $t): ?>
                <a href="<?= $bp ?>/super-admin/certificate-templates/<?= (int) $t['id'] ?>" style="background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 2px 8px rgba(0,0,0,0.08);text-decoration:none;color:inherit;transition:transform 0.2s,box-shadow 0.2s;" onmouseover="this.style.transform='translateY(-3px)';this.style.boxShadow='0 6px 20px rgba(0,0,0,0.12)'" onmouseout="this.style.transform='';this.style.boxShadow='0 2px 8px rgba(0,0,0,0.08)'">
                    <div style="height:160px;background:#f0f0f0;position:relative;overflow:hidden;">
                        <?php if (!empty($t['background_image'])): ?>
                            <img src="<?= $bp ?>/<?= htmlspecialchars($t['background_image'], ENT_QUOTES, 'UTF-8') ?>" alt="" style="width:100%;height:100%;object-fit:cover;">
                        <?php else: ?>
                            <div style="display:flex;align-items:center;justify-content:center;height:100%;color:#bbb;font-size:0.85rem;">No image</div>
                        <?php endif; ?>
                        <span style="position:absolute;top:8px;left:8px;background:<?= $typeColors[$t['type']] ?? '#999' ?>;color:#fff;padding:3px 10px;border-radius:4px;font-size:0.72rem;font-weight:600;"><?= htmlspecialchars($typeLabels[$t['type']] ?? $t['type'], ENT_QUOTES, 'UTF-8') ?></span>
                        <?php if (!$t['is_active']): ?>
                            <span style="position:absolute;top:8px;right:8px;background:#999;color:#fff;padding:3px 10px;border-radius:4px;font-size:0.72rem;font-weight:600;">Inactive</span>
                        <?php endif; ?>
                    </div>
                    <div style="padding:12px;">
                        <div style="font-weight:600;color:#2c1e4a;font-size:0.86rem;margin-bottom:4px;"><?= htmlspecialchars($t['name'], ENT_QUOTES, 'UTF-8') ?></div>
                        <div style="font-size:0.72rem;color:#999;display:flex;justify-content:space-between;">
                            <span><?= (int) ($t['field_count'] ?? 0) ?> fields mapped</span>
                            <span><?= (int) ($t['template_width'] ?? 0) ?>×<?= (int) ($t['template_height'] ?? 0) ?>pt</span>
                        </div>
                        <?php if (($t['field_count'] ?? 0) == 0): ?>
                            <div style="font-size:0.7rem;color:#e84118;margin-top:4px;">⚠ No fields mapped yet</div>
                        <?php elseif (($t['field_count'] ?? 0) < 3): ?>
                            <div style="font-size:0.7rem;color:#f39c12;margin-top:4px;">⚠ Needs more fields</div>
                        <?php else: ?>
                            <div style="font-size:0.7rem;color:#27ae60;margin-top:4px;">✓ Ready to use</div>
                        <?php endif; ?>
                    </div>
                </a>
                <?php endforeach; ?>

                <!-- "Add template for this course" card -->
                <a href="<?= $bp ?>/super-admin/certificate-templates/create" style="background:#f9f9f9;border:2px dashed #ddd;border-radius:12px;display:flex;align-items:center;justify-content:center;text-decoration:none;color:#999;min-height:200px;transition:all 0.2s;" onmouseover="this.style.borderColor='#6c3fe8';this.style.color='#6c3fe8';this.style.background='#f0f6ff'" onmouseout="this.style.borderColor='#ddd';this.style.color='#999';this.style.background='#f9f9f9'">
                    <div style="text-align:center;">
                        <div style="font-size:2rem;">+</div>
                        <div style="font-size:0.82rem;font-weight:600;margin-top:4px;">Add template for<br><?= htmlspecialchars($courseName, ENT_QUOTES, 'UTF-8') ?></div>
                    </div>
                </a>
            </div>
        </div>
        <?php endforeach; ?>
    <?php endif; ?>
</div>
