<?php
// concurso_nobel/admin/importar_participantes.php
// Importación administrativa de participantes por Excel (.xlsx) usando código modular.
// Diseño profesional actualizado sin alterar la lógica principal de importación.

declare(strict_types=1);

session_start();

require_once __DIR__ . '/../includes/db.php';
require_once __DIR__ . '/../includes/concurso_contexto.php';
require_once __DIR__ . '/../includes/importar_participantes_plantilla.php';
require_once __DIR__ . '/../includes/importar_participantes_servicio.php';

date_default_timezone_set('America/Lima');

if (isset($_GET['descargar']) && $_GET['descargar'] === 'plantilla') {
    ip_descargar_plantilla();
}

$acceso = cn_validar_acceso($conn, '../index.php');
$esAdmin = cn_es_admin($acceso);

if (!$esAdmin) {
    http_response_code(403);
    die('Acceso denegado. La importación de participantes es solo para administrador.');
}

$idConcurso = cn_concurso_trabajo($conn, $acceso);

if (isset($_GET['id_concurso']) && is_numeric($_GET['id_concurso'])) {
    $idConcurso = (int)$_GET['id_concurso'];
}

if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    $idConcursoPost = (int)($_POST['id_concurso'] ?? 0);

    if ($idConcursoPost > 0) {
        $idConcurso = $idConcursoPost;
    }
}

if ($idConcurso <= 0) {
    http_response_code(500);
    die('No hay concurso activo disponible.');
}

$concursoTrabajo = cn_datos_concurso($conn, $idConcurso);

if (!$concursoTrabajo) {
    http_response_code(404);
    die('No se encontró el concurso seleccionado.');
}

$concursosActivos = cn_concursos_activos($conn);
$idAcceso = (int)$acceso['id_acceso'];
$anioConcurso = (int)($concursoTrabajo['anio'] ?? date('Y'));

if (empty($_SESSION['csrf_importar_participantes_nobex'])) {
    $_SESSION['csrf_importar_participantes_nobex'] = bin2hex(random_bytes(32));
}

$csrf = (string)$_SESSION['csrf_importar_participantes_nobex'];
$mensajeError = '';
$mensajeOk = '';
$resumen = ip_resumen_inicial();
$faltantesColumnas = ip_validar_columnas_participantes($conn);

if (!empty($faltantesColumnas)) {
    $mensajeError = 'Faltan columnas en concurso_participantes: ' . implode(', ', $faltantesColumnas) . '. Corrige la tabla antes de importar.';
}

if ($_SERVER['REQUEST_METHOD'] === 'POST' && $mensajeError === '') {
    $csrfPost = (string)($_POST['csrf_token'] ?? '');
    $idGrupo = null;
    $observacionBase = trim((string)($_POST['observacion_base'] ?? ''));

    if (!hash_equals($csrf, $csrfPost)) {
        $mensajeError = 'Solicitud no válida. Recarga la página.';
    } else {
        try {
            $resumen = ip_procesar_importacion_participantes(
                $conn,
                $_FILES['archivo'] ?? [],
                $idConcurso,
                $idGrupo,
                $idAcceso,
                $anioConcurso,
                $observacionBase
            );

            $_SESSION['csrf_importar_participantes_nobex'] = bin2hex(random_bytes(32));
            $csrf = (string)$_SESSION['csrf_importar_participantes_nobex'];

            $mensajeOk = 'Importación finalizada. Insertados: ' . $resumen['insertados'] . '. Duplicados: ' . $resumen['duplicados'] . '. Saltados: ' . $resumen['saltados'] . '.';
        } catch (Throwable $e) {
            $mensajeError = $e->getMessage();
        }
    }
}

$ultimosImportados = ip_ultimos_importados($conn, $idConcurso);
$ambito = 'Administrador | Importación por código modular';
?>
<!DOCTYPE html>
<html lang="es">
<head>
    <meta charset="UTF-8">
    <title>Importar participantes | NOBEX</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- Bootstrap Icons + Font Awesome -->
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css">
    <link rel="stylesheet" href="../assets/css/menu_concurso.css?v=5">

    <style>
        *{box-sizing:border-box}

        :root{
            --red:#dc2626;
            --red-dark:#991b1b;
            --yellow:#facc15;
            --blue:#1d4ed8;
            --blue-dark:#1e40af;
            --green:#16a34a;
            --orange:#ea580c;
            --slate:#0f172a;
            --muted:#64748b;
            --line:#e2e8f0;
            --soft:#f8fafc;
            --card:#ffffff;
        }

        body{
            margin:0;
            font-family:Inter,Arial,Helvetica,sans-serif;
            background:linear-gradient(135deg,#f8fafc 0%,#eef2ff 45%,#fff7ed 100%);
            color:var(--slate);
        }

        .topbar{
            background:
                radial-gradient(circle at top left,rgba(250,204,21,.28),transparent 28%),
                linear-gradient(135deg,#991b1b,#dc2626);
            color:#fff;
            border-bottom:6px solid var(--yellow);
            padding:22px 22px;
            box-shadow:0 18px 45px rgba(153,27,27,.25);
        }

        .topbar-inner{
            max-width:1320px;
            margin:0 auto;
            display:flex;
            justify-content:space-between;
            gap:16px;
            align-items:center;
        }

        .brand-block{
            display:flex;
            align-items:center;
            gap:14px;
        }

        .brand-icon{
            width:52px;
            height:52px;
            border-radius:17px;
            display:flex;
            align-items:center;
            justify-content:center;
            background:rgba(255,255,255,.14);
            border:1px solid rgba(255,255,255,.24);
            font-size:24px;
        }

        .topbar h1{
            margin:0;
            font-size:28px;
            font-weight:950;
            letter-spacing:-.035em;
        }

        .topbar p{
            margin:6px 0 0;
            color:#fde68a;
            font-weight:900;
            font-size:14px;
        }

        .btn-back{
            color:#fff;
            text-decoration:none;
            border:1px solid rgba(255,255,255,.35);
            border-radius:15px;
            padding:12px 16px;
            font-weight:900;
            white-space:nowrap;
            display:inline-flex;
            align-items:center;
            gap:8px;
            background:rgba(255,255,255,.10);
        }

        .btn-back:hover{
            background:rgba(255,255,255,.18);
        }

        .container{
            max-width:1320px;
            margin:24px auto;
            padding:0 18px 44px;
        }

        .tabs{
            display:flex;
            gap:10px;
            flex-wrap:wrap;
            margin-bottom:20px;
        }

        .tab{
            display:inline-flex;
            align-items:center;
            justify-content:center;
            gap:8px;
            text-decoration:none;
            border:1px solid var(--line);
            background:#fff;
            color:#334155;
            border-radius:999px;
            padding:11px 16px;
            font-weight:900;
            box-shadow:0 8px 20px rgba(15,23,42,.06);
            transition:.16s ease;
        }

        .tab:hover{
            transform:translateY(-1px);
            box-shadow:0 12px 26px rgba(15,23,42,.09);
        }

        .tab.active{
            background:linear-gradient(135deg,#dc2626,#991b1b);
            color:#fff;
            border-color:transparent;
        }

        .notice{
            border-radius:17px;
            padding:14px 16px;
            margin-bottom:16px;
            font-weight:900;
            line-height:1.45;
            white-space:pre-wrap;
            display:flex;
            align-items:flex-start;
            gap:10px;
            box-shadow:0 8px 18px rgba(15,23,42,.06);
        }

        .notice i{
            margin-top:2px;
            font-size:18px;
        }

        .notice-ok{background:#dcfce7;color:#166534;border:1px solid #bbf7d0}
        .notice-error{background:#fee2e2;color:#991b1b;border:1px solid #fecaca}
        .notice-info{background:#eff6ff;color:#1e40af;border:1px solid #bfdbfe}

        .result-card{
            margin-bottom:20px;
        }

        .grid{
            display:grid;
            grid-template-columns:minmax(420px,500px) 1fr;
            gap:20px;
            align-items:start;
        }

        .card{
            background:rgba(255,255,255,.94);
            border:1px solid rgba(226,232,240,.95);
            border-radius:26px;
            padding:24px;
            box-shadow:0 20px 45px rgba(15,23,42,.10);
            backdrop-filter:blur(8px);
        }

        .card-header{
            display:flex;
            justify-content:space-between;
            gap:14px;
            align-items:center;
            margin-bottom:18px;
        }

        .card-title{
            display:flex;
            align-items:center;
            gap:12px;
        }

        .card-icon{
            width:44px;
            height:44px;
            border-radius:16px;
            display:flex;
            align-items:center;
            justify-content:center;
            background:#fee2e2;
            color:var(--red);
            font-size:20px;
        }

        .card h2{
            margin:0;
            font-size:22px;
            font-weight:950;
            letter-spacing:-.03em;
        }

        .subtle{
            color:var(--muted);
            line-height:1.55;
            font-size:14px;
            margin:4px 0 0;
        }

        .badge-soft{
            display:inline-flex;
            align-items:center;
            gap:7px;
            background:#eff6ff;
            color:#1d4ed8;
            border-radius:999px;
            padding:7px 10px;
            font-size:12px;
            font-weight:900;
            white-space:nowrap;
        }

        .summary{
            display:grid;
            grid-template-columns:repeat(4,1fr);
            gap:12px;
            margin:14px 0 6px;
        }

        .box{
            border:1px solid #e5e7eb;
            background:#fff;
            border-radius:18px;
            padding:16px;
            display:flex;
            align-items:center;
            gap:12px;
            box-shadow:0 10px 22px rgba(15,23,42,.06);
        }

        .box-icon{
            width:42px;
            height:42px;
            border-radius:15px;
            display:flex;
            align-items:center;
            justify-content:center;
            font-size:19px;
            flex:0 0 auto;
        }

        .box strong{
            display:block;
            font-size:26px;
            color:#0f172a;
            line-height:1;
        }

        .box span{
            display:block;
            color:#64748b;
            font-weight:900;
            font-size:11px;
            text-transform:uppercase;
            margin-top:5px;
        }

        .box-blue .box-icon{background:#dbeafe;color:#1d4ed8}
        .box-green .box-icon{background:#dcfce7;color:#166534}
        .box-yellow .box-icon{background:#fef3c7;color:#92400e}
        .box-red .box-icon{background:#fee2e2;color:#991b1b}

        .errors{
            max-height:320px;
            overflow:auto;
            border:1px solid #fecaca;
            border-radius:16px;
            background:#fff1f2;
            padding:12px;
            color:#991b1b;
            font-size:13px;
            line-height:1.45;
            margin-top:12px;
        }

        .errors div{
            padding:8px 9px;
            border-bottom:1px solid rgba(254,202,202,.75);
        }

        .errors div:last-child{
            border-bottom:0;
        }

        .format-card{
            background:linear-gradient(135deg,#fff7ed,#ffffff);
            border:1px solid #fed7aa;
            color:#9a3412;
            border-radius:20px;
            padding:16px;
            margin:16px 0;
        }

        .format-title{
            display:flex;
            align-items:center;
            gap:9px;
            font-weight:950;
            margin-bottom:10px;
        }

        .columns-list{
            display:flex;
            flex-wrap:wrap;
            gap:8px;
        }

        .pill{
            display:inline-flex;
            align-items:center;
            gap:6px;
            border-radius:999px;
            padding:6px 10px;
            font-size:12px;
            font-weight:900;
            white-space:nowrap;
        }

        .pill-blue{background:#dbeafe;color:#1e40af}
        .pill-green{background:#dcfce7;color:#166534}
        .pill-yellow{background:#fef3c7;color:#92400e}
        .pill-red{background:#fee2e2;color:#991b1b}
        .pill-gray{background:#f1f5f9;color:#475569}
        .pill-orange{background:#ffedd5;color:#9a3412}

        label{
            display:block;
            font-weight:900;
            margin:15px 0 7px;
            color:#1f2937;
            font-size:13px;
        }

        label i{
            color:var(--red);
            margin-right:7px;
        }

        input,select,textarea{
            width:100%;
            border:1px solid #dbe3ef;
            border-radius:15px;
            padding:12px 13px;
            font-size:15px;
            background:#fff;
            outline:none;
            min-height:47px;
            color:#0f172a;
        }

        input:focus,select:focus,textarea:focus{
            border-color:var(--red);
            box-shadow:0 0 0 4px rgba(220,38,38,.12);
        }

        textarea{
            min-height:88px;
            resize:vertical;
        }

        .input-icon{
            position:relative;
        }

        .input-icon > i{
            position:absolute;
            left:14px;
            top:50%;
            transform:translateY(-50%);
            color:#64748b;
            font-size:15px;
            pointer-events:none;
        }

        .input-icon input,
        .input-icon select{
            padding-left:42px;
        }

        .file-zone{
            position:relative;
            border:2px dashed #cbd5e1;
            background:#f8fafc;
            border-radius:20px;
            padding:18px;
            transition:.16s ease;
        }

        .file-zone:hover{
            border-color:#dc2626;
            background:#fff7ed;
        }

        .file-zone input[type="file"]{
            border:0;
            background:transparent;
            padding:0;
            min-height:auto;
            border-radius:0;
        }

        .btn-primary{
            width:100%;
            border:0;
            border-radius:17px;
            background:linear-gradient(135deg,#1d4ed8,#2563eb);
            color:#fff;
            font-weight:950;
            padding:14px 16px;
            margin-top:18px;
            cursor:pointer;
            font-size:15px;
            display:flex;
            justify-content:center;
            align-items:center;
            gap:9px;
            box-shadow:0 14px 28px rgba(37,99,235,.24);
        }

        .btn-primary:hover{
            background:linear-gradient(135deg,#1e40af,#1d4ed8);
        }

        .btn-download{
            width:100%;
            text-align:center;
            border-radius:17px;
            padding:13px 16px;
            background:#fff;
            border:1px solid #bbf7d0;
            color:#166534;
            text-decoration:none;
            font-weight:950;
            display:flex;
            justify-content:center;
            align-items:center;
            gap:9px;
            box-shadow:0 10px 22px rgba(22,101,52,.08);
        }

        .btn-download:hover{
            background:#f0fdf4;
        }

        .form-divider{
            margin:18px 0 4px;
            padding:12px 14px;
            border-radius:16px;
            background:#f8fafc;
            border:1px solid var(--line);
            display:flex;
            align-items:center;
            gap:9px;
            font-weight:950;
        }

        .form-divider i{
            color:var(--red);
        }

        .mini{
            font-size:12px;
            color:#64748b;
            line-height:1.45;
            margin:8px 0 0;
        }

        .table-wrap{
            overflow:auto;
        }

        table{
            width:100%;
            border-collapse:separate;
            border-spacing:0 8px;
            font-size:14px;
        }

        th,td{
            padding:11px 10px;
            text-align:left;
            vertical-align:top;
        }

        th{
            background:transparent;
            border:0;
            color:#64748b;
            text-transform:uppercase;
            font-size:12px;
            white-space:nowrap;
        }

        td{
            background:#fff;
            border-top:1px solid #e5e7eb;
            border-bottom:1px solid #e5e7eb;
        }

        tbody tr td:first-child{
            border-left:1px solid #e5e7eb;
            border-radius:14px 0 0 14px;
        }

        tbody tr td:last-child{
            border-right:1px solid #e5e7eb;
            border-radius:0 14px 14px 0;
        }

        .code{
            font-weight:950;
            color:#1d4ed8;
            white-space:nowrap;
        }

        .participant-name{
            font-weight:950;
            color:#0f172a;
        }

        .school-name{
            max-width:260px;
        }

        .empty-state{
            border:1px dashed #cbd5e1;
            background:#f8fafc;
            border-radius:20px;
            padding:28px;
            color:#475569;
            text-align:center;
            font-weight:900;
        }

        .empty-state i{
            display:block;
            font-size:34px;
            color:#94a3b8;
            margin-bottom:9px;
        }

        @media(max-width:1100px){
            .grid{grid-template-columns:1fr}
            .summary{grid-template-columns:repeat(2,1fr)}
        }

        @media(max-width:700px){
            .topbar-inner{flex-direction:column;align-items:flex-start}
            .topbar h1{font-size:23px}
            .brand-icon{width:46px;height:46px}
            .summary{grid-template-columns:1fr}
            .card{padding:18px}
            .card-header{align-items:flex-start;flex-direction:column}
        }
    </style>
</head>
<body class="cn-con-sidebar">
<?php include __DIR__ . '/../includes/sidebar_concurso.php'; ?>
<header class="topbar">
    <div class="topbar-inner">
        <div class="brand-block">
            <div class="brand-icon">
                <i class="fa-solid fa-file-import"></i>
            </div>
            <div>
                <h1>Importar participantes</h1>
                <p><?php echo ip_h($concursoTrabajo['nombre'] . ' ' . $concursoTrabajo['subtitulo']); ?> | <?php echo ip_h($ambito); ?></p>
            </div>
        </div>

        <a class="btn-back" href="../panel.php">
            <i class="bi bi-arrow-left-circle"></i>
            Volver al panel
        </a>
    </div>
</header>

<main class="container">
    <nav class="tabs">
        <a class="tab" href="../participantes.php">
            <i class="fa-solid fa-user-plus"></i>
            Registro manual
        </a>
        <a class="tab active" href="importar_participantes.php">
            <i class="fa-solid fa-file-excel"></i>
            Importar Excel
        </a>
        <a class="tab" href="salones.php">
            <i class="fa-solid fa-door-open"></i>
            Control de salones
        </a>
    </nav>

    <?php if ($mensajeOk !== ''): ?>
        <div class="notice notice-ok">
            <i class="bi bi-check-circle-fill"></i>
            <div><?php echo ip_h($mensajeOk); ?></div>
        </div>
    <?php endif; ?>

    <?php if ($mensajeError !== ''): ?>
        <div class="notice notice-error">
            <i class="bi bi-exclamation-triangle-fill"></i>
            <div><?php echo ip_h($mensajeError); ?></div>
        </div>
    <?php endif; ?>

    <?php if ($resumen['procesados'] > 0): ?>
        <section class="card result-card">
            <div class="card-header">
                <div class="card-title">
                    <div class="card-icon">
                        <i class="fa-solid fa-chart-pie"></i>
                    </div>
                    <div>
                        <h2>Resultado de importación</h2>
                        <p class="subtle">Resumen del último archivo procesado.</p>
                    </div>
                </div>
                <span class="badge-soft">
                    <i class="fa-solid fa-clock-rotate-left"></i>
                    Último proceso
                </span>
            </div>

            <div class="summary">
                <div class="box box-blue">
                    <div class="box-icon"><i class="fa-solid fa-list-check"></i></div>
                    <div><strong><?php echo ip_h($resumen['procesados']); ?></strong><span>Procesados</span></div>
                </div>

                <div class="box box-green">
                    <div class="box-icon"><i class="fa-solid fa-circle-check"></i></div>
                    <div><strong><?php echo ip_h($resumen['insertados']); ?></strong><span>Insertados</span></div>
                </div>

                <div class="box box-yellow">
                    <div class="box-icon"><i class="fa-solid fa-copy"></i></div>
                    <div><strong><?php echo ip_h($resumen['duplicados']); ?></strong><span>Duplicados</span></div>
                </div>

                <div class="box box-red">
                    <div class="box-icon"><i class="fa-solid fa-triangle-exclamation"></i></div>
                    <div><strong><?php echo ip_h($resumen['saltados']); ?></strong><span>Saltados</span></div>
                </div>
            </div>

            <?php if (!empty($resumen['errores'])): ?>
                <div class="form-divider">
                    <i class="fa-solid fa-circle-exclamation"></i>
                    Observaciones
                </div>

                <div class="errors">
                    <?php foreach ($resumen['errores'] as $err): ?>
                        <div><?php echo ip_h($err); ?></div>
                    <?php endforeach; ?>
                </div>

                <p class="mini">
                    Solo se muestran las primeras <?php echo ip_h(IP_MAX_ERRORES_MOSTRAR); ?> observaciones para no saturar la pantalla.
                </p>
            <?php endif; ?>
        </section>
    <?php endif; ?>

    <div class="grid">
        <section class="card">
            <div class="card-header">
                <div class="card-title">
                    <div class="card-icon">
                        <i class="fa-solid fa-cloud-arrow-up"></i>
                    </div>
                    <div>
                        <h2>Cargar Excel</h2>
                        <p class="subtle">Importación por código modular.</p>
                    </div>
                </div>
                <span class="badge-soft">
                    <i class="fa-solid fa-file-excel"></i>
                    .xlsx
                </span>
            </div>

            <div class="format-card">
                <div class="format-title">
                    <i class="fa-solid fa-table-columns"></i>
                    Columnas requeridas
                </div>

                <div class="columns-list">
                    <span class="pill pill-orange"><i class="fa-solid fa-barcode"></i> CODIGO_MODULAR</span>
                    <span class="pill pill-blue"><i class="fa-solid fa-id-card"></i> DNI</span>
                    <span class="pill pill-gray"><i class="fa-solid fa-user"></i> APELLIDO_PATERNO</span>
                    <span class="pill pill-gray"><i class="fa-regular fa-user"></i> APELLIDO_MATERNO</span>
                    <span class="pill pill-green"><i class="fa-solid fa-signature"></i> NOMBRES</span>
                </div>
            </div>

            <a class="btn-download" href="importar_participantes.php?descargar=plantilla">
                <i class="fa-solid fa-download"></i>
                Descargar plantilla Excel
            </a>

            <form method="post" enctype="multipart/form-data" action="">
                <input type="hidden" name="csrf_token" value="<?php echo ip_h($csrf); ?>">

                <div class="form-divider">
                    <i class="fa-solid fa-gear"></i>
                    Datos de importación
                </div>

                <label><i class="bi bi-trophy"></i> Concurso</label>
                <div class="input-icon">
                    <i class="fa-solid fa-award"></i>
                    <select name="id_concurso" onchange="window.location='importar_participantes.php?id_concurso=' + encodeURIComponent(this.value)">
                        <?php foreach ($concursosActivos as $c): ?>
                            <option value="<?php echo ip_h($c['id_concurso']); ?>" <?php echo (int)$c['id_concurso'] === $idConcurso ? 'selected' : ''; ?>>
                                <?php echo ip_h($c['nombre'] . ' ' . $c['subtitulo']); ?>
                            </option>
                        <?php endforeach; ?>
                    </select>
                </div>

                <label><i class="bi bi-file-earmark-spreadsheet"></i> Archivo Excel</label>
                <div class="file-zone">
                    <input type="file" name="archivo" accept=".xlsx" required>
                    <p class="mini">
                        Sube únicamente archivos .xlsx generados con la plantilla oficial.
                    </p>
                </div>

                <label><i class="bi bi-chat-left-text"></i> Observación general</label>
                <textarea name="observacion_base" maxlength="1000" placeholder="Opcional">Importado por Excel con código modular. Grado y salón pendientes.</textarea>

                <button type="submit" class="btn-primary">
                    <i class="fa-solid fa-file-import"></i>
                    Importar participantes
                </button>
            </form>
        </section>

        <section class="card">
            <div class="card-header">
                <div class="card-title">
                    <div class="card-icon">
                        <i class="fa-solid fa-users"></i>
                    </div>
                    <div>
                        <h2>Últimos participantes</h2>
                        <p class="subtle">Registros recientes del concurso seleccionado.</p>
                    </div>
                </div>
                <span class="badge-soft">
                    <i class="fa-solid fa-database"></i>
                    <?php echo count($ultimosImportados); ?> registros
                </span>
            </div>

            <?php if (!empty($ultimosImportados)): ?>
                <div class="table-wrap">
                    <table>
                        <thead>
                            <tr>
                                <th>Código</th>
                                <th>DNI</th>
                                <th>Participante</th>
                                <th>Cód. modular</th>
                                <th>I.E.</th>
                                <th>Tipo</th>
                                <th>Nivel</th>
                                <th>Grado</th>
                            </tr>
                        </thead>
                        <tbody>
                            <?php foreach ($ultimosImportados as $p): ?>
                                <?php
                                    $tipoInstitucion = (string)($p['tipo_institucion'] ?? '');
                                    $tipoClase = $tipoInstitucion === 'PUBLICA' ? 'pill-blue' : 'pill-red';
                                    $nivel = (string)($p['nivel_modalidad_ie'] ?? '');
                                ?>
                                <tr>
                                    <td class="code"><?php echo ip_h($p['codigo_participante']); ?></td>
                                    <td><?php echo ip_h($p['documento']); ?></td>
                                    <td class="participant-name"><?php echo ip_h($p['apellidos_nombres']); ?></td>
                                    <td>
                                        <span class="pill pill-orange">
                                            <i class="fa-solid fa-barcode"></i>
                                            <?php echo ip_h($p['codigo_modular_ie']); ?>
                                        </span>
                                    </td>
                                    <td class="school-name"><?php echo ip_h($p['institucion_educativa']); ?></td>
                                    <td>
                                        <span class="pill <?php echo ip_h($tipoClase); ?>">
                                            <?php echo ip_h($tipoInstitucion); ?>
                                        </span>
                                    </td>
                                    <td>
                                        <span class="pill pill-green">
                                            <?php echo ip_h($nivel ?: 'PENDIENTE'); ?>
                                        </span>
                                    </td>
                                    <td><?php echo ip_h($p['grupo'] ?: 'Pendiente'); ?></td>
                                </tr>
                            <?php endforeach; ?>
                        </tbody>
                    </table>
                </div>
            <?php else: ?>
                <div class="empty-state">
                    <i class="fa-regular fa-folder-open"></i>
                    Aún no hay participantes registrados en este concurso.
                </div>
            <?php endif; ?>
        </section>
    </div>
</main>
</body>
</html>
