<!--Ventana Modal-->
<form method="POST" id="formfisioterapia">

    <input type="checkbox" id="btns-fisioterapia">
    <div class="container-modal">
        <div class="content-modal">
            <h2>FISIOTERAPIA</h2>
            <hr>
            <label for="email"><b>Evaluación Fisioterapéutica</b></label><span class="badge-warning">*</span>
            
            <!-- Contenedor de los textarea -->
            <div class="textarea-container">
                <textarea name="fsentarse_levantarse" id="fsentarse_levantarse" required placeholder="Sentarse y Levantarse"></textarea>
                <textarea name="fflexiones_brazo" id="fflexiones_brazo" required placeholder="Flexiones de Brazo"></textarea>
                <textarea name="fflexion_tronco" id="fflexion_tronco" required placeholder="Flexión de Tronco"></textarea>
                <textarea name="fjuntar_manos_atras" id="fjuntar_manos_atras" required placeholder="Juntar las Manos Atrás"></textarea>
                <textarea name="fromberg" id="fromberg" required placeholder="Test de Romberg"></textarea>
                <textarea name="fipaq" id="fipaq" required placeholder="IPAQ (Cuestionario Internacional de Actividad Física)"></textarea>
                <textarea name="falcance_funcional" id="falcance_funcional" required placeholder="Alcance Funcional"></textarea>
                <textarea name="fbarthel" id="fbarthel" required placeholder="Índice de Barthel"></textarea>
                <textarea name="ffuncionalidad" id="ffuncionalidad" required placeholder="Funcionalidad General"></textarea>
            </div>

            <input type="hidden" id="fsidpa" name="fsidpa" value="<?php echo $d->idpa; ?>">
            <input type="hidden" id="fsnopa" name="fsnopa" value="<?php echo $d->nompa; ?>">
            
            <input type="button" class="registerbtn" name="submit" value="Guardar" onclick="insertarfisioterapia();">
        </div>
        
        <label for="btns-fisioterapia" class="cerrar-modal"></label>
    </div>
</form>
<!--Fin de Ventana Modal-->

<style>
    /* El contenedor general del modal */
    #btns-fisioterapia {
        display: none;
    }
    
    #btns-fisioterapia:checked ~ .container-modal {
        display: flex;
    }
    
    .container-modal {
        width: 100%;
        height: calc(100vh - 60px);
        position: fixed;
        top: 60px;
        left: 0;
        background-color: rgba(53, 9, 73, 0.8);
        display: none;
        justify-content: center;
        align-items: center;
        z-index: 99100;
        overflow-y: auto;
        padding: 20px;
        box-sizing: border-box;
    }

    /* El contenido blanco interno del modal */
    .content-modal {
        background: white;
        padding: 20px;
        border-radius: 10px;
        max-width: 90vw;
        max-height: 90%;
        overflow-y: auto;
        box-sizing: border-box;
    }

    /* Grid con 3 columnas verticales */
    .textarea-container {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 15px;
        padding: 10px 0;
    }

    /* Cada textarea */
    .textarea-container textarea {
        width: 100%;
        min-width: 200px;
        height: 80px;
        resize: vertical;
        padding: 8px;
        font-size: 14px;
        border-radius: 5px;
        border: 1px solid #ccc;
        box-sizing: border-box;
    }

    /* Botón guardar */
    .registerbtn {
        margin-top: 20px;
        padding: 10px 20px;
        font-size: 16px;
        background-color: #4CAF50;
        color: white;
        border: none;
        border-radius: 5px;
        cursor: pointer;
    }

    .registerbtn:hover {
        background-color: #45a049;
    }

    /* Botón para cerrar modal */
    .cerrar-modal {
        position: absolute;
        top: 10px;
        right: 20px;
        font-size: 30px;
        cursor: pointer;
    }
</style>
