<?php
require_once __DIR__ . '/../../config/app.php';
require_once __DIR__ . '/../../config/onedrive.php';
require_once __DIR__ . '/../../includes/OneDriveStorage.php';
require_once __DIR__ . '/../../includes/auth.php';
require_once __DIR__ . '/../../includes/functions.php';
require_once __DIR__ . '/../../includes/flash.php';
requireRol(ROL_ESTUDIANTE);

$user        = currentUser();
$db          = getDB();
$pageTitle   = 'Convalidación PPP';
$idInstituto = (int)($user['id_instituto'] ?? 0);

// ── Datos del estudiante ────────────────────────────────────────
$stEst = $db->prepare("
    SELECT e.*, c.nombre AS carrera, u.nombres, u.apellidos, u.cedula, u.email
    FROM   estudiantes e
    JOIN   usuarios  u ON u.id_usuario = e.id_usuario
    JOIN   carreras  c ON c.id_carrera = e.id_carrera
    WHERE  e.id_usuario = :u
");
$stEst->execute([':u' => $user['id']]);
$est = $stEst->fetch();

// ── Práctica activa del estudiante (periodo del mismo instituto) ──
$practica = null;
if ($est) {
    $stP = $db->prepare("
        SELECT pr.*,
               COALESCE(em.razon_social, pr.emp_nueva_nombre) AS empresa_nombre,
               pe.nombre AS periodo_nombre
        FROM   practicas pr
        LEFT JOIN empresas         em ON em.id_empresa = pr.id_empresa
        JOIN     periodos_academicos pe ON pe.id_periodo = pr.id_periodo
                                       AND pe.activo = 1
                                       AND (:inst = 0 OR pe.id_instituto = :inst2)
        WHERE  pr.id_estudiante = :eid
        ORDER  BY pr.created_at DESC
        LIMIT  1
    ");
    $stP->execute([':eid' => $est['id_estudiante'], ':inst' => $idInstituto, ':inst2' => $idInstituto]);
    $practica = $stP->fetch();
}

// ── Solicitud de convalidación existente ─────────────────────────
$solicitud   = null;
$docsSubidos = [];
if ($est) {
    $stS = $db->prepare("
        SELECT cs.*, CONCAT(ur.nombres,' ',ur.apellidos) AS resuelto_nombre
        FROM   convalidaciones cs
        LEFT JOIN usuarios ur ON ur.id_usuario = cs.resuelto_por
        WHERE  cs.id_estudiante = :eid
        ORDER  BY cs.created_at DESC
        LIMIT  1
    ");
    $stS->execute([':eid' => $est['id_estudiante']]);
    $solicitud = $stS->fetch();

    if ($solicitud) {
        $stDocs = $db->prepare("SELECT * FROM convalidacion_documentos WHERE id_solicitud = :is ORDER BY codigo_doc");
        $stDocs->execute([':is' => $solicitud['id_solicitud']]);
        foreach ($stDocs->fetchAll() as $d) { $docsSubidos[$d['codigo_doc']] = $d; }
    }
}

// ── Catálogo de documentos ────────────────────────────────────────
$DOCS = [
    'CON-001' => ['titulo' => 'Solicitud de Convalidación',    'desc' => 'Carta firmada solicitando el reconocimiento de tu experiencia laboral como práctica preprofesional.'],
    'CON-002' => ['titulo' => 'Contrato o Nombramiento',       'desc' => 'Documento que acredita tu relación laboral vigente o pasada (contrato, nombramiento, acta de posesión).'],
    'CON-003' => ['titulo' => 'Rol de Pagos / Historial IESS', 'desc' => 'Rol de pagos o reporte de aportes del IESS que certifique el tiempo trabajado (mínimo las horas requeridas).'],
    'CON-004' => ['titulo' => 'Certificado del Empleador',     'desc' => 'Certificado firmado por el representante de la empresa, indicando cargo, funciones, fechas y horas trabajadas.'],
    'CON-005' => ['titulo' => 'Informe de Actividades',        'desc' => 'Informe descriptivo de las actividades realizadas y su relación directa con tu carrera.'],
];

// ── Validación segura de archivos (3 capas) ──────────────────
// Capa 1: extensión del nombre
// Capa 2: MIME type real con finfo (lee bytes internos, ignora el nombre)
// Capa 3: magic bytes — firma hexadecimal real al inicio del archivo
// Retorna '' si pasa todo, o mensaje de error si falla alguna capa.
if (!function_exists('validarArchivoSeguro')) {
    function validarArchivoSeguro(array $file, array $extsOk, array $mimesOk, array $magicOk): string
    {
        $ext = strtolower(pathinfo($file['name'], PATHINFO_EXTENSION));
        if (!in_array($ext, $extsOk))
            return 'Extensión no permitida. Solo se aceptan: ' . strtoupper(implode(', ', $extsOk)) . '.';

        if (function_exists('finfo_open')) {
            $fi   = finfo_open(FILEINFO_MIME_TYPE);
            $mime = $fi ? finfo_file($fi, $file['tmp_name']) : '';
            if ($fi) finfo_close($fi);
            if ($mime && !in_array($mime, $mimesOk))
                return 'El contenido del archivo no corresponde al tipo permitido (MIME inválido).';
        }

        $fh = fopen($file['tmp_name'], 'rb');
        if ($fh === false) return 'No se pudo leer el archivo temporalmente.';
        $cabecera = fread($fh, max(array_column($magicOk, 'len')));
        fclose($fh);

        foreach ($magicOk as $firma)
            if (substr($cabecera, 0, $firma['len']) === $firma['bytes']) return '';

        return 'El archivo no tiene la firma interna correcta. Puede ser un archivo falso con extensión cambiada.';
    }
}

if (!defined('MAGIC_CONV')) {
    define('MAGIC_CONV', [
        'pdf'  => ['bytes' => '%PDF-',             'len' => 5],
        'jpg'  => ['bytes' => "\xFF\xD8\xFF",      'len' => 3],
        'jpeg' => ['bytes' => "\xFF\xD8\xFF",      'len' => 3],
        'png'  => ['bytes' => "\x89PNG",           'len' => 4],
    ]);
}

// ── Catálogos filtrados por instituto ────────────────────────────
// CORRECCIÓN: se filtra id_instituto para evitar mostrar datos de otros institutos
$stPer = $idInstituto
    ? $db->prepare("SELECT id_periodo, nombre FROM periodos_academicos WHERE activo=1 AND id_instituto=:inst ORDER BY id_periodo DESC")
    : $db->prepare("SELECT id_periodo, nombre FROM periodos_academicos WHERE activo=1 ORDER BY id_periodo DESC");
if ($idInstituto) $stPer->execute([':inst' => $idInstituto]);
else              $stPer->execute();
$periodos = $stPer->fetchAll();

$stEmp = $idInstituto
    ? $db->prepare("SELECT id_empresa, razon_social FROM empresas WHERE activa=1 AND id_instituto=:inst ORDER BY razon_social")
    : $db->prepare("SELECT id_empresa, razon_social FROM empresas WHERE activa=1 ORDER BY razon_social");
if ($idInstituto) $stEmp->execute([':inst' => $idInstituto]);
else              $stEmp->execute();
$empresas = $stEmp->fetchAll();

// ── PROCESAR POST ─────────────────────────────────────────────────
if ($_SERVER['REQUEST_METHOD'] === 'POST' && $est) {
    $accion = $_POST['accion'] ?? '';

    // 1. Crear solicitud nueva
    if ($accion === 'crear_solicitud' && !$solicitud) {
        $idPractica = (int)($_POST['id_practica'] ?? 0);
        $idPeriodo  = (int)($_POST['id_periodo']  ?? 0);

        if (!$idPractica && $idPeriodo) {
            $idEmp = (int)($_POST['id_empresa']           ?? 0);
            $area  = trim($_POST['area_practica']         ?? '');
            $cargo = trim($_POST['cargo_practica']        ?? '');
            $ntEmp = trim($_POST['nombre_tutor_empresa']  ?? '');
            $etEmp = trim($_POST['email_tutor_empresa']   ?? '');

            if (!$idEmp || !$area) {
                flashSet('err', 'Selecciona la empresa y el área de trabajo.');
                header('Location: convalidacion.php'); exit;
            }

            $db->prepare("
                INSERT INTO practicas
                  (id_estudiante, id_empresa, id_periodo, area_practica, cargo_practica,
                   nombre_tutor_empresa, email_tutor_empresa, estado, modalidad, horas_requeridas)
                VALUES (:eid,:emp,:per,:area,:cargo,:nt,:et,'postulado','convalidacion',400)
            ")->execute([
                ':eid'=>$est['id_estudiante'],':emp'=>$idEmp,':per'=>$idPeriodo,
                ':area'=>$area,':cargo'=>$cargo,':nt'=>$ntEmp,':et'=>$etEmp,
            ]);
            $idPractica = (int)$db->lastInsertId();
        }

        if (!$idPractica) {
            flashSet('err', 'No se pudo identificar la práctica. Completa todos los campos.');
            header('Location: convalidacion.php'); exit;
        }

        $db->prepare("INSERT INTO convalidaciones (id_practica,id_estudiante,estado) VALUES (:ip,:eid,'pendiente')")
           ->execute([':ip'=>$idPractica,':eid'=>$est['id_estudiante']]);

        $idSol = (int)$db->lastInsertId();
        foreach (array_keys($DOCS) as $cod) {
            $db->prepare("INSERT INTO convalidacion_documentos (id_solicitud,codigo_doc) VALUES (:is,:cod)")
               ->execute([':is'=>$idSol,':cod'=>$cod]);
        }

        registrarAudit($user['id'], 'crear_convalidacion', 'convalidaciones', $idSol);
        flashSet('ok', 'Solicitud creada. Sube los 5 documentos requeridos.');
        header('Location: convalidacion.php'); exit;
    }

    // 2. Subir documento
    if ($accion === 'subir_doc' && $solicitud && in_array($solicitud['estado'], ['pendiente','en_revision'])) {
        $cod  = $_POST['codigo_doc'] ?? '';
        $file = $_FILES['archivo_doc'] ?? null;

        if (!array_key_exists($cod, $DOCS) || !$file || $file['error'] !== UPLOAD_ERR_OK) {
            flashSet('err', 'Error al subir el archivo. Verifica que sea un PDF válido.');
            header('Location: convalidacion.php'); exit;
        }
        if ($file['size'] > 5 * 1024 * 1024) {
            flashSet('err', 'El archivo no debe superar 5 MB.');
            header('Location: convalidacion.php'); exit;
        }
        // Validación 3 capas: extensión + MIME real + magic bytes
        $errDoc = validarArchivoSeguro(
            $file,
            ['pdf'],
            ['application/pdf'],
            [MAGIC_CONV['pdf']]
        );
        if ($errDoc) {
            flashSet('err', $errDoc);
            header('Location: convalidacion.php'); exit;
        }

        $nombreArchivo = $cod . '-' . $est['cedula'] . '-' . time() . '.pdf';
        try {
            $rutaRelativa = OneDriveStorage::upload($file['tmp_name'], 'convalidaciones', $nombreArchivo, (string)$solicitud['id_solicitud'], $idInstituto);
            $db->prepare("
                UPDATE convalidacion_documentos
                SET nombre_archivo=:nom, ruta_archivo=:ruta, tamano_bytes=:tam,
                    estado='enviado', observacion=NULL, subido_por=:uid, subido_at=NOW(), updated_at=NOW()
                WHERE id_solicitud=:is AND codigo_doc=:cod
            ")->execute([':nom'=>$nombreArchivo,':ruta'=>$rutaRelativa,':tam'=>$file['size'],
                         ':uid'=>$user['id'],':is'=>$solicitud['id_solicitud'],':cod'=>$cod]);

            if ($solicitud['estado'] === 'pendiente') {
                $db->prepare("UPDATE convalidaciones SET estado='en_revision',updated_at=NOW() WHERE id_solicitud=:is")
                   ->execute([':is'=>$solicitud['id_solicitud']]);
            }

            // Notificar coordinador del mismo instituto
            $stCoord = $idInstituto
                ? $db->prepare("SELECT u.id_usuario FROM coordinadores co JOIN usuarios u ON u.id_usuario=co.id_usuario WHERE u.id_instituto=:inst LIMIT 1")
                : $db->prepare("SELECT u.id_usuario FROM coordinadores co JOIN usuarios u ON u.id_usuario=co.id_usuario LIMIT 1");
            if ($idInstituto) $stCoord->execute([':inst' => $idInstituto]);
            else              $stCoord->execute();
            $coord = $stCoord->fetch();

            if ($coord) {
                $db->prepare("INSERT INTO notificaciones(id_usuario,tipo,asunto,mensaje) VALUES(:uid,'sistema',:as,:msg)")
                   ->execute([
                       ':uid' => $coord['id_usuario'],
                       ':as'  => 'Documento de convalidación subido',
                       ':msg' => $est['nombres'].' '.$est['apellidos'].' subió el documento '.$cod.' para convalidación.',
                   ]);
            }

            registrarAudit($user['id'], 'subir_doc_convalidacion', 'convalidacion_documentos', $solicitud['id_solicitud']);
            flashSet('ok', "Documento {$cod} enviado correctamente.");
        } catch(Exception $e) {
            flashSet('err', 'Error al subir a OneDrive: '.$e->getMessage());
        }
        header('Location: convalidacion.php'); exit;
    }

    // 3. Cancelar solicitud
    if ($accion === 'cancelar_solicitud' && $solicitud && $solicitud['estado'] === 'pendiente') {
        $idSol = $solicitud['id_solicitud'];

        $stDocCount = $db->prepare("SELECT COUNT(*) FROM convalidacion_documentos WHERE id_solicitud=:is AND nombre_archivo IS NOT NULL");
        $stDocCount->execute([':is' => $idSol]);
        $docsConArchivo = (int)$stDocCount->fetchColumn();

        if ($docsConArchivo > 0) {
            flashSet('err', 'No puedes cancelar: ya subiste '.$docsConArchivo.' documento(s). Contacta al coordinador.');
            header('Location: convalidacion.php'); exit;
        }

        $db->prepare("DELETE FROM convalidacion_documentos WHERE id_solicitud=:is")->execute([':is'=>$idSol]);
        $db->prepare("DELETE FROM convalidaciones WHERE id_solicitud=:is AND id_estudiante=:eid")
           ->execute([':is'=>$idSol,':eid'=>$est['id_estudiante']]);

        if ($solicitud['id_practica']) {
            $stPr = $db->prepare("SELECT id_practica,modalidad,estado FROM practicas WHERE id_practica=:id AND id_estudiante=:eid");
            $stPr->execute([':id'=>$solicitud['id_practica'],':eid'=>$est['id_estudiante']]);
            $prCon = $stPr->fetch();
            if ($prCon && $prCon['modalidad'] === 'convalidacion' && $prCon['estado'] === 'postulado') {
                $db->prepare("DELETE FROM practicas WHERE id_practica=:id")->execute([':id'=>$prCon['id_practica']]);
            }
        }

        registrarAudit($user['id'], 'cancelar_convalidacion', 'convalidaciones', $idSol);
        flashSet('ok', 'Solicitud cancelada exitosamente.');
        header('Location: convalidacion.php'); exit;
    }

    // 4. Subir comprobante de pago
    if ($accion === 'enviar_comprobante_conv' && $solicitud) {
        if (in_array($solicitud['estado_pago'] ?? 'pendiente', ['pendiente','rechazado'])) {
            if (empty($_FILES['comprobante_pago']['name'])) {
                flashSet('err', 'Debes adjuntar el comprobante o PDF de exoneración.');
            } else {
                $file = $_FILES['comprobante_pago'];
                if ($file['error'] !== UPLOAD_ERR_OK) {
                    flashSet('err', 'Error al recibir el archivo.');
                } elseif ($file['size'] > 5 * 1024 * 1024) {
                    flashSet('err', 'El archivo no puede superar 5 MB.');
                } else {
                    // Validación 3 capas: extensión + MIME real + magic bytes
                    $errComp = validarArchivoSeguro(
                        $file,
                        ['pdf','jpg','jpeg','png'],
                        ['application/pdf','image/jpeg','image/png'],
                        array_values(array_intersect_key(MAGIC_CONV, array_flip(['pdf','jpg','jpeg','png'])))
                    );
                    if ($errComp) {
                        flashSet('err', $errComp);
                    } else {
                        $ext   = strtolower(pathinfo($file['name'], PATHINFO_EXTENSION));
                        $fname = 'comp_conv_' . $est['id_estudiante'] . '_' . time() . '.' . $ext;
                        try {
                            $rutaComp = OneDriveStorage::upload($file['tmp_name'], 'comprobantes_convalidacion', $fname, (string)$solicitud['id_solicitud'], $idInstituto);
                            $db->prepare("UPDATE convalidaciones SET comprobante_pago=:c, estado_pago='enviada', updated_at=NOW() WHERE id_solicitud=:is")
                               ->execute([':c'=>$rutaComp,':is'=>$solicitud['id_solicitud']]);
                            flashSet('ok', '✅ Comprobante enviado. Facturación validará y recibirás una notificación.');
                        } catch(Exception $e) {
                            flashSet('err', 'Error al subir a OneDrive: '.$e->getMessage());
                        }
                    }
                }
            }
        }
        header('Location: convalidacion.php'); exit;
    }
}

// ── Precio de convalidación ──────────────────────────────────
$stPrecioConv = $db->prepare("SELECT valor FROM configuracion_institucional WHERE id_instituto=:id AND clave='precio_convalidacion'");
$stPrecioConv->execute([':id' => $idInstituto]);
$precioConv = number_format((float)($stPrecioConv->fetchColumn() ?: '0.00'), 2);
?>
<?php $paginaActual = 'convalidacion'; ?>
<!DOCTYPE html>
<html lang="es">
<head>
<?php include __DIR__ . '/../../includes/head.php'; ?>
<link rel="stylesheet" href="<?= BASE_URL ?>/assets/css/sidebar.css">
<link rel="stylesheet" href="<?= BASE_URL ?>/assets/css/sidebar-estudiante.css">
<style>
  /* ═══════════════════════════════════════════════════════════
     PALETA CLARA PROFESIONAL — Convalidación PPP
  ═══════════════════════════════════════════════════════════ */
  :root {
    --bg-page:    #f0f4f8;   /* fondo general           */
    --bg-card:    #ffffff;   /* tarjetas                */
    --bg-inner:   #f8fafc;   /* fondos secundarios      */
    --border:     #e2e8f0;   /* bordes suaves           */
    --border-med: #cbd5e1;   /* bordes medios           */
    --text-1:     #1e293b;   /* texto principal         */
    --text-2:     #64748b;   /* texto secundario        */
    --text-3:     #94a3b8;   /* texto tenue             */
    --blue:       #3b82f6;
    --blue-dk:    #2563eb;
    --emerald:    #10b981;
    --amber:      #f59e0b;
    --red:        #ef4444;
    --violet:     #8b5cf6;
    --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 { background: var(--bg-page); color: var(--text-1); }

  /* ── Encabezado de página ── */
  .page-header h4 { color: var(--text-1); font-weight: 700; }
  .page-header p  { color: var(--text-2); font-size: 13.5px; margin: 0; }

  /* ── Tarjetas principales ── */
  .card-pro {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 24px 28px;
    margin-bottom: 18px;
    box-shadow: var(--shadow-sm);
    transition: box-shadow .2s, border-color .2s;
  }
  .card-pro:hover { border-color: var(--border-med); box-shadow: var(--shadow-md); }
  .card-title {
    font-size: 15px; font-weight: 700; color: var(--text-1);
    margin-bottom: 16px; display: flex; align-items: center; gap: 10px;
  }
  .card-title i { color: var(--blue); font-size: 16px; }

  /* ── Info box ── */
  .info-box {
    background: rgba(59,130,246,.05);
    border: 1px solid rgba(59,130,246,.2);
    border-radius: var(--radius);
    padding: 14px 18px;
    font-size: 13px;
    color: var(--text-2);
    margin-bottom: 20px;
    line-height: 1.6;
  }
  .info-box strong { color: var(--text-1); }
  .info-box .ico   { color: var(--blue); }

  /* ── Chips de estado ── */
  .chip {
    font-size: 10px; font-weight: 700; padding: 3px 11px;
    border-radius: 20px; text-transform: uppercase; letter-spacing: .5px;
    white-space: nowrap; display: inline-flex; align-items: center; gap: 4px;
    border: 1px solid;
  }
  .chip-pend { background: rgba(245,158,11,.1);  color: #b45309; border-color: rgba(245,158,11,.3); }
  .chip-env  { background: rgba(59,130,246,.1);  color: #1d4ed8; border-color: rgba(59,130,246,.3); }
  .chip-obs  { background: rgba(239,68,68,.1);   color: #b91c1c; border-color: rgba(239,68,68,.3); }
  .chip-apr  { background: rgba(16,185,129,.1);  color: #047857; border-color: rgba(16,185,129,.3); }

  /* ── Tarjeta de documento ── */
  .doc-card {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    overflow: hidden;
    margin-bottom: 12px;
    box-shadow: var(--shadow-sm);
    transition: box-shadow .2s, border-color .2s, transform .15s;
  }
  .doc-card:hover { border-color: var(--border-med); box-shadow: var(--shadow-md); transform: translateY(-1px); }
  .doc-barra { width: 4px; flex-shrink: 0; }
  .doc-body  { flex: 1; padding: 14px 20px; min-width: 0; }
  .doc-footer {
    padding: 11px 16px;
    border-top: 1px solid var(--border);
    background: var(--bg-inner);
    display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
  }

  /* ── Botones de acción ── */
  .btn-ac {
    padding: 7px 16px; border-radius: var(--radius-sm); font-size: 12px; font-weight: 600;
    cursor: pointer; border: 1px solid transparent; text-decoration: none;
    display: inline-flex; align-items: center; gap: 6px;
    white-space: nowrap; transition: all .15s;
  }
  .btn-subir  { background: rgba(59,130,246,.08);  color: var(--blue-dk); border-color: rgba(59,130,246,.25); }
  .btn-subir:hover { background: rgba(59,130,246,.16); }
  .btn-ver    { background: rgba(139,92,246,.08);  color: var(--violet);  border-color: rgba(139,92,246,.25); }
  .btn-ver:hover { background: rgba(139,92,246,.16); }
  .btn-dis    { background: var(--bg-inner); color: var(--text-3); border-color: var(--border); cursor: default; }
  .btn-cancel { background: rgba(239,68,68,.08);   color: #b91c1c;        border-color: rgba(239,68,68,.25); }
  .btn-cancel:hover { background: rgba(239,68,68,.15); }
  .btn-ok     { background: rgba(16,185,129,.08);  color: #047857;        border-color: rgba(16,185,129,.25); cursor: default; }

  /* ── Upload inline ── */
  .upload-form {
    display: none; width: 100%; margin-top: 10px; padding: 14px;
    background: rgba(59,130,246,.04);
    border-radius: var(--radius-sm); border: 1px dashed rgba(59,130,246,.3);
  }
  .upload-form input[type=file] {
    width: 100%; background: var(--bg-card); border: 1px solid var(--border-med);
    color: var(--text-1); border-radius: var(--radius-sm); padding: 8px 10px; font-size: 12px;
  }

  /* ── Barra de progreso ── */
  .prog-wrap  { margin-top: 14px; }
  .prog-label { display: flex; justify-content: space-between; font-size: 11px; color: var(--text-3); margin-bottom: 6px; }
  .prog-bar   { height: 6px; background: var(--border); border-radius: 4px; overflow: hidden; }
  .prog-fill  { height: 100%; border-radius: 4px; transition: width .5s cubic-bezier(.4,0,.2,1); }

  /* ── Cajas de resolución ── */
  .res-box {
    border-radius: var(--radius); padding: 18px 22px;
    font-size: 13px; margin-top: 20px; line-height: 1.6;
  }
  .res-ok  { background: rgba(16,185,129,.07);  border: 1px solid rgba(16,185,129,.25); color: #047857; }
  .res-err { background: rgba(239,68,68,.07);   border: 1px solid rgba(239,68,68,.25);  color: #b91c1c; }

  /* ── Form select / input ── */
  .form-select, .form-control {
    background: var(--bg-card) !important;
    border-color: var(--border-med) !important;
    color: var(--text-1) !important;
    border-radius: var(--radius-sm) !important;
  }
  .form-select:focus, .form-control:focus {
    border-color: var(--blue) !important;
    box-shadow: 0 0 0 3px rgba(59,130,246,.12) !important;
  }
  .form-label { font-size: 12.5px; color: var(--text-2); font-weight: 500; margin-bottom: 5px; }
  .form-label span { color: var(--red); }

  /* ── Botón primario ── */
  .btn-primary {
    background: var(--blue) !important;
    border-color: var(--blue) !important;
    font-weight: 600 !important;
    border-radius: var(--radius-sm) !important;
  }
  .btn-primary:hover { background: var(--blue-dk) !important; }

  /* ── Separador sección ── */
  .sec-label {
    font-size: 10px; font-weight: 700; color: var(--text-2);
    text-transform: uppercase; letter-spacing: .8px;
    border-bottom: 1px solid var(--border);
    padding-bottom: 8px; margin-bottom: 16px;
    display: flex; align-items: center; gap: 8px;
  }
  .sec-label i { color: var(--blue); }

  /* ── Stat número ── */
  .stat-num { font-size: 28px; font-weight: 800; line-height: 1; color: var(--text-1); }

  /* ── Observación box ── */
  .obs-box {
    background: rgba(239,68,68,.06); border: 1px solid rgba(239,68,68,.2);
    border-radius: var(--radius-sm); padding: 10px 14px;
    font-size: 12px; color: #b91c1c; margin-top: 10px;
  }

  /* ── Lock notice ── */
  .lock-notice {
    font-size: 11px; color: #92400e;
    background: rgba(245,158,11,.08); border: 1px solid rgba(245,158,11,.3);
    border-radius: var(--radius-sm); padding: 9px 13px;
    max-width: 230px; text-align: center; line-height: 1.5;
  }

  /* ── Sección de pago (igual a mi_practica) ── */
  .seccion-pago {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-left: 4px solid #f97316;
    border-radius: 14px;
    padding: 1.5rem 1.75rem;
    margin-bottom: 1.25rem;
    box-shadow: var(--shadow-sm);
  }
  .sec-step-pago  { font-size:10px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:#ea580c;margin-bottom:2px; }
  .sec-title-pago { font-size:15px;font-weight:700;color:var(--text-1);margin:0 0 2px; }
  .sec-sub-pago   { font-size:12px;color:var(--text-2);margin:0 0 1.1rem; }

  /* ── Upload zone drag & drop ── */
  .upload-zone-pago {
    border: 2px dashed var(--border-med);
    border-radius: var(--radius);
    padding: 1.5rem 1rem;
    text-align: center;
    cursor: pointer;
    transition: border-color .18s, background .18s;
    background: var(--bg-inner);
  }
  .upload-zone-pago:hover  { border-color: #f97316; background: #fff7ed; }
  .upload-zone-pago.loaded { border-color: var(--emerald); background: rgba(16,185,129,.06); }
  .upload-zone-pago input[type=file] { display: none; }

  /* ── Cajas estado pago ── */
  .caja-pago-info  { background:#eff6ff;border:1px solid #bfdbfe;border-radius:10px;padding:12px 16px;color:#1e40af;font-size:13px; }
  .caja-pago-ok    { background:#ecfdf5;border:1px solid #a7f3d0;border-radius:10px;padding:12px 16px;color:#065f46;font-size:13px; }
  .caja-pago-warn  { background:#fffbeb;border:1px solid #fde68a;border-radius:10px;padding:12px 16px;color:#92400e;font-size:13px; }
  .caja-pago-error { background:#fef2f2;border:1px solid #fecaca;border-radius:10px;padding:12px 16px;color:#991b1b;font-size:13px; }

  /* ── Preview comprobante enviado ── */
  .comp-preview-pago {
    display:flex;align-items:center;gap:14px;
    background:#f0fdf4;border:1px solid #bbf7d0;
    border-radius:10px;padding:14px 16px;margin-bottom:14px;
  }

  /* ── Divisor flecha ── */
  .sec-arrow { display:flex;align-items:center;justify-content:center;padding:.4rem 0 .2rem;color:#f97316;font-size:18px; }

  /* ── Exonerado badge ── */
  .exon-badge { display:inline-flex;align-items:center;gap:4px;background:#fef3c7;color:#92400e;border:1px solid #fde68a;border-radius:6px;padding:3px 10px;font-size:11px;font-weight:700; }

  /* ── Alerta empresa/periodo sin datos ── */
  .empty-notice {
    background: rgba(245,158,11,.07); border: 1px solid rgba(245,158,11,.25);
    border-radius: var(--radius); padding: 12px 16px;
    font-size: 12.5px; color: #92400e; margin-bottom: 14px;
  }
</style>
</head>
<body>
<?php include __DIR__ . '/../../includes/navbar.php'; ?>
<div class="app-shell">
<?php include __DIR__ . '/../../includes/sidebar-estudiante.php'; ?>

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

  <!-- Encabezado -->
  <div class="page-header" style="margin-bottom:24px;">
    <h4 style="display:flex;align-items:center;gap:10px;">
      <span style="background:var(--blue);width:36px;height:36px;border-radius:10px;
                   display:inline-flex;align-items:center;justify-content:center;">
        <i class="fa fa-rotate" style="color:#fff;font-size:16px;"></i>
      </span>
      Convalidación de Prácticas Preprofesionales
    </h4>
    <p>Si ya trabajas en una empresa, puedes solicitar que tu experiencia sea reconocida como práctica preprofesional.</p>
  </div>

  <?php if (!$est): ?>
  <!-- ── Sin perfil ── -->
  <div class="info-box">
    <i class="fa fa-triangle-exclamation ico" style="color:#92400e;"></i>
    Tu perfil de estudiante no está configurado. Contacta al coordinador para que lo active.
  </div>

  <?php elseif (!$solicitud): ?>
  <!-- ══════════════════════════════════════════════════════════
       FORMULARIO: NUEVA SOLICITUD
  ══════════════════════════════════════════════════════════ -->
  <div class="info-box">
    <i class="fa fa-circle-info ico"></i>
    <strong>¿Qué es la convalidación?</strong> Si actualmente trabajas o has trabajado en una empresa
    en funciones relacionadas a tu carrera, puedes solicitar que esas horas sean reconocidas como
    prácticas preprofesionales. Deberás presentar 5 documentos que acrediten tu relación laboral.
  </div>

  <div class="card-pro">
    <div class="card-title">
      <i class="fa fa-file-circle-plus"></i>
      Nueva solicitud de convalidación
    </div>

    <?php if (empty($periodos)): ?>
    <div class="empty-notice">
      <i class="fa fa-triangle-exclamation me-2"></i>
      No hay períodos académicos activos configurados en tu instituto. Contacta al coordinador.
    </div>
    <?php elseif (empty($empresas)): ?>
    <div class="empty-notice">
      <i class="fa fa-triangle-exclamation me-2"></i>
      No hay empresas registradas en tu instituto. Contacta al coordinador para registrar la empresa.
    </div>
    <?php endif; ?>

    <form method="POST" enctype="multipart/form-data">
      <input type="hidden" name="accion" value="crear_solicitud">

      <?php if ($practica && $practica['estado'] !== 'rechazado'): ?>
        <input type="hidden" name="id_practica" value="<?= $practica['id_practica'] ?>">
        <div style="background:rgba(16,185,129,.07);border:1px solid rgba(16,185,129,.25);border-radius:10px;
                    padding:12px 18px;margin-bottom:20px;font-size:13px;color:#047857;">
          <i class="fa fa-circle-check me-2"></i>
          Se vinculará a tu práctica en <strong><?= htmlspecialchars($practica['empresa_nombre']) ?></strong>
          — período <strong><?= htmlspecialchars($practica['periodo_nombre']) ?></strong>
        </div>
      <?php else: ?>
        <div class="row g-3 mb-4">
          <div class="col-md-6">
            <label class="form-label">Período académico <span>*</span></label>
            <select name="id_periodo" class="form-select" required>
              <option value="">— Selecciona el período —</option>
              <?php foreach ($periodos as $p): ?>
              <option value="<?= $p['id_periodo'] ?>"><?= htmlspecialchars($p['nombre']) ?></option>
              <?php endforeach; ?>
            </select>
          </div>
          <div class="col-md-6">
            <label class="form-label">Empresa donde trabajas <span>*</span></label>
            <select name="id_empresa" class="form-select" required>
              <option value="">— Selecciona la empresa —</option>
              <?php foreach ($empresas as $e): ?>
              <option value="<?= $e['id_empresa'] ?>"><?= htmlspecialchars($e['razon_social']) ?></option>
              <?php endforeach; ?>
            </select>
          </div>
          <div class="col-md-6">
            <label class="form-label">Área de trabajo <span>*</span></label>
            <input type="text" name="area_practica" class="form-control"
                   placeholder="Ej: Desarrollo de Software, Contabilidad..." required>
          </div>
          <div class="col-md-6">
            <label class="form-label">Cargo que desempeñas</label>
            <input type="text" name="cargo_practica" class="form-control"
                   placeholder="Ej: Desarrollador Junior, Auxiliar Contable...">
          </div>
          <div class="col-md-6">
            <label class="form-label">Nombre del jefe / supervisor</label>
            <input type="text" name="nombre_tutor_empresa" class="form-control" placeholder="Nombre completo">
          </div>
          <div class="col-md-6">
            <label class="form-label">Email del jefe / supervisor</label>
            <input type="email" name="email_tutor_empresa" class="form-control" placeholder="correo@empresa.com">
          </div>
        </div>
      <?php endif; ?>

      <div style="border-top:1px solid var(--border);padding-top:18px;">
        <div style="font-size:12px;color:var(--text-3);margin-bottom:14px;display:flex;gap:8px;align-items:flex-start;">
          <i class="fa fa-circle-info" style="color:var(--blue);margin-top:2px;"></i>
          <span>Al crear la solicitud deberás subir <strong style="color:var(--text-2);">5 documentos</strong>
          que acrediten tu experiencia laboral. El coordinador revisará cada uno.</span>
        </div>
        <button type="submit" class="btn btn-primary"
                onclick="return confirm('¿Confirmas que trabajas o has trabajado en esta empresa y deseas solicitar la convalidación?')">
          <i class="fa fa-paper-plane me-2"></i>Crear solicitud de convalidación
        </button>
      </div>
    </form>
  </div>

  <?php else: ?>
  <!-- ══════════════════════════════════════════════════════════
       VISTA: SOLICITUD EXISTENTE + DOCUMENTOS
  ══════════════════════════════════════════════════════════ -->
  <?php
    $docsApr   = count(array_filter($docsSubidos, fn($d) => $d['estado'] === 'aprobado'));
    $docsObs   = count(array_filter($docsSubidos, fn($d) => $d['estado'] === 'observado'));
    $docsTotal = count($DOCS);
    $pct       = $docsTotal ? round(($docsApr / $docsTotal) * 100) : 0;
    $estadoSol = $solicitud['estado'];

    $solChip = match($estadoSol) {
        'aprobada'    => ['chip-apr', 'Aprobada'],
        'rechazada'   => ['chip-obs', 'Rechazada'],
        'en_revision' => ['chip-env', 'En revisión'],
        default       => ['chip-pend', 'Pendiente'],
    };
    $colorPct = $pct === 100 ? 'var(--emerald)' : 'var(--blue)';
  ?>

  <!-- Cabecera de solicitud -->
  <div class="card-pro">
    <div class="d-flex justify-content-between align-items-start flex-wrap gap-3">
      <div>
        <div style="font-size:11px;color:var(--text-3);font-weight:600;text-transform:uppercase;letter-spacing:.6px;margin-bottom:6px;">
          Solicitud de convalidación
        </div>
        <div style="font-size:22px;font-weight:800;color:var(--text-1);">
          #<?= str_pad($solicitud['id_solicitud'], 4, '0', STR_PAD_LEFT) ?>
        </div>
        <div style="font-size:12px;color:var(--text-3);margin-top:4px;">
          <i class="fa fa-calendar-days me-1"></i>
          Creada el <?= date('d M Y', strtotime($solicitud['created_at'])) ?>
        </div>
        <div style="margin-top:12px;display:flex;align-items:center;gap:8px;flex-wrap:wrap;">
          <span class="chip <?= $solChip[0] ?>"><?= $solChip[1] ?></span>
          <?php if ($docsObs > 0): ?>
          <span class="chip chip-obs">
            <i class="fa fa-triangle-exclamation"></i>
            <?= $docsObs ?> doc<?= $docsObs > 1 ? 's' : '' ?> con observación
          </span>
          <?php endif; ?>
        </div>
      </div>

      <!-- Estadística + botón cancelar -->
      <div style="display:flex;flex-direction:column;align-items:flex-end;gap:14px;">
        <div style="text-align:right;">
          <div class="stat-num" style="color:<?= $colorPct ?>;"><?= $pct ?>%</div>
          <div style="font-size:11px;color:var(--text-3);margin-top:2px;">
            <?= $docsApr ?> / <?= $docsTotal ?> documentos aprobados
          </div>
        </div>

        <?php
          $docsConArchivo = count(array_filter($docsSubidos, fn($d) => !empty($d['nombre_archivo'])));
        ?>
        <?php if ($estadoSol === 'pendiente'): ?>
          <?php if ($docsConArchivo === 0): ?>
          <form method="POST" style="margin:0;">
            <input type="hidden" name="accion" value="cancelar_solicitud">
            <button type="submit" class="btn-ac btn-cancel"
              onclick="return confirm('¿Seguro que deseas cancelar esta solicitud?\n\nSe eliminará definitivamente.')">
              <i class="fa fa-xmark-circle"></i> Cancelar solicitud
            </button>
          </form>
          <?php else: ?>
          <div class="lock-notice">
            <i class="fa fa-lock me-1"></i>
            <?= $docsConArchivo ?> doc<?= $docsConArchivo > 1 ? 's' : '' ?> subido<?= $docsConArchivo > 1 ? 's' : '' ?>.<br>
            <span style="color:var(--text-3);">No se puede cancelar.<br>Contacta al coordinador.</span>
          </div>
          <?php endif; ?>
        <?php endif; ?>
      </div>
    </div>

    <!-- Barra de progreso -->
    <div class="prog-wrap">
      <div class="prog-label">
        <span>Progreso de documentos</span>
        <span><?= $docsApr ?> aprobado<?= $docsApr !== 1 ? 's' : '' ?></span>
      </div>
      <div class="prog-bar">
        <div class="prog-fill" style="width:<?= $pct ?>%;background:<?= $colorPct ?>;"></div>
      </div>
    </div>
  </div>

  <!-- Resolución final -->
  <?php if ($estadoSol === 'aprobada'): ?>
  <div class="res-box res-ok">
    <i class="fa fa-trophy me-2" style="font-size:16px;"></i>
    <strong>¡Convalidación aprobada!</strong> —
    <?= date('d M Y', strtotime($solicitud['resuelto_at'])) ?>
    por <?= htmlspecialchars($solicitud['resuelto_nombre'] ?? '—') ?>.
    <?php if ($solicitud['resolucion']): ?>
    <div style="margin-top:8px;font-size:12px;opacity:.85;"><?= htmlspecialchars($solicitud['resolucion']) ?></div>
    <?php endif; ?>
  </div>

  <?php elseif ($estadoSol === 'rechazada'): ?>
  <div class="res-box res-err">
    <i class="fa fa-circle-xmark me-2" style="font-size:16px;"></i>
    <strong>Solicitud rechazada.</strong>
    <?php if ($solicitud['resolucion']): ?>
    <div style="margin-top:8px;font-size:12px;">Motivo: <?= htmlspecialchars($solicitud['resolucion']) ?></div>
    <?php endif; ?>
    <div style="margin-top:12px;font-size:12px;color:var(--text-3);">
      Si crees que es un error, contacta directamente con la coordinadora de prácticas.
    </div>
  </div>

  <?php else: ?>

  <!-- Instrucción -->
  <div class="info-box" style="margin-bottom:18px;">
    <i class="fa fa-circle-info ico"></i>
    Sube cada documento en formato <strong>PDF</strong> (máx. 5 MB).
    El coordinador revisará y aprobará o devolverá con observaciones.
  </div>

  <!-- ══════════════════════════════════════════════════════════
       SECCIÓN PAGO — igual a mi_practica.php
  ══════════════════════════════════════════════════════════ -->
  <?php
  $estPago  = $solicitud['estado_pago']     ?? 'pendiente';
  $compConv = $solicitud['comprobante_pago'] ?? null;
  $obsPago  = $solicitud['obs_pago']         ?? null;
  $esExonConv = (int)($solicitud['exonerado'] ?? 0);
  $puedeSubirConv = in_array($estPago, ['pendiente','rechazado']);
  ?>

  <div class="sec-arrow"><i class="fa fa-arrow-down"></i></div>

  <div class="seccion-pago">
    <p class="sec-step-pago">Comprobante de Pago</p>
    <p class="sec-title-pago"><i class="fa fa-file-invoice-dollar me-2" style="color:#f97316;"></i>Pago del Trámite de Convalidación</p>
    <p class="sec-sub-pago">
      <?php if ((float)$precioConv > 0): ?>
        Adjunta el comprobante del pago de <strong style="color:var(--text-1);">$<?= $precioConv ?></strong> para que Facturación lo valide y puedas continuar el proceso.
      <?php else: ?>
        Sube el comprobante o, si eres exonerado, el PDF que lo acredita ($0.00).
      <?php endif; ?>
    </p>

    <?php if ($estPago === 'enviada'): ?>
      <!-- Enviado — en revisión -->
      <div class="comp-preview-pago">
        <div style="width:44px;height:44px;background:#bbf7d0;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0;">
          <i class="fa fa-file-invoice-dollar" style="color:#059669;font-size:20px;"></i>
        </div>
        <div>
          <div style="font-weight:700;color:#065f46;font-size:.9rem;">Comprobante enviado</div>
          <div style="font-size:12px;color:#059669;margin-top:2px;"><?= htmlspecialchars($compConv) ?></div>
        </div>
      </div>
      <div class="caja-pago-info">
        <i class="fa fa-hourglass-half me-2"></i>
        Facturación está validando tu comprobante. Recibirás una notificación cuando sea procesado.
      </div>

    <?php elseif ($estPago === 'aprobado'): ?>
      <!-- Aprobado -->
      <div class="caja-pago-ok">
        <i class="fa fa-circle-check me-2"></i>
        <strong>Pago validado.</strong>
        <?php if ($esExonConv): ?>
          <span class="exon-badge ms-2"><i class="fa fa-star"></i>Exonerado — $0.00</span>
        <?php else: ?>
          Monto: <strong>$<?= $precioConv ?></strong>
        <?php endif; ?>
        &nbsp;·&nbsp;Ya puedes continuar con tus documentos.
      </div>

    <?php elseif ($estPago === 'rechazado'): ?>
      <!-- Rechazado -->
      <div class="caja-pago-error mb-3">
        <i class="fa fa-circle-xmark me-2"></i>
        <strong>Comprobante rechazado.</strong>
        <?php if ($obsPago): ?> Motivo: <?= htmlspecialchars($obsPago) ?><?php endif; ?>
      </div>

    <?php else: ?>
      <!-- Pendiente — instrucción -->
      <div class="caja-pago-warn mb-3" style="font-size:12px;">
        <i class="fa fa-circle-info me-2"></i>
        <?php if ((float)$precioConv > 0): ?>
          Realiza el depósito de <strong>$<?= $precioConv ?></strong> a las cuentas del Instituto y adjunta el comprobante aquí.
        <?php endif; ?>
        Si eres exonerado, sube el PDF que lo acredita y Facturación lo marcará como $0.00.
      </div>
    <?php endif; ?>

    <!-- Formulario upload (pendiente o rechazado) -->
    <?php if ($puedeSubirConv): ?>
    <form method="POST" action="convalidacion.php" enctype="multipart/form-data" id="form-comp-conv"
          onsubmit="return validarEnvioConv(this);">
      <input type="hidden" name="accion" value="enviar_comprobante_conv">

      <!-- Zona drag & drop igual a mi_practica -->
      <div class="upload-zone-pago mb-3" id="upzone-conv"
           onclick="document.getElementById('input-comp-conv').click()">
        <input type="file" name="comprobante_pago" id="input-comp-conv"
               accept=".pdf,.jpg,.jpeg,.png"
               onchange="previewConv(this)">
        <div id="ph-conv">
          <i class="fa fa-cloud-arrow-up" style="font-size:28px;color:#94a3b8;margin-bottom:8px;display:block;"></i>
          <div style="font-weight:600;color:#475569;font-size:13px;">Haz clic o arrastra el archivo aquí</div>
          <div style="font-size:11px;color:#94a3b8;margin-top:4px;">PDF, JPG o PNG · Máximo 5 MB</div>
        </div>
        <div id="pv-conv" style="display:none;">
          <i class="fa fa-file-check" style="font-size:26px;color:#059669;margin-bottom:6px;display:block;"></i>
          <div id="fn-conv" style="font-weight:600;color:#065f46;font-size:13px;"></div>
          <div style="font-size:11px;color:#059669;margin-top:2px;">Listo para enviar</div>
        </div>
      </div>

      <div class="d-flex gap-3 flex-wrap align-items-center">
        <button type="submit" class="btn btn-primary px-4" id="btn-env-conv">
          <i class="fa fa-paper-plane me-2"></i>
          <?= $estPago === 'rechazado' ? 'Reenviar Comprobante' : 'Enviar Comprobante' ?>
        </button>
        <span style="font-size:12px;color:var(--text-3);">
          <i class="fa fa-lock me-1"></i>Tu comprobante irá a Facturación para validación
        </span>
      </div>
    </form>
    <?php endif; ?>
  </div><!-- /seccion-pago -->

  <div class="sec-arrow"><i class="fa fa-arrow-down"></i></div>

  <!-- Listado de documentos -->
  <div class="sec-label">
    <i class="fa fa-file-lines"></i>
    Documentos requeridos (<?= $docsTotal ?> en total)
  </div>

  <?php foreach ($DOCS as $cod => $info):
    $doc    = $docsSubidos[$cod] ?? null;
    $estado = $doc['estado'] ?? 'pendiente';

    $barra = match($estado) {
      'aprobado'  => 'var(--emerald)',
      'enviado'   => 'var(--blue)',
      'observado' => 'var(--red)',
      default     => 'var(--border-med)',
    };
    $chipCls = match($estado) { 'aprobado'=>'chip-apr','enviado'=>'chip-env','observado'=>'chip-obs',default=>'chip-pend' };
    $chipLbl = match($estado) { 'aprobado'=>'Aprobado','enviado'=>'En revisión','observado'=>'Con observación',default=>'Pendiente' };
    $chipIco = match($estado) { 'aprobado'=>'fa-check','enviado'=>'fa-clock','observado'=>'fa-triangle-exclamation',default=>'fa-circle-dot' };
    $puedeSubir = ($estado !== 'aprobado') && in_array($estadoSol, ['pendiente','en_revision']);
  ?>
  <div class="doc-card">
    <div style="display:flex;align-items:stretch;">
      <div class="doc-barra" style="background:<?= $barra ?>;"></div>
      <div class="doc-body">
        <div style="display:flex;align-items:center;gap:8px;margin-bottom:6px;">
          <span style="font-family:monospace;font-size:11px;font-weight:700;
                       background:var(--bg-inner);padding:2px 8px;border-radius:6px;
                       color:var(--blue);border:1px solid var(--border);">
            <?= $cod ?>
          </span>
          <span class="chip <?= $chipCls ?>">
            <i class="fa <?= $chipIco ?>"></i> <?= $chipLbl ?>
          </span>
        </div>
        <div style="font-size:13.5px;font-weight:600;color:var(--text-1);">
          <?= htmlspecialchars($info['titulo']) ?>
        </div>
        <div style="font-size:12px;color:var(--text-2);margin-top:5px;line-height:1.5;">
          <?= htmlspecialchars($info['desc']) ?>
        </div>

        <?php if ($doc && $doc['subido_at']): ?>
        <div style="font-size:11px;color:var(--text-3);margin-top:8px;display:flex;gap:12px;flex-wrap:wrap;">
          <span><i class="fa fa-upload me-1"></i>Subido: <?= date('d/m/Y H:i', strtotime($doc['subido_at'])) ?></span>
          <?php if ($estado === 'aprobado' && !empty($doc['aprobado_at'])): ?>
          <span style="color:#047857;"><i class="fa fa-circle-check me-1"></i>Aprobado: <?= date('d/m/Y', strtotime($doc['aprobado_at'])) ?></span>
          <?php endif; ?>
        </div>
        <?php endif; ?>

        <?php if ($estado === 'observado' && $doc['observacion']): ?>
        <div class="obs-box">
          <i class="fa fa-triangle-exclamation me-1"></i>
          <strong>Observación del coordinador:</strong> <?= htmlspecialchars($doc['observacion']) ?>
          <div style="margin-top:5px;font-size:11px;color:var(--text-3);">
            Corrige el documento y vuelve a subirlo.
          </div>
        </div>
        <?php endif; ?>
      </div>
    </div>

    <div class="doc-footer">
      <?php if ($puedeSubir): ?>
      <button type="button" class="btn-ac btn-subir" onclick="toggleUpload('<?= $cod ?>')">
        <i class="fa fa-upload"></i>
        <?= $estado === 'observado' ? 'Corregir y resubir' : 'Subir documento' ?>
      </button>
      <?php endif; ?>

      <?php if ($doc && $doc['ruta_archivo']): ?>
      <a href="<?= BASE_URL ?>/api/ver_doc_convalidacion_est.php?solicitud=<?= $solicitud['id_solicitud'] ?>&doc=<?= urlencode($cod) ?>"
         target="_blank" class="btn-ac btn-ver">
        <i class="fa fa-eye"></i> Ver mi archivo
      </a>
      <?php endif; ?>

      <?php if ($estado === 'aprobado'): ?>
      <span class="btn-ac btn-ok">
        <i class="fa fa-check-double"></i> Aprobado — sin cambios requeridos
      </span>
      <?php endif; ?>

      <!-- Form de subida oculto -->
      <?php if ($puedeSubir): ?>
      <div class="upload-form w-100" id="upload-<?= $cod ?>">
        <form method="POST" enctype="multipart/form-data">
          <input type="hidden" name="accion"     value="subir_doc">
          <input type="hidden" name="codigo_doc" value="<?= $cod ?>">
          <div style="font-size:12px;color:var(--text-3);margin-bottom:8px;">
            <i class="fa fa-file-pdf me-1" style="color:var(--red);"></i>
            Solo PDF · Máximo 5 MB
          </div>
          <input type="file" name="archivo_doc" accept=".pdf" required class="mb-3">
          <div style="display:flex;gap:8px;margin-top:10px;">
            <button type="submit" class="btn-ac btn-subir">
              <i class="fa fa-paper-plane"></i> Enviar documento
            </button>
            <button type="button" class="btn-ac btn-dis" onclick="toggleUpload('<?= $cod ?>')">
              <i class="fa fa-xmark"></i> Cancelar
            </button>
          </div>
        </form>
      </div>
      <?php endif; ?>
    </div>
  </div>
  <?php endforeach; ?>

  <?php endif; // fin else estado no resuelto ?>
  <?php endif; // fin else solicitud existe ?>

</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>
function toggleUpload(cod) {
  const el = document.getElementById('upload-' + cod);
  el.style.display = el.style.display === 'block' ? 'none' : 'block';
  if (el.style.display === 'block') el.querySelector('input[type=file]').focus();
}

/* ── Validar y enviar comprobante convalidación ── */
function validarEnvioConv(form) {
  var input = document.getElementById('input-comp-conv');
  if (!input || !input.files || input.files.length === 0) {
    alert('Debes seleccionar un archivo antes de enviar.');
    return false;
  }
  var btn = document.getElementById('btn-env-conv');
  if (btn) {
    btn.disabled = true;
    btn.innerHTML = '<i class="fa fa-spinner fa-spin me-2"></i>Enviando...';
  }
  return true;
}

/* ── Preview upload comprobante convalidación ── */
function previewConv(input) {
  if (input.files && input.files[0]) {
    document.getElementById('fn-conv').textContent = input.files[0].name;
    document.getElementById('ph-conv').style.display = 'none';
    document.getElementById('pv-conv').style.display = 'block';
    document.getElementById('upzone-conv').classList.add('loaded');
    var btn = document.getElementById('btn-env-conv');
    if (btn) btn.disabled = false;
  }
}

/* ── Drag & drop comprobante convalidación ── */
var zoneConv = document.getElementById('upzone-conv');
if (zoneConv) {
  zoneConv.addEventListener('dragover', function(e) {
    e.preventDefault();
    zoneConv.style.borderColor = '#f97316';
  });
  zoneConv.addEventListener('dragleave', function() {
    zoneConv.style.borderColor = '';
  });
  zoneConv.addEventListener('drop', function(e) {
    e.preventDefault();
    zoneConv.style.borderColor = '';
    var input = document.getElementById('input-comp-conv');
    if (e.dataTransfer.files.length) {
      try {
        var dt = new DataTransfer();
        dt.items.add(e.dataTransfer.files[0]);
        input.files = dt.files;
      } catch(ex) {}
      previewConv(input);
    }
  });
}
</script>
</body>
</html>