@extends('layouts.master')

@section('title')
    Alumno {{ $alumno->matricula }}
@endsection

@section('content')
    <div class="row">
        <!-- Columna izquierda: resumen y menú -->
        <div class="col-lg-4 col-xl-3">
            <div class="card bg-primary text-white mb-3">
                <div class="card-body text-center">
                    <a href="{{ url('alumnos') }}" class="btn btn-sm btn-light position-absolute top-0 end-0 m-2" title="Volver">
                        <i class="ri-arrow-left-line"></i>
                    </a>
                    <div class="avatar-lg mx-auto mb-2">
                        <div class="avatar-title bg-light text-primary rounded-circle">
                            <i class="ri-user-line fs-1"></i>
                        </div>
                    </div>
                    <h5 class="text-white mb-1">{{ strtoupper($alumno->nombre . ' ' . $alumno->apellido_paterno . ' ' . ($alumno->apellido_materno ?? '')) }}</h5>
                    <p class="mb-0 small">{{ $alumno->matricula }}</p>
                    <p class="mb-0 small">{{ $alumno->inscripcionActual()?->plantel ?? 'UNII AGS' }}</p>
                    @if($insc = $alumno->inscripcionActual())
                        <p class="mb-0 small">{{ $insc->oferta_educativa }} {{ $insc->grado ?? '' }} | {{ $insc->periodo_nombre ?? '' }}</p>
                    @endif
                    <p class="mb-2 small">Estatus actual: {{ $alumno->inscripcionActual()?->estatus ?? 'Nuevo Ingreso' }}</p>
                    <button type="button" class="btn btn-sm btn-light"><i class="ri-settings-3-line me-1"></i> Opciones</button>
                </div>
            </div>
            <ul class="nav nav-pills flex-column gap-1" id="menuAlumno" role="tablist">
                <li class="nav-item">
                    <a class="nav-link active" href="#" data-seccion="informacion-personal"><i class="ri-user-line me-2"></i>Información Personal</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="#" data-seccion="informacion-adicional"><i class="ri-file-list-line me-2"></i>Información Adicional</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="#" data-seccion="documentacion"><i class="ri-folder-line me-2"></i>Documentación</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="#" data-seccion="horarios"><i class="ri-calendar-line me-2"></i>Horarios</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="#" data-seccion="boleta"><i class="ri-file-text-line me-2"></i>Boleta de calificaciones</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="#" data-seccion="seguimiento-medico"><i class="ri-heart-pulse-line me-2"></i>Seguimiento médico</a>
                </li>
            </ul>
        </div>
        <!-- Columna derecha: contenido -->
        <div class="col-lg-8 col-xl-9">
            <div id="contenidoInformacionPersonal" class="seccion-contenido">
                <h5 class="mb-3">Información Personal</h5>
                <p class="text-muted">Usa el siguiente formulario para <strong>MODIFICAR</strong> la información personal del alumno.</p>
                @include('alumnos.partials.informacion-personal', ['alumno' => $alumno])
            </div>
            <div id="contenidoInformacionAdicional" class="seccion-contenido d-none">
                <h5 class="mb-3">Información Adicional</h5>
                <p class="text-muted">Información adicional del alumno.</p>
                @include('alumnos.partials.informacion-adicional', ['alumno' => $alumno])
            </div>
            <div id="contenidoDocumentacion" class="seccion-contenido d-none">
                <div class="d-flex justify-content-between align-items-center flex-wrap gap-2 mb-3">
                    <div>
                        <h5 class="mb-1">Documentación</h5>
                        <p class="text-muted mb-0 small">Usa el siguiente formulario para marcar la documentación entregada por el alumno.</p>
                    </div>
                    <a href="{{ url('alumnos/' . $alumno->id . '/expediente/pdf') }}" target="_blank" rel="noopener" class="btn btn-outline-primary btn-sm">
                        <i class="ri-file-pdf-line me-1"></i>Expediente en PDF
                    </a>
                </div>
                @include('alumnos.partials.documentacion', ['alumno' => $alumno])
            </div>
            <div id="contenidoHorarios" class="seccion-contenido d-none">
                <h5 class="mb-3">Horarios</h5>
                <p class="text-muted mb-3">Horario del alumno según su inscripción actual (periodo, plan, grado y grupo).</p>
                <div id="horariosAlumnoCarga" class="text-center py-4 text-muted small">
                    <span class="spinner-border spinner-border-sm me-2" role="status"></span>Cargando horarios…
                </div>
                <div id="horariosAlumnoContenido" class="d-none"></div>
                <div id="horariosAlumnoVacio" class="card border-0 shadow-sm d-none"><div class="card-body text-center py-4 text-muted">El alumno no tiene inscripción con grupo asignado o no hay horarios configurados para su grupo.</div></div>
            </div>
            <div id="contenidoBoleta" class="seccion-contenido d-none">
                <div class="d-flex justify-content-between align-items-center flex-wrap gap-2 mb-3">
                    <div>
                        <h5 class="mb-1">Boleta de calificaciones</h5>
                        <p class="text-muted mb-0 small">Calificaciones del alumno según su inscripción actual (periodo, plan, grado y grupo).</p>
                    </div>
                    <a href="{{ url('alumnos/' . $alumno->id . '/boleta/pdf') }}" target="_blank" rel="noopener" class="btn btn-outline-primary btn-sm">
                        <i class="ri-file-pdf-line me-1"></i>Descargar PDF / Imprimir
                    </a>
                </div>
                <div id="boletaAlumnoCarga" class="text-center py-4 text-muted small">
                    <span class="spinner-border spinner-border-sm me-2" role="status"></span>Cargando boleta…
                </div>
                <div id="boletaAlumnoContenido" class="d-none"></div>
                <div id="boletaAlumnoVacio" class="card border-0 shadow-sm d-none"><div class="card-body text-center py-4 text-muted">El alumno no tiene inscripción con grupo asignado o no hay calificaciones capturadas.</div></div>
            </div>
            <div id="contenidoSeguimientoMedico" class="seccion-contenido d-none">
                <h5 class="mb-3">Seguimiento médico</h5>
                @include('alumnos.partials.seguimiento-medico', ['alumno' => $alumno])
            </div>
        </div>
    </div>
    @include('alumnos.modals.carga-multiple-documentos')
    @include('alumnos.modals.lista-documentos')
    <!-- Modal registro médico (alergia / enfermedad / padecimiento) -->
    <div class="modal fade" id="modalRegistroMedico" tabindex="-1">
        <div class="modal-dialog modal-dialog-centered">
            <div class="modal-content">
                <div class="modal-header bg-primary text-white">
                    <h5 class="modal-title" id="modalRegistroMedicoTitulo">Agregar</h5>
                    <button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal"></button>
                </div>
                <div class="modal-body">
                    <input type="hidden" id="registroMedicoTipo" value="">
                    <label class="form-label">Descripción</label>
                    <textarea id="registroMedicoDescripcion" class="form-control" rows="3" maxlength="500"></textarea>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancelar</button>
                    <button type="button" class="btn btn-primary" id="btnGuardarRegistroMedico">Guardar</button>
                </div>
            </div>
        </div>
    </div>
    <!-- Modal incidencia -->
    <div class="modal fade" id="modalIncidencia" tabindex="-1">
        <div class="modal-dialog modal-dialog-centered">
            <div class="modal-content">
                <div class="modal-header bg-primary text-white">
                    <h5 class="modal-title">Agregar incidencia</h5>
                    <button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal"></button>
                </div>
                <div class="modal-body">
                    <div class="mb-2"><label class="form-label">Tipo</label><select class="form-select" id="incidenciaTipo"><option value="Retardo">Retardo</option><option value="Falta">Falta</option><option value="Disciplinaria">Disciplinaria</option><option value="Otra">Otra</option></select></div>
                    <div class="mb-2"><label class="form-label">Fecha</label><input type="date" class="form-control" id="incidenciaFecha"></div>
                    <div class="mb-2"><label class="form-label">Descripción</label><textarea class="form-control" id="incidenciaDescripcion" rows="3"></textarea></div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancelar</button>
                    <button type="button" class="btn btn-primary" id="btnGuardarIncidencia">Guardar</button>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('script')
<script>
var alumnoId = {{ $alumno->id }};
document.querySelectorAll('#menuAlumno a[data-seccion]').forEach(function(link) {
    link.addEventListener('click', function(e) {
        e.preventDefault();
        document.querySelectorAll('#menuAlumno .nav-link').forEach(function(l) { l.classList.remove('active'); });
        this.classList.add('active');
        var seccion = this.getAttribute('data-seccion');
        var idMap = { 'informacion-personal': 'contenidoInformacionPersonal', 'informacion-adicional': 'contenidoInformacionAdicional', 'documentacion': 'contenidoDocumentacion', 'horarios': 'contenidoHorarios', 'boleta': 'contenidoBoleta', 'seguimiento-medico': 'contenidoSeguimientoMedico' };
        var id = idMap[seccion] || ('contenido' + seccion.split('-').map(function(s) { return s.charAt(0).toUpperCase() + s.slice(1); }).join(''));
        document.querySelectorAll('.seccion-contenido').forEach(function(div) { div.classList.add('d-none'); });
        var el = document.getElementById(id);
        if (el) el.classList.remove('d-none');
        if (seccion === 'horarios') cargarHorariosAlumno();
        if (seccion === 'boleta') cargarBoletaAlumno();
    });
});

var horariosAlumnoCargados = false;
var boletaAlumnoCargados = false;
var DIAS_SEMANA = ['Lunes', 'Martes', 'Miércoles', 'Jueves', 'Viernes', 'Sábado'];
var PERIODOS = [
    { num: 1, start: '08:00', end: '08:50' }, { num: 2, start: '09:00', end: '09:50' }, { num: 3, start: '10:00', end: '10:50' },
    { num: 4, start: '11:00', end: '11:50' }, { num: 5, start: '12:00', end: '12:50' }, { num: 6, start: '13:00', end: '13:50' },
    { num: 7, start: '14:00', end: '14:50' }, { num: 8, start: '15:00', end: '15:50' }, { num: 9, start: '16:00', end: '16:45' }
];
function fmtHora(h) { if (!h) return '—'; var s = String(h); return s.length >= 5 ? s.substr(0, 5) : s; }
function horaToMin(str) { if (!str || str.length < 5) return 0; var p = String(str).substr(0, 5).split(':'); return parseInt(p[0], 10) * 60 + parseInt(p[1], 10); }
function horarioAPeriodoYSpan(hi, hf) {
    var minIni = horaToMin(hi), minFin = horaToMin(hf), periodIndex = -1, span = 0;
    for (var i = 0; i < PERIODOS.length; i++) {
        var pStart = horaToMin(PERIODOS[i].start), pEnd = horaToMin(PERIODOS[i].end);
        if (minIni < pEnd && minFin > pStart) { if (periodIndex === -1) periodIndex = i; span++; }
    }
    return { periodIndex: periodIndex, span: span || 1 };
}
function construirGrillaHorarios(horarios, docenteNombre) {
    var grid = [], covered = [];
    for (var d = 0; d < 6; d++) { grid[d] = []; covered[d] = []; for (var p = 0; p < PERIODOS.length; p++) { grid[d][p] = null; covered[d][p] = false; } }
    (horarios || []).forEach(function(h) {
        var hi = fmtHora(h.hora_inicio), hf = fmtHora(h.hora_fin);
        var r = horarioAPeriodoYSpan(hi, hf);
        if (r.periodIndex < 0) return;
        var diaIdx = DIAS_SEMANA.indexOf(h.dia_semana);
        if (diaIdx < 0) return;
        if (grid[diaIdx][r.periodIndex] === null) {
            grid[diaIdx][r.periodIndex] = { horario: h, span: Math.min(r.span, 9 - r.periodIndex) };
            for (var s = 1; s < grid[diaIdx][r.periodIndex].span; s++) covered[diaIdx][r.periodIndex + s] = true;
        }
    });
    return { grid: grid, covered: covered, docenteNombre: docenteNombre || '—' };
}
function cargarHorariosAlumno() {
    if (horariosAlumnoCargados) return;
    var cont = document.getElementById('horariosAlumnoContenido');
    var carga = document.getElementById('horariosAlumnoCarga');
    var vacio = document.getElementById('horariosAlumnoVacio');
    if (!cont || !carga) return;
    horariosAlumnoCargados = true;
    carga.classList.remove('d-none');
    cont.classList.add('d-none');
    vacio.classList.add('d-none');
    fetch('{{ url("api/alumnos/{$alumno->id}/horarios") }}', { headers: { 'Accept': 'application/json' } })
        .then(function(r) { return r.json(); })
        .then(function(data) {
            carga.classList.add('d-none');
            var horarios = data.horarios || [];
            var grupo = data.grupo;
            if (!grupo || !horarios.length) {
                vacio.classList.remove('d-none');
                if (data.mensaje) vacio.querySelector('.card-body').textContent = data.mensaje;
                return;
            }
            var res = construirGrillaHorarios(horarios, data.docente_nombre);
            var grid = res.grid, covered = res.covered, docNom = res.docenteNombre;
            var html = '<div class="card border-0 shadow-sm"><div class="card-header bg-light py-2"><h6 class="mb-0 text-primary">' + (grupo.plan_nombre || '') + ' — ' + (grupo.ciclo_nombre || '') + ' | ' + (grupo.grado ? grupo.grado + '°' : '') + ' ' + (grupo.clave || '') + '</h6><p class="mb-0 small text-muted">' + (grupo.plantel_nombre || '') + '</p></div><div class="card-body p-0"><div class="table-responsive"><table class="table table-bordered align-middle mb-0" style="min-width: 720px;"><thead class="table-light"><tr><th class="text-center" style="width: 80px;">Hora</th><th class="text-center">Lunes</th><th class="text-center">Martes</th><th class="text-center">Miércoles</th><th class="text-center">Jueves</th><th class="text-center">Viernes</th><th class="text-center">Sábado</th></tr></thead><tbody>';
            for (var p = 0; p < PERIODOS.length; p++) {
                var horaTexto = PERIODOS[p].num + ' ' + PERIODOS[p].start + ' - ' + PERIODOS[p].end;
                html += '<tr><td class="text-center text-muted small">' + horaTexto + '</td>';
                for (var d = 0; d < 6; d++) {
                    if (covered[d] && covered[d][p]) continue;
                    var cell = grid[d][p];
                    if (cell && cell.horario) {
                        var h = cell.horario;
                        var matNombre = (h.materia && (h.materia.nombre || h.materia.clave)) || '—';
                        var rowspan = cell.span > 1 ? ' rowspan="' + cell.span + '"' : '';
                        html += '<td class="p-2"' + rowspan + '><div class="fw-semibold small">' + (matNombre || '').replace(/</g, '&lt;') + '</div><div class="text-muted" style="font-size: 0.75rem;">' + (docNom || '—').replace(/</g, '&lt;') + '</div>' + (h.aula ? '<div class="text-muted" style="font-size: 0.7rem;">Aula ' + String(h.aula).replace(/</g, '&lt;') + '</div>' : '') + '</td>';
                    } else {
                        html += '<td class="p-2 bg-light"></td>';
                    }
                }
                html += '</tr>';
            }
            html += '</tbody></table></div></div></div>';
            cont.innerHTML = html;
            cont.classList.remove('d-none');
        })
        .catch(function() {
            carga.classList.add('d-none');
            vacio.classList.remove('d-none');
            vacio.querySelector('.card-body').textContent = 'Error al cargar los horarios. Intente de nuevo.';
        });
}
function cargarBoletaAlumno() {
    if (boletaAlumnoCargados) return;
    var cont = document.getElementById('boletaAlumnoContenido');
    var carga = document.getElementById('boletaAlumnoCarga');
    var vacio = document.getElementById('boletaAlumnoVacio');
    if (!cont || !carga) return;
    boletaAlumnoCargados = true;
    carga.classList.remove('d-none');
    cont.classList.add('d-none');
    vacio.classList.add('d-none');
    fetch('{{ url("api/alumnos/{$alumno->id}/boleta") }}', { headers: { 'Accept': 'application/json' } })
        .then(function(r) { return r.json(); })
        .then(function(data) {
            carga.classList.add('d-none');
            var alumno = data.alumno;
            var grupo = data.grupo;
            var evaluaciones = data.evaluaciones || [];
            var materias = data.materias || [];
            if (!alumno || !grupo) {
                vacio.classList.remove('d-none');
                if (data.mensaje) vacio.querySelector('.card-body').textContent = data.mensaje;
                return;
            }
            var html = '<div class="card border-0 shadow-sm mb-3"><div class="card-body"><div class="row"><div class="col-md-6"><p class="mb-1"><strong>Alumno:</strong> ' + (alumno.nombre_completo || '').replace(/</g, '&lt;') + '</p><p class="mb-1 text-muted small">Matrícula: ' + (alumno.matricula || '—') + '</p></div><div class="col-md-6"><p class="mb-1"><strong>Plan:</strong> ' + (grupo.plan_nombre || '—').replace(/</g, '&lt;') + '</p><p class="mb-1"><strong>Periodo:</strong> ' + (grupo.ciclo_nombre || '—').replace(/</g, '&lt;') + '</p><p class="mb-1"><strong>Grupo:</strong> ' + (grupo.grado ? grupo.grado + '° ' : '') + (grupo.clave || '') + ' &nbsp;|&nbsp; <strong>Plantel:</strong> ' + (grupo.plantel_nombre || '—').replace(/</g, '&lt;') + '</p></div></div></div></div>';
            html += '<div class="card border-0 shadow-sm"><div class="card-body p-0"><div class="table-responsive"><table class="table table-bordered align-middle mb-0"><thead class="table-light"><tr><th class="text-nowrap">Clave</th><th class="text-nowrap">Asignatura</th>';
            evaluaciones.forEach(function(ev) { html += '<th class="text-center">' + (ev.abreviatura || ev.nombre || 'P' + ev.orden).replace(/</g, '&lt;') + '</th>'; });
            html += '<th class="text-center fw-semibold">Promedio</th></tr></thead><tbody>';
            var promedioGeneralSum = 0, promedioGeneralCount = 0;
            materias.forEach(function(m) {
                html += '<tr><td class="text-nowrap">' + (m.clave || '—').replace(/</g, '&lt;') + '</td><td>' + (m.nombre || '—').replace(/</g, '&lt;') + '</td>';
                m.calificaciones.forEach(function(c) {
                    var val = c.calificacion;
                    var txt = val !== null && val !== undefined ? Number(val) : '—';
                    html += '<td class="text-center">' + txt + '</td>';
                });
                var prom = m.promedio;
                html += '<td class="text-center fw-semibold">' + (prom !== null && prom !== undefined ? Number(prom) : '—') + '</td></tr>';
                if (prom !== null && prom !== undefined) { promedioGeneralSum += prom; promedioGeneralCount++; }
            });
            if (materias.length === 0) html += '<tr><td colspan="' + (3 + evaluaciones.length) + '" class="text-center text-muted py-4">No hay materias o calificaciones registradas.</td></tr>';
            html += '</tbody></table></div>';
            if (promedioGeneralCount > 0) {
                var promGen = (promedioGeneralSum / promedioGeneralCount).toFixed(2);
                html += '<div class="p-3 border-top bg-light"><p class="mb-0 fw-semibold text-primary">Promedio general: ' + promGen + '</p></div>';
            }
            html += '</div></div>';
            cont.innerHTML = html;
            cont.classList.remove('d-none');
        })
        .catch(function() {
            carga.classList.add('d-none');
            vacio.classList.remove('d-none');
            vacio.querySelector('.card-body').textContent = 'Error al cargar la boleta. Intente de nuevo.';
        });
}
// Información adicional: guardar
document.getElementById('btnGuardarInformacionAdicional') && document.getElementById('btnGuardarInformacionAdicional').addEventListener('click', function() {
    var btn = this;
    var texto = document.getElementById('informacionAdicionalTexto').value;
    btn.disabled = true;
    fetch('{{ url("alumnos/{$alumno->id}/informacion-adicional") }}', {
        method: 'PUT',
        headers: { 'Content-Type': 'application/json', 'X-CSRF-TOKEN': '{{ csrf_token() }}', 'Accept': 'application/json' },
        body: JSON.stringify({ informacion_adicional: texto })
    }).then(function(r) { return r.json(); }).then(function() { btn.disabled = false; Swal.fire({ icon: 'success', title: 'Éxito', text: 'Guardado correctamente.' }); }).catch(function() { btn.disabled = false; Swal.fire({ icon: 'error', title: 'Error', text: 'Error al guardar.' }); });
});
// Documentación: tipos y listados
var tiposDocumento = [];
function cargarTiposDocumentos() {
    fetch('{{ url("api/lista-tipos-documentos") }}').then(function(r) { return r.json(); }).then(function(data) {
        tiposDocumento = data;
        var opts = data.map(function(t) { return '<option value="' + t.id + '">' + t.nombre + '</option>'; }).join('');
        var sel = document.getElementById('documentacionTipoDocumento');
        var sel2 = document.getElementById('cargaMultipleTipoDocumento');
        if (sel) { sel.innerHTML = '<option value="">-- Tipo --</option>' + opts; }
        if (sel2) { sel2.innerHTML = '<option value="">-- Seleccione --</option>' + opts; }
        var tbody = document.getElementById('listaDocumentosTiposBody');
        if (tbody) tbody.innerHTML = data.map(function(t) { return '<tr><td>' + t.id + '</td><td>' + t.nombre + '</td></tr>'; }).join('') || '<tr><td colspan="2" class="text-muted text-center">Sin documentos definidos.</td></tr>';
    });
}
function nombreTipo(id) {
    var t = tiposDocumento.find(function(x) { return x.id == id; });
    return t ? t.nombre : 'Otro';
}
function renderExpediente(documentos) {
    var el = document.getElementById('expedienteDigitalBody');
    if (!el) return;
    if (!documentos || documentos.length === 0) { el.innerHTML = '<p class="text-muted text-center py-4 mb-0">No hay documentos cargados.</p>'; return; }
    var baseUrl = '{{ url("alumnos/{$alumno->id}/documentos") }}';
    el.innerHTML = '<ul class="list-group list-group-flush">' + documentos.map(function(d) {
        var nombre = (d.nombre_original || d.ruta || '').replace(/</g, '&lt;').replace(/"/g, '&quot;');
        var originalCopia = (d.es_original === false || d.es_original === 0) ? '<span class="badge bg-light text-dark ms-1">Copia</span>' : '<span class="badge bg-light text-dark ms-1">Original</span>';
        var tipoNombre = nombreTipo(d.tipo_documento).replace(/</g, '&lt;');
        var urlVer = baseUrl + '/' + d.id + '/ver';
        return '<li class="list-group-item d-flex justify-content-between align-items-center flex-wrap gap-2">' +
            '<div class="d-flex align-items-center gap-2 flex-grow-1 min-width-0">' +
            '<a href="' + urlVer + '" target="_blank" rel="noopener" class="text-primary text-truncate" title="Ver documento">' + nombre + '</a>' +
            originalCopia + '<span class="badge bg-secondary">' + tipoNombre + '</span>' +
            '</div>' +
            '<div class="d-flex gap-1 flex-shrink-0">' +
            '<a href="' + urlVer + '" target="_blank" rel="noopener" class="btn btn-sm btn-soft-primary" title="Ver"><i class="ri-eye-line"></i></a>' +
            '<button type="button" class="btn btn-sm btn-soft-danger btnEliminarDocumento" data-id="' + d.id + '" data-nombre="' + nombre + '" title="Eliminar"><i class="ri-delete-bin-line"></i></button>' +
            '</div></li>';
    }).join('') + '</ul>';
    el.querySelectorAll('.btnEliminarDocumento').forEach(function(btn) {
        btn.addEventListener('click', function() {
            var id = this.getAttribute('data-id');
            var nombre = this.getAttribute('data-nombre');
            if (typeof Swal === 'undefined') {
                if (confirm('¿Eliminar el documento "' + nombre + '"?')) eliminarDocumento(id);
                return;
            }
            Swal.fire({
                title: '¿Eliminar documento?',
                text: 'Se eliminará "' + nombre + '". Esta acción no se puede deshacer.',
                icon: 'warning',
                showCancelButton: true,
                confirmButtonColor: '#d33',
                cancelButtonColor: '#3085d6',
                confirmButtonText: 'Sí, eliminar'
            }).then(function(r) {
                if (r.isConfirmed) eliminarDocumento(id);
            });
        });
    });
}
function eliminarDocumento(documentoId) {
    var url = '{{ url("alumnos/{$alumno->id}/documentos") }}/' + documentoId;
    fetch(url, {
        method: 'DELETE',
        headers: { 'X-CSRF-TOKEN': '{{ csrf_token() }}', 'Accept': 'application/json' }
    }).then(function(r) { return r.json(); }).then(function(data) {
        if (data.success) {
            if (typeof Swal !== 'undefined') Swal.fire({ icon: 'success', title: 'Eliminado', text: 'Documento eliminado correctamente.' });
            cargarDocumentosAlumno();
            cargarListaDocumentosAlumnoEnModal();
        }
    }).catch(function() {
        if (typeof Swal !== 'undefined') Swal.fire({ icon: 'error', title: 'Error', text: 'No se pudo eliminar el documento.' });
    });
}
function cargarDocumentosAlumno() {
    fetch('{{ url("alumnos/{$alumno->id}/documentos") }}').then(function(r) { return r.json(); }).then(renderExpediente);
}
function cargarListaDocumentosAlumnoEnModal() {
    var tbody = document.getElementById('listaDocumentosAlumnoBody');
    if (!tbody) return;
    fetch('{{ url("alumnos/{$alumno->id}/documentos") }}').then(function(r) { return r.json(); }).then(function(documentos) {
        if (!documentos || documentos.length === 0) { tbody.innerHTML = '<tr><td colspan="2" class="text-muted text-center">Sin documentos cargados.</td></tr>'; return; }
        tbody.innerHTML = documentos.map(function(d) { return '<tr><td>' + (d.nombre_original || '') + '</td><td>' + nombreTipo(d.tipo_documento) + '</td></tr>'; }).join('');
    });
}
function subirArchivos(files, tipoDocumentoId, reemplazar) {
    if (!files || files.length === 0) return Promise.resolve();
    var fd = new FormData();
    for (var i = 0; i < files.length; i++) fd.append('archivos[]', files[i]);
    fd.append('tipo_documento', tipoDocumentoId || '');
    fd.append('reemplazar', reemplazar ? '1' : '0');
    fd.append('_token', '{{ csrf_token() }}');
    return fetch('{{ url("alumnos/{$alumno->id}/documentos") }}', { method: 'POST', body: fd }).then(function(r) { return r.json(); });
}
document.getElementById('btnModalCargaMultipleAgregar') && document.getElementById('btnModalCargaMultipleAgregar').addEventListener('click', function() {
    document.getElementById('inputCargaMultipleArchivos').click();
});
document.getElementById('inputCargaMultipleArchivos') && document.getElementById('inputCargaMultipleArchivos').addEventListener('change', function() {
    var input = this;
    var files = input.files;
    if (!files || files.length === 0) return;
    var tipo = document.getElementById('cargaMultipleTipoDocumento').value;
    var reemplazar = document.getElementById('reemplazarDocumentos').checked;
    subirArchivos(files, tipo, reemplazar).then(function() {
        input.value = '';
        cargarDocumentosAlumno();
        cargarListaDocumentosAlumnoEnModal();
        var modal = bootstrap.Modal.getInstance(document.getElementById('modalCargaMultipleDocumentos'));
        if (modal) modal.hide();
    }).catch(function() { Swal.fire({ icon: 'error', title: 'Error', text: 'Error al subir archivos.' }); });
});
document.getElementById('btnAgregarDocumentos') && document.getElementById('btnAgregarDocumentos').addEventListener('click', function() {
    document.getElementById('inputAgregarDocumentos').click();
});
document.getElementById('inputAgregarDocumentos') && document.getElementById('inputAgregarDocumentos').addEventListener('change', function() {
    var input = this;
    var files = input.files;
    if (!files || files.length === 0) return;
    var tipo = document.getElementById('documentacionTipoDocumento').value;
    subirArchivos(files, tipo, false).then(function() {
        input.value = '';
        cargarDocumentosAlumno();
        cargarListaDocumentosAlumnoEnModal();
    }).catch(function() { Swal.fire({ icon: 'error', title: 'Error', text: 'Error al subir archivos.' }); });
});
document.getElementById('modalListaDocumentos') && document.getElementById('modalListaDocumentos').addEventListener('show.bs.modal', cargarListaDocumentosAlumnoEnModal);
cargarTiposDocumentos();
cargarDocumentosAlumno();

// Seguimiento médico: guardar datos médicos
document.getElementById('btnGuardarDatosMedicos') && document.getElementById('btnGuardarDatosMedicos').addEventListener('click', function() {
    var payload = {
        peso: document.getElementById('medicoPeso').value,
        estatura: document.getElementById('medicoEstatura').value,
        tipo_sangre: document.getElementById('medicoTipoSangre').value,
        observaciones_generales: document.getElementById('medicoObservaciones').value
    };
    fetch('{{ url("alumnos/{$alumno->id}/datos-medicos") }}', {
        method: 'POST',
        headers: { 'Content-Type': 'application/json', 'X-CSRF-TOKEN': '{{ csrf_token() }}', 'Accept': 'application/json' },
        body: JSON.stringify(payload)
    }).then(function(r) { return r.json(); }).then(function() { Swal.fire({ icon: 'success', title: 'Éxito', text: 'Guardado correctamente.' }); }).catch(function() { Swal.fire({ icon: 'error', title: 'Error', text: 'Error al guardar.' }); });
});
// Botones + Alergias / Enfermedades / Padecimientos
var modalRegistroMedicoEl = document.getElementById('modalRegistroMedico');
var titulosRegistro = { alergia: 'Agregar alergia', enfermedad: 'Agregar enfermedad', padecimiento: 'Agregar padecimiento' };
document.querySelectorAll('.btnAgregarRegistroMedico').forEach(function(btn) {
    btn.addEventListener('click', function() {
        var tipo = this.getAttribute('data-tipo');
        document.getElementById('registroMedicoTipo').value = tipo;
        document.getElementById('modalRegistroMedicoTitulo').textContent = titulosRegistro[tipo] || 'Agregar';
        document.getElementById('registroMedicoDescripcion').value = '';
        var modal = new bootstrap.Modal(modalRegistroMedicoEl);
        modal.show();
    });
});
document.getElementById('btnGuardarRegistroMedico') && document.getElementById('btnGuardarRegistroMedico').addEventListener('click', function() {
    var tipo = document.getElementById('registroMedicoTipo').value;
    var descripcion = document.getElementById('registroMedicoDescripcion').value.trim();
    if (!descripcion) { Swal.fire({ icon: 'warning', title: 'Aviso', text: 'Escribe una descripción.' }); return; }
    fetch('{{ url("alumnos/{$alumno->id}/registros-medicos") }}', {
        method: 'POST',
        headers: { 'Content-Type': 'application/json', 'X-CSRF-TOKEN': '{{ csrf_token() }}', 'Accept': 'application/json' },
        body: JSON.stringify({ tipo: tipo, descripcion: descripcion })
    }).then(function(r) { return r.json(); }).then(function() {
        bootstrap.Modal.getInstance(modalRegistroMedicoEl).hide();
        var listId = { alergia: 'listaAlergias', enfermedad: 'listaEnfermedades', padecimiento: 'listaPadecimientos' }[tipo];
        var list = document.getElementById(listId);
        if (list) {
            var first = list.querySelector('li.text-muted');
            if (first) first.remove();
            var li = document.createElement('li');
            li.textContent = descripcion;
            list.appendChild(li);
        }
    }).catch(function() { Swal.fire({ icon: 'error', title: 'Error', text: 'Error al guardar.' }); });
});
// Incidencia: abrir modal y guardar
document.getElementById('btnAgregarIncidencia') && document.getElementById('btnAgregarIncidencia').addEventListener('click', function() {
    var d = new Date();
    document.getElementById('incidenciaFecha').value = d.getFullYear() + '-' + String(d.getMonth() + 1).padStart(2, '0') + '-' + String(d.getDate()).padStart(2, '0');
    document.getElementById('incidenciaDescripcion').value = '';
    new bootstrap.Modal(document.getElementById('modalIncidencia')).show();
});
document.getElementById('btnGuardarIncidencia') && document.getElementById('btnGuardarIncidencia').addEventListener('click', function() {
    var tipo = document.getElementById('incidenciaTipo').value;
    var fecha = document.getElementById('incidenciaFecha').value;
    var descripcion = document.getElementById('incidenciaDescripcion').value.trim();
    if (!descripcion) { Swal.fire({ icon: 'warning', title: 'Aviso', text: 'Escribe la descripción.' }); return; }
    fetch('{{ url("alumnos/{$alumno->id}/incidencias") }}', {
        method: 'POST',
        headers: { 'Content-Type': 'application/json', 'X-CSRF-TOKEN': '{{ csrf_token() }}', 'Accept': 'application/json' },
        body: JSON.stringify({ tipo: tipo, fecha: fecha, descripcion: descripcion })
    }).then(function(r) { return r.json(); }).then(function() {
        bootstrap.Modal.getInstance(document.getElementById('modalIncidencia')).hide();
        var cont = document.getElementById('listaIncidenciasContainer');
        if (cont) {
            var p = cont.querySelector('p.text-muted');
            if (p) p.remove();
            var card = document.createElement('div');
            card.className = 'card mb-2';
            var fechaStr = fecha.split('-');
            card.innerHTML = '<div class="card-body py-2"><strong>' + tipo + '</strong> – ' + (fechaStr[2] || '') + '/' + (fechaStr[1] || '') + '/' + (fechaStr[0] || '') + '<br><span class="small text-muted">' + descripcion.replace(/</g, '&lt;') + '</span></div>';
            cont.insertBefore(card, document.getElementById('btnAgregarIncidencia'));
        }
    }).catch(function() { Swal.fire({ icon: 'error', title: 'Error', text: 'Error al guardar.' }); });
});
</script>
@endsection