<?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_ADMIN);
$user=currentUser(); $db=getDB(); $pageTitle='Usuarios';
$idInstituto = (int)($user['id_instituto'] ?? 0);

// Crear / editar usuario
if ($_SERVER['REQUEST_METHOD']==='POST') {
    $id         = (int)($_POST['id_usuario']??0);
    $ced        = trim($_POST['cedula']??'');
    $nom        = trim($_POST['nombres']??'');
    $ape        = trim($_POST['apellidos']??'');
    $email      = trim($_POST['email']??'');
    $emailPers  = trim($_POST['email_personal']??'') ?: null;
    $telefono   = trim($_POST['telefono']??'') ?: null;
    $rol        = (int)($_POST['id_rol']??5);
    $activo     = isset($_POST['activo'])?1:0;
    $resetPass  = ($_POST['reset_pass_cedula'] ?? '0') === '1';
    $esAdmin    = ($rol === ROL_ADMIN);
    if ($nom && $email) {
        if ($id) {
            // Preservar id_instituto del admin si el usuario no tiene uno asignado
            $instUpdate = $idInstituto ?: null;
            $db->prepare("UPDATE usuarios SET cedula=:c,nombres=:n,apellidos=:a,email=:e,email_personal=:ep,telefono=:tel,id_rol=:r,activo=:ac,id_instituto=COALESCE(id_instituto,:ins) WHERE id_usuario=:id")
               ->execute([':c'=>$ced,':n'=>$nom,':a'=>$ape,':e'=>$email,':ep'=>$emailPers,':tel'=>$telefono,':r'=>$rol,':ac'=>$activo,':ins'=>$instUpdate,':id'=>$id]);
            // Solo restablecer clave a cédula si no es Admin y se solicitó
            if ($resetPass && !$esAdmin && $ced) {
                $nuevoHash = password_hash($ced, PASSWORD_BCRYPT);
                $db->prepare("UPDATE usuarios SET password_hash=:h, cambiar_password=1 WHERE id_usuario=:id")
                   ->execute([':h'=>$nuevoHash, ':id'=>$id]);
            }
            // Si es estudiante, actualizar o crear perfil en estudiantes
            if ($rol === ROL_ESTUDIANTE) {
                $idCar  = (int)($_POST['id_carrera'] ?? 0);
                $idPer  = ($_POST['id_periodo_ingreso'] ?? '') !== '' ? (int)$_POST['id_periodo_ingreso'] : null;
                $codigo = trim($_POST['codigo_estudiante'] ?? '');
                $semest = ($_POST['semestre_actual'] ?? '') !== '' ? (int)$_POST['semestre_actual'] : null;
                if ($idCar && $codigo) {
                    $stChk = $db->prepare("SELECT id_estudiante FROM estudiantes WHERE id_usuario=:u");
                    $stChk->execute([':u' => $id]);
                    if ($stChk->fetch()) {
                        $db->prepare("UPDATE estudiantes SET id_carrera=:c,id_periodo_ingreso=:p,codigo_estudiante=:cod,semestre_actual=:s WHERE id_usuario=:u")
                           ->execute([':c'=>$idCar,':p'=>$idPer,':cod'=>$codigo,':s'=>$semest,':u'=>$id]);
                    } else {
                        $db->prepare("INSERT INTO estudiantes (id_usuario,id_carrera,id_periodo_ingreso,codigo_estudiante,semestre_actual) VALUES(:u,:c,:p,:cod,:s)")
                           ->execute([':u'=>$id,':c'=>$idCar,':p'=>$idPer,':cod'=>$codigo,':s'=>$semest]);
                    }
                }
            }
            $msgUpd = 'Usuario actualizado.';
            if ($resetPass && !$esAdmin && $ced) $msgUpd .= " Contraseña restablecida a la cédula ($ced).";
            flashSet('ok', $msgUpd);
        } else {
            // Admin → Sigvp2026!, todos los demás → cédula
            $passDefault = $esAdmin ? 'Sigvp2026!' : ($ced ?: 'Sigvp2026!');
            $passInput   = trim($_POST['password'] ?? '');
            $passUsar    = $passInput !== '' ? $passInput : $passDefault;
            $pass        = password_hash($passUsar, PASSWORD_BCRYPT);
            $instInsert  = $idInstituto ?: null;
            try {
                $db->prepare("INSERT INTO usuarios (cedula,nombres,apellidos,email,email_personal,telefono,password_hash,id_rol,id_instituto,activo,cambiar_password)VALUES(:c,:n,:a,:e,:ep,:tel,:p,:r,:ins,1,1)")
                   ->execute([':c'=>$ced,':n'=>$nom,':a'=>$ape,':e'=>$email,':ep'=>$emailPers,':tel'=>$telefono,':p'=>$pass,':r'=>$rol,':ins'=>$instInsert]);
                $newId = (int)$db->lastInsertId();
                if ($rol === ROL_ESTUDIANTE && $newId) {
                    $idCar  = (int)($_POST['id_carrera'] ?? 0);
                    $idPer  = ($_POST['id_periodo_ingreso'] ?? '') !== '' ? (int)$_POST['id_periodo_ingreso'] : null;
                    $codigo = trim($_POST['codigo_estudiante'] ?? '');
                    $semest = ($_POST['semestre_actual'] ?? '') !== '' ? (int)$_POST['semestre_actual'] : null;
                    if ($idCar && $codigo) {
                        $db->prepare("INSERT INTO estudiantes (id_usuario,id_carrera,id_periodo_ingreso,codigo_estudiante,semestre_actual) VALUES(:u,:c,:p,:cod,:s)")
                           ->execute([':u'=>$newId,':c'=>$idCar,':p'=>$idPer,':cod'=>$codigo,':s'=>$semest]);
                    }
                }
                $msgPass = $esAdmin ? "Contraseña: $passUsar" : "Usuario: $ced — Contraseña: $passDefault";
                flashSet('ok', "Usuario creado correctamente. $msgPass");
                registrarAudit($user['id'],'crear_usuario','usuarios',$newId);
                header('Location: usuarios.php'); exit;
            } catch (\Throwable $ex) {
                // Solo llega aquí si el usuario ya existe en ESTE mismo instituto
                header('Location: usuarios.php?dup=1'); exit;
            }
        }
    }
}

$q       = $_GET['q']       ?? '';
$filtCar = (int)($_GET['carrera'] ?? 0);
$filtPer = (int)($_GET['periodo'] ?? 0);
$filtRol = (int)($_GET['rol']     ?? 0);   // ← NUEVO: filtro por rol

// ── Período activo por defecto (solo al entrar sin filtro explícito) ─────────
if ($filtPer === 0 && !isset($_GET['periodo']) && !isset($_GET['q']) && !isset($_GET['rol'])) {
    $stAct = $db->prepare("
        SELECT id_periodo FROM periodos_academicos
        WHERE  activo       = 1
          AND  id_instituto = :inst
        ORDER  BY fecha_inicio DESC LIMIT 1
    ");
    $stAct->execute([':inst' => $idInstituto]);
    $periodoDefecto = $stAct->fetchColumn();
    if ($periodoDefecto) $filtPer = (int)$periodoDefecto;
}

// Paginación
$perPageOpts = [25, 50, 100, 200, 500];
$perPage     = in_array((int)($_GET['per_page'] ?? 0), $perPageOpts) ? (int)$_GET['per_page'] : 25;
$page        = max(1, (int)($_GET['page'] ?? 1));
$offset      = ($page - 1) * $perPage;

// $idInstituto ya definido al inicio del archivo
$where = ['1=1']; $param = [];
if ($idInstituto) { $where[] = "u.id_instituto = :inst"; $param[':inst'] = $idInstituto; }
if ($q) {
    $where[] = "(u.nombres LIKE :q1 OR u.apellidos LIKE :q2 OR u.email LIKE :q3 OR u.cedula LIKE :q4)";
    $param[':q1']=$param[':q2']=$param[':q3']=$param[':q4']='%'.$q.'%';
}
if ($filtCar) { $where[] = "e.id_carrera = :car";         $param[':car'] = $filtCar; }
if ($filtPer) { $where[] = "e.id_periodo_ingreso = :per"; $param[':per'] = $filtPer; }
if ($filtRol) { $where[] = "u.id_rol = :rol";             $param[':rol'] = $filtRol; }  // ← NUEVO
$wStr = implode(' AND ', $where);

// Total de registros
$sqlCount = "SELECT COUNT(*) FROM usuarios u
             JOIN roles r ON r.id_rol=u.id_rol
             LEFT JOIN estudiantes e ON e.id_usuario=u.id_usuario
             WHERE $wStr";
$stCount = $db->prepare($sqlCount); $stCount->execute($param);
$totalRows  = (int)$stCount->fetchColumn();
$totalPages = max(1, (int)ceil($totalRows / $perPage));
if ($page > $totalPages) { $page = $totalPages; $offset = ($page - 1) * $perPage; }

$sql  = "SELECT u.*,r.nombre AS rol_nombre,e.id_estudiante,e.id_carrera,
                e.id_periodo_ingreso,e.codigo_estudiante,e.semestre_actual
         FROM   usuarios u
         JOIN   roles r ON r.id_rol=u.id_rol
         LEFT JOIN estudiantes e ON e.id_usuario=u.id_usuario
         WHERE  $wStr ORDER BY u.created_at DESC
         LIMIT  :lim OFFSET :off";
$st=$db->prepare($sql);
foreach($param as $k=>&$v) $st->bindValue($k,$v);
$st->bindValue(':lim',$perPage,PDO::PARAM_INT);
$st->bindValue(':off',$offset, PDO::PARAM_INT);
$st->execute();
$usuarios=$st->fetchAll();
$roles=$db->query("SELECT * FROM roles ORDER BY id_rol")->fetchAll();
$carreras=$db->query("SELECT id_carrera,nombre FROM carreras WHERE activa=1" . ($idInstituto ? " AND id_instituto=$idInstituto" : "") . " ORDER BY nombre")->fetchAll();
$periodos=$db->query("SELECT id_periodo, nombre, activo FROM periodos_academicos WHERE 1=1" . ($idInstituto ? " AND id_instituto=$idInstituto" : "") . " ORDER BY activo DESC, id_periodo DESC")->fetchAll();
?>
<!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-admin.css">
</head><body>
<?php include __DIR__ . DIRECTORY_SEPARATOR . '..' . DIRECTORY_SEPARATOR . '..' . DIRECTORY_SEPARATOR . 'includes' . DIRECTORY_SEPARATOR . 'navbar.php'; ?>
<div class="app-shell">
  <?php $sbActivo = 'usuarios'; include __DIR__ . '/../../includes/sidebar_admin.php'; ?>
  <main class="main-area">
    <div class="page-header d-flex justify-content-between align-items-center">
      <div><h4>Gestión de Usuarios</h4><p>Crear, editar y desactivar cuentas</p></div>
      <div class="d-flex gap-2 flex-wrap">
        <!-- Descargar plantilla Excel -->
        <a href="importar_usuarios.php?accion=plantilla"
           class="btn btn-sm"
           style="background:#166534;border:1px solid #4ade80;color:#bbf7d0;font-size:12px;font-weight:600;"
           title="Descarga la plantilla Excel para llenar los datos">
          <i class="fa fa-file-excel me-1"></i>Plantilla Excel
        </a>
        <!-- Carga masiva -->
        <button class="btn btn-sm"
           style="background:#1e3a5f;border:1px solid #5bc4ef;color:#d0edf8;font-size:12px;font-weight:600;"
           data-bs-toggle="modal" data-bs-target="#modalImportar"
           title="Sube el Excel con los datos llenos para cargar usuarios masivamente">
          <i class="fa fa-file-arrow-up me-1"></i>Carga masiva
        </button>
        <!-- Nuevo usuario individual -->
        <button class="btn btn-primary btn-sm" data-bs-toggle="modal" data-bs-target="#modalUser" onclick="resetForm()">
          <i class="fa fa-plus me-1"></i>Nuevo usuario
        </button>
      </div>
    </div>
    <?=flashHtml()?>
    <form method="GET" class="mb-3" id="form-filtros">
      <input type="hidden" name="page" value="1">
      <div class="row g-2 align-items-end">

        <!-- Buscador -->
        <div class="col-md-3">
          <label style="font-size:11px;font-weight:700;color:#6b7280;text-transform:uppercase;letter-spacing:.04em;display:block;margin-bottom:3px;">
            <i class="fa fa-search me-1"></i>Buscar
          </label>
          <input type="text" name="q" class="form-control form-control-sm"
                 placeholder="Nombre, cédula o email..." value="<?=htmlspecialchars($q)?>">
        </div>

        <!-- Carrera -->
        <div class="col-md-2">
          <label style="font-size:11px;font-weight:700;color:#6b7280;text-transform:uppercase;letter-spacing:.04em;display:block;margin-bottom:3px;">
            <i class="fa fa-graduation-cap me-1"></i>Carrera
          </label>
          <select name="carrera" class="form-select form-select-sm" onchange="this.form.submit()">
            <option value="">— Todas —</option>
            <?php foreach($carreras as $car): ?>
              <option value="<?=$car['id_carrera']?>" <?=$filtCar===$car['id_carrera']?'selected':''?>>
                <?=htmlspecialchars($car['nombre'])?>
              </option>
            <?php endforeach; ?>
          </select>
        </div>

        <!-- Período / Ciclo -->
        <div class="col-md-2">
          <label style="font-size:11px;font-weight:700;color:#6b7280;text-transform:uppercase;letter-spacing:.04em;display:block;margin-bottom:3px;">
            <i class="fa fa-calendar me-1"></i>Período / Ciclo
          </label>
          <select name="periodo" class="form-select form-select-sm" onchange="this.form.submit()">
            <option value="">— Todos —</option>
            <?php foreach($periodos as $per): ?>
              <option value="<?=$per['id_periodo']?>" <?=$filtPer===$per['id_periodo']?'selected':''?>>
                <?= !empty($per['activo']) ? '🟢 ' : '' ?><?=htmlspecialchars($per['nombre'])?><?= !empty($per['activo']) ? ' (activo)' : '' ?>
              </option>
            <?php endforeach; ?>
          </select>
        </div>

        <!-- Rol -->
        <div class="col-md-2">
          <label style="font-size:11px;font-weight:700;color:#6b7280;text-transform:uppercase;letter-spacing:.04em;display:block;margin-bottom:3px;">
            <i class="fa fa-user-tag me-1"></i>Rol
          </label>
          <select name="rol" class="form-select form-select-sm" onchange="this.form.submit()">
            <option value="">— Todos los roles —</option>
            <?php foreach($roles as $r): ?>
              <option value="<?=$r['id_rol']?>" <?=$filtRol===$r['id_rol']?'selected':''?>>
                <?=htmlspecialchars(ucfirst(str_replace('_',' ',$r['nombre'])))?>
              </option>
            <?php endforeach; ?>
          </select>
        </div>

        <!-- Por página -->
        <div class="col-md-1">
          <label style="font-size:11px;font-weight:700;color:#6b7280;text-transform:uppercase;letter-spacing:.04em;display:block;margin-bottom:3px;">
            Mostrar
          </label>
          <select name="per_page" class="form-select form-select-sm" onchange="this.form.submit()">
            <?php foreach($perPageOpts as $opt): ?>
              <option value="<?=$opt?>" <?=$perPage===$opt?'selected':''?>><?=$opt?></option>
            <?php endforeach; ?>
          </select>
        </div>

        <!-- Botones -->
        <div class="col-md-2 d-flex gap-1">
          <button type="submit" class="btn btn-primary btn-sm flex-fill">
            <i class="fa fa-search me-1"></i>Filtrar
          </button>
          <?php if($q||$filtCar||$filtPer||$filtRol): ?>
        <a href="usuarios.php" class="btn btn-outline-secondary btn-sm" title="Limpiar filtros">
          <i class="fa fa-xmark"></i>
        </a>
      <?php endif; ?>
        </div>

      </div>

      <!-- Chips de filtros activos -->
      <?php if($q||$filtCar||$filtPer||$filtRol): ?>
      <div class="d-flex align-items-center gap-2 mt-2 flex-wrap" style="font-size:11px;">
        <span style="color:#6b7280;">Filtros activos:</span>
        <?php if($q): ?><span class="badge" style="background:#e0f2fe;color:#0369a1;border:1px solid #bae6fd;">🔍 "<?=htmlspecialchars($q)?>"</span><?php endif; ?>
        <?php if($filtPer): $pNom=''; $pAct=false; foreach($periodos as $p) if($p['id_periodo']==$filtPer){$pNom=$p['nombre'];$pAct=!empty($p['activo']);} ?>
          <span class="badge" style="background:#f0fdf4;color:#15803d;border:1px solid #bbf7d0;"><?=$pAct?'🟢':'📅'?> <?=htmlspecialchars($pNom)?><?=$pAct?' (activo)':''?></span>
        <?php endif; ?>
        <?php if($filtCar): $cNom=''; foreach($carreras as $c) if($c['id_carrera']==$filtCar) $cNom=$c['nombre']; ?>
          <span class="badge" style="background:#faf5ff;color:#7e22ce;border:1px solid #e9d5ff;">🎓 <?=htmlspecialchars($cNom)?></span>
        <?php endif; ?>
        <?php if($filtRol): $rNom=''; foreach($roles as $r) if($r['id_rol']==$filtRol) $rNom=$r['nombre']; ?>
          <span class="badge" style="background:#fff7ed;color:#c2410c;border:1px solid #fed7aa;">👤 <?=htmlspecialchars(ucfirst(str_replace('_',' ',$rNom)))?></span>
        <?php endif; ?>
      </div>
      <?php endif; ?>
    </form>
        <style>
      .tbl-usuarios { width:100%; border-collapse:separate; border-spacing:0 4px; }
      .tbl-usuarios thead tr th {
        background: #1e293b; color: #94a3b8; font-size: 11px; font-weight: 700;
        letter-spacing: .07em; text-transform: uppercase; padding: 10px 14px; border: none;
      }
      .tbl-usuarios thead tr th:first-child { border-radius: 8px 0 0 8px; }
      .tbl-usuarios thead tr th:last-child  { border-radius: 0 8px 8px 0; }
      .tbl-usuarios tbody tr { background: #fff; transition: background .15s, box-shadow .15s; }
      .tbl-usuarios tbody tr:hover { background: #f0f7ff; box-shadow: 0 2px 8px rgba(46,168,255,.10); }
      .tbl-usuarios tbody td {
        padding: 11px 14px; font-size: 13px; color: #1e293b;
        border-top: 1px solid #f1f5f9; border-bottom: 1px solid #f1f5f9; vertical-align: middle;
      }
      .tbl-usuarios tbody td:first-child { border-left:1px solid #f1f5f9; border-radius:8px 0 0 8px; }
      .tbl-usuarios tbody td:last-child  { border-right:1px solid #f1f5f9; border-radius:0 8px 8px 0; }
      .usr-avatar {
        width:32px; height:32px; border-radius:50%;
        display:inline-flex; align-items:center; justify-content:center;
        font-size:13px; font-weight:800; flex-shrink:0;
        background:linear-gradient(135deg,#dbeafe,#ede9fe); color:#2563eb;
        border:1.5px solid #bfdbfe;
      }
      .rol-badge { display:inline-flex; align-items:center; gap:5px; font-size:11px; font-weight:700; border-radius:20px; padding:3px 10px; white-space:nowrap; }
      .rol-administrador { background:#ede9fe; color:#5b21b6; }
      .rol-coordinador   { background:#dbeafe; color:#1d4ed8; }
      .rol-estudiante    { background:#dcfce7; color:#166534; }
      .rol-tutor         { background:#fef9c3; color:#854d0e; }
      .rol-tutor_empresa { background:#ffedd5; color:#9a3412; }
      .rol-secretaria    { background:#fce7f3; color:#9d174d; }
      .rol-facturacion   { background:#e0f2fe; color:#075985; }
      .rol-gestor_ppp    { background:#f3e8ff; color:#7e22ce; }
      .rol-default       { background:#f1f5f9; color:#475569; }
      .est-activo   { background:#dcfce7; color:#166534; font-size:11px; font-weight:700; border-radius:20px; padding:3px 10px; display:inline-flex; align-items:center; gap:4px; }
      .est-inactivo { background:#fee2e2; color:#991b1b; font-size:11px; font-weight:700; border-radius:20px; padding:3px 10px; display:inline-flex; align-items:center; gap:4px; }
      .pag-info { font-size:13px; color:#475569; font-weight:600; }
      .pag-info strong { color:#0f172a; font-weight:800; font-size:14px; }
      .pag-total { background:#e0f2fe; color:#0369a1; font-weight:800; border-radius:20px; padding:2px 10px; font-size:13px; }
    </style>
    <div class="tbl-wrap">
      <table class="tbl-usuarios">
        <thead><tr>
          <th>Nombre</th><th>Email</th><th>Cédula</th><th>Rol</th><th>Estado</th><th style="text-align:center;">Acciones</th>
        </tr></thead>
        <tbody>
        <?php foreach($usuarios as $u):
          $inicial = mb_strtoupper(mb_substr($u['nombres'],0,1,'UTF-8'),'UTF-8');
          $rNombre = $u['rol_nombre'] ?? '';
          $rolMap  = ['administrador'=>'rol-administrador','coordinador'=>'rol-coordinador',
                      'estudiante'=>'rol-estudiante','tutor'=>'rol-tutor',
                      'tutor_empresa'=>'rol-tutor_empresa','secretaria'=>'rol-secretaria',
                      'facturacion'=>'rol-facturacion','gestor_ppp'=>'rol-gestor_ppp'];
          $rClass  = $rolMap[$rNombre] ?? 'rol-default';
        ?>
        <tr>
          <td>
            <div style="display:flex;align-items:center;gap:10px;">
              <span class="usr-avatar"><?=$inicial?></span>
              <div>
                <div style="font-weight:700;"><?=htmlspecialchars($u['apellidos'].' '.$u['nombres'])?></div>
                <?php if(!empty($u['email_personal'])): ?>
                  <div style="font-size:11px;color:#94a3b8;"><?=htmlspecialchars($u['email_personal'])?></div>
                <?php endif; ?>
              </div>
            </div>
          </td>
          <td style="font-size:12px;color:#475569;font-family:monospace;"><?=htmlspecialchars($u['email'])?></td>
          <td style="font-size:12px;color:#64748b;letter-spacing:.04em;"><?=htmlspecialchars($u['cedula'])?></td>
          <td><span class="rol-badge <?=$rClass?>"><i class="fa fa-circle" style="font-size:6px;"></i><?=htmlspecialchars($rNombre)?></span></td>
          <td><?=$u['activo']
            ? '<span class="est-activo"><i class="fa fa-circle" style="font-size:6px;"></i>Activo</span>'
            : '<span class="est-inactivo"><i class="fa fa-circle" style="font-size:6px;"></i>Inactivo</span>'?></td>
          <td style="text-align:center;">
            <button class="btn btn-sm btn-outline-secondary btn-editar"
              data-id="<?=$u['id_usuario']?>"
              data-cedula="<?=htmlspecialchars($u['cedula'])?>"
              data-nombres="<?=htmlspecialchars($u['nombres'])?>"
              data-apellidos="<?=htmlspecialchars($u['apellidos'])?>"
              data-email="<?=htmlspecialchars($u['email'])?>"
              data-emailpers="<?=htmlspecialchars($u['email_personal']??'')?>"
              data-telefono="<?=htmlspecialchars($u['telefono']??'')?>"
              data-rol="<?=$u['id_rol']?>"
              data-activo="<?=$u['activo']?>"
              data-carrera="<?=$u['id_carrera']??''?>"
              data-periodo="<?=$u['id_periodo_ingreso']??''?>"
              data-codigo="<?=htmlspecialchars($u['codigo_estudiante']??'')?>"
              data-semestre="<?=$u['semestre_actual']??''?>"><i class="fa fa-pen-to-square"></i></button>
          </td>
        </tr>
        <?php endforeach; ?>
        </tbody>
      </table>
    </div>

    <?php if($totalPages > 1 || $totalRows > 0): ?>
    <!-- Paginación -->
    <div class="d-flex justify-content-between align-items-center mt-3 flex-wrap gap-2">
      <span class="pag-info">
        Mostrando <strong><?= $totalRows === 0 ? 0 : $offset + 1 ?></strong>
        – <strong><?= min($offset + $perPage, $totalRows) ?></strong>
        de <span class="pag-total"><?= number_format($totalRows) ?></span> usuarios
        · Página <strong><?= $page ?></strong> de <strong><?= $totalPages ?></strong>
      </span>
      <?php if($totalPages > 1): ?>
      <?php
        $baseUrl  = 'usuarios.php?' . http_build_query(array_filter([
            'q'        => $q,
            'carrera'  => $filtCar  ?: null,
            'periodo'  => $filtPer  ?: null,
            'rol'      => $filtRol  ?: null,
            'per_page' => $perPage,
        ]));
        $prevPage = max(1, $page - 1);
        $nextPage = min($totalPages, $page + 1);
      ?>
      <nav>
        <ul class="pagination pagination-sm mb-0">
          <!-- Primera -->
          <li class="page-item <?= $page<=1?'disabled':'' ?>">
            <a class="page-link" href="<?=$baseUrl?>&page=1" title="Primera página">
              <i class="fa fa-angles-left fa-xs"></i>
            </a>
          </li>
          <!-- Anterior -->
          <li class="page-item <?= $page<=1?'disabled':'' ?>">
            <a class="page-link" href="<?=$baseUrl?>&page=<?=$prevPage?>">
              <i class="fa fa-chevron-left fa-xs"></i> Anterior
            </a>
          </li>

          <!-- Números de página -->
          <?php
            $range = 2;
            $from  = max(1, $page - $range);
            $to    = min($totalPages, $page + $range);
            if($from > 1): ?>
              <li class="page-item"><a class="page-link" href="<?=$baseUrl?>&page=1">1</a></li>
              <?php if($from > 2): ?><li class="page-item disabled"><span class="page-link">…</span></li><?php endif; ?>
            <?php endif;
            for($i=$from; $i<=$to; $i++): ?>
              <li class="page-item <?= $i===$page?'active':'' ?>">
                <a class="page-link" href="<?=$baseUrl?>&page=<?=$i?>"><?=$i?></a>
              </li>
            <?php endfor;
            if($to < $totalPages): ?>
              <?php if($to < $totalPages - 1): ?><li class="page-item disabled"><span class="page-link">…</span></li><?php endif; ?>
              <li class="page-item"><a class="page-link" href="<?=$baseUrl?>&page=<?=$totalPages?>"><?=$totalPages?></a></li>
            <?php endif; ?>

          <!-- Siguiente -->
          <li class="page-item <?= $page>=$totalPages?'disabled':'' ?>">
            <a class="page-link" href="<?=$baseUrl?>&page=<?=$nextPage?>">
              Siguiente <i class="fa fa-chevron-right fa-xs"></i>
            </a>
          </li>
          <!-- Última -->
          <li class="page-item <?= $page>=$totalPages?'disabled':'' ?>">
            <a class="page-link" href="<?=$baseUrl?>&page=<?=$totalPages?>" title="Última página">
              <i class="fa fa-angles-right fa-xs"></i>
            </a>
          </li>
        </ul>
      </nav>
      <?php endif; ?>
    </div>
    <?php endif; ?>

    <div class="modal fade" id="modalUser" tabindex="-1">
      <div class="modal-dialog modal-dialog-scrollable"><div class="modal-content">
        <div class="modal-header"><h5 class="modal-title" id="modalUserTitle">Nuevo usuario</h5>
          <button type="button" class="btn-close" data-bs-dismiss="modal"></button></div>
        <form method="POST"><input type="hidden" name="id_usuario" id="f-id" value="0">
          <div class="modal-body">
            <div class="row g-3">
              <div class="col-sm-6"><label class="form-label">Nombres</label><input type="text" name="nombres" id="f-nom" class="form-control" required></div>
              <div class="col-sm-6"><label class="form-label">Apellidos</label><input type="text" name="apellidos" id="f-ape" class="form-control" required></div>
              <div class="col-sm-6"><label class="form-label">Cédula</label><input type="text" name="cedula" id="f-ced" class="form-control" maxlength="13"></div>
              <div class="col-sm-6"><label class="form-label">Email institucional</label><input type="email" name="email" id="f-email" class="form-control" required></div>
              <div class="col-sm-6"><label class="form-label">Teléfono / Móvil</label>
                <div class="input-group">
                  <span class="input-group-text" style="background:#0d1117;border-color:#30363d;color:#8b949e;"><i class="fa fa-mobile-screen fa-sm"></i></span>
                  <input type="tel" name="telefono" id="f-tel" class="form-control" maxlength="15" placeholder="09XXXXXXXX">
                </div>
              </div>
              <div class="col-sm-6"><label class="form-label">Email personal</label>
                <div class="input-group">
                  <span class="input-group-text" style="background:#0d1117;border-color:#30363d;color:#8b949e;"><i class="fa fa-envelope fa-sm"></i></span>
                  <input type="email" name="email_personal" id="f-emailpers" class="form-control" placeholder="correo@gmail.com">
                </div>
              </div>
              <div class="col-sm-6"><label class="form-label">Rol</label>
                <select name="id_rol" id="f-rol" class="form-select">
                  <?php foreach($roles as $r): ?><option value="<?=$r['id_rol']?>"><?=htmlspecialchars($r['nombre'])?></option><?php endforeach; ?>
                </select></div>
              <div class="col-sm-6 d-flex align-items-end">
                <div class="form-check"><input type="checkbox" name="activo" id="f-activo" class="form-check-input" value="1" checked>
                  <label class="form-check-label" for="f-activo">Activo</label></div></div>
              <!-- Campos extra solo para estudiantes -->
              <div id="blk-estudiante" style="display:none;" class="col-12">
                <hr style="margin:4px 0 12px;">
                <div style="font-size:10px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;color:#6b7280;margin-bottom:10px;">
                  <i class="fa fa-graduation-cap me-1"></i>Perfil de Estudiante
                </div>
                <div class="row g-3">
                  <div class="col-sm-6">
                    <label class="form-label">Carrera <span class="text-danger">*</span></label>
                    <select name="id_carrera" id="f-carrera" class="form-select">
                      <option value="">— Selecciona —</option>
                      <?php foreach($carreras as $car): ?>
                        <option value="<?=$car['id_carrera']?>"><?=htmlspecialchars($car['nombre'])?></option>
                      <?php endforeach; ?>
                    </select>
                  </div>
                  <div class="col-sm-6">
                    <label class="form-label">Código de estudiante <span class="text-danger">*</span></label>
                    <input type="text" name="codigo_estudiante" id="f-codigo" class="form-control" placeholder="ej: 2024-ISW-001">
                  </div>
                  <div class="col-sm-6">
                    <label class="form-label">Período de ingreso</label>
                    <select name="id_periodo_ingreso" id="f-periodo" class="form-select">
                      <option value="">— Opcional —</option>
                      <?php foreach($periodos as $per): ?>
                        <option value="<?=$per['id_periodo']?>"><?=htmlspecialchars($per['nombre'])?></option>
                      <?php endforeach; ?>
                    </select>
                  </div>
                  <div class="col-sm-6">
                    <label class="form-label">Semestre actual</label>
                    <input type="number" name="semestre_actual" id="f-semestre" class="form-control" min="1" max="10" placeholder="ej: 6">
                  </div>
                </div>
              </div>
              <div class="col-12" id="pass-row">
                <label class="form-label">Contraseña inicial
                  <span id="pass-hint" style="font-size:11px;color:#8b949e;font-weight:400;">— vacío = cédula</span>
                </label>
                <input type="text" name="password" id="f-pass" class="form-control"
                       value="" placeholder="Vacío = cédula (Admin: Sigvp2026!)">
              </div>
              <!-- Restablecer clave — solo al editar, y solo para no-admin -->
              <div class="col-12" id="reset-pass-row" style="display:none;">
                <div style="background:#161b22;border:1px solid #30363d;border-radius:8px;padding:12px 14px;">
                  <div style="font-size:11px;color:#8b949e;font-weight:700;letter-spacing:.5px;text-transform:uppercase;margin-bottom:8px;">
                    <i class="fa fa-key me-1"></i> Restablecer contraseña
                  </div>
                  <p style="font-size:12px;color:#a0aab8;margin-bottom:10px;">
                    Cambia la contraseña a su <strong style="color:#e6edf3;">número de cédula</strong>.
                    El sistema pedirá cambiarla en el próximo inicio de sesión.
                  </p>
                  <input type="hidden" name="reset_pass_cedula" id="f-reset-pass" value="0">
                  <button type="button" id="btn-reset-pass" class="btn btn-sm"
                          style="background:#ff9f0022;border:1px solid #ff9f0055;color:#ff9f00;font-size:12px;">
                    <i class="fa fa-rotate-left me-1"></i> Restablecer clave a cédula
                  </button>
                  <span id="reset-ok" style="display:none;font-size:12px;color:#3dffa0;margin-left:10px;">
                    <i class="fa fa-check me-1"></i>Se restablecerá al guardar
                  </span>
                </div>
              </div>
            </div>
          </div>
          <div class="modal-footer"><button type="submit" class="btn btn-primary">Guardar</button></div>
        </form>
      </div></div>
    </div>
  
    <!-- ═══ MODAL CARGA MASIVA ═══════════════════════════════ -->
    <div class="modal fade" id="modalImportar" tabindex="-1">
      <div class="modal-dialog modal-dialog-centered" style="max-width:520px;">
        <div class="modal-content">
          <div class="modal-header" style="background:#0c1d2e;border-bottom:1px solid #1e3a5f;">
            <h5 class="modal-title" style="font-size:15px;font-weight:700;color:#d0edf8;">
              <i class="fa fa-file-arrow-up me-2" style="color:#5bc4ef;"></i>Carga Masiva de Usuarios
            </h5>
            <button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal"></button>
          </div>
          <div class="modal-body" style="background:#0d1117;">

            <!-- Paso 1 -->
            <div style="background:#0c2d4e22;border:1px solid #1e3a5f;border-radius:10px;padding:14px 16px;margin-bottom:14px;">
              <div style="font-size:11px;font-weight:700;color:#5bc4ef;text-transform:uppercase;letter-spacing:.6px;margin-bottom:8px;">
                <span style="background:#1e3a5f;color:#d0edf8;border-radius:50%;display:inline-flex;width:18px;height:18px;align-items:center;justify-content:center;font-size:10px;margin-right:6px;">1</span>
                Descarga la plantilla
              </div>
              <p style="font-size:12.5px;color:#90b8d8;margin-bottom:10px;line-height:1.5;">
                Descarga el archivo Excel oficial, llena los datos de los usuarios siguiendo las instrucciones internas.
              </p>
              <a href="importar_usuarios.php?accion=plantilla"
                 class="btn btn-sm"
                 style="background:#166534;border:1px solid #4ade80;color:#bbf7d0;font-size:12px;font-weight:600;">
                <i class="fa fa-download me-1"></i>Descargar plantilla_usuarios_sigvp.xlsx
              </a>
            </div>

            <!-- Paso 2 -->
            <div style="background:#0c2d4e22;border:1px solid #1e3a5f;border-radius:10px;padding:14px 16px;">
              <div style="font-size:11px;font-weight:700;color:#5bc4ef;text-transform:uppercase;letter-spacing:.6px;margin-bottom:8px;">
                <span style="background:#1e3a5f;color:#d0edf8;border-radius:50%;display:inline-flex;width:18px;height:18px;align-items:center;justify-content:center;font-size:10px;margin-right:6px;">2</span>
                Sube el archivo lleno
              </div>
              <p style="font-size:12.5px;color:#90b8d8;margin-bottom:12px;line-height:1.5;">
                Una vez completado el Excel, súbelo aquí. El sistema creará o actualizará los usuarios automáticamente.
              </p>
              <form method="POST" action="importar_usuarios.php" enctype="multipart/form-data" id="formImportar">
                <!-- Zona drag & drop -->
                <label for="archivo_excel" id="dropzone"
                  style="display:block;border:2px dashed #1e3a5f;border-radius:10px;padding:24px;text-align:center;cursor:pointer;transition:border-color .2s,background .2s;"
                  onmouseover="this.style.borderColor='#5bc4ef';this.style.background='#0c2d4e33';"
                  onmouseout="this.style.borderColor='#1e3a5f';this.style.background='transparent';">
                  <i class="fa fa-file-excel" style="font-size:28px;color:#4ade80;margin-bottom:8px;display:block;"></i>
                  <span id="drop-label" style="font-size:13px;color:#90b8d8;display:block;">
                    Haz clic o arrastra el archivo .xlsx aquí
                  </span>
                  <span style="font-size:11px;color:#4a7f9a;margin-top:4px;display:block;">
                    Solo archivos .xlsx · Máximo 500 usuarios por archivo
                  </span>
                  <input type="file" name="archivo_excel" id="archivo_excel"
                         accept=".xlsx,.xls" style="display:none;" required>
                </label>

                <!-- Alerta de confirmación -->
                <div id="import-info" style="display:none;margin-top:12px;background:#14532d22;border:1px solid #4ade8055;border-radius:8px;padding:10px 13px;">
                  <div style="font-size:12px;color:#4ade80;font-weight:600;">
                    <i class="fa fa-circle-check me-1"></i><span id="import-filename"></span>
                  </div>
                  <div style="font-size:11px;color:#90b8d8;margin-top:3px;">
                    ¿Listo? Presiona <strong style="color:#d0edf8;">Importar ahora</strong>.
                  </div>
                </div>

                <div style="margin-top:14px;display:flex;gap:8px;justify-content:flex-end;">
                  <button type="button" class="btn btn-sm btn-outline-secondary" data-bs-dismiss="modal">Cancelar</button>
                  <button type="submit" class="btn btn-sm" id="btnImportar" disabled
                    style="background:#1e3a5f;border:1px solid #5bc4ef;color:#d0edf8;font-weight:600;opacity:.5;">
                    <span id="btnImportarTxt"><i class="fa fa-upload me-1"></i>Importar ahora</span>
                    <span id="btnImportarSpin" style="display:none;">
                      <span class="spinner-border spinner-border-sm me-1"></span>Procesando...
                    </span>
                  </button>
                </div>
              </form>
            </div>

            <!-- Nota -->
            <div style="margin-top:12px;font-size:11px;color:#4a7f9a;line-height:1.6;">
              <i class="fa fa-circle-info me-1"></i>
              Si la cédula ya existe, el usuario será <strong style="color:#90b8d8;">actualizado</strong> (no duplicado).
              Los estudiantes nuevos requieren <strong style="color:#90b8d8;">Carrera</strong> y <strong style="color:#90b8d8;">Código</strong>.
            </div>

          </div>
        </div>
      </div>
    </div>
    <!-- ═══ FIN MODAL CARGA MASIVA ═══════════════════════════ -->
  </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 ROL_ESTUDIANTE = <?= ROL_ESTUDIANTE ?>;
var ROL_ADMIN      = <?= ROL_ADMIN ?>;

function toggleEstudiante() {
  var rol = parseInt($('#f-rol').val());
  if (rol === ROL_ESTUDIANTE) {
    $('#blk-estudiante').slideDown(150);
    $('#f-carrera,#f-codigo').prop('required', true);
  } else {
    $('#blk-estudiante').slideUp(150);
    $('#f-carrera,#f-codigo').prop('required', false);
  }
  actualizarPass();
}

// Auto-rellena el campo contraseña con la cédula (salvo admin)
function actualizarPass() {
  var rol    = parseInt($('#f-rol').val());
  var cedula = $('#f-ced').val().trim();
  if (rol === ROL_ADMIN) {
    $('#f-pass').val('Sigvp2026!');
    $('#pass-hint').text('— Administrador: contraseña fija');
  } else {
    $('#f-pass').val(cedula);
    $('#pass-hint').text(cedula ? '— contraseña: ' + cedula : '— ingresa la cédula primero');
  }
}

function resetForm() {
  $('#f-id').val(0);
  $('#modalUserTitle').text('Nuevo usuario');
  $('#f-nom,#f-ape,#f-ced,#f-email,#f-emailpers,#f-tel,#f-codigo,#f-semestre').val('');
  $('#f-carrera,#f-periodo').val('');
  $('#f-pass').val('');
  $('#pass-hint').text('— vacío = cédula');
  $('#pass-row').show();
  $('#reset-pass-row').hide();
  $('#f-reset-pass').val('0');
  toggleEstudiante();
}

$(function(){
  $('#f-rol').on('change', toggleEstudiante);
  $('#f-ced').on('input', function(){ actualizarPass(); });

  // Botón restablecer clave a cédula
  $(document).on('click', '#btn-reset-pass', function(){
    $('#f-reset-pass').val('1');
    $('#reset-ok').show();
    $(this).prop('disabled', true)
           .html('<i class="fa fa-check me-1"></i> Marcado para restablecer');
  });

  $(document).on('click','.btn-editar',function(){
    var d = $(this).data();
    $('#f-id').val(d.id);
    $('#f-nom').val(d.nombres);
    $('#f-ape').val(d.apellidos);
    $('#f-ced').val(d.cedula);
    $('#f-email').val(d.email);
    $('#f-emailpers').val(d.emailpers || '');
    $('#f-tel').val(d.telefono || '');
    $('#f-rol').val(d.rol);
    $('#f-activo').prop('checked', d.activo == 1);
    $('#pass-row').hide();
    // Bloque restablecer: solo para roles que NO son admin
    $('#f-reset-pass').val('0');
    $('#reset-ok').hide();
    $('#btn-reset-pass').prop('disabled', false)
      .html('<i class="fa fa-rotate-left me-1"></i> Restablecer clave a cédula');
    if (parseInt(d.rol) === ROL_ADMIN) {
      $('#reset-pass-row').hide();   // Admin: no mostrar botón reset
    } else {
      $('#reset-pass-row').show();   // Todos los demás: sí mostrar
    }
    $('#modalUserTitle').text('Editar usuario');
    if (parseInt(d.rol) === ROL_ESTUDIANTE) {
      $('#f-carrera').val(d.carrera || '');
      $('#f-periodo').val(d.periodo || '');
      $('#f-codigo').val(d.codigo || '');
      $('#f-semestre').val(d.semestre || '');
      $('#blk-estudiante').show();
      $('#f-carrera,#f-codigo').prop('required', true);
    } else {
      $('#blk-estudiante').hide();
      $('#f-carrera,#f-codigo').prop('required', false);
    }
    new bootstrap.Modal('#modalUser').show();
  });
});
</script>

<script>
// ── Drag & Drop / selección de archivo ──────────────────────────
(function(){
  var input    = document.getElementById('archivo_excel');
  var dropzone = document.getElementById('dropzone');
  var label    = document.getElementById('drop-label');
  var info     = document.getElementById('import-info');
  var fname    = document.getElementById('import-filename');
  var btn      = document.getElementById('btnImportar');
  if (!input) return;

  function setFile(file) {
    if (!file) return;
    var ext = file.name.split('.').pop().toLowerCase();
    if (!['xlsx','xls'].includes(ext)) {
      label.textContent = '⚠️ Solo se aceptan archivos .xlsx o .xls';
      label.style.color = '#f87171';
      info.style.display = 'none';
      btn.disabled = true;
      btn.style.opacity = '.5';
      return;
    }
    label.textContent = '✅ Archivo seleccionado';
    label.style.color = '#4ade80';
    fname.textContent = file.name + ' (' + (file.size/1024).toFixed(1) + ' KB)';
    info.style.display = 'block';
    btn.disabled = false;
    btn.style.opacity = '1';
  }

  input.addEventListener('change', function(){ setFile(this.files[0]); });

  dropzone.addEventListener('dragover', function(e){
    e.preventDefault();
    this.style.borderColor = '#5bc4ef';
    this.style.background  = '#0c2d4e55';
  });
  dropzone.addEventListener('dragleave', function(){
    this.style.borderColor = '#1e3a5f';
    this.style.background  = 'transparent';
  });
  dropzone.addEventListener('drop', function(e){
    e.preventDefault();
    this.style.borderColor = '#1e3a5f';
    this.style.background  = 'transparent';
    var file = e.dataTransfer.files[0];
    if (file) {
      // Asignar al input
      var dt = new DataTransfer();
      dt.items.add(file);
      input.files = dt.files;
      setFile(file);
    }
  });

  // Spinner al enviar
  document.getElementById('formImportar').addEventListener('submit', function(){
    document.getElementById('btnImportarTxt').style.display = 'none';
    document.getElementById('btnImportarSpin').style.display = 'inline';
    btn.disabled = true;
  });
})();
</script>

<!-- POPUP duplicado -->
<div class="modal fade" id="mDup" tabindex="-1" data-bs-backdrop="static" aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered" style="max-width:400px;">
    <div class="modal-content border-0 shadow-lg" style="border-radius:14px;overflow:hidden;">
      <div style="background:linear-gradient(135deg,#991b1b,#dc2626);padding:22px 24px;display:flex;align-items:center;gap:14px;">
        <div style="width:46px;height:46px;min-width:46px;background:rgba(255,255,255,.15);border-radius:50%;display:flex;align-items:center;justify-content:center;">
          <i class="fa fa-user-xmark" style="font-size:22px;color:#fff;"></i>
        </div>
        <div style="flex:1;">
          <p style="margin:0;font-size:.65rem;color:rgba(255,255,255,.6);font-weight:700;letter-spacing:1.8px;text-transform:uppercase;">Registro rechazado</p>
          <p style="margin:3px 0 0;color:#fff;font-weight:800;font-size:1.05rem;">El usuario ya existe</p>
        </div>
        <button type="button" data-bs-dismiss="modal" style="background:rgba(255,255,255,.15);border:none;border-radius:50%;width:30px;height:30px;color:#fff;cursor:pointer;font-size:14px;display:flex;align-items:center;justify-content:center;"><i class="fa fa-xmark"></i></button>
      </div>
      <div style="padding:22px 24px 16px;background:#fff;">
        <p style="margin:0 0 14px;color:#1f2937;font-size:.95rem;line-height:1.65;">No es posible registrar este usuario porque la <strong>cédula, correo o código</strong> que ingresaste ya está registrado en el sistema.</p>
        <div style="background:#fef2f2;border-left:3px solid #dc2626;border-radius:0 6px 6px 0;padding:10px 14px;">
          <p style="margin:0;font-size:.83rem;color:#991b1b;"><i class="fa fa-lightbulb me-1"></i>Busca al usuario en la lista y edita sus datos si necesitas actualizarlos.</p>
        </div>
      </div>
      <div style="padding:12px 24px 20px;background:#fff;display:flex;justify-content:flex-end;gap:10px;border-top:1px solid #f3f4f6;">
        <button type="button" data-bs-dismiss="modal" class="btn btn-sm btn-secondary">Cerrar</button>
        <button type="button" class="btn btn-sm btn-danger" onclick="dupBuscar()"><i class="fa fa-magnifying-glass me-1"></i>Buscar usuario</button>
      </div>
    </div>
  </div>
</div>
<script>
<?php if(isset($_GET['dup']) && $_GET['dup']==='1'): ?>
document.addEventListener('DOMContentLoaded',function(){
  new bootstrap.Modal(document.getElementById('mDup')).show();
  if(window.history.replaceState){
    window.history.replaceState({},'','usuarios.php');
  }
});
<?php endif; ?>
function dupBuscar(){
  var m=bootstrap.Modal.getInstance(document.getElementById('mDup'));
  if(m)m.hide();
  document.getElementById('form-filtros').submit();
}
</script>
</body></html>