<?php
// FORMATO MSP-024: CONSENTIMIENTO INFORMADO
?>
<form name="formulariop" id="formulariop" method="POST">
    <input type="hidden" name="idatencion" id="idatencion" value="<?php echo $_POST['idatencion'] ?? ''; ?>">
    <input type="hidden" name="tipo_formato" value="MSP_024">

    <!-- ENCABEZADO OFICIAL -->
    <div class="msp-024-header" style="background-color: #607D8B; color: white; padding: 10px; font-weight: bold;">
        CONSENTIMIENTO INFORMADO 024
    </div>

    <!-- DATOS DEL PACIENTE -->
    <?php include 'partials/patient_header.php'; ?>

    <div class="msp-container">

        <!-- 1. INFORMACIÓN DEL PROCEDIMIENTO -->
        <div class="msp-section">
            <div class="msp-section-title">1. INFORMACIÓN DEL PROCEDIMIENTO</div>

            <div class="msp-form-group">
                <label class="msp-field-label">Nombre del Procedimiento / Tratamiento</label>
                <input type="text" class="msp-input" name="tipo_procedimiento" required
                    placeholder="Ej: Apendicectomía Laparoscópica">
            </div>

            <div class="msp-form-group msp-mt-10">
                <label class="msp-field-label">Descripción del Procedimiento (¿En qué consiste?)</label>
                <textarea class="msp-textarea" name="descripcion_procedimiento" rows="3" required></textarea>
            </div>

            <div class="msp-row msp-mt-10">
                <div class="msp-col-6">
                    <label class="msp-field-label">Riesgos y Complicaciones Posibles</label>
                    <textarea class="msp-textarea" name="riesgos" rows="4"></textarea>
                </div>
                <div class="msp-col-6">
                    <label class="msp-field-label">Beneficios Esperados</label>
                    <textarea class="msp-textarea" name="beneficios" rows="4"></textarea>
                </div>
            </div>

            <div class="msp-form-group msp-mt-10">
                <label class="msp-field-label">Alternativas de Tratamiento</label>
                <textarea class="msp-textarea" name="alternativas" rows="2"></textarea>
            </div>
        </div>

        <!-- 2. DECLARACIÓN DEL PACIENTE / REPRESENTANTE -->
        <div class="msp-section">
            <div class="msp-section-title">2. DECLARACIÓN DE CONSENTIMIENTO</div>

            <div class="msp-alert msp-alert-info">
                Declaro que he recibido información clara y comprensible sobre el procedimiento, sus riesgos y
                beneficios. He tenido la oportunidad de hacer preguntas y han sido respondidas satisfactoriamente.
            </div>

            <div class="msp-row">
                <div class="msp-col-12" style="text-align: center; margin: 20px 0;">
                    <label class="msp-checkbox-label" style="font-size: 1.2em; font-weight: bold;">
                        <input type="checkbox" name="paciente_acepta" value="1" required>
                        DOY MI CONSENTIMIENTO PARA EL PROCEDIMIENTO
                    </label>
                </div>
            </div>

            <div class="msp-row">
                <div class="msp-col-6">
                    <label class="msp-field-label">Nombre del Representante Legal (Si aplica)</label>
                    <input type="text" class="msp-input" name="representante_legal"
                        placeholder="Solo si el paciente no puede firmar">
                </div>
                <div class="msp-col-3">
                    <label class="msp-field-label">Parentesco</label>
                    <input type="text" class="msp-input" name="parentesco_representante">
                </div>
                <div class="msp-col-3">
                    <label class="msp-field-label">Cédula Representante</label>
                    <input type="text" class="msp-input" name="documento_representante">
                </div>
            </div>
        </div>

        <!-- 3. FIRMAS (Registro de Nombres por ahora) -->
        <div class="msp-section">
            <div class="msp-section-title">3. SUSCRIPCIÓN DEL DOCUMENTO</div>

            <div class="msp-row">
                <div class="msp-col-6">
                    <label class="msp-field-label">Lugar y Fecha</label>
                    <div class="msp-row">
                        <div class="msp-col-8">
                            <input type="date" class="msp-input" name="fecha_consentimiento"
                                value="<?php echo date('Y-m-d'); ?>">
                        </div>
                        <div class="msp-col-4">
                            <input type="time" class="msp-input" name="hora_consentimiento"
                                value="<?php echo date('H:i'); ?>">
                        </div>
                    </div>
                </div>
            </div>

            <div class="msp-row msp-mt-10">
                <div class="msp-col-6">
                    <label class="msp-field-label">Nombre del Paciente / Representante</label>
                    <div class="input-group">
                        <div class="input-group-btn">
                            <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"
                                aria-haspopup="true" aria-expanded="false">
                                Firmante <span class="caret"></span>
                            </button>
                            <ul class="dropdown-menu">
                                <li><a href="#" onclick="setFirmante('PACIENTE'); return false;">Paciente</a></li>
                                <li><a href="#" onclick="setFirmante('REPRESENTANTE'); return false;">Representante</a>
                                </li>
                            </ul>
                        </div>
                        <input type="text" class="msp-input" id="nombre_firmante" name="nombre_firmante" readonly>
                    </div>
                </div>
                <div class="msp-col-6">
                    <label class="msp-field-label">Nombre del Profesional de Salud</label>
                    <input type="text" class="msp-input" id="nombre_profesional" name="nombre_profesional">
                </div>
            </div>

            <script>
                function setFirmante(tipo) {
                    if (typeof currentPatientData !== 'undefined') {
                        if (tipo === 'PACIENTE') {
                            $("#nombre_firmante").val(currentPatientData.paciente);
                        } else {
                            $("#nombre_firmante").val(currentPatientData.responsable || 'No registrado');
                        }
                    }
                }

                // Autopoblar profesional al cargar
                $(document).ready(function() {
                    if (typeof currentPatientData !== 'undefined' && currentPatientData.especialista) {
                        $("#nombre_profesional").val(currentPatientData.especialista);
                    }
                });

                // También escuchar el evento personalizado por si acaso
                $(document).on('patientDataLoaded', function(e, data) {
                    if (data && data.especialista) {
                        $("#nombre_profesional").val(data.especialista);
                    }
                });
            </script>

            <div class="msp-row msp-mt-10">
                <div class="msp-col-6">
                    <label class="msp-field-label">Testigo 1 (Nombre y Cédula)</label>
                    <input type="text" class="msp-input" name="firma_testigo1">
                </div>
                <div class="msp-col-6">
                    <label class="msp-field-label">Testigo 2 (Nombre y Cédula)</label>
                    <input type="text" class="msp-input" name="firma_testigo2">
                </div>
            </div>
        </div>

        <!-- BOTONES -->
        <!-- BOTONES OCULTOS -->
        <div class="form-group col-lg-12 col-md-12 col-sm-12 col-xs-12" id="guardar" style="display: none;">
            <button class="btn btn-primary btn-lg msp-btn-primary" type="submit" id="btnGuardarP">
                <i class="fa fa-save"></i> GUARDAR CONSENTIMIENTO INFORMADO 024
            </button>
            <button class="btn btn-danger btn-lg msp-btn-danger" onclick="cancelarform()" type="button">
                <i class="fa fa-arrow-circle-left"></i> Cancelar
            </button>
        </div>

    </div>
</form>