<?php
// Set flag to hide footer
$hideFooter = false;
?>
<div class="container-fluid">
    <div class="row">
        <div class="col-12">
            <div class="d-flex justify-content-between align-items-center mb-4">
                <h2>
                    <i class="fas fa-check-circle me-2" style="color: var(--nis-primary);"></i>
                    Approved Applications
                </h2>
                <div>
                    <a href="<?= APP_URL ?>/migrants/search" class="btn btn-outline-secondary me-2">
                        <i class="fas fa-search"></i> Search
                    </a>
                    <a href="<?= APP_URL ?>/pending" class="btn btn-outline-warning">
                        <i class="fas fa-clock"></i> Pending
                    </a>
                    <a href="<?= APP_URL ?>/rejected" class="btn btn-outline-danger">
                        <i class="fas fa-times-circle"></i> Rejected
                    </a>
                </div>
            </div>
        </div>
    </div>
    
    <!-- Statistics Cards -->
    <div class="row mb-4">
        <div class="col-md-3">
            <div class="stat-card" style="background: linear-gradient(135deg, #28a745 0%, #20c997 100%);">
                <div class="d-flex justify-content-between align-items-center">
                    <div>
                        <div class="stat-value"><?= count($applications) ?></div>
                        <div class="stat-label">Total Approved</div>
                    </div>
                    <div class="stat-icon">
                        <i class="fas fa-check-circle"></i>
                    </div>
                </div>
            </div>
        </div>
    </div>
    
    <!-- Approved Applications List -->
    <div class="card">
        <div class="card-header">
            <i class="fas fa-list"></i> Approved Applications List
        </div>
        <div class="card-body">
            <?php if (empty($applications)): ?>
                <div class="text-center py-5">
                    <i class="fas fa-clock fa-4x text-muted mb-3"></i>
                    <h4>No Approved Applications</h4>
                    <p class="text-muted">There are no approved applications to display.</p>
                    <a href="<?= APP_URL ?>/pending" class="btn btn-nis mt-2">
                        <i class="fas fa-clock me-2"></i> View Pending Applications
                    </a>
                </div>
            <?php else: ?>
                <div class="table-responsive">
                    <table class="table table-hover">
                        <thead>
                            <tr>
                                <th>Person ID</th>
                                <th>Name</th>
                                <th>Document No</th>
                                <th>Nationality</th>
                                <th>Approved Date</th>
                                <th>Approved By</th>
                                <th>Action</th>
                            </tr>
                        </thead>
                        <tbody>
                            <?php foreach ($applications as $app): ?>
                            <tr>
                                <td><code><?= htmlspecialchars($app['person_id']) ?></code></td>
                                <td>
                                    <strong><?= htmlspecialchars($app['surname'] ?? '') ?></strong>, 
                                    <?= htmlspecialchars($app['given_name'] ?? '') ?>
                                </td>
                                <td><?= htmlspecialchars($app['document_no'] ?? '') ?></td>
                                <td><?= htmlspecialchars($app['nationality'] ?? '') ?></td>
                                <td>
                                    <span class="badge bg-success">
                                        <i class="fas fa-calendar-alt me-1"></i>
                                        <?= date('d/m/Y H:i', strtotime($app['updated_at'] ?? $app['created_at'])) ?>
                                    </span>
                                </td>
                                <td>
                                    <?php
                                    $reviewerName = 'System';
                                    if (!empty($app['reviewer_name'])) {
                                        $reviewerName = $app['reviewer_name'];
                                    }
                                    ?>
                                    <span class="badge bg-info">
                                        <i class="fas fa-user me-1"></i>
                                        <?= htmlspecialchars($reviewerName) ?>
                                    </span>
                                </td>
                                <td>
                                    <a href="<?= APP_URL ?>/migrants/<?= urlencode($app['person_id']) ?>" 
                                       class="btn btn-sm btn-outline-success">
                                        <i class="fas fa-eye"></i> View
                                    </a>
                                </td>
                            </tr>
                            <?php endforeach; ?>
                        </tbody>
                    </table>
                </div>
            <?php endif; ?>
        </div>
    </div>
</div>

<style>
.stat-card {
    color: white;
    border-radius: 15px;
    padding: 20px;
    height: 100%;
}

.stat-card .stat-value {
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.2;
}

.stat-card .stat-icon {
    font-size: 2.5rem;
    opacity: 0.3;
}
</style>