<?php
// $periodo_index, $periodo, $recaudo, $tipo_codigo_fk, $renovar, $form
?>

<div class="row justify-content-center" id="recibe-masivo-<?php echo $periodo_index?>">
    
    <!-- Campos ocultos necesarios para la subida -->
    <input type="hidden" id="periodo-<?php echo $periodo_index; ?>" name="periodo" value="<?php echo $periodo; ?>">
    <input type="hidden" id="tipo-<?php echo $periodo_index; ?>" name="tipo" value="<?php echo $tipo_codigo_fk; ?>">
    <input type="hidden" id="renovar-<?php echo $periodo_index; ?>" name="renovar" value="<?php echo $renovar; ?>">
    
    <div class="col-md-8 offset-md-2">
        <div class='form-group file-input text-left m-md-3' data-max-text="30">
            <?php echo $form->fileField($model, $recaudo.'_'.$periodo_index, [
                'class'=>'file-masivo',
                'id' => 'SidcaiRecaudo_' . $recaudo . '_' . $periodo_index,
                'accept' => '.pdf,.PDF', // Aceptar solo PDFs
                'required' => true
            ]); ?>
            <span class="button" style="font-size: 16px">Cargar</span>
            <?php echo $form->labelEx($model, $recaudo, ['class' => 'labelRecaudo']); ?>
            <label class="label" data-js-label>Seleccionar archivo PDF (máx. 8MB)</label>
            <span class="input-file-line"></span>
            <span id="error-masivo-<?php echo $periodo_index?>" style="color:#a94442" class="text-danger small"></span>
            
            <!-- Mostrar información del período para depuración (opcional) -->
            <small class="text-muted d-block mt-1">
                <i class="material-icons" style="font-size: 14px;">info</i> 
                Período: <?php echo date('d/m/Y', strtotime($periodo)); ?>
            </small>
        </div>
    </div>

    <div class="col-md-2">
        <button type="button" 
                id="enviar-masivo-<?php echo $periodo_index?>" 
                title="Subir archivo ISLR" 
                class="btn btn-success btn-sm d-flex align-items-center gap-2 animate-hover btn-subir-masivo" 
                data-periodo-index="<?php echo $periodo_index ?>"
                data-recaudo="<?php echo $recaudo ?>">
            <span class="material-icons icon-upload">cloud_upload</span>
            <span class="d-none d-md-inline">Subir</span>
        </button>
    </div>
</div>

<script>
// Inicializar el input file personalizado si existe la función
document.addEventListener('DOMContentLoaded', function() {
    // Inicializar el componente file-input personalizado si existe
    if (typeof initFileInputs === 'function') {
        initFileInputs();
    }
});
</script>