<?php
require_once '../includes/auth.php';

if (!isAdmin()) {
    redirect('../login.php');
}

// Helper function untuk handle null values
function getSafeValue($data, $key, $default = '') {
    return isset($data[$key]) ? $data[$key] : $default;
}

// Helper function untuk memotong teks
function truncateText($text, $length = 100) {
    if (strlen($text) <= $length) {
        return $text;
    }
    return substr($text, 0, $length) . '...';
}

$success = '';
$error = '';

// Proses Tambah Ujian
if ($_SERVER['REQUEST_METHOD'] == 'POST' && isset($_POST['tambah_ujian'])) {
    $nama_ujian = sanitize($_POST['nama_ujian']);
    $tanggal_ujian = sanitize($_POST['tanggal_ujian']);
    $waktu_mulai = sanitize($_POST['waktu_mulai'] ?? '08:00');
    $waktu_selesai = sanitize($_POST['waktu_selesai'] ?? '16:00');
    $deskripsi = sanitize($_POST['deskripsi'] ?? '');
    $status = sanitize($_POST['status'] ?? 'aktif');
    
    // Validasi
    if (empty($nama_ujian) || empty($tanggal_ujian)) {
        $error = "Nama ujian dan tanggal ujian harus diisi!";
    } else {
        // Insert ujian baru
        $stmt = $pdo->prepare("INSERT INTO ujian (nama_ujian, tanggal_ujian, waktu_mulai, waktu_selesai, deskripsi, status) VALUES (?, ?, ?, ?, ?, ?)");
        if ($stmt->execute([$nama_ujian, $tanggal_ujian, $waktu_mulai, $waktu_selesai, $deskripsi, $status])) {
            $success = "Ujian berhasil ditambahkan!";
            $_POST = array(); // Clear form
        } else {
            $error = "Gagal menambahkan ujian!";
        }
    }
}

// Proses Edit Ujian
if ($_SERVER['REQUEST_METHOD'] == 'POST' && isset($_POST['edit_ujian'])) {
    $id = intval($_POST['id']);
    $nama_ujian = sanitize($_POST['nama_ujian']);
    $tanggal_ujian = sanitize($_POST['tanggal_ujian']);
    $waktu_mulai = sanitize($_POST['waktu_mulai'] ?? '08:00');
    $waktu_selesai = sanitize($_POST['waktu_selesai'] ?? '16:00');
    $deskripsi = sanitize($_POST['deskripsi'] ?? '');
    $status = sanitize($_POST['status'] ?? 'aktif');
    
    // Validasi
    if (empty($nama_ujian) || empty($tanggal_ujian)) {
        $error = "Nama ujian dan tanggal ujian harus diisi!";
    } else {
        // Update ujian
        $stmt = $pdo->prepare("UPDATE ujian SET nama_ujian = ?, tanggal_ujian = ?, waktu_mulai = ?, waktu_selesai = ?, deskripsi = ?, status = ? WHERE id = ?");
        if ($stmt->execute([$nama_ujian, $tanggal_ujian, $waktu_mulai, $waktu_selesai, $deskripsi, $status, $id])) {
            $success = "Ujian berhasil diupdate!";
        } else {
            $error = "Gagal mengupdate ujian!";
        }
    }
}

// Proses Hapus Ujian
if (isset($_GET['hapus'])) {
    $id = intval($_GET['hapus']);
    
    // Cek apakah ujian sudah memiliki penilaian
    $stmt = $pdo->prepare("SELECT id FROM penilaian WHERE ujian_id = ? LIMIT 1");
    $stmt->execute([$id]);
    
    if ($stmt->rowCount() > 0) {
        $error = "Tidak dapat menghapus ujian yang sudah memiliki penilaian!";
    } else {
        // Hapus relasi ujian_stations terlebih dahulu
        $stmt = $pdo->prepare("DELETE FROM ujian_stations WHERE ujian_id = ?");
        $stmt->execute([$id]);
        
        // Hapus ujian
        $stmt = $pdo->prepare("DELETE FROM ujian WHERE id = ?");
        if ($stmt->execute([$id])) {
            $success = "Ujian berhasil dihapus!";
        } else {
            $error = "Gagal menghapus ujian!";
        }
    }
}

// Proses Kelola Stations
if ($_SERVER['REQUEST_METHOD'] == 'POST' && isset($_POST['simpan_stations'])) {
    $ujian_id = intval($_POST['ujian_id']);
    $stations = $_POST['stations'] ?? [];
    
    // Hapus semua stations untuk ujian ini
    $stmt = $pdo->prepare("DELETE FROM ujian_stations WHERE ujian_id = ?");
    $stmt->execute([$ujian_id]);
    
    // Insert stations baru
    $success_count = 0;
    foreach ($stations as $station_id => $data) {
        if (isset($data['include']) && $data['include'] == '1') {
            $urutan = intval($data['urutan'] ?? 1);
            $stmt = $pdo->prepare("INSERT INTO ujian_stations (ujian_id, station_id, urutan) VALUES (?, ?, ?)");
            if ($stmt->execute([$ujian_id, $station_id, $urutan])) {
                $success_count++;
            }
        }
    }
    
    $success = "Stations berhasil diupdate! (" . $success_count . " stations)";
}

// Ambil data ujian
$stmt = $pdo->query("SELECT * FROM ujian ORDER BY tanggal_ujian DESC, created_at DESC");
$ujian = $stmt->fetchAll();

// Ambil data stations untuk form kelola stations
$stmt = $pdo->query("SELECT * FROM stations ORDER BY nama_station");
$all_stations = $stmt->fetchAll();

// Data untuk form edit
$edit_data = null;
if (isset($_GET['edit'])) {
    $id = intval($_GET['edit']);
    $stmt = $pdo->prepare("SELECT * FROM ujian WHERE id = ?");
    $stmt->execute([$id]);
    $edit_data = $stmt->fetch();
}

// Data untuk kelola stations
$kelola_stations_data = null;
if (isset($_GET['kelola_stations'])) {
    $id = intval($_GET['kelola_stations']);
    $stmt = $pdo->prepare("SELECT * FROM ujian WHERE id = ?");
    $stmt->execute([$id]);
    $kelola_stations_data = $stmt->fetch();
    
    // Ambil stations yang sudah dipilih untuk ujian ini
    $stmt = $pdo->prepare("
        SELECT s.*, us.urutan 
        FROM stations s 
        INNER JOIN ujian_stations us ON s.id = us.station_id 
        WHERE us.ujian_id = ? 
        ORDER BY us.urutan
    ");
    $stmt->execute([$id]);
    $selected_stations = $stmt->fetchAll();
    
    // Buat array untuk memudahkan pencarian
    $selected_stations_map = [];
    foreach ($selected_stations as $station) {
        $selected_stations_map[$station['id']] = $station;
    }
}
?>

<?php include 'header.php'; ?>

<div class="content">
    <div class="page-header">
        <h2><i class="fas fa-calendar-alt"></i> Kelola Ujian</h2>
        <div class="header-actions">
            <button type="button" class="btn btn-primary" onclick="toggleForm()">
                <i class="fas fa-plus"></i> Tambah Ujian
            </button>
        </div>
    </div>
    
    <?php if ($success): ?>
        <div class="alert alert-success"><?php echo $success; ?></div>
    <?php endif; ?>
    
    <?php if ($error): ?>
        <div class="alert alert-error"><?php echo $error; ?></div>
    <?php endif; ?>

    <!-- Form Tambah/Edit Ujian -->
    <div class="card" id="formUjian" style="<?php echo $edit_data ? 'display:block;' : 'display:none;'; ?>">
        <h3><?php echo $edit_data ? 'Edit Ujian' : 'Tambah Ujian Baru'; ?></h3>
        
        <form method="POST">
            <?php if ($edit_data): ?>
                <input type="hidden" name="id" value="<?php echo $edit_data['id']; ?>">
            <?php endif; ?>
            
            <div class="form-row">
                <div class="form-group">
                    <label for="nama_ujian">Nama Ujian *</label>
                    <input type="text" id="nama_ujian" name="nama_ujian" 
                           value="<?php echo getSafeValue($edit_data ?? [], 'nama_ujian', $_POST['nama_ujian'] ?? ''); ?>" 
                           required placeholder="Masukkan nama ujian">
                </div>
                
                <div class="form-group">
                    <label for="tanggal_ujian">Tanggal Ujian *</label>
                    <input type="date" id="tanggal_ujian" name="tanggal_ujian" 
                           value="<?php echo getSafeValue($edit_data ?? [], 'tanggal_ujian', $_POST['tanggal_ujian'] ?? ''); ?>" 
                           required>
                </div>
            </div>
            
            <div class="form-row">
                <div class="form-group">
                    <label for="waktu_mulai">Waktu Mulai</label>
                    <input type="time" id="waktu_mulai" name="waktu_mulai" 
                           value="<?php echo getSafeValue($edit_data ?? [], 'waktu_mulai', $_POST['waktu_mulai'] ?? '08:00'); ?>">
                </div>
                
                <div class="form-group">
                    <label for="waktu_selesai">Waktu Selesai</label>
                    <input type="time" id="waktu_selesai" name="waktu_selesai" 
                           value="<?php echo getSafeValue($edit_data ?? [], 'waktu_selesai', $_POST['waktu_selesai'] ?? '16:00'); ?>">
                </div>
            </div>
            
            <div class="form-group">
                <label for="deskripsi">Deskripsi Ujian</label>
                <textarea id="deskripsi" name="deskripsi" rows="3" 
                          placeholder="Masukkan deskripsi ujian (opsional)"><?php echo getSafeValue($edit_data ?? [], 'deskripsi', $_POST['deskripsi'] ?? ''); ?></textarea>
            </div>
            
            <div class="form-group">
                <label for="status">Status *</label>
                <select id="status" name="status" required>
                    <option value="aktif" <?php echo (getSafeValue($edit_data ?? [], 'status', $_POST['status'] ?? '') == 'aktif') ? 'selected' : ''; ?>>Aktif</option>
                    <option value="nonaktif" <?php echo (getSafeValue($edit_data ?? [], 'status', $_POST['status'] ?? '') == 'nonaktif') ? 'selected' : ''; ?>>Nonaktif</option>
                    <option value="selesai" <?php echo (getSafeValue($edit_data ?? [], 'status', $_POST['status'] ?? '') == 'selesai') ? 'selected' : ''; ?>>Selesai</option>
                </select>
            </div>
            
            <div class="form-actions">
                <button type="submit" name="<?php echo $edit_data ? 'edit_ujian' : 'tambah_ujian'; ?>" class="btn btn-primary">
                    <i class="fas fa-save"></i> <?php echo $edit_data ? 'Update Ujian' : 'Simpan Ujian'; ?>
                </button>
                <button type="button" class="btn btn-secondary" onclick="resetForm()">
                    <i class="fas fa-times"></i> Batal
                </button>
            </div>
        </form>
    </div>

    <!-- Form Kelola Stations -->
    <?php if ($kelola_stations_data): ?>
    <div class="card">
        <h3>
            <i class="fas fa-cogs"></i> 
            Kelola Stations - <?php echo getSafeValue($kelola_stations_data, 'nama_ujian', 'Ujian'); ?>
        </h3>
        
        <form method="POST">
            <input type="hidden" name="ujian_id" value="<?php echo getSafeValue($kelola_stations_data, 'id'); ?>">
            
            <div class="stations-list">
                <h4>Pilih Stations untuk Ujian Ini:</h4>
                
                <?php if (empty($all_stations)): ?>
                    <div class="alert alert-warning">
                        <i class="fas fa-exclamation-triangle"></i>
                        Belum ada stations. Silakan buat stations terlebih dahulu.
                    </div>
                <?php else: ?>
                    <div class="table-container">
                        <table class="improved-table">
                            <thead>
                                <tr>
                                    <th width="50">Pilih</th>
                                    <th>Nama Station</th>
                                    <th width="100">Urutan</th>
                                    <th>Deskripsi</th>
                                    <th>Waktu (menit)</th>
                                </tr>
                            </thead>
                            <tbody>
                                <?php foreach ($all_stations as $station): ?>
                                    <?php 
                                    $is_selected = isset($selected_stations_map[$station['id']]);
                                    $current_urutan = $is_selected ? $selected_stations_map[$station['id']]['urutan'] : '';
                                    ?>
                                    <tr>
                                        <td>
                                            <input type="checkbox" name="stations[<?php echo $station['id']; ?>][include]" 
                                                   value="1" <?php echo $is_selected ? 'checked' : ''; ?> 
                                                   onchange="toggleUrutan(this, <?php echo $station['id']; ?>)">
                                        </td>
                                        <td>
                                            <strong><?php echo getSafeValue($station, 'nama_station'); ?></strong>
                                        </td>
                                        <td>
                                            <input type="number" name="stations[<?php echo $station['id']; ?>][urutan]" 
                                                   value="<?php echo $current_urutan; ?>" 
                                                   min="1" max="20" 
                                                   id="urutan_<?php echo $station['id']; ?>"
                                                   <?php echo !$is_selected ? 'disabled' : ''; ?>
                                                   style="width: 60px; padding: 0.25rem;">
                                        </td>
                                        <td>
                                            <small><?php echo truncateText(getSafeValue($station, 'deskripsi', ''), 100); ?></small>
                                        </td>
                                        <td>
                                            <span class="badge badge-info"><?php echo getSafeValue($station, 'waktu', 0); ?> menit</span>
                                        </td>
                                    </tr>
                                <?php endforeach; ?>
                            </tbody>
                        </table>
                    </div>
                    
                    <div class="form-actions">
                        <button type="submit" name="simpan_stations" class="btn btn-primary">
                            <i class="fas fa-save"></i> Simpan Stations
                        </button>
                        <a href="ujian.php" class="btn btn-secondary">
                            <i class="fas fa-times"></i> Batal
                        </a>
                    </div>
                <?php endif; ?>
            </div>
        </form>
    </div>
    <?php endif; ?>

    <!-- Daftar Ujian -->
<div class="card">
    <h3><i class="fas fa-list"></i> Daftar Ujian</h3>
    
    <?php if (empty($ujian)): ?>
        <div class="alert alert-info">
            <i class="fas fa-info-circle"></i>
            Belum ada data ujian.
        </div>
    <?php else: ?>
        <div class="table-responsive">
            <table class="improved-table">
                <thead>
                    <tr>
                        <th width="60">No</th>
                        <th width="120">Nama Ujian</th>
                        <th width="120">Tanggal</th>
                        <th width="130">Waktu</th>
                        <th width="100">Status</th>
                        <th width="110">Stations</th>
                        <th width="120">Dibuat</th>
                        <th width="180" class="text-center">Aksi</th>
                    </tr>
                </thead>
                <tbody>
                    <?php foreach ($ujian as $index => $u): ?>
                        <?php
                        // Hitung jumlah stations untuk ujian ini
                        $stmt = $pdo->prepare("SELECT COUNT(*) as total FROM ujian_stations WHERE ujian_id = ?");
                        $stmt->execute([$u['id']]);
                        $station_count = $stmt->fetch()['total'];
                        
                        // Format waktu
                        $waktu_mulai = getSafeValue($u, 'waktu_mulai') ? substr($u['waktu_mulai'], 0, 5) : '';
                        $waktu_selesai = getSafeValue($u, 'waktu_selesai') ? substr($u['waktu_selesai'], 0, 5) : '';
                        ?>
                        <tr>
                            <td class="text-center">
                                <span class="row-number"><?php echo $index + 1; ?></span>
                            </td>
                            <td>
                                <div class="ujian-info">
                                    <div class="ujian-name"><?php echo htmlspecialchars(getSafeValue($u, 'nama_ujian')); ?></div>
                                    <?php if (getSafeValue($u, 'deskripsi')): ?>
                                        <div class="ujian-desc"><?php echo truncateText(htmlspecialchars(getSafeValue($u, 'deskripsi', '')), 60); ?></div>
                                    <?php endif; ?>
                                </div>
                            </td>
                            <td class="text-center">
                                <div class="tanggal-ujian">
                                    <?php echo formatTanggal(getSafeValue($u, 'tanggal_ujian')); ?>
                                </div>
                            </td>
                            <td class="text-center">
                                <?php if ($waktu_mulai && $waktu_selesai): ?>
                                    <div class="waktu-slot">
                                        <i class="fas fa-clock"></i>
                                        <?php echo $waktu_mulai; ?> - <?php echo $waktu_selesai; ?>
                                    </div>
                                <?php else: ?>
                                    <span class="text-muted">-</span>
                                <?php endif; ?>
                            </td>
                            <td class="text-center">
                                <?php 
                                $status = getSafeValue($u, 'status', 'nonaktif');
                                $status_class = [
                                    'aktif' => 'status-aktif',
                                    'nonaktif' => 'status-nonaktif',
                                    'selesai' => 'status-selesai'
                                ];
                                ?>
                                <span class="status-badge <?php echo $status_class[$status] ?? 'status-nonaktif'; ?>">
                                    <i class="fas fa-circle"></i>
                                    <?php echo ucfirst($status); ?>
                                </span>
                            </td>
                            <td class="text-center">
                                <span class="station-count <?php echo $station_count > 0 ? 'has-stations' : 'no-stations'; ?>">
                                    <i class="fas fa-layer-group"></i>
                                    <?php echo $station_count; ?> station<?php echo $station_count != 1 ? 's' : ''; ?>
                                </span>
                            </td>
                            <td class="text-center">
                                <div class="created-date">
                                    <?php echo formatTanggal(getSafeValue($u, 'created_at')); ?>
                                </div>
                            </td>
                            <td>
                                <div class="table-actions">
                                    <a href="?edit=<?php echo $u['id']; ?>" class="btn-action btn-edit" title="Edit Ujian">
                                        <i class="fas fa-edit"></i>
                                        <span>Edit</span>
                                    </a>
                                    <a href="?kelola_stations=<?php echo $u['id']; ?>" class="btn-action btn-manage" title="Kelola Stations">
                                        <i class="fas fa-cogs"></i>
                                        <span>Stations</span>
                                    </a>
                                    <a href="?hapus=<?php echo $u['id']; ?>" class="btn-action btn-delete" 
                                       title="Hapus Ujian" 
                                       onclick="return confirm('Hapus ujian <?php echo htmlspecialchars(getSafeValue($u, 'nama_ujian')); ?>?')">
                                        <i class="fas fa-trash"></i>
                                        <span>Hapus</span>
                                    </a>
                                </div>
                            </td>
                        </tr>
                    <?php endforeach; ?>
                </tbody>
            </table>
        </div>
        
        <div class="table-footer">
            <div class="table-summary">
                <i class="fas fa-database"></i>
                Total <strong><?php echo count($ujian); ?></strong> ujian
            </div>
        </div>
    <?php endif; ?>
</div>

<style>
/* CSS styles tetap sama seperti sebelumnya 
.page-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
}

.header-actions {
    display: flex;
    gap: 1rem;
}

.form-actions {
    display: flex;
    gap: 1rem;
    margin-top: 1.5rem;
}

.action-buttons {
    display: flex;
    gap: 0.5rem;
}

.btn-sm {
    padding: 0.375rem 0.75rem;
    font-size: 0.875rem;
}

.badge {
    padding: 0.25rem 0.75rem;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 500;
}

.badge-success { background: #27ae60; color: white; }
.badge-primary { background: #3498db; color: white; }
.badge-info { background: #17a2b8; color: white; }
.badge-warning { background: #f39c12; color: white; }
.badge-secondary { background: #6c757d; color: white; }
.badge-danger { background: #e74c3c; color: white; }

.table-info {
    margin-top: 1rem;
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 6px;
    text-align: center;
    font-size: 0.9rem;
    color: #6c757d;
}

.text-muted {
    color: #6c757d !important;
}

.stations-list h4 {
    margin-bottom: 1rem;
    color: #2c3e50;
}

/* Responsive 
@media (max-width: 768px) {
    .page-header {
        flex-direction: column;
        gap: 1rem;
        align-items: flex-start;
    }
    
    .form-row {
        grid-template-columns: 1fr;
    }
    
    .action-buttons {
        flex-direction: column;
    }
}


/* CSS styles yang sudah ada tetap dipertahankan */
.page-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
}

.header-actions {
    display: flex;
    gap: 1rem;
}

.form-actions {
    display: flex;
    gap: 1rem;
    margin-top: 1.5rem;
}

.action-buttons {
    display: flex;
    gap: 0.5rem;
}

.btn-sm {
    padding: 0.375rem 0.75rem;
    font-size: 0.875rem;
}

.badge {
    padding: 0.25rem 0.75rem;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 500;
}

.badge-success { background: #27ae60; color: white; }
.badge-primary { background: #3498db; color: white; }
.badge-info { background: #17a2b8; color: white; }
.badge-warning { background: #f39c12; color: white; }
.badge-secondary { background: #6c757d; color: white; }
.badge-danger { background: #e74c3c; color: white; }

.table-info {
    margin-top: 1rem;
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 6px;
    text-align: center;
    font-size: 0.9rem;
    color: #6c757d;
}

.text-muted {
    color: #6c757d !important;
}

.stations-list h4 {
    margin-bottom: 1rem;
    color: #2c3e50;
}


/* ===== IMPROVED TABLE STYLING ===== */
.table-responsive {
    overflow-x: auto;
    border-radius: 10px;
    border: 1px solid #e1e5e9;
    background: white;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.improved-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 800px;
    background: white;
}

.improved-table thead {
    background: linear-gradient(135deg, #4b92ddff 0%, #3039b8ff 100%);
}

/* SEMUA HEADER RATA TENGAH */
.improved-table th {
    padding: 16px 12px;
    text-align: center;
    font-weight: 600;
    color: white;
    font-size: 14px;
    border: none;
    position: relative;
    white-space: nowrap;
}

.improved-table th:not(:last-child)::after {
    content: '';
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    height: 50%;
    width: 1px;
    background: rgba(255, 255, 255, 0.4);
}

/* SEMUA TD RATA TENGAH */
.improved-table td {
    padding: 16px 12px;
    border-bottom: 1px solid #f1f3f4;
    vertical-align: middle;
    font-size: 14px;
    color: #424242;
    transition: all 0.3s ease;
    text-align: center;
}

.improved-table tbody tr {
    transition: all 0.3s ease;
}

.improved-table tbody tr:hover {
    background-color: #d2e4f5ff;
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.improved-table tbody tr:last-child td {
    border-bottom: none;
}

/* Number styling - center */
.row-number {
    display: inline-block;
    width: 28px;
    height: 28px;
    background: #4b92ddff;
    color: white;
    border-radius: 50%;
    text-align: center;
    line-height: 28px;
    font-weight: 600;
    font-size: 12px;
    margin: 0 auto;
}

/* Ujian info styling - center */
.ujian-info {
    line-height: 1.4;
    text-align: center; /* Diubah jadi center */
}

.ujian-name {
    font-weight: 600;
    color: #0b0c0dff;
    font-size: 14px;
    margin-bottom: 4px;
}

.ujian-desc {
    font-size: 12px;
    color: #6c757d;
    line-height: 1.3;
}

/* Tanggal dan waktu styling - center */
.tanggal-ujian {
    font-weight: 600;
    color: #0e0f0fff;
    font-size: 13px;
}

.waktu-slot {
    background: #e8f4fd;
    padding: 6px 10px;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 600;
    color: #1976d2;
    border: 1px solid #bbdefb;
    display: inline-block;
}

.waktu-slot i {
    margin-right: 4px;
    font-size: 10px;
}

/* Status badge styling - center */
.status-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    text-transform: capitalize;
    justify-content: center;
}

.status-aktif {
    background: #e8f5e8;
    color: #27ae60;
    border: 1px solid #c8e6c9;
}

.status-nonaktif {
    background: #f5f5f5;
    color: #6c757d;
    border: 1px solid #e0e0e0;
}

.status-selesai {
    background: #e3f2fd;
    color: #1976d2;
    border: 1px solid #bbdefb;
}

.status-badge i {
    font-size: 6px;
}

/* Station count styling - center */
.station-count {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 600;
    justify-content: center;
}

.has-stations {
    background: #e8f4fd;
    color: #1976d2;
    border: 1px solid #bbdefb;
}

.no-stations {
    background: #fff3e0;
    color: #f57c00;
    border: 1px solid #ffe0b2;
}

.station-count i {
    font-size: 12px;
}

/* Created date styling - center */
.created-date {
    font-size: 12px;
    color: #6c757d;
    font-weight: 500;
}

/* Table actions styling - center */
.table-actions {
    display: flex;
    gap: 6px;
    justify-content: center;
    flex-wrap: wrap;
}

.btn-action {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 6px 10px;
    border-radius: 6px;
    font-size: 11px;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.3s ease;
    border: none;
    cursor: pointer;
    min-width: 50px;
    justify-content: center;
}

.btn-action span {
    display: none;
}

.btn-edit {
    background: #fff3e0;
    color: #f57c00;
    border: 1px solid #ffe0b2;
}

.btn-edit:hover {
    background: #f57c00;
    color: white;
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(245, 124, 0, 0.3);
}

.btn-manage {
    background: #e8f4fd;
    color: #1976d2;
    border: 1px solid #bbdefb;
}

.btn-manage:hover {
    background: #1976d2;
    color: white;
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(25, 118, 210, 0.3);
}

.btn-delete {
    background: #ffebee;
    color: #d32f2f;
    border: 1px solid #ffcdd2;
}

.btn-delete:hover {
    background: #d32f2f;
    color: white;
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(211, 47, 47, 0.3);
}

/* Table footer */
.table-footer {
    margin-top: 20px;
    padding: 16px;
    background: #f8f9fa;
    border-radius: 8px;
    text-align: center;
}

.table-summary {
    font-size: 14px;
    color: #6c757d;
    font-weight: 500;
}

.table-summary i {
    margin-right: 8px;
    color: #1976d2;
}

/* Text alignment utilities */
.text-center {
    text-align: center !important;
}

.text-muted {
    color: #6c757d !important;
}

/* Responsive design */
@media (max-width: 1024px) {
    .improved-table {
        min-width: 700px;
    }
    
    .improved-table th,
    .improved-table td {
        padding: 14px 10px;
        font-size: 13px;
    }
}

@media (max-width: 768px) {
    .table-responsive {
        border-radius: 8px;
        margin: 0 -10px;
    }
    
    .improved-table {
        min-width: 600px;
    }
    
    .improved-table th,
    .improved-table td {
        padding: 12px 8px;
        font-size: 12px;
    }
    
    .btn-action span {
        display: inline;
    }
    
    /* Hide less important columns on mobile */
    .improved-table th:nth-child(7),
    .improved-table td:nth-child(7) {
        display: none;
    }
}

@media (max-width: 480px) {
    .improved-table {
        min-width: 500px;
    }
    
    .improved-table th:nth-child(3),
    .improved-table td:nth-child(3),
    .improved-table th:nth-child(6),
    .improved-table td:nth-child(6) {
        display: none;
    }
    
    .table-actions {
        flex-direction: column;
        gap: 4px;
    }
    
    .btn-action {
        width: 100%;
        justify-content: center;
    }
}
</style>

<script>
function toggleForm() {
    const form = document.getElementById('formUjian');
    form.style.display = form.style.display === 'none' ? 'block' : 'none';
    
    // Reset form ketika menutup
    if (form.style.display === 'none') {
        resetForm();
    }
}

function resetForm() {
    // Redirect ke halaman tanpa parameter edit
    window.location.href = 'ujian.php';
}

function toggleUrutan(checkbox, stationId) {
    const urutanInput = document.getElementById('urutan_' + stationId);
    urutanInput.disabled = !checkbox.checked;
    
    if (checkbox.checked && !urutanInput.value) {
        // Set urutan default jika kosong
        urutanInput.value = 1;
    }
}

// Auto close alert setelah 5 detik
setTimeout(() => {
    const alerts = document.querySelectorAll('.alert');
    alerts.forEach(alert => {
        alert.style.display = 'none';
    });
}, 5000);

// Set tanggal minimal ke hari ini
document.addEventListener('DOMContentLoaded', function() {
    const today = new Date().toISOString().split('T')[0];
    const tanggalInput = document.getElementById('tanggal_ujian');
    if (tanggalInput && !tanggalInput.value) {
        tanggalInput.min = today;
    }
});
</script>

<?php include 'footer.php'; ?>