<?php
// modules/coordinador/dashboard.php
require_once __DIR__ . '/../../config/app.php';
require_once __DIR__ . '/../../includes/auth.php';
require_once __DIR__ . '/../../includes/functions.php';
require_once __DIR__ . '/../../includes/flash.php';
requireRol(ROL_COORDINADOR);

$user   = currentUser();
$db     = getDB();
$pageTitle = 'Dashboard Coordinador';
$idInst = instId();
$iCond = instCond('car'); // alias por defecto

// ── Datos del instituto (logo y nombre) ──────────────────────
$stInstCoord = $db->prepare("SELECT * FROM institutos WHERE id_instituto = :id LIMIT 1");
$stInstCoord->execute([':id' => $idInst ?: 1]);
$instCoord   = $stInstCoord->fetch() ?: [];
$logoCoord   = $instCoord['logo'] ?? '';
$nombreCoord = $instCoord['nombre'] ?? 'SIGVP';
$logoUrlCoord = $logoCoord ? BASE_URL . '/uploads/institutos/' . $logoCoord : '';

// ── id_coordinador ───────────────────────────────────────────
$stCoord = $db->prepare("SELECT id_coordinador FROM coordinadores WHERE id_usuario=:u");
$stCoord->execute([':u' => $user['id']]);
$coord   = $stCoord->fetch();
$idCoord = $coord['id_coordinador'] ?? null;

// ── Contadores prácticas ─────────────────────────────────────
$stPE = $db->prepare("SELECT pr.estado, COUNT(*) as total FROM practicas pr JOIN estudiantes est ON est.id_estudiante=pr.id_estudiante JOIN carreras car ON car.id_carrera=est.id_carrera WHERE 1=1{$iCond} GROUP BY pr.estado");
$stPE->execute(); $porEstado = $stPE->fetchAll();
$estados   = array_column($porEstado, 'total', 'estado');

// ── Contadores otros módulos ──────────────────────────────────
$cntConval = 0;
try { $stCV = $db->prepare("SELECT COUNT(*) FROM convalidaciones cv JOIN estudiantes est ON est.id_estudiante=cv.id_estudiante JOIN carreras car ON car.id_carrera=est.id_carrera WHERE cv.estado='pendiente'{$iCond}");
$stCV->execute(); $cntConval = (int)$stCV->fetchColumn(); } catch(Exception $e){}

$cntVinc = 0;
try {
    $stVinc = $db->prepare("SELECT COUNT(*) FROM proyectos_vinculacion WHERE estado='planificacion'" . instCond());
$stVinc->execute(); $cntVinc = (int)$stVinc->fetchColumn();
} catch(Exception $e){}

$cntTit = 0;
try { $stTit = $db->prepare("SELECT COUNT(*) FROM titulaciones t JOIN estudiantes est ON est.id_estudiante=t.id_estudiante JOIN carreras car ON car.id_carrera=est.id_carrera WHERE t.estado='enviada'{$iCond}");
$stTit->execute(); $cntTit = (int)$stTit->fetchColumn(); } catch(Exception $e){}

// ── Postulaciones PPP pendientes ─────────────────────────────
$postulaciones = $db->query("
    SELECT p.id_practica, p.estado, p.created_at,
           CONCAT(u.apellidos,' ',u.nombres) AS estudiante,
           COALESCE(em.razon_social, p.emp_nueva_nombre) AS empresa,
           pe.nombre  AS periodo,
           c.nombre   AS carrera
    FROM   practicas p
    JOIN   estudiantes est ON est.id_estudiante = p.id_estudiante
    JOIN   usuarios u      ON u.id_usuario      = est.id_usuario
    JOIN   carreras c      ON c.id_carrera      = est.id_carrera
    LEFT JOIN empresas em  ON em.id_empresa     = p.id_empresa
    JOIN   periodos_academicos pe ON pe.id_periodo = p.id_periodo
    WHERE  p.estado = 'postulado'" . instCond('c') . "
    ORDER  BY p.created_at DESC
    LIMIT  10
")->fetchAll();

// ── Convalidaciones pendientes ───────────────────────────────
$convalidaciones = [];
try {
    $convalidaciones = $db->query("
        SELECT cv.id_convalidacion, cv.estado, cv.created_at,
               CONCAT(u.apellidos,' ',u.nombres) AS estudiante,
               cv.asignatura_origen, cv.asignatura_destino,
               c.nombre AS carrera
        FROM   convalidaciones cv
        JOIN   estudiantes est ON est.id_estudiante = cv.id_estudiante
        JOIN   usuarios u      ON u.id_usuario      = est.id_usuario
        JOIN   carreras c      ON c.id_carrera      = est.id_carrera
        WHERE  cv.estado = 'pendiente'" . instCond('c') . "
        ORDER  BY cv.created_at DESC
        LIMIT  10
    ")->fetchAll();
} catch(Exception $e){}

// ── Proyectos de vinculación pendientes ──────────────────────
$vinculacion = [];
try {
    $instCondVinc = $idInst ? "AND pv.id_instituto = $idInst" : '';
    $vinculacion = $db->query("
        SELECT pv.id_proyecto, pv.nombre AS titulo, pv.estado, pv.created_at,
               pv.area AS carrera,
               CONCAT(u.apellidos,' ',u.nombres) AS responsable
        FROM   proyectos_vinculacion pv
        LEFT JOIN usuarios u ON u.id_usuario = pv.id_coordinador
        WHERE  pv.estado = 'planificacion' $instCondVinc
        ORDER  BY pv.created_at DESC
        LIMIT  10
    ")->fetchAll();
} catch(Exception $e){}

// ── Titulaciones pendientes ───────────────────────────────────
$titulaciones = [];
try {
    $titulaciones = $db->query("
        SELECT t.id_titulacion, t.estado, t.modalidad, t.created_at,
               CONCAT(u.apellidos,' ',u.nombres) AS estudiante,
               c.nombre AS carrera,
               t.titulo_trabajo
        FROM   titulaciones t
        JOIN   estudiantes est ON est.id_estudiante = t.id_estudiante
        JOIN   usuarios u      ON u.id_usuario      = est.id_usuario
        JOIN   carreras c      ON c.id_carrera      = est.id_carrera
        WHERE  t.estado = 'enviada'" . instCond('c') . "
        ORDER  BY t.created_at DESC
        LIMIT  10
    ")->fetchAll();
} catch(Exception $e){}

// ── Prácticas en progreso recientes ─────────────────────────
$recientes = $db->query("
    SELECT p.id_practica, p.estado, p.horas_cumplidas, p.horas_requeridas,
           CONCAT(u.apellidos,' ',u.nombres) AS estudiante,
           COALESCE(em.razon_social, p.emp_nueva_nombre) AS empresa
    FROM   practicas p
    JOIN   estudiantes est ON est.id_estudiante = p.id_estudiante
    JOIN   usuarios u      ON u.id_usuario      = est.id_usuario
    JOIN   carreras car    ON car.id_carrera     = est.id_carrera
    LEFT JOIN empresas em  ON em.id_empresa     = p.id_empresa
    WHERE  p.estado IN ('en_progreso','aprobado','informe_enviado'){$iCond}
    ORDER  BY p.updated_at DESC
    LIMIT  6
")->fetchAll();

// ── Helper: estrellas mini ────────────────────────────────────
function starMini(int $v): string {
    $s = '';
    for ($i = 1; $i <= 5; $i++)
        $s .= '<span style="color:'.($i<=$v?'#f59e0b':'#d1d5db').';font-size:13px;">★</span>';
    return $s;
}

// ── Últimas evaluaciones ─────────────────────────────────────
$evaluaciones = [];
try {
    $evaluaciones = $db->query("
        SELECT ev.id_practica,
               CONCAT(u.apellidos,' ',u.nombres) AS estudiante,
               em.razon_social AS empresa,
               CONCAT(ut.nombres,' ',ut.apellidos) AS tutor,
               ev.p1_satisfaccion, ev.p2_aprendizaje,
               ev.p3_infraestructura, ev.p4_tutoria, ev.p5_recomendaria,
               ROUND((ev.p1_satisfaccion+ev.p2_aprendizaje+ev.p3_infraestructura+ev.p4_tutoria)/4,1) AS promedio,
               ev.comentarios, ev.created_at
        FROM evaluaciones_satisfaccion ev
        JOIN practicas p     ON p.id_practica    = ev.id_practica
        JOIN estudiantes est ON est.id_estudiante = p.id_estudiante
        JOIN usuarios u      ON u.id_usuario      = est.id_usuario
        LEFT JOIN empresas em ON em.id_empresa    = p.id_empresa
        LEFT JOIN tutores t  ON t.id_tutor        = p.id_tutor
        LEFT JOIN usuarios ut ON ut.id_usuario    = t.id_usuario
        JOIN carreras car ON car.id_carrera = est.id_carrera
        WHERE ev.tipo_evaluador = 'estudiante'" . instCond('car') . "
        ORDER BY ev.created_at DESC LIMIT 5
    ")->fetchAll();
} catch(Exception $e){}

// ── Acción POST: aprobar/rechazar PPP rápido ────────────────
if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['id_practica'], $_POST['accion'])) {
    $id = (int)$_POST['id_practica'];
    $accion = $_POST['accion'];
    // Seguridad: verificar que la práctica pertenece al instituto del coordinador
    $instCheckPPP = $idInst ? "AND (SELECT car.id_instituto FROM estudiantes est2 JOIN carreras car ON car.id_carrera=est2.id_carrera WHERE est2.id_estudiante=pr2.id_estudiante) = $idInst" : '';
    if ($accion === 'aprobar' && $id > 0) {
        $db->prepare("UPDATE practicas pr2 SET estado='aprobado', id_coordinador=:cid WHERE id_practica=:id AND estado='postulado' $instCheckPPP")
           ->execute([':cid'=>$idCoord,':id'=>$id]);
        registrarAudit($user['id'], 'aprobar_postulacion_dashboard', 'practicas', $id);
        flashSet('ok', 'Postulación PPP aprobada.');
    } elseif ($accion === 'rechazar' && $id > 0) {
        $db->prepare("UPDATE practicas pr2 SET estado='rechazado' WHERE id_practica=:id AND estado='postulado' $instCheckPPP")
           ->execute([':id'=>$id]);
        registrarAudit($user['id'], 'rechazar_postulacion_dashboard', 'practicas', $id);
        flashSet('err', 'Postulación rechazada.');
    }
    header('Location: dashboard.php'); exit;
}

// Total pendientes de aprobación rápida
$totalPendientes = count($postulaciones) + count($convalidaciones) + count($vinculacion) + count($titulaciones);
?>
<!DOCTYPE html>
<html lang="es">
<head><?php include __DIR__ . '/../../includes/head.php'; ?>
<link rel="stylesheet" href="<?= BASE_URL ?>/assets/css/sidebar-grupos.css">
<style>
/* ═══════════════════════════════════════════════════
   Dashboard Coordinador — Tema Claro Profesional
   ═══════════════════════════════════════════════════ */
:root {
  --bg-page:   #f0f4f8;
  --bg-card:   #ffffff;
  --bg-inner:  #f8fafc;
  --border:    #e2e8f0;
  --border-med:#cbd5e1;
  --text-main: #1e293b;
  --text-sub:  #64748b;
  --text-light:#94a3b8;
  --blue:      #3b82f6;
  --green:     #10b981;
  --yellow:    #f59e0b;
  --red:       #ef4444;
  --purple:    #8b5cf6;
  --orange:    #f97316;
  --shadow-sm: 0 1px 3px rgba(0,0,0,.06),0 1px 2px rgba(0,0,0,.04);
  --shadow-md: 0 4px 12px rgba(0,0,0,.07);
  --radius:    12px;
  --radius-sm: 8px;
}

html,body { height:100%; margin:0; padding:0; overflow-x:hidden; }
.main-area { background:var(--bg-page); min-height:100vh; padding:24px 28px 36px; }

.page-header h4 { color:var(--text-main); font-weight:700; font-size:20px; letter-spacing:-.3px; margin:0; }
.page-header p  { color:var(--text-light); font-size:12px; margin:2px 0 0; }

/* ── STAT CARDS ── */
.stat-card {
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:18px 20px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  box-shadow:var(--shadow-sm);
  transition:box-shadow .2s,border-color .2s;
  text-decoration:none;
}
.stat-card:hover { box-shadow:var(--shadow-md); border-color:var(--border-med); }
.stat-num   { font-size:28px; font-weight:800; line-height:1; letter-spacing:-.5px; }
.stat-label { font-size:11px; color:var(--text-sub); margin-top:3px; font-weight:500; }
.stat-icon  { font-size:26px; opacity:.7; }

/* ── MÓDULOS PENDIENTES — tabs ── */
.aprobacion-wrap {
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:var(--radius);
  box-shadow:var(--shadow-sm);
  overflow:hidden;
  margin-bottom:24px;
}
.aprobacion-header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:16px 20px 0;
  border-bottom:1px solid var(--border);
  flex-wrap:wrap;
  gap:8px;
}
.aprobacion-title {
  font-size:14px;
  font-weight:700;
  color:var(--text-main);
  display:flex;
  align-items:center;
  gap:8px;
  padding-bottom:12px;
}
.aprobacion-title .total-badge {
  background:var(--red);
  color:#fff;
  font-size:11px;
  font-weight:700;
  padding:2px 8px;
  border-radius:20px;
}

/* Tabs de módulo */
.mod-tabs {
  display:flex;
  gap:4px;
  padding-bottom:0;
  flex-wrap:wrap;
}
.mod-tab {
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:8px 14px;
  font-size:12px;
  font-weight:600;
  color:var(--text-sub);
  background:transparent;
  border:none;
  border-bottom:3px solid transparent;
  cursor:pointer;
  transition:color .15s,border-color .15s;
  white-space:nowrap;
  position:relative;
  top:1px;
}
.mod-tab:hover  { color:var(--text-main); }
.mod-tab.active { color:var(--blue); border-bottom-color:var(--blue); }
.mod-tab.active.tab-ppp    { color:var(--blue);   border-bottom-color:var(--blue); }
.mod-tab.active.tab-conval { color:var(--purple); border-bottom-color:var(--purple); }
.mod-tab.active.tab-vinc   { color:var(--green);  border-bottom-color:var(--green); }
.mod-tab.active.tab-tit    { color:var(--orange); border-bottom-color:var(--orange); }
.tab-cnt {
  font-size:10px;
  font-weight:700;
  padding:1px 6px;
  border-radius:10px;
  color:#fff;
}
.tab-cnt-ppp    { background:var(--blue); }
.tab-cnt-conval { background:var(--purple); }
.tab-cnt-vinc   { background:var(--green); }
.tab-cnt-tit    { background:var(--orange); }

/* Paneles de módulo */
.mod-panel { display:none; padding:0; }
.mod-panel.active { display:block; }

/* Tabla rápida */
.q-table { width:100%; border-collapse:collapse; font-size:13px; }
.q-table th {
  font-size:10px;
  font-weight:700;
  letter-spacing:.7px;
  text-transform:uppercase;
  color:var(--text-light);
  padding:10px 16px 8px;
  border-bottom:1px solid var(--border);
  white-space:nowrap;
}
.q-table td {
  padding:11px 16px;
  border-bottom:1px solid #f1f5f9;
  vertical-align:middle;
  color:var(--text-main);
}
.q-table tr:last-child td { border-bottom:none; }
.q-table tr:hover td { background:#fafbff; }

.td-nombre  { font-weight:700; color:var(--text-main); }
.td-sub     { font-size:11px; color:var(--text-light); margin-top:2px; }
.td-muted   { color:var(--text-sub); font-size:12px; }
.td-mono    { font-family:monospace; font-size:11px; color:var(--blue); }

/* Acciones rápidas botones */
.btn-ok {
  display:inline-flex; align-items:center; gap:4px;
  padding:5px 12px; font-size:11px; font-weight:700;
  background:rgba(16,185,129,.1); color:#047857;
  border:1px solid rgba(16,185,129,.3); border-radius:6px;
  cursor:pointer; transition:background .15s;
  white-space:nowrap;
}
.btn-ok:hover { background:rgba(16,185,129,.2); }
.btn-no {
  display:inline-flex; align-items:center; gap:4px;
  padding:5px 12px; font-size:11px; font-weight:700;
  background:rgba(239,68,68,.08); color:#b91c1c;
  border:1px solid rgba(239,68,68,.25); border-radius:6px;
  cursor:pointer; transition:background .15s;
  white-space:nowrap;
}
.btn-no:hover { background:rgba(239,68,68,.18); }
.btn-detail {
  display:inline-flex; align-items:center; gap:4px;
  padding:5px 12px; font-size:11px; font-weight:600;
  background:var(--bg-inner); color:var(--text-sub);
  border:1px solid var(--border-med); border-radius:6px;
  text-decoration:none; white-space:nowrap;
}
.btn-detail:hover { background:var(--border); color:var(--text-main); }

/* Estado vacío en panel */
.panel-empty {
  padding:36px;
  text-align:center;
  color:var(--text-light);
  font-size:13px;
}
.panel-empty-icon { font-size:32px; margin-bottom:8px; }

/* Alerta banner pendientes */
.banner-pendientes {
  background:rgba(239,68,68,.06);
  border:1px solid rgba(239,68,68,.2);
  border-radius:var(--radius);
  padding:12px 18px;
  margin-bottom:18px;
  display:flex;
  align-items:center;
  gap:10px;
  font-size:13px;
  color:#b91c1c;
}
.banner-pendientes a { color:#b91c1c; font-weight:700; text-decoration:underline; }
.banner-pendientes.ok {
  background:rgba(16,185,129,.06);
  border-color:rgba(16,185,129,.2);
  color:#047857;
}

/* Tabla progreso recientes */
.tbl-wrap {
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:var(--radius);
  overflow:hidden;
  box-shadow:var(--shadow-sm);
}
.tbl-wrap .table th {
  font-size:10px; font-weight:700; letter-spacing:.7px;
  text-transform:uppercase; color:var(--text-light);
  background:var(--bg-inner); border-bottom:1px solid var(--border);
  padding:10px 16px 8px;
}
.tbl-wrap .table td {
  padding:11px 16px; vertical-align:middle;
  border-bottom:1px solid #f1f5f9; color:var(--text-main);
  font-size:13px;
}
.tbl-wrap .table tr:last-child td { border-bottom:none; }

/* Sección label */
.sec-label {
  font-size:11px; font-weight:700; letter-spacing:1px;
  text-transform:uppercase; color:var(--text-light);
  margin-bottom:10px;
}

/* Evaluaciones */
.eval-col-prom { font-size:15px; font-weight:700; }

/* Accesos rápidos */
.quick-card {
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:16px 18px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:6px;
  box-shadow:var(--shadow-sm);
  text-decoration:none;
  transition:box-shadow .2s,border-color .2s,transform .15s;
}
.quick-card:hover { box-shadow:var(--shadow-md); border-color:var(--border-med); transform:translateY(-1px); }
.quick-card-icon  { font-size:22px; }
.quick-card-label { font-weight:600; font-size:13px; color:var(--text-main); }
.quick-card-sub   { font-size:11px; color:var(--text-sub); margin-top:1px; }

/* Badge estados */
.badge-estado {
  display:inline-block; font-size:10px; font-weight:700;
  padding:3px 10px; border-radius:20px;
  text-transform:uppercase; letter-spacing:.4px; border:1px solid;
}
.st-postulado    { background:rgba(245,158,11,.1); color:#b45309; border-color:rgba(245,158,11,.3); }
.st-aprobado     { background:rgba(16,185,129,.1); color:#047857; border-color:rgba(16,185,129,.3); }
.st-en_progreso  { background:rgba(59,130,246,.1); color:#1d4ed8; border-color:rgba(59,130,246,.3); }
.st-completado   { background:rgba(16,185,129,.1); color:#047857; border-color:rgba(16,185,129,.3); }
.st-informe_enviado { background:rgba(139,92,246,.1); color:#5b21b6; border-color:rgba(139,92,246,.3); }
.st-pendiente    { background:rgba(245,158,11,.1); color:#b45309; border-color:rgba(245,158,11,.3); }
.st-enviada      { background:rgba(59,130,246,.1); color:#1d4ed8; border-color:rgba(59,130,246,.3); }
.st-planificacion{ background:rgba(139,92,246,.1); color:#5b21b6; border-color:rgba(139,92,246,.3); }

/* Barra de progreso */
.prog-track { background:#e9eef5; border-radius:3px; }
.prog-fill  { border-radius:3px; height:5px; }
</style>
</head>
<body>
<?php include __DIR__ . '/../../includes/navbar.php'; ?>
<div class="app-shell">
  <aside class="sidebar">
    <div class="sidebar-label">Coordinador</div>
    <a href="dashboard.php" class="active"><span class="icon"><i class="fa fa-gauge"></i></span> Dashboard</a>

    <div class="sidebar-group g-practicas">
      <span class="sg-label"><i class="fa fa-briefcase me-1"></i> Prácticas PPP</span>
      <a href="practicas.php"><span class="icon"><i class="fa fa-briefcase"></i></span> Prácticas</a>
      <a href="postulaciones.php">
        <span class="icon"><i class="fa fa-inbox"></i></span> Postulaciones
        <?php if (count($postulaciones)): ?>
          <span class="badge rounded-pill ms-auto" style="background:#3b82f6;color:#fff;font-size:10px;"><?= count($postulaciones) ?></span>
        <?php endif; ?>
      </a>
      <a href="fichas_ppp.php"><span class="icon"><i class="fa fa-file-pdf"></i></span> Fichas PPP</a>
      <a href="expedientes.php"><span class="icon"><i class="fa fa-folder-open"></i></span> Expedientes PPP</a>
      <a href="bitacoras.php"><span class="icon"><i class="fa fa-book-open"></i></span> Bitácoras</a>
      <a href="convalidaciones.php"><span class="icon"><i class="fa fa-rotate"></i></span> Convalidaciones
        <?php if ($cntConval): ?>
          <span class="badge rounded-pill ms-auto" style="background:#8b5cf6;color:#fff;font-size:10px;"><?= $cntConval ?></span>
        <?php endif; ?>
      </a>
      <a href="evaluaciones.php"><span class="icon"><i class="fa fa-star"></i></span> Evaluaciones</a>
    </div>

    <div class="sidebar-group g-vinculacion">
      <span class="sg-label"><i class="fa fa-handshake me-1"></i> Vinculación</span>
      <a href="vinculacion.php"><span class="icon"><i class="fa fa-handshake"></i></span> Vinculación
        <?php if ($cntVinc): ?>
          <span class="badge rounded-pill ms-auto" style="background:#10b981;color:#fff;font-size:10px;"><?= $cntVinc ?></span>
        <?php endif; ?>
      </a>
    </div>

    <div class="sidebar-group g-titulacion">
      <span class="sg-label"><i class="fa fa-graduation-cap me-1"></i> Titulación</span>
      <a href="titulacion.php"><span class="icon"><i class="fa fa-graduation-cap"></i></span> Titulación
        <?php if ($cntTit): ?>
          <span class="badge rounded-pill ms-auto" style="background:#f97316;color:#fff;font-size:10px;"><?= $cntTit ?></span>
        <?php endif; ?>
      </a>
    </div>

    <div class="sidebar-group g-reportes">
      <span class="sg-label"><i class="fa fa-chart-bar me-1"></i> Reportes</span>
      <a href="reportes.php"><span class="icon"><i class="fa fa-chart-bar"></i></span> Reportes CES</a>
    </div>

    <div class="sidebar-sep"></div>
    <a href="<?= BASE_URL ?>/auth/logout.php"><span class="icon"><i class="fa fa-right-from-bracket"></i></span> Salir</a>
  </aside>

  <main class="main-area">
    <?= flashHtml() ?>

    <!-- ── ENCABEZADO CON LOGO, INSTITUTO Y FECHA ── -->
    <div style="display:flex;align-items:center;justify-content:space-between;
                background:var(--bg-card);border:1px solid var(--border);
                border-radius:var(--radius);padding:16px 24px;margin-bottom:24px;
                box-shadow:var(--shadow-sm);">

      <!-- LOGO -->
      <div style="flex-shrink:0;">
        <?php if (!empty($logoUrlCoord)): ?>
          <img src="<?= htmlspecialchars($logoUrlCoord) ?>"
               alt="Logo <?= htmlspecialchars($nombreCoord) ?>"
               style="height:72px;width:72px;object-fit:contain;border-radius:10px;
                      border:1px solid var(--border);padding:4px;background:var(--bg-inner);">
        <?php else: ?>
          <div style="height:72px;width:72px;background:#1a3a6b;border-radius:10px;
                      display:flex;align-items:center;justify-content:center;font-size:32px;">🏫</div>
        <?php endif; ?>
      </div>

      <!-- NOMBRE DEL INSTITUTO -->
      <div style="flex:1;text-align:center;padding:0 20px;">
        <div style="font-size:11px;font-weight:700;letter-spacing:1.5px;
                    text-transform:uppercase;color:var(--text-light);margin-bottom:4px;">
          Panel Coordinador
        </div>
        <div style="font-size:19px;font-weight:900;color:var(--text-main);line-height:1.2;">
          <?= htmlspecialchars($nombreCoord) ?>
        </div>
        <div style="font-size:12px;color:var(--text-sub);margin-top:4px;">
          <?= htmlspecialchars($user['nombre'] ?? '') ?>
        </div>
      </div>

      <!-- FECHA Y HORA -->
      <div style="flex-shrink:0;text-align:center;background:var(--bg-inner);
                  border:1px solid var(--border);border-radius:var(--radius);
                  padding:12px 20px;min-width:130px;">
        <div style="font-size:22px;font-weight:800;color:var(--text-main);line-height:1;" id="coord-hora">
          <?= date('H:i:s') ?>
        </div>
        <div style="font-size:11px;color:var(--text-light);margin-top:4px;font-weight:600;" id="coord-fecha">
          <?= date('d/m/Y') ?>
        </div>
        <div style="font-size:10px;color:var(--border-med);margin-top:2px;" id="coord-dia">
          <?= ['Domingo','Lunes','Martes','Miércoles','Jueves','Viernes','Sábado'][date('w')] ?>
        </div>
      </div>

    </div>

    <!-- ── STAT CARDS ── -->
    <div class="row g-3 mb-4">
      <div class="col-6 col-lg-3">
        <div class="stat-card">
          <div>
            <div class="stat-num" style="color:var(--blue);"><?= $estados['postulado'] ?? 0 ?></div>
            <div class="stat-label">Postulaciones nuevas</div>
          </div>
          <div class="stat-icon">📥</div>
        </div>
      </div>
      <div class="col-6 col-lg-3">
        <div class="stat-card">
          <div>
            <div class="stat-num" style="color:var(--yellow);"><?= ($estados['aprobado']??0)+($estados['en_progreso']??0) ?></div>
            <div class="stat-label">En curso</div>
          </div>
          <div class="stat-icon">⚡</div>
        </div>
      </div>
      <div class="col-6 col-lg-3">
        <div class="stat-card">
          <div>
            <div class="stat-num" style="color:var(--purple);"><?= $estados['informe_enviado'] ?? 0 ?></div>
            <div class="stat-label">Informes por revisar</div>
          </div>
          <div class="stat-icon">📄</div>
        </div>
      </div>
      <div class="col-6 col-lg-3">
        <div class="stat-card">
          <div>
            <div class="stat-num" style="color:var(--green);"><?= $estados['completado'] ?? 0 ?></div>
            <div class="stat-label">Completadas</div>
          </div>
          <div class="stat-icon">✅</div>
        </div>
      </div>
    </div>

    <!-- ── BANNER pendientes ── -->
    <?php if ($totalPendientes > 0): ?>
    <div class="banner-pendientes mb-3">
      <i class="fa fa-triangle-exclamation"></i>
      Tienes <strong><?= $totalPendientes ?></strong> solicitud(es) pendiente(s) de revisión en los módulos de abajo.
    </div>
    <?php else: ?>
    <div class="banner-pendientes ok mb-3">
      <i class="fa fa-circle-check"></i>
      ¡Todo al día! No hay solicitudes pendientes en ningún módulo.
    </div>
    <?php endif; ?>

    <!-- ══════════════════════════════════════════════════════════
         APROBACIONES RÁPIDAS — 4 MÓDULOS EN TABS
    ══════════════════════════════════════════════════════════ -->
    <div class="aprobacion-wrap">
      <div class="aprobacion-header">
        <div class="aprobacion-title">
          <i class="fa fa-bolt" style="color:var(--yellow);"></i>
          Aprobaciones rápidas
          <?php if ($totalPendientes): ?>
            <span class="total-badge"><?= $totalPendientes ?> pendiente<?= $totalPendientes>1?'s':'' ?></span>
          <?php endif; ?>
        </div>
        <div class="mod-tabs">
          <!-- Tab PPP -->
          <button class="mod-tab tab-ppp active" onclick="switchTab('ppp',this)">
            <i class="fa fa-briefcase"></i> Prácticas PPP
            <?php if (count($postulaciones)): ?>
              <span class="tab-cnt tab-cnt-ppp"><?= count($postulaciones) ?></span>
            <?php endif; ?>
          </button>
          <!-- Tab Convalidaciones -->
          <button class="mod-tab tab-conval" onclick="switchTab('conval',this)">
            <i class="fa fa-rotate"></i> Convalidaciones
            <?php if ($cntConval): ?>
              <span class="tab-cnt tab-cnt-conval"><?= $cntConval ?></span>
            <?php endif; ?>
          </button>
          <!-- Tab Vinculación -->
          <button class="mod-tab tab-vinc" onclick="switchTab('vinc',this)">
            <i class="fa fa-handshake"></i> Vinculación
            <?php if ($cntVinc): ?>
              <span class="tab-cnt tab-cnt-vinc"><?= $cntVinc ?></span>
            <?php endif; ?>
          </button>
          <!-- Tab Titulación -->
          <button class="mod-tab tab-tit" onclick="switchTab('tit',this)">
            <i class="fa fa-graduation-cap"></i> Titulación
            <?php if ($cntTit): ?>
              <span class="tab-cnt tab-cnt-tit"><?= $cntTit ?></span>
            <?php endif; ?>
          </button>
        </div>
      </div>

      <!-- ── Panel PPP ── -->
      <div class="mod-panel active" id="panel-ppp">
        <?php if (empty($postulaciones)): ?>
        <div class="panel-empty">
          <div class="panel-empty-icon">🎉</div>
          Sin postulaciones PPP pendientes. ¡Todo al día!
        </div>
        <?php else: ?>
        <table class="q-table">
          <thead>
            <tr>
              <th>Estudiante</th>
              <th>Carrera</th>
              <th>Empresa</th>
              <th>Período</th>
              <th>Fecha</th>
              <th style="text-align:right;">Acciones</th>
            </tr>
          </thead>
          <tbody>
            <?php foreach ($postulaciones as $p): ?>
            <tr>
              <td>
                <div class="td-nombre"><?= htmlspecialchars($p['estudiante']) ?></div>
              </td>
              <td><span class="td-muted"><?= htmlspecialchars($p['carrera']) ?></span></td>
              <td><?= htmlspecialchars($p['empresa']) ?></td>
              <td><span class="td-muted"><?= htmlspecialchars($p['periodo']) ?></span></td>
              <td><span class="td-muted"><?= date('d/m/Y', strtotime($p['created_at'])) ?></span></td>
              <td style="text-align:right;">
                <div style="display:flex;gap:5px;justify-content:flex-end;flex-wrap:wrap;">
                  <form method="POST" style="margin:0;">
                    <input type="hidden" name="id_practica" value="<?= $p['id_practica'] ?>">
                    <button type="submit" name="accion" value="aprobar" class="btn-ok"
                            onclick="return confirm('¿Aprobar práctica de <?= htmlspecialchars(addslashes($p['estudiante'])) ?>?')">
                      <i class="fa fa-check"></i> Aprobar
                    </button>
                  </form>
                  <form method="POST" style="margin:0;">
                    <input type="hidden" name="id_practica" value="<?= $p['id_practica'] ?>">
                    <button type="submit" name="accion" value="rechazar" class="btn-no"
                            onclick="return confirm('¿Rechazar esta postulación?')">
                      <i class="fa fa-xmark"></i> Rechazar
                    </button>
                  </form>
                  <a href="postulaciones.php?estado=postulado" class="btn-detail">
                    <i class="fa fa-eye"></i> Detalle
                  </a>
                </div>
              </td>
            </tr>
            <?php endforeach; ?>
          </tbody>
        </table>
        <div style="padding:10px 16px;border-top:1px solid var(--border);text-align:right;">
          <a href="postulaciones.php" style="font-size:12px;color:var(--blue);text-decoration:none;font-weight:600;">
            Ver todas las postulaciones PPP <i class="fa fa-arrow-right fa-xs ms-1"></i>
          </a>
        </div>
        <?php endif; ?>
      </div>

      <!-- ── Panel Convalidaciones ── -->
      <div class="mod-panel" id="panel-conval">
        <?php if (empty($convalidaciones)): ?>
        <div class="panel-empty">
          <div class="panel-empty-icon">✅</div>
          Sin convalidaciones pendientes.
        </div>
        <?php else: ?>
        <table class="q-table">
          <thead>
            <tr>
              <th>Estudiante</th>
              <th>Carrera</th>
              <th>Asignatura origen</th>
              <th>Asignatura destino</th>
              <th>Fecha</th>
              <th style="text-align:right;">Acciones</th>
            </tr>
          </thead>
          <tbody>
            <?php foreach ($convalidaciones as $cv): ?>
            <tr>
              <td><div class="td-nombre"><?= htmlspecialchars($cv['estudiante']) ?></div></td>
              <td><span class="td-muted"><?= htmlspecialchars($cv['carrera']) ?></span></td>
              <td><?= htmlspecialchars($cv['asignatura_origen'] ?? '—') ?></td>
              <td><?= htmlspecialchars($cv['asignatura_destino'] ?? '—') ?></td>
              <td><span class="td-muted"><?= date('d/m/Y', strtotime($cv['created_at'])) ?></span></td>
              <td style="text-align:right;">
                <a href="convalidaciones.php?id=<?= $cv['id_convalidacion'] ?>" class="btn-detail">
                  <i class="fa fa-arrow-right"></i> Revisar
                </a>
              </td>
            </tr>
            <?php endforeach; ?>
          </tbody>
        </table>
        <div style="padding:10px 16px;border-top:1px solid var(--border);text-align:right;">
          <a href="convalidaciones.php" style="font-size:12px;color:var(--purple);text-decoration:none;font-weight:600;">
            Ver todas las convalidaciones <i class="fa fa-arrow-right fa-xs ms-1"></i>
          </a>
        </div>
        <?php endif; ?>
      </div>

      <!-- ── Panel Vinculación ── -->
      <div class="mod-panel" id="panel-vinc">
        <?php if (empty($vinculacion)): ?>
        <div class="panel-empty">
          <div class="panel-empty-icon">✅</div>
          Sin proyectos de vinculación en planificación.
        </div>
        <?php else: ?>
        <table class="q-table">
          <thead>
            <tr>
              <th>Proyecto</th>
              <th>Carrera</th>
              <th>Responsable</th>
              <th>Estado</th>
              <th>Fecha</th>
              <th style="text-align:right;">Acciones</th>
            </tr>
          </thead>
          <tbody>
            <?php foreach ($vinculacion as $vp): ?>
            <tr>
              <td><div class="td-nombre"><?= htmlspecialchars($vp['titulo']) ?></div></td>
              <td><span class="td-muted"><?= htmlspecialchars($vp['carrera'] ?? '—') ?></span></td>
              <td><span class="td-muted"><?= htmlspecialchars($vp['responsable'] ?? '—') ?></span></td>
              <td><span class="badge-estado st-planificacion">Planificación</span></td>
              <td><span class="td-muted"><?= date('d/m/Y', strtotime($vp['created_at'])) ?></span></td>
              <td style="text-align:right;">
                <a href="vinculacion.php?id=<?= $vp['id_proyecto'] ?>" class="btn-detail">
                  <i class="fa fa-arrow-right"></i> Revisar
                </a>
              </td>
            </tr>
            <?php endforeach; ?>
          </tbody>
        </table>
        <div style="padding:10px 16px;border-top:1px solid var(--border);text-align:right;">
          <a href="vinculacion.php" style="font-size:12px;color:var(--green);text-decoration:none;font-weight:600;">
            Ver todos los proyectos de vinculación <i class="fa fa-arrow-right fa-xs ms-1"></i>
          </a>
        </div>
        <?php endif; ?>
      </div>

      <!-- ── Panel Titulación ── -->
      <div class="mod-panel" id="panel-tit">
        <?php if (empty($titulaciones)): ?>
        <div class="panel-empty">
          <div class="panel-empty-icon">✅</div>
          Sin titulaciones enviadas para revisión.
        </div>
        <?php else: ?>
        <table class="q-table">
          <thead>
            <tr>
              <th>Estudiante</th>
              <th>Carrera</th>
              <th>Trabajo / Examen</th>
              <th>Modalidad</th>
              <th>Fecha</th>
              <th style="text-align:right;">Acciones</th>
            </tr>
          </thead>
          <tbody>
            <?php foreach ($titulaciones as $tit): ?>
            <tr>
              <td><div class="td-nombre"><?= htmlspecialchars($tit['estudiante']) ?></div></td>
              <td><span class="td-muted"><?= htmlspecialchars($tit['carrera']) ?></span></td>
              <td style="max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;">
                <?= htmlspecialchars($tit['titulo_trabajo'] ?? '—') ?>
              </td>
              <td>
                <?php $ml=['examen_complexivo'=>'Examen','trabajo_investigacion'=>'Investigación','sin_definir'=>'S/D']; ?>
                <span class="badge-estado st-enviada"><?= $ml[$tit['modalidad']] ?? ($tit['modalidad']??'—') ?></span>
              </td>
              <td><span class="td-muted"><?= date('d/m/Y', strtotime($tit['created_at'])) ?></span></td>
              <td style="text-align:right;">
                <a href="titulacion.php?id=<?= $tit['id_titulacion'] ?>" class="btn-detail">
                  <i class="fa fa-arrow-right"></i> Revisar
                </a>
              </td>
            </tr>
            <?php endforeach; ?>
          </tbody>
        </table>
        <div style="padding:10px 16px;border-top:1px solid var(--border);text-align:right;">
          <a href="titulacion.php" style="font-size:12px;color:var(--orange);text-decoration:none;font-weight:600;">
            Ver todas las titulaciones <i class="fa fa-arrow-right fa-xs ms-1"></i>
          </a>
        </div>
        <?php endif; ?>
      </div>

    </div><!-- fin aprobacion-wrap -->

    <!-- ── PRÁCTICAS EN PROGRESO ── -->
    <?php if (!empty($recientes)): ?>
    <div class="sec-label">Prácticas en progreso recientes</div>
    <div class="tbl-wrap mb-4">
      <table class="table table-borderless mb-0">
        <thead>
          <tr><th>Estudiante</th><th>Empresa</th><th>Avance</th><th>Estado</th></tr>
        </thead>
        <tbody>
          <?php foreach ($recientes as $r):
            $pct = $r['horas_requeridas'] > 0 ? min(100,round($r['horas_cumplidas']/$r['horas_requeridas']*100)) : 0;
            $pc  = $pct>=80?'var(--green)':($pct>=40?'var(--yellow)':'var(--red)');
          ?>
          <tr>
            <td><strong><?= htmlspecialchars($r['estudiante']) ?></strong></td>
            <td style="color:var(--text-sub);font-size:12px;"><?= htmlspecialchars($r['empresa']) ?></td>
            <td style="min-width:130px;">
              <div style="display:flex;align-items:center;gap:7px;">
                <div class="prog-track" style="flex:1;height:5px;">
                  <div class="prog-fill" style="width:<?=$pct?>%;background:<?=$pc?>;"></div>
                </div>
                <span style="font-size:11px;color:<?=$pc?>;font-weight:700;"><?=$pct?>%</span>
              </div>
            </td>
            <td><?= badgeEstado($r['estado']) ?></td>
          </tr>
          <?php endforeach; ?>
        </tbody>
      </table>
    </div>
    <?php endif; ?>

    <!-- ── EVALUACIONES ── -->
    <?php if (!empty($evaluaciones)): ?>
    <div class="d-flex justify-content-between align-items-center mb-2 mt-1">
      <div>
        <span style="font-size:14px;font-weight:700;color:var(--text-main);">⭐ Votaciones de estudiantes al tutor</span>
        <span style="font-size:12px;color:var(--text-light);margin-left:8px;">Últimas evaluaciones de satisfacción</span>
      </div>
      <a href="evaluaciones.php" class="btn-detail">Ver todas <i class="fa fa-arrow-right ms-1"></i></a>
    </div>
    <div class="tbl-wrap mb-4">
      <table class="table table-borderless mb-0" style="font-size:13px;">
        <thead>
          <tr>
            <th>Estudiante</th><th>Empresa</th><th>Tutor académico</th>
            <th style="text-align:center;">Satisf.</th><th style="text-align:center;">Aprendiz.</th>
            <th style="text-align:center;">Infraest.</th><th style="text-align:center;">Tutoría</th>
            <th style="text-align:center;">Prom.</th><th style="text-align:center;">¿Recomienda?</th>
          </tr>
        </thead>
        <tbody>
        <?php foreach ($evaluaciones as $ev):
          $prom = (float)$ev['promedio'];
          $cp   = $prom>=4?'var(--green)':($prom>=3?'var(--yellow)':'var(--red)');
        ?>
        <tr>
          <td><strong><?= htmlspecialchars($ev['estudiante']) ?></strong>
            <div style="font-size:11px;color:var(--text-light);"><?= date('d/m/Y',strtotime($ev['created_at'])) ?></div>
          </td>
          <td style="color:var(--text-sub);font-size:12px;"><?= htmlspecialchars($ev['empresa']) ?></td>
          <td style="font-size:12px;color:var(--text-sub);"><?= htmlspecialchars($ev['tutor']??'—') ?></td>
          <td style="text-align:center;"><?= starMini((int)$ev['p1_satisfaccion']) ?></td>
          <td style="text-align:center;"><?= starMini((int)$ev['p2_aprendizaje']) ?></td>
          <td style="text-align:center;"><?= starMini((int)$ev['p3_infraestructura']) ?></td>
          <td style="text-align:center;"><?= starMini((int)$ev['p4_tutoria']) ?></td>
          <td style="text-align:center;">
            <span class="eval-col-prom" style="color:<?=$cp?>;"><?=$prom?></span>
            <span style="font-size:10px;color:var(--text-light);">/5</span>
          </td>
          <td style="text-align:center;">
            <?php if ($ev['p5_recomendaria']): ?>
              <i class="fa fa-thumbs-up" style="color:var(--green);font-size:14px;"></i>
            <?php else: ?>
              <i class="fa fa-thumbs-down" style="color:var(--red);font-size:14px;"></i>
            <?php endif; ?>
          </td>
        </tr>
        <?php if ($ev['comentarios']): ?>
        <tr>
          <td colspan="9" style="padding-top:0;padding-bottom:8px;">
            <div style="background:rgba(59,130,246,.05);border:1px solid rgba(59,130,246,.15);
                        border-radius:6px;padding:6px 10px;font-size:11px;color:var(--text-sub);">
              <i class="fa fa-comment me-1" style="color:var(--blue);"></i><?= htmlspecialchars($ev['comentarios']) ?>
            </div>
          </td>
        </tr>
        <?php endif; ?>
        <?php endforeach; ?>
        </tbody>
      </table>
    </div>
    <?php endif; ?>

    <!-- ── ACCESOS RÁPIDOS ── -->
    <div class="sec-label">Accesos rápidos</div>
    <div class="row g-3">
      <div class="col-6 col-lg-3">
        <a href="practicas.php" class="quick-card">
          <div class="quick-card-icon">📋</div>
          <div><div class="quick-card-label">Prácticas</div><div class="quick-card-sub">Ver todas</div></div>
        </a>
      </div>
      <div class="col-6 col-lg-3">
        <a href="postulaciones.php" class="quick-card">
          <div class="quick-card-icon">📥</div>
          <div><div class="quick-card-label">Postulaciones</div>
            <div class="quick-card-sub"><?= count($postulaciones) ?> pendiente(s)</div></div>
        </a>
      </div>
      <div class="col-6 col-lg-3">
        <a href="convalidaciones.php" class="quick-card">
          <div class="quick-card-icon">⇄</div>
          <div><div class="quick-card-label">Convalidaciones</div>
            <div class="quick-card-sub"><?= $cntConval ?> pendiente(s)</div></div>
        </a>
      </div>
      <div class="col-6 col-lg-3">
        <a href="vinculacion.php" class="quick-card">
          <div class="quick-card-icon">🤝</div>
          <div><div class="quick-card-label">Vinculación</div>
            <div class="quick-card-sub"><?= $cntVinc ?> en planificación</div></div>
        </a>
      </div>
      <div class="col-6 col-lg-3">
        <a href="titulacion.php" class="quick-card">
          <div class="quick-card-icon">🎓</div>
          <div><div class="quick-card-label">Titulación</div>
            <div class="quick-card-sub"><?= $cntTit ?> por revisar</div></div>
        </a>
      </div>
      <div class="col-6 col-lg-3">
        <a href="expedientes.php" class="quick-card">
          <div class="quick-card-icon">📁</div>
          <div><div class="quick-card-label">Expedientes PPP</div><div class="quick-card-sub">Revisar documentos</div></div>
        </a>
      </div>
      <div class="col-6 col-lg-3">
        <a href="bitacoras.php" class="quick-card">
          <div class="quick-card-icon">📓</div>
          <div><div class="quick-card-label">Bitácoras</div><div class="quick-card-sub">Supervisar</div></div>
        </a>
      </div>
      <div class="col-6 col-lg-3">
        <a href="reportes.php" class="quick-card">
          <div class="quick-card-icon">📊</div>
          <div><div class="quick-card-label">Reportes CES</div><div class="quick-card-sub">Generar</div></div>
        </a>
      </div>
    </div>

  </main>
</div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.3/js/bootstrap.bundle.min.js"></script>
<script>
var BASE_URL='<?= BASE_URL ?>';

function switchTab(id, btn) {
  // Ocultar todos los paneles
  document.querySelectorAll('.mod-panel').forEach(function(p){ p.classList.remove('active'); });
  // Desactivar todos los tabs
  document.querySelectorAll('.mod-tab').forEach(function(t){ t.classList.remove('active'); });
  // Activar el panel y tab seleccionados
  document.getElementById('panel-' + id).classList.add('active');
  btn.classList.add('active');
}

// Auto-abrir el tab que tenga pendientes al cargar
(function(){
  var orden = ['ppp','conval','vinc','tit'];
  var cnts  = {
    ppp:    <?= count($postulaciones) ?>,
    conval: <?= $cntConval ?>,
    vinc:   <?= $cntVinc ?>,
    tit:    <?= $cntTit ?>
  };
  for (var i=0; i<orden.length; i++) {
    if (cnts[orden[i]] > 0) {
      var tabBtn = document.querySelector('.tab-' + orden[i]);
      if (tabBtn) { switchTab(orden[i], tabBtn); }
      break;
    }
  }
})();

// Reloj en tiempo real
(function(){
  var dias = ['Domingo','Lunes','Martes','Miércoles','Jueves','Viernes','Sábado'];
  function tick() {
    var n  = new Date();
    var hh = String(n.getHours()).padStart(2,'0');
    var mm = String(n.getMinutes()).padStart(2,'0');
    var ss = String(n.getSeconds()).padStart(2,'0');
    var dd = String(n.getDate()).padStart(2,'0');
    var mo = String(n.getMonth()+1).padStart(2,'0');
    var yy = n.getFullYear();
    document.getElementById('coord-hora').textContent  = hh+':'+mm+':'+ss;
    document.getElementById('coord-fecha').textContent = dd+'/'+mo+'/'+yy;
    document.getElementById('coord-dia').textContent   = dias[n.getDay()];
  }
  setInterval(tick, 1000);
  tick();
})();
</script>
</body>
</html>