<?php
/**
 * Batches List View — Modern, Responsive
 *
 * Upload to: /gmind/branch/Views/batches/index.php
 *
 * Features:
 *   - Stats cards at top (Total, Upcoming, Running, Completed)
 *   - Responsive table with action buttons (Edit, Delete)
 *   - Status badges with color coding
 *   - Student count per batch
 *   - Course name + duration
 *   - Time range
 *   - Delete confirmation modal
 */

/** @var array $batches */
/** @var array $stats */
/** @var string $csrfToken */

$bp = defined('BASE_PATH') ? BASE_PATH : '/gmind';
$csrf = htmlspecialchars($csrfToken ?? '', ENT_QUOTES, 'UTF-8');
?>
<style>
    .batch-stats-card {
        background: #fff;
        border-radius: 12px;
        padding: 18px 22px;
        box-shadow: 0 2px 8px rgba(0,0,0,0.04);
        display: flex;
        align-items: center;
        gap: 14px;
        margin-bottom: 16px;
        transition: transform 0.15s ease, box-shadow 0.15s ease;
    }
    .batch-stats-card:hover {
        transform: translateY(-2px);
        box-shadow: 0 4px 16px rgba(0,0,0,0.08);
    }
    .batch-stats-card .stats-icon {
        width: 48px;
        height: 48px;
        border-radius: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1.3rem;
        color: #fff;
        flex-shrink: 0;
    }
    .batch-stats-card .stats-num {
        font-size: 1.5rem;
        font-weight: 700;
        color: #2c1e4a;
        line-height: 1;
    }
    .batch-stats-card .stats-label {
        font-size: 0.82rem;
        color: #667085;
        margin-top: 4px;
    }
    .batch-table-card {
        background: #fff;
        border-radius: 12px;
        padding: 24px;
        box-shadow: 0 2px 8px rgba(0,0,0,0.04);
    }
    .batch-table {
        width: 100%;
        border-collapse: collapse;
    }
    .batch-table thead th {
        background: #f8f4ff;
        color: #6c3fe8;
        font-weight: 700;
        font-size: 0.78rem;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        padding: 12px 14px;
        border-bottom: 2px solid #6c3fe8;
        white-space: nowrap;
    }
    .batch-table tbody td {
        padding: 14px;
        border-bottom: 1px solid #f1f1f1;
        vertical-align: middle;
        font-size: 0.9rem;
    }
    .batch-table tbody tr:hover { background: #faf8ff; }
    .badge-status {
        padding: 5px 12px;
        border-radius: 20px;
        font-size: 0.72rem;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        display: inline-block;
        white-space: nowrap;
    }
    .badge-upcoming  { background: #dbeafe; color: #2563eb; }
    .badge-running   { background: #dcfce7; color: #16a34a; }
    .badge-completed { background: #f3f4f6; color: #6b7280; }
    .batch-action-btn {
        padding: 6px 12px;
        border-radius: 6px;
        font-size: 0.78rem;
        font-weight: 600;
        text-decoration: none;
        display: inline-flex;
        align-items: center;
        gap: 5px;
        white-space: nowrap;
        cursor: pointer;
        border: none;
    }
    .batch-action-edit { background: #fef3c7; color: #d97706; }
    .batch-action-edit:hover { background: #fde68a; }
    .batch-action-delete { background: #fee2e2; color: #dc2626; }
    .batch-action-delete:hover { background: #fecaca; }
    .btn-create-batch {
        background: linear-gradient(135deg, #16a085, #117a65);
        color: #fff;
        padding: 10px 22px;
        border-radius: 8px;
        font-weight: 600;
        text-decoration: none;
        display: inline-flex;
        align-items: center;
        gap: 8px;
        border: none;
    }
    .btn-create-batch:hover { color: #fff; transform: translateY(-1px); box-shadow: 0 4px 12px rgba(22,160,133,0.3); }
    .empty-state {
        text-align: center;
        padding: 60px 20px;
        color: #9ca3af;
    }
    .empty-state i { font-size: 3.5rem; opacity: 0.3; margin-bottom: 16px; }
    @media (max-width: 768px) {
        .batch-table thead { display: none; }
        .batch-table, .batch-table tbody, .batch-table tr, .batch-table td { display: block; width: 100%; }
        .batch-table tr {
            margin-bottom: 12px;
            border: 1px solid #e9ecef;
            border-radius: 8px;
            padding: 8px;
            background: #fff;
        }
        .batch-table td {
            border: none;
            padding: 8px 4px;
            display: flex;
            justify-content: space-between;
            align-items: center;
            text-align: right;
        }
        .batch-table td::before {
            content: attr(data-label);
            font-weight: 700;
            color: #6c3fe8;
            text-align: left;
            padding-right: 12px;
        }
    }
</style>

<div class="container-fluid py-4">
    <!-- Header -->
    <div class="d-flex justify-content-between align-items-center mb-4 flex-wrap gap-2">
        <div>
            <h2 style="color:#0d3b3b; font-weight:700; margin:0;">
                <i class="fas fa-layer-group"></i> Batches
            </h2>
            <p class="text-muted mb-0" style="font-size:0.88rem;">
                Manage class batches, schedules, and student assignments.
            </p>
        </div>
        <a href="<?= $bp ?>/branch/batches/create" class="btn-create-batch">
            <i class="fas fa-plus"></i> Create New Batch
        </a>
    </div>

    <!-- Stats Row -->
    <div class="row">
        <div class="col-md-3 col-6">
            <div class="batch-stats-card">
                <div class="stats-icon" style="background:linear-gradient(135deg,#6c3fe8,#4a2db8);"><i class="fas fa-layer-group"></i></div>
                <div>
                    <div class="stats-num"><?= (int)($stats['total'] ?? 0) ?></div>
                    <div class="stats-label">Total Batches</div>
                </div>
            </div>
        </div>
        <div class="col-md-3 col-6">
            <div class="batch-stats-card">
                <div class="stats-icon" style="background:linear-gradient(135deg,#2563eb,#1d4ed8);"><i class="fas fa-clock"></i></div>
                <div>
                    <div class="stats-num"><?= (int)($stats['upcoming'] ?? 0) ?></div>
                    <div class="stats-label">Upcoming</div>
                </div>
            </div>
        </div>
        <div class="col-md-3 col-6">
            <div class="batch-stats-card">
                <div class="stats-icon" style="background:linear-gradient(135deg,#16a34a,#15803d);"><i class="fas fa-play-circle"></i></div>
                <div>
                    <div class="stats-num"><?= (int)($stats['running'] ?? 0) ?></div>
                    <div class="stats-label">Running</div>
                </div>
            </div>
        </div>
        <div class="col-md-3 col-6">
            <div class="batch-stats-card">
                <div class="stats-icon" style="background:linear-gradient(135deg,#6b7280,#4b5563);"><i class="fas fa-check-circle"></i></div>
                <div>
                    <div class="stats-num"><?= (int)($stats['completed'] ?? 0) ?></div>
                    <div class="stats-label">Completed</div>
                </div>
            </div>
        </div>
    </div>

    <!-- Batches Table -->
    <div class="batch-table-card">
        <div class="table-responsive">
            <table class="batch-table">
                <thead>
                    <tr>
                        <th>#</th>
                        <th>Batch Name</th>
                        <th>Course</th>
                        <th>Schedule</th>
                        <th>Time</th>
                        <th>Students</th>
                        <th>Status</th>
                        <th style="text-align:right;">Actions</th>
                    </tr>
                </thead>
                <tbody>
                    <?php if (empty($batches)): ?>
                    <tr>
                        <td colspan="8" class="empty-state">
                            <i class="fas fa-inbox"></i>
                            <p class="mt-2 mb-1" style="font-size:1.1rem; color:#6b7280;">No batches yet</p>
                            <p class="mb-3">Create your first batch to start enrolling students.</p>
                            <a href="<?= $bp ?>/branch/batches/create" class="btn-create-batch">
                                <i class="fas fa-plus"></i> Create First Batch
                            </a>
                        </td>
                    </tr>
                    <?php else: foreach ($batches as $i => $b):
                        $status = $b['status'] ?? 'upcoming';
                        $statusCls = 'badge-' . $status;
                    ?>
                    <tr>
                        <td data-label="#"><?= $i + 1 ?></td>
                        <td data-label="Batch Name">
                            <div style="font-weight:600; color:#2c1e4a;"><?= htmlspecialchars($b['batch_name'] ?? '—', ENT_QUOTES, 'UTF-8') ?></div>
                            <?php if (!empty($b['description'])): ?>
                                <div class="text-muted" style="font-size:0.78rem; margin-top:2px;"><?= htmlspecialchars(mb_substr($b['description'], 0, 60), ENT_QUOTES, 'UTF-8') ?><?= (strlen($b['description']) > 60) ? '…' : '' ?></div>
                            <?php endif; ?>
                        </td>
                        <td data-label="Course">
                            <?php if (!empty($b['course_name'])): ?>
                                <div><?= htmlspecialchars($b['course_name'], ENT_QUOTES, 'UTF-8') ?></div>
                                <div class="text-muted" style="font-size:0.78rem;"><?= htmlspecialchars($b['course_duration'] ?? '', ENT_QUOTES, 'UTF-8') ?></div>
                            <?php else: ?>
                                <span class="text-muted">—</span>
                            <?php endif; ?>
                        </td>
                        <td data-label="Schedule">
                            <?php
                            $sDate = !empty($b['start_date']) ? date('d M Y', strtotime($b['start_date'])) : '—';
                            $eDate = !empty($b['end_date']) ? date('d M Y', strtotime($b['end_date'])) : '—';
                            ?>
                            <div style="font-size:0.85rem;">
                                <i class="fas fa-calendar-day" style="color:#6c3fe8;"></i>
                                <?= $sDate ?> → <?= $eDate ?>
                            </div>
                        </td>
                        <td data-label="Time">
                            <?php if (!empty($b['start_time']) || !empty($b['end_time'])): ?>
                                <div style="font-size:0.85rem;">
                                    <i class="fas fa-clock" style="color:#16a085;"></i>
                                    <?= htmlspecialchars($b['start_time'] ?? '', ENT_QUOTES) ?> - <?= htmlspecialchars($b['end_time'] ?? '', ENT_QUOTES) ?>
                                </div>
                            <?php else: ?>
                                <span class="text-muted">—</span>
                            <?php endif; ?>
                        </td>
                        <td data-label="Students">
                            <span style="font-weight:600; color:#16a085;">
                                <?= (int)($b['student_count'] ?? 0) ?>
                            </span>
                            <?php if (!empty($b['max_students'])): ?>
                                <span class="text-muted" style="font-size:0.78rem;">/ <?= (int)$b['max_students'] ?></span>
                            <?php endif; ?>
                        </td>
                        <td data-label="Status">
                            <span class="badge-status <?= $statusCls ?>"><?= htmlspecialchars(ucfirst($status), ENT_QUOTES, 'UTF-8') ?></span>
                        </td>
                        <td data-label="Actions" style="text-align:right; white-space:nowrap;">
                            <a href="<?= $bp ?>/branch/batches/<?= (int)$b['id'] ?>/edit" class="batch-action-btn batch-action-edit" title="Edit Batch">
                                <i class="fas fa-edit"></i> Edit
                            </a>
                            <form method="POST" action="<?= $bp ?>/branch/batches/<?= (int)$b['id'] ?>/delete" style="display:inline;" onsubmit="return confirm('Are you sure you want to delete this batch? This action cannot be undone.');">
                                <input type="hidden" name="csrf_token" value="<?= $csrf ?>">
                                <button type="submit" class="batch-action-btn batch-action-delete" title="Delete Batch">
                                    <i class="fas fa-trash"></i> Delete
                                </button>
                            </form>
                        </td>
                    </tr>
                    <?php endforeach; endif; ?>
                </tbody>
            </table>
        </div>
    </div>
</div>
