<?php
/** @var array $patterns */
/** @var string $csrfToken */
if (!defined('APP_ROOT')) define('APP_ROOT', dirname(dirname(dirname(__DIR__))));
$bp = defined('BASE_PATH') ? BASE_PATH : '/gmind';
$flash_error = $_SESSION['flash']['error'] ?? '';
$flash_success = $_SESSION['flash']['success'] ?? '';
unset($_SESSION['flash']);
?>
<div class="container-fluid py-4">
    <div class="d-flex justify-content-between align-items-center mb-4">
        <div>
            <h2 class="mb-1">Certificate & Marksheet Patterns</h2>
            <p class="text-muted mb-0">Create reusable layouts — map once, lock, and use across all courses</p>
        </div>
        <a href="<?= $bp ?>/super-admin/patterns/create" class="btn btn-primary">
            <i class="fas fa-plus"></i> New Pattern
        </a>
    </div>

    <?php if ($flash_error): ?>
        <div class="alert alert-danger alert-dismissible fade show">
            <?= htmlspecialchars($flash_error) ?>
            <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
        </div>
    <?php endif; ?>
    <?php if ($flash_success): ?>
        <div class="alert alert-success alert-dismissible fade show">
            <?= htmlspecialchars($flash_success) ?>
            <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
        </div>
    <?php endif; ?>

    <!-- How it works -->
    <div class="card border-info mb-4">
        <div class="card-body bg-light">
            <h6 class="text-info mb-3"><i class="fas fa-info-circle"></i> How Pattern System Works</h6>
            <div class="row">
                <div class="col-md-3">
                    <div class="d-flex align-items-center mb-2">
                        <span class="badge bg-info rounded-circle me-2">1</span>
                        <strong>Create Pattern</strong>
                    </div>
                    <small class="text-muted">Click "New Pattern" to start</small>
                </div>
                <div class="col-md-3">
                    <div class="d-flex align-items-center mb-2">
                        <span class="badge bg-info rounded-circle me-2">2</span>
                        <strong>Map Fields + Preview</strong>
                    </div>
                    <small class="text-muted">Upload JPG, drag fields, click "Live Preview" to verify</small>
                </div>
                <div class="col-md-3">
                    <div class="d-flex align-items-center mb-2">
                        <span class="badge bg-info rounded-circle me-2">3</span>
                        <strong>Lock Pattern</strong>
                    </div>
                    <small class="text-muted">Once locked, it becomes reusable</small>
                </div>
                <div class="col-md-3">
                    <div class="d-flex align-items-center mb-2">
                        <span class="badge bg-info rounded-circle me-2">4</span>
                        <strong>Assign to Course</strong>
                    </div>
                    <small class="text-muted">Select pattern in course settings</small>
                </div>
            </div>
        </div>
    </div>

    <?php if (empty($patterns)): ?>
        <div class="card">
            <div class="card-body text-center py-5">
                <i class="fas fa-shapes fa-4x text-muted mb-3"></i>
                <h5 class="text-muted">No patterns yet</h5>
                <p class="text-muted">Create your first pattern to get started</p>
                <a href="<?= $bp ?>/super-admin/patterns/create" class="btn btn-primary">
                    <i class="fas fa-plus"></i> Create First Pattern
                </a>
            </div>
        </div>
    <?php else: ?>
        <div class="row">
            <?php foreach ($patterns as $p): ?>
                <?php
                $isLocked = ($p['status'] ?? '') === 'locked';
                $isDefault = (int)($p['is_default'] ?? 0) === 1;
                $hasCertBg = !empty($p['cert_background_path']);
                $hasMarksheetBg = !empty($p['marksheet_background_path']);
                ?>
                <div class="col-md-6 col-lg-4 mb-4">
                    <div class="card h-100 <?= $isLocked ? 'border-success' : 'border-warning' ?>">
                        <div class="card-header d-flex justify-content-between align-items-center">
                            <div>
                                <strong><?= htmlspecialchars($p['name']) ?></strong>
                                <?php if ($isDefault): ?>
                                    <span class="badge bg-primary ms-1">DEFAULT</span>
                                <?php endif; ?>
                            </div>
                            <?php if ($isLocked): ?>
                                <span class="badge bg-success"><i class="fas fa-lock"></i> LOCKED</span>
                            <?php else: ?>
                                <span class="badge bg-warning text-dark"><i class="fas fa-pencil"></i> DRAFT</span>
                            <?php endif; ?>
                        </div>
                        <div class="card-body">
                            <?php if (!empty($p['description'])): ?>
                                <p class="text-muted small mb-2"><?= htmlspecialchars($p['description']) ?></p>
                            <?php endif; ?>

                            <div class="row text-center mb-3">
                                <div class="col-6">
                                    <div class="border rounded p-2 <?= $hasCertBg ? 'bg-light' : 'bg-danger bg-opacity-10' ?>">
                                        <small class="d-block">Certificate BG</small>
                                        <?php if ($hasCertBg): ?>
                                            <i class="fas fa-check text-success"></i>
                                        <?php else: ?>
                                            <i class="fas fa-times text-danger"></i>
                                        <?php endif; ?>
                                    </div>
                                </div>
                                <div class="col-6">
                                    <div class="border rounded p-2 <?= $hasMarksheetBg ? 'bg-light' : 'bg-danger bg-opacity-10' ?>">
                                        <small class="d-block">Marksheet BG</small>
                                        <?php if ($hasMarksheetBg): ?>
                                            <i class="fas fa-check text-success"></i>
                                        <?php else: ?>
                                            <i class="fas fa-times text-danger"></i>
                                        <?php endif; ?>
                                    </div>
                                </div>
                            </div>

                            <div class="small text-muted mb-3">
                                <div><i class="fas fa-th me-2"></i><?= (int)($p['field_count'] ?? 0) ?> fields mapped</div>
                                <div><i class="fas fa-book me-2"></i><?= (int)($p['course_count'] ?? 0) ?> course(s) using</div>
                                <?php if (!empty($p['locked_at'])): ?>
                                    <div><i class="fas fa-clock me-2"></i>Locked: <?= date('d M Y', strtotime($p['locked_at'])) ?></div>
                                <?php endif; ?>
                            </div>

                            <div class="d-grid gap-2">
                                <a href="<?= $bp ?>/super-admin/patterns/edit/<?= $p['id'] ?>" class="btn btn-sm btn-<?= $isLocked ? 'outline-primary' : 'primary' ?>">
                                    <i class="fas fa-<?= $isLocked ? 'eye' : 'pencil' ?>"></i>
                                    <?= $isLocked ? 'View Pattern' : 'Edit & Map Fields' ?>
                                </a>

                                <div class="btn-group btn-group-sm">
                                    <a href="<?= $bp ?>/super-admin/patterns/preview/<?= $p['id'] ?>?doc_type=certificate" target="_blank" class="btn btn-outline-info">
                                        <i class="fas fa-file"></i> Cert Preview
                                    </a>
                                    <a href="<?= $bp ?>/super-admin/patterns/preview/<?= $p['id'] ?>?doc_type=marksheet" target="_blank" class="btn btn-outline-info">
                                        <i class="fas fa-file"></i> Marksheet Preview
                                    </a>
                                </div>

                                <div class="btn-group btn-group-sm">
                                    <a href="<?= $bp ?>/super-admin/patterns/clone/<?= $p['id'] ?>" class="btn btn-outline-secondary" onclick="return confirm('Clone this pattern into a new draft?')">
                                        <i class="fas fa-copy"></i> Clone
                                    </a>
                                    <?php if (!$isDefault): ?>
                                        <a href="<?= $bp ?>/super-admin/patterns/set-default/<?= $p['id'] ?>" class="btn btn-outline-primary" onclick="return confirm('Set as default pattern for new courses?')">
                                            <i class="fas fa-star"></i> Default
                                        </a>
                                    <?php endif; ?>
                                    <?php if ($isLocked): ?>
                                        <a href="<?= $bp ?>/super-admin/patterns/unlock/<?= $p['id'] ?>" class="btn btn-outline-warning" onclick="return confirm('Unlock this pattern? Existing certificates will NOT be affected.')">
                                            <i class="fas fa-unlock"></i> Unlock
                                        </a>
                                    <?php endif; ?>
                                    <?php if (!$isLocked): ?>
                                        <a href="<?= $bp ?>/super-admin/patterns/delete/<?= $p['id'] ?>" class="btn btn-outline-danger" onclick="return confirm('Delete this draft pattern? This cannot be undone.')">
                                            <i class="fas fa-trash"></i>
                                        </a>
                                    <?php endif; ?>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            <?php endforeach; ?>
        </div>
    <?php endif; ?>
</div>
