<?php
require_once __DIR__ . DIRECTORY_SEPARATOR . '..' . DIRECTORY_SEPARATOR . '..' . DIRECTORY_SEPARATOR . 'config' . DIRECTORY_SEPARATOR . 'app.php';
require_once __DIR__ . DIRECTORY_SEPARATOR . '..' . DIRECTORY_SEPARATOR . '..' . DIRECTORY_SEPARATOR . 'includes' . DIRECTORY_SEPARATOR . 'auth.php';
require_once __DIR__ . DIRECTORY_SEPARATOR . '..' . DIRECTORY_SEPARATOR . '..' . DIRECTORY_SEPARATOR . 'includes' . DIRECTORY_SEPARATOR . 'functions.php';
require_once __DIR__ . DIRECTORY_SEPARATOR . '..' . DIRECTORY_SEPARATOR . '..' . DIRECTORY_SEPARATOR . 'includes' . DIRECTORY_SEPARATOR . 'flash.php';
requireRol(ROL_TUTOR);
$idInst = instId();

$user      = currentUser();
$db        = getDB();
$pageTitle = 'Mis Estudiantes';

// Obtener id_tutor del usuario en sesión
$stTutor = $db->prepare("SELECT id_tutor FROM tutores WHERE id_usuario = :uid");
$stTutor->execute([':uid' => $user['id']]);
$tutor = $stTutor->fetch();

// ── Filtros GET ───────────────────────────────────────────────
$filtroPeriodo  = trim($_GET['periodo']  ?? '');
$filtroCarrera  = trim($_GET['carrera']  ?? '');
$_pp            = (int)($_GET['pp']  ?? 25);
$porPagina      = in_array($_pp, [25,50,100,200]) ? $_pp : 25;
$pagina         = max(1, (int)($_GET['pag'] ?? 1));
$totalRegistros = 0;
$totalPaginas   = 1;

$estudiantes = [];
$totales     = ['activos'=>0,'completados'=>0,'pendientes'=>0,'total'=>0];
$periodos    = [];
$carreras    = [];

if ($tutor) {
    // ── Cargar combos ─────────────────────────────────────────
    // Ciclos que tiene este tutor
    $stPer = $db->prepare("
        SELECT DISTINCT pe.id_periodo, pe.nombre
        FROM practicas pr
        JOIN periodos_academicos pe ON pe.id_periodo = pr.id_periodo
        WHERE pr.id_tutor = :tid
        ORDER BY pe.nombre DESC
    ");
    $stPer->execute([':tid' => $tutor['id_tutor']]);
    $periodos = $stPer->fetchAll();

    // Carreras que tiene este tutor
    $stCar = $db->prepare("
        SELECT DISTINCT c.id_carrera, c.nombre
        FROM practicas pr
        JOIN estudiantes e ON e.id_estudiante = pr.id_estudiante
        JOIN carreras c    ON c.id_carrera    = e.id_carrera
        WHERE pr.id_tutor = :tid
        ORDER BY c.nombre ASC
    ");
    $stCar->execute([':tid' => $tutor['id_tutor']]);
    $carreras = $stCar->fetchAll();

    // ── Query principal con filtros ───────────────────────────
    $where  = "WHERE pr.id_tutor = :tid";
    $params = [':tid' => $tutor['id_tutor']];

    if ($filtroPeriodo !== '') {
        $where .= " AND pe.id_periodo = :pid";
        $params[':pid'] = $filtroPeriodo;
    }
    if ($filtroCarrera !== '') {
        $where .= " AND c.id_carrera = :cid";
        $params[':cid'] = $filtroCarrera;
    }

    $sqlBase = "
        FROM   practicas pr
        JOIN   estudiantes e   ON e.id_estudiante = pr.id_estudiante
        JOIN   usuarios uu     ON uu.id_usuario    = e.id_usuario
        JOIN   carreras c      ON c.id_carrera     = e.id_carrera
        LEFT JOIN empresas em  ON em.id_empresa    = pr.id_empresa
        JOIN   periodos_academicos pe ON pe.id_periodo = pr.id_periodo
        $where
    ";

    // Total para paginación
    $stCount = $db->prepare("SELECT COUNT(*) $sqlBase");
    $stCount->execute($params);
    $totalRegistros = (int)$stCount->fetchColumn();
    $totalPaginas   = $totalRegistros > 0 ? max(1, (int)ceil($totalRegistros / $porPagina)) : 1;
    $pagina         = min($pagina, $totalPaginas);
    $offset         = ($pagina - 1) * $porPagina;

    $stEst = $db->prepare("
        SELECT
            pr.id_practica,
            pr.estado,
            pr.horas_requeridas,
            pr.horas_cumplidas,
            pr.area_practica,
            pr.cargo_practica,
            pr.fecha_inicio,
            pr.fecha_fin,
            pr.nota_tutor_academico,
            CONCAT(uu.nombres,' ',uu.apellidos)  AS estudiante_nombre,
            uu.email                              AS estudiante_email,
            uu.telefono                           AS estudiante_tel,
            c.nombre                              AS carrera,
            COALESCE(em.razon_social, pr.emp_nueva_nombre) AS empresa,
            pe.nombre                             AS periodo,
            (SELECT COUNT(*) FROM bitacoras b WHERE b.id_practica = pr.id_practica AND b.estado = 'enviada')  AS bits_pendientes,
            (SELECT COUNT(*) FROM bitacoras b WHERE b.id_practica = pr.id_practica AND b.estado = 'validada') AS bits_validadas,
            (SELECT COUNT(*) FROM bitacoras b WHERE b.id_practica = pr.id_practica) AS bits_total
        $sqlBase
        ORDER  BY pr.estado ASC, uu.apellidos ASC
        LIMIT  :lim OFFSET :off
    ");
    $params[':lim'] = $porPagina;
    $params[':off'] = $offset;
    $stEst->execute($params);
    $estudiantes = $stEst->fetchAll();

    // Totales (sin paginar) para stat cards
    $stTot = $db->prepare("
        SELECT pr.estado,
               (SELECT COUNT(*) FROM bitacoras b WHERE b.id_practica = pr.id_practica AND b.estado='enviada') AS bits_p
        $sqlBase
    ");
    $paramsTot = $params;
    unset($paramsTot[':lim'], $paramsTot[':off']);
    $stTot->execute($paramsTot);
    foreach ($stTot->fetchAll() as $r) {
        $totales['total']++;
        if (in_array($r['estado'], ['aprobado','en_progreso','informe_enviado'])) $totales['activos']++;
        if ($r['estado'] === 'completado') $totales['completados']++;
        if ($r['bits_p'] > 0) $totales['pendientes']++;
    }
}

// Guardar nota del tutor
if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['id_practica'])) {
    $idPr = (int)$_POST['id_practica'];
    $nota = !empty($_POST['nota']) ? min(100, max(0, (float)$_POST['nota'])) : null;
    $obs  = trim($_POST['observaciones'] ?? '');
    $db->prepare("UPDATE practicas SET nota_tutor_academico=:n, observaciones=:o WHERE id_practica=:id AND id_tutor=:tid")
       ->execute([':n'=>$nota, ':o'=>$obs, ':id'=>$idPr, ':tid'=>$tutor['id_tutor']??0]);
    registrarAudit($user['id'], 'calificar_estudiante', 'practicas', $idPr);
    flashSet('ok', 'Calificación guardada correctamente.');
    header('Location: mis_estudiantes.php?' . http_build_query([
        'periodo'=>$filtroPeriodo,'carrera'=>$filtroCarrera,'pp'=>$porPagina,'pag'=>$pagina
    ]));
    exit;
}

// Helper URL con filtros activos
function urlFiltro(array $extra = []): string {
    global $filtroPeriodo, $filtroCarrera, $porPagina, $pagina;
    $base = ['periodo'=>$filtroPeriodo,'carrera'=>$filtroCarrera,'pp'=>$porPagina,'pag'=>$pagina];
    return 'mis_estudiantes.php?' . http_build_query(array_merge($base, $extra));
}
?>
<?php $paginaActual = 'mis_estudiantes'; ?>
<!DOCTYPE html>
<html lang="es">
<head><?php include __DIR__ . DIRECTORY_SEPARATOR . '..' . DIRECTORY_SEPARATOR . '..' . DIRECTORY_SEPARATOR . 'includes' . DIRECTORY_SEPARATOR . 'head.php'; ?>
<link rel="stylesheet" href="<?= BASE_URL ?>/assets/css/sidebar.css">
<link rel="stylesheet" href="<?= BASE_URL ?>/assets/css/sidebar-tutor.css">
<style>
.filtros-bar {
  display:flex; flex-wrap:wrap; gap:10px; align-items:flex-end;
  background:#fff; border:1px solid #e2e8f0; border-radius:12px;
  padding:14px 16px; margin-bottom:20px;
}
.filtros-bar label { font-size:11px; font-weight:700; text-transform:uppercase;
  letter-spacing:.5px; color:#64748b; margin-bottom:3px; display:block; }
.filtros-bar select {
  border:1.5px solid #e2e8f0; border-radius:8px; padding:6px 10px;
  font-size:13px; background:#f8fafc; color:#1e293b;
  min-width:160px; cursor:pointer;
}
.filtros-bar select:focus { outline:none; border-color:#2ea8ff;
  box-shadow:0 0 0 3px rgba(46,168,255,.12); }
.btn-filtrar {
  background:linear-gradient(135deg,#0f1f3d,#2ea8ff); border:none;
  border-radius:8px; color:#fff; font-size:13px; font-weight:600;
  padding:7px 18px; cursor:pointer; transition:opacity .2s;
}
.btn-filtrar:hover { opacity:.88; }
.btn-limpiar {
  background:none; border:1.5px solid #e2e8f0; border-radius:8px;
  color:#64748b; font-size:13px; padding:6px 14px; cursor:pointer;
  transition:all .2s;
}
.btn-limpiar:hover { border-color:#94a3b8; color:#334155; }
.paginacion {
  display:flex; align-items:center; justify-content:space-between;
  flex-wrap:wrap; gap:10px; margin-top:16px; padding:10px 4px;
}
.pag-info { font-size:12px; color:#64748b; }
.pag-btns { display:flex; gap:4px; flex-wrap:wrap; }
.pag-btn {
  min-width:34px; height:34px; border-radius:7px; border:1.5px solid #e2e8f0;
  background:#fff; color:#374151; font-size:13px; font-weight:500;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; text-decoration:none; transition:all .15s;
}
.pag-btn:hover { border-color:#2ea8ff; color:#2ea8ff; }
.pag-btn.active { background:#2ea8ff; border-color:#2ea8ff; color:#fff; font-weight:700; }
.pag-btn.disabled { opacity:.4; pointer-events:none; }
.pp-sel { border:1.5px solid #e2e8f0; border-radius:7px; padding:5px 8px;
  font-size:12px; background:#f8fafc; color:#374151; cursor:pointer; }
</style>
</head>
<body>
<?php include __DIR__ . DIRECTORY_SEPARATOR . '..' . DIRECTORY_SEPARATOR . '..' . DIRECTORY_SEPARATOR . 'includes' . DIRECTORY_SEPARATOR . 'navbar.php'; ?>

<div class="app-shell">
  <?php include __DIR__ . DIRECTORY_SEPARATOR . '..' . DIRECTORY_SEPARATOR . '..' . DIRECTORY_SEPARATOR . 'includes' . DIRECTORY_SEPARATOR . 'sidebar-tutor.php'; ?>

  <main class="main-area">
    <div class="page-header">
      <h4>Mis Estudiantes</h4>
      <p>Seguimiento y calificación de prácticas asignadas</p>
    </div>
    <?= flashHtml() ?>

    <?php if (!$tutor): ?>
    <div class="alert-dark-danger p-3">
      <i class="fa fa-circle-exclamation me-2"></i>
      Tu perfil de tutor no está configurado. Contacta al administrador.
    </div>
    <?php else: ?>

    <!-- 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:#2ea8ff;"><?=$totales['total']?></div><div class="stat-label">Total asignados</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:#3dffa0;"><?=$totales['activos']?></div><div class="stat-label">En progreso</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:#f7b93e;"><?=$totales['pendientes']?></div><div class="stat-label">Bitácoras por validar</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:#c792ea;"><?=$totales['completados']?></div><div class="stat-label">Completados</div></div><div class="stat-icon">✅</div></div>
      </div>
    </div>

    <!-- ── Filtros ── -->
    <form method="GET" action="mis_estudiantes.php" class="filtros-bar">
      <div>
        <label>Ciclo / Período</label>
        <select name="periodo">
          <option value="">Todos los ciclos</option>
          <?php foreach ($periodos as $p): ?>
            <option value="<?= $p['id_periodo'] ?>" <?= $filtroPeriodo == $p['id_periodo'] ? 'selected' : '' ?>>
              <?= htmlspecialchars($p['nombre']) ?>
            </option>
          <?php endforeach; ?>
        </select>
      </div>
      <div>
        <label>Carrera</label>
        <select name="carrera">
          <option value="">Todas las carreras</option>
          <?php foreach ($carreras as $c): ?>
            <option value="<?= $c['id_carrera'] ?>" <?= $filtroCarrera == $c['id_carrera'] ? 'selected' : '' ?>>
              <?= htmlspecialchars($c['nombre']) ?>
            </option>
          <?php endforeach; ?>
        </select>
      </div>
      <div>
        <label>Mostrar</label>
        <select name="pp">
          <?php foreach ([25,50,100,200] as $n): ?>
            <option value="<?=$n?>" <?= $porPagina==$n ? 'selected':'' ?>><?=$n?> por página</option>
          <?php endforeach; ?>
        </select>
      </div>
      <input type="hidden" name="pag" value="1">
      <button type="submit" class="btn-filtrar"><i class="fa fa-filter me-1"></i>Filtrar</button>
      <a href="mis_estudiantes.php" class="btn-limpiar"><i class="fa fa-xmark me-1"></i>Limpiar</a>
    </form>

    <?php if (empty($estudiantes)): ?>
    <div class="alert-dark-info p-3">
      <i class="fa fa-info-circle me-2"></i>
      No hay estudiantes con los filtros seleccionados.
    </div>
    <?php else: ?>

    <!-- Tabla de estudiantes -->
    <div class="tbl-wrap">
      <table class="table table-borderless mb-0">
        <thead>
          <tr>
            <th>#</th>
            <th>Estudiante</th>
            <th>Carrera / Empresa</th>
            <th>Período</th>
            <th>Avance</th>
            <th>Bitácoras</th>
            <th>Estado</th>
            <th>Nota</th>
            <th>Acciones</th>
          </tr>
        </thead>
        <tbody>
          <?php foreach ($estudiantes as $i => $e):
            $pct   = pct($e['horas_cumplidas'], $e['horas_requeridas']);
            $color = $pct >= 100 ? '#3dffa0' : ($pct >= 50 ? '#2ea8ff' : '#f7b93e');
            $num   = ($pagina - 1) * $porPagina + $i + 1;
          ?>
          <tr>
            <td style="color:#8b949e;font-size:12px;"><?= $num ?></td>
            <td>
              <div style="font-weight:600;font-size:13px;"><?= htmlspecialchars($e['estudiante_nombre']) ?></div>
              <div style="font-size:11px;color:#8b949e;"><?= htmlspecialchars($e['estudiante_email']) ?></div>
              <?php if($e['estudiante_tel']): ?>
              <div style="font-size:11px;color:#8b949e;"><i class="fa fa-phone fa-xs me-1"></i><?= htmlspecialchars($e['estudiante_tel']) ?></div>
              <?php endif; ?>
            </td>
            <td>
              <div style="font-size:12px;"><?= htmlspecialchars($e['carrera']) ?></div>
              <div style="font-size:11px;color:#8b949e;"><?= htmlspecialchars($e['empresa']) ?></div>
              <?php if($e['area_practica']): ?>
              <div style="font-size:11px;color:#8b949e;font-style:italic;"><?= htmlspecialchars($e['area_practica']) ?></div>
              <?php endif; ?>
            </td>
            <td style="font-size:12px;color:#8b949e;"><?= htmlspecialchars($e['periodo']) ?></td>
            <td style="min-width:120px;">
              <div style="display:flex;align-items:center;gap:6px;">
                <div style="flex:1;background:#30363d;border-radius:4px;height:6px;overflow:hidden;">
                  <div style="width:<?=$pct?>%;background:<?=$color?>;height:6px;border-radius:4px;"></div>
                </div>
                <span style="font-size:11px;color:#8b949e;white-space:nowrap;"><?=$e['horas_cumplidas']?>/<?=$e['horas_requeridas']?>h</span>
              </div>
              <div style="font-size:10px;color:#8b949e;margin-top:2px;"><?=$pct?>% completado</div>
            </td>
            <td>
              <div style="font-size:12px;">
                <?php if($e['bits_pendientes']>0): ?>
                  <span style="color:#f7b93e;font-weight:600;"><i class="fa fa-clock me-1"></i><?=$e['bits_pendientes']?> pendiente(s)</span><br>
                <?php endif; ?>
                <span style="color:#8b949e;"><?=$e['bits_validadas']?>/<?=$e['bits_total']?> validadas</span>
              </div>
            </td>
            <td><?= badgeEstado($e['estado']) ?></td>
            <td>
              <?php if ($e['nota_tutor_academico'] !== null): ?>
                <span style="font-size:15px;font-weight:700;color:#3dffa0;"><?= number_format($e['nota_tutor_academico'],2) ?></span>
              <?php else: ?>
                <span style="color:#8b949e;font-size:12px;">Sin nota</span>
              <?php endif; ?>
            </td>
            <td>
              <div class="d-flex gap-1 flex-wrap">
                <button class="btn btn-sm btn-outline-secondary btn-ver-bits"
                  data-id="<?=$e['id_practica']?>"
                  data-nombre="<?=htmlspecialchars($e['estudiante_nombre'])?>">
                  <i class="fa fa-book-open fa-xs me-1"></i>Bitácoras
                  <?php if($e['bits_pendientes']>0): ?><span class="badge" style="background:#f7b93e;color:#0d1117;font-size:9px;"><?=$e['bits_pendientes']?></span><?php endif; ?>
                </button>
                <button class="btn btn-sm btn-primary btn-calificar"
                  data-id="<?=$e['id_practica']?>"
                  data-nombre="<?=htmlspecialchars($e['estudiante_nombre'])?>"
                  data-nota="<?=$e['nota_tutor_academico']??''?>">
                  <i class="fa fa-star fa-xs me-1"></i>Nota
                </button>
              </div>
            </td>
          </tr>
          <?php endforeach; ?>
        </tbody>
      </table>
    </div>

    <!-- ── Paginación ── -->
    <div class="paginacion">
      <div class="pag-info">
        Mostrando <?= (($pagina-1)*$porPagina)+1 ?>–<?= min($pagina*$porPagina, $totalRegistros) ?>
        de <?= $totalRegistros ?> estudiantes
        &nbsp;|&nbsp;
        <select class="pp-sel" onchange="cambiarPP(this.value)">
          <?php foreach ([25,50,100,200] as $n): ?>
            <option value="<?=$n?>" <?= $porPagina==$n?'selected':'' ?>><?=$n?>/pág</option>
          <?php endforeach; ?>
        </select>
      </div>
      <div class="pag-btns">
        <a class="pag-btn <?= $pagina<=1?'disabled':'' ?>" href="<?= urlFiltro(['pag'=>$pagina-1]) ?>">
          <i class="fa fa-chevron-left fa-xs"></i>
        </a>
        <?php
          $ini = max(1, $pagina-2);
          $fin = min($totalPaginas, $pagina+2);
          if ($ini > 1) echo '<a class="pag-btn" href="'.urlFiltro(['pag'=>1]).'">1</a>';
          if ($ini > 2) echo '<span class="pag-btn disabled">…</span>';
          for ($p=$ini; $p<=$fin; $p++) {
            echo '<a class="pag-btn'.($p==$pagina?' active':'').'" href="'.urlFiltro(['pag'=>$p]).'">'.$p.'</a>';
          }
          if ($fin < $totalPaginas-1) echo '<span class="pag-btn disabled">…</span>';
          if ($fin < $totalPaginas)   echo '<a class="pag-btn" href="'.urlFiltro(['pag'=>$totalPaginas]).'">'.$totalPaginas.'</a>';
        ?>
        <a class="pag-btn <?= $pagina>=$totalPaginas?'disabled':'' ?>" href="<?= urlFiltro(['pag'=>$pagina+1]) ?>">
          <i class="fa fa-chevron-right fa-xs"></i>
        </a>
      </div>
    </div>

    <?php endif; ?>
    <?php endif; ?>

    <!-- Modal: bitácoras del estudiante -->
    <div class="modal fade" id="modalBits" tabindex="-1">
      <div class="modal-dialog modal-lg">
        <div class="modal-content">
          <div class="modal-header">
            <h5 class="modal-title">Bitácoras de <span id="mbit-nombre"></span></h5>
            <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
          </div>
          <div class="modal-body" id="mbit-body">
            <div class="text-center py-3"><i class="fa fa-spinner fa-spin me-2"></i>Cargando...</div>
          </div>
        </div>
      </div>
    </div>

    <!-- Modal: calificar -->
    <div class="modal fade" id="modalNota" tabindex="-1">
      <div class="modal-dialog">
        <div class="modal-content">
          <div class="modal-header">
            <h5 class="modal-title">Calificar a <span id="mnota-nombre"></span></h5>
            <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
          </div>
          <form method="POST">
            <input type="hidden" name="id_practica" id="mnota-id">
            <div class="modal-body">
              <div class="mb-3">
                <label class="form-label">Nota del tutor académico (0 – 100)</label>
                <input type="number" name="nota" id="mnota-val" class="form-control"
                       min="0" max="100" step="0.5" placeholder="ej: 85.00">
              </div>
              <div class="mb-3">
                <label class="form-label">Observaciones</label>
                <textarea name="observaciones" class="form-control" rows="3"
                          placeholder="Comentarios sobre el desempeño del estudiante..."></textarea>
              </div>
            </div>
            <div class="modal-footer">
              <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">Cancelar</button>
              <button type="submit" class="btn btn-primary"><i class="fa fa-floppy-disk me-1"></i>Guardar nota</button>
            </div>
          </form>
        </div>
      </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 cambiarPP(val) {
  var url = new URL(window.location.href);
  url.searchParams.set('pp', val);
  url.searchParams.set('pag', '1');
  window.location.href = url.toString();
}

$(function () {

  $(document).on('click', '.btn-ver-bits', function () {
    var id  = $(this).data('id');
    var nom = $(this).data('nombre');
    $('#mbit-nombre').text(nom);
    $('#mbit-body').html('<div class="text-center py-3"><i class="fa fa-spinner fa-spin me-2"></i>Cargando...</div>');
    new bootstrap.Modal('#modalBits').show();

    $.ajax({
      url: BASE_URL + '/api/tutor/bitacoras_practica.php',
      data: { id_practica: id },
      dataType: 'json',
      error: function (xhr) {
        var msg = 'Error de conexión (HTTP ' + xhr.status + ').';
        if (xhr.status === 404) msg = 'API no encontrada.';
        if (xhr.status === 500) msg = 'Error interno del servidor.';
        $('#mbit-body').html('<div class="text-center py-4" style="color:#ef4444;"><i class="fa fa-circle-exclamation fa-2x mb-2 d-block"></i>' + msg + '</div>');
      },
      success: function (d) {
        var estadoMap = {
          'en_progreso':'<span class="badge-estado st-en_progreso">En progreso</span>',
          'completado' :'<span class="badge-estado st-completado">Completado</span>',
          'completada' :'<span class="badge-estado st-completado">Completada</span>',
          'calificado' :'<span class="badge-estado st-calificado">Calificado</span>',
          'aprobado'   :'<span class="badge-estado st-aprobado">Aprobado</span>',
          'rechazado'  :'<span class="badge-estado st-rechazado">Rechazado</span>',
          'postulado'  :'<span class="badge-estado st-postulado">Postulado</span>'
        };
        var infoBar = '';
        if (d.estado) {
          infoBar += '<div style="display:flex;align-items:center;gap:10px;margin-bottom:12px;padding:8px 12px;background:#f8fafc;border-radius:8px;border:1px solid #e2e8f0;">'
                   + '<span style="font-size:12px;color:#6b7280;">Estado:</span> '
                   + (estadoMap[d.estado] || '<span class="badge-estado st-borrador">'+d.estado+'</span>');
          if (d.estudiante) infoBar += '<span style="font-size:12px;color:#6b7280;margin-left:auto;"><i class="fa fa-user me-1"></i>'+d.estudiante+'</span>';
          infoBar += '</div>';
        }
        var avisoLectura = '';
        if (d.solo_lectura) {
          avisoLectura = '<div style="display:flex;align-items:center;gap:8px;margin-bottom:10px;padding:8px 12px;background:#fefce8;border:1px solid #fde047;border-radius:8px;font-size:12px;color:#92400e;"><i class="fa fa-triangle-exclamation"></i>Visualización de solo lectura.</div>';
        }
        if (!d.ok) {
          $('#mbit-body').html(infoBar+'<div class="text-center py-4" style="color:#ef4444;"><i class="fa fa-circle-exclamation fa-2x mb-2 d-block"></i>'+(d.msg||'Error al cargar.')+'</div>');
          return;
        }
        if (!d.rows || !d.rows.length) {
          $('#mbit-body').html(infoBar+avisoLectura+'<div class="text-center py-4" style="color:#9ca3af;"><i class="fa fa-inbox fa-2x mb-2 d-block"></i>Sin bitácoras registradas.</div>');
          return;
        }
        var html = infoBar+avisoLectura+'<div class="tbl-wrap"><table class="table table-borderless mb-0"><thead><tr><th>Semana</th><th>Período</th><th>Horas</th><th>Estado</th><th>Acciones</th></tr></thead><tbody>';
        $.each(d.rows, function(i, r) {
          var badgeClass = {validada:'st-aprobado',enviada:'st-postulado',borrador:'st-borrador',observada:'st-calificado'}[r.estado]||'st-borrador';
          html += '<tr><td><strong>Semana '+r.semana_numero+'</strong></td><td style="font-size:11px;">'+r.fecha_inicio+' — '+r.fecha_fin+'</td><td>'+r.horas_semana+'h</td><td><span class="badge-estado '+badgeClass+'">'+r.estado+'</span></td><td>';
          if (!d.solo_lectura && r.estado==='enviada') {
            html += '<button class="btn btn-sm btn-primary btn-validar me-1" data-id="'+r.id_bitacora+'" data-accion="validada">✓ Validar</button>'
                  + '<button class="btn btn-sm btn-outline-secondary btn-validar" data-id="'+r.id_bitacora+'" data-accion="observada">⚠ Observar</button>';
          } else if (d.solo_lectura && r.estado==='enviada') {
            html += '<span style="font-size:11px;color:#9ca3af;">Solo lectura</span>';
          }
          html += '</td></tr>';
          var detalle = '';
          try {
            var dias = JSON.parse(r.actividades);
            if (Array.isArray(dias) && dias.length) {
              var diasNom=['','Lunes','Martes','Miércoles','Jueves','Viernes','Sábado','Domingo'];
              detalle += '<table style="width:100%;border-collapse:collapse;margin-top:6px;font-size:11px;"><thead><tr><th style="padding:4px 8px;border-bottom:1px solid var(--border);color:var(--text-2);">Fecha</th><th style="padding:4px 8px;border-bottom:1px solid var(--border);color:var(--text-2);text-align:center;">Horas</th><th style="padding:4px 8px;border-bottom:1px solid var(--border);color:var(--text-2);">Actividades</th><th style="padding:4px 8px;border-bottom:1px solid var(--border);color:var(--text-2);">Logros</th><th style="padding:4px 8px;border-bottom:1px solid var(--border);color:var(--text-2);">Dificultades</th></tr></thead><tbody>';
              $.each(dias, function(j, dia) {
                var feriado=parseInt(dia.horas)===0;
                var dObj=new Date(dia.fecha+'T12:00:00');
                var diaNom=diasNom[dObj.getDay()===0?7:dObj.getDay()];
                var fechaStr=dia.fecha.split('-').reverse().join('/');
                detalle += '<tr style="'+(feriado?'opacity:.65;':'')+'"><td style="padding:5px 8px;border-bottom:1px solid var(--border);"><strong>'+fechaStr+'</strong><div style="font-size:10px;color:var(--text-2);">'+diaNom+'</div>'+(feriado?'<span style="font-size:9px;padding:1px 5px;border-radius:3px;background:rgba(251,191,36,.12);color:var(--yellow);font-weight:700;">FERIADO</span>':'')+'</td><td style="padding:5px 8px;border-bottom:1px solid var(--border);text-align:center;font-weight:700;color:'+(feriado?'var(--yellow)':'var(--accent)');
                detalle += ';">'+(feriado?'—':dia.horas+'h')+'</td><td style="padding:5px 8px;border-bottom:1px solid var(--border);">'+(dia.descripcion||'—')+'</td><td style="padding:5px 8px;border-bottom:1px solid var(--border);color:var(--green);">'+(dia.logros||'—')+'</td><td style="padding:5px 8px;border-bottom:1px solid var(--border);color:var(--yellow);">'+(dia.dificultades||'—')+'</td></tr>';
              });
              detalle += '</tbody></table>';
            } else detalle='<span style="font-size:12px;color:var(--text-2);">Sin actividades registradas.</span>';
          } catch(e) {
            detalle='<div style="font-size:12px;"><strong>Actividades:</strong> '+(r.actividades||'—')+'</div>'+(r.logros?'<div style="font-size:12px;"><strong>Logros:</strong> '+r.logros+'</div>':'')+(r.dificultades?'<div style="font-size:12px;"><strong>Dificultades:</strong> '+r.dificultades+'</div>':'');
          }
          if (r.comentario_tutor) detalle+='<div style="margin-top:6px;padding:6px 10px;border-radius:6px;background:rgba(251,191,36,.08);border:1px solid rgba(251,191,36,.25);font-size:11px;color:var(--yellow);"><i class="fa fa-comment fa-xs me-1"></i><strong>Comentario:</strong> '+r.comentario_tutor+'</div>';
          html += '<tr><td colspan="5" style="padding:4px 14px 14px;">'+detalle+'</td></tr>';
        });
        html += '</tbody></table></div>';
        $('#mbit-body').html(html);
      }
    });
  });

  $(document).on('click', '.btn-validar', function () {
    var btn=$(this), id=btn.data('id'), accion=btn.data('accion'), comentario='';
    if (accion==='observada') {
      comentario=prompt('Escribe tu comentario de observación (obligatorio):');
      if (comentario===null||comentario.trim()==='') { alert('Debes escribir un comentario.'); return; }
    }
    if (accion==='validada'&&!confirm('¿Confirmas que validas esta bitácora?')) return;
    btn.prop('disabled',true).text('...');
    $.post(BASE_URL+'/api/tutor/validar_bitacora.php',{id_bitacora:id,accion:accion,comentario:comentario},function(r){
      if(r.ok){
        var bc=accion==='validada'?'st-aprobado':'st-calificado';
        btn.closest('tr').find('.badge-estado').text(accion).attr('class','badge-estado '+bc);
        btn.closest('td').html('<span style="color:var(--text-2);font-size:12px;">✓ '+accion+'</span>');
        setTimeout(function(){location.reload();},800);
      } else { alert(r.msg||'Error al actualizar'); btn.prop('disabled',false).text(accion==='validada'?'✓ Validar':'⚠ Observar'); }
    },'json');
  });

  $(document).on('click', '.btn-calificar', function () {
    $('#mnota-id').val($(this).data('id'));
    $('#mnota-nombre').text($(this).data('nombre'));
    $('#mnota-val').val($(this).data('nota')||'');
    new bootstrap.Modal('#modalNota').show();
  });

});
</script>
</body>