@php
    $catalogosProgramadoRelacion = [
        'Cliente Factura' => collect($catalogos['clientes_factura'] ?? [])->values()->all(),
        'Proveedor' => collect($catalogos['proveedores'] ?? [])->values()->all(),
        'Empleado' => collect($catalogos['empleados'] ?? [])->values()->all(),
        'Cuenta' => collect($catalogos['cuentas_relacionadas'] ?? [])->values()->all(),
    ];
    $jsonOptionsProgramado = JSON_HEX_TAG | JSON_HEX_APOS | JSON_HEX_AMP | JSON_HEX_QUOT;
    if (defined('JSON_INVALID_UTF8_SUBSTITUTE')) {
        $jsonOptionsProgramado = $jsonOptionsProgramado | JSON_INVALID_UTF8_SUBSTITUTE;
    }
    $catalogosProgramadoJson = json_encode($catalogosProgramadoRelacion, $jsonOptionsProgramado);
    if ($catalogosProgramadoJson === false) {
        $catalogosProgramadoJson = '{}';
    }
@endphp

<div class="modal fade" id="modal_pago_programado_real" tabindex="-1" role="dialog" aria-labelledby="modalPagoProgramadoRealLabel" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered modal-xl" role="document">
        <div class="modal-content">
            <form method="post" action="{{ route('bancos.real.programados.store') }}" enctype="multipart/form-data" id="form_pago_programado_real" data-store-action="{{ route('bancos.real.programados.store') }}">
                {{ csrf_field() }}
                <input type="hidden" name="_method" value="" class="programado-method-real">
                <input type="hidden" name="fechas_programadas" value="" class="programado-fechas-hidden-real">

                <div class="modal-header">
                    <h5 class="modal-title" id="modalPagoProgramadoRealLabel">Nuevo pago programado</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Cerrar"><span aria-hidden="true">&times;</span></button>
                </div>

                <div class="modal-body">
                    <div class="alert alert-info">
                        El calendario se calcula automaticamente con periodicidad, fecha de inicio y fecha de termino.
                    </div>

                    <ul class="nav nav-pills mb-3 nav-justified" role="tablist">
                        <li class="nav-item"><a class="nav-link active" data-toggle="pill" href="#prog-real-datos" role="tab">Datos generales</a></li>
                        <li class="nav-item"><a class="nav-link" data-toggle="pill" href="#prog-real-concepto" role="tab">Concepto e importe</a></li>
                        <li class="nav-item"><a class="nav-link" data-toggle="pill" href="#prog-real-calendario" role="tab">Calendario de ejecución</a></li>
                        <li class="nav-item"><a class="nav-link" data-toggle="pill" href="#prog-real-documentos-reglas" role="tab">Autorizaciones y documentos</a></li>
                    </ul>

                    <div class="tab-content">
                        <div class="tab-pane fade show active" id="prog-real-datos" role="tabpanel">
                            <div class="form-step-card">
                                <div class="form-row">
                                    <div class="form-group col-md-4"><label>Nombre de programación</label><input type="text" class="form-control" name="nombre_programacion" placeholder="Renta mensual laboratorio" required></div>
                                    <div class="form-group col-md-4"><label>Tipo de movimiento</label><select class="custom-select" name="tipo_movimiento"><option>Cargo</option><option>Abono</option><option>Ajuste positivo</option><option>Ajuste negativo</option></select></div>
                                    <div class="form-group col-md-4"><label>Estatus de programación</label><select class="custom-select" name="estatus"><option>Activa</option><option>Pausada</option><option>Finalizada</option><option>Cancelada</option></select></div>
                                </div>

                                <div class="form-row">
                                    <div class="form-group col-md-4">
                                        <label>Cuenta bancaria activa</label>
                                        <select class="selectpicker form-control programado-cuenta-real" name="id_banco_cuenta" data-live-search="true" data-live-search-style="contains" data-live-search-normalize="true" data-size="8" data-width="100%" required>
                                            @foreach($cuentasActivas as $cuentaActiva)
                                                <option value="{{ $cuentaActiva->id_banco_cuenta }}" data-moneda="{{ $cuentaActiva->moneda }}">{{ $cuentaActiva->banco }} - {{ $cuentaActiva->nombre_cuenta }} - {{ $cuentaActiva->moneda }}</option>
                                            @endforeach
                                        </select>
                                        <small class="text-muted">Cuentas bloqueadas o inactivas no aparecen para generar movimientos.</small>
                                    </div>
                                    <div class="form-group col-md-3">
                                        <label>Área de negocio</label>
                                        <select class="selectpicker form-control" name="area_negocio" data-live-search="true" data-width="100%" required>
                                            @foreach(($catalogos['unidades_negocio'] ?? []) as $area)
                                                <option value="{{ $area['id'] }}" data-subtext="{{ $area['nombre'] }}">{{ $area['clave'] }}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                    <div class="form-group col-md-2">
                                        <label>Origen relacionado</label>
                                        <select class="selectpicker form-control programado-origen-entidad-real" name="entidad_tipo" data-live-search="true" data-width="100%" data-container="body" required>
                                            @foreach(($catalogos['origenes'] ?? []) as $origen)
                                                <option value="{{ $origen }}">{{ $origen }}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                    <div class="form-group col-md-3">
                                        <label class="programado-label-entidad-real">Cliente Factura relacionado</label>
                                        <div class="programado-entidad-wrapper-real">
                                            <input type="text" class="form-control programado-entidad-buscador-real" placeholder="Buscar y seleccionar" autocomplete="off" data-bancos-counter="off">
                                            <div class="programado-entidad-dropdown-real" style="display:none;"></div>
                                            <input type="hidden" class="programado-entidad-id-real" name="entidad_id">
                                        </div>
                                        <input type="text" class="form-control programado-entidad-libre-real mt-1" name="entidad_nombre_libre" style="display:none;" placeholder="Captura libre">
                                        <input type="hidden" class="programado-entidad-nombre-real" name="entidad_nombre">
                                        <small class="text-danger programado-entidad-error-real" style="display:none;">Debe seleccionar una entidad relacionada.</small>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="tab-pane fade" id="prog-real-concepto" role="tabpanel">
                            <div class="form-step-card">
                                <div class="form-row">
                                    <div class="form-group col-md-3"><label class="programado-concepto-label-real">Concepto</label><input type="text" class="form-control" name="concepto" placeholder="Renta mensual" required></div>
                                    <div class="form-group col-md-3"><label class="programado-descripcion-label-real">Descripción</label><input type="text" class="form-control" name="descripcion" placeholder="Pago fijo por contrato"></div>
                                    <div class="form-group col-md-2"><label>Tipo de importe</label><select class="custom-select programado-tipo-importe-real" name="tipo_pago"><option value="Fijo">Fijo</option><option value="Variable">Variable</option></select></div>
                                    <div class="form-group col-md-2"><label class="programado-monto-label-real">Monto base</label><input type="number" step="0.01" class="form-control programado-monto-base-real" name="monto_base" required></div>
                                    <div class="form-group col-md-2"><label>Moneda</label><input type="text" class="form-control programado-moneda-display-real" value="MXN" readonly><input type="hidden" name="moneda" class="programado-moneda-real" value="MXN"></div>
                                </div>
                                <div class="alert alert-info py-2 mb-2 programado-estructura-tipo-real"></div>
                                <div class="alert alert-warning py-2 mb-0 programado-alerta-variable-real" style="display:none;">Este pago es variable. Capture el importe antes de generar el movimiento.</div>
                            </div>
                        </div>

                        <div class="tab-pane fade" id="prog-real-calendario" role="tabpanel">
                            <div class="form-step-card">
                                <div class="form-row">
                                    <div class="form-group col-md-3"><label>Periodicidad</label><select class="custom-select programado-periodicidad-real" name="periodicidad" required><option>Diario</option><option>Semanal</option><option>Quincenal</option><option selected>Mensual</option><option>Bimestral</option><option>Trimestral</option><option>Semestral</option><option>Anual</option></select></div>
                                    <div class="form-group col-md-3"><label>Fecha de inicio</label><input type="datetime-local" step="1" class="form-control programado-fecha-inicio-real" name="fecha_inicio" value="{{ \Carbon\Carbon::now(\App\Services\BancoFechaService::zona())->format('Y-m-d\TH:i:s') }}" required></div>
                                    <div class="form-group col-md-3"><label>Vigencia</label><select class="custom-select programado-vigencia-real" name="vigencia_tipo"><option value="fecha" selected>Hasta una fecha específica</option><option value="ejecuciones">Por número de ejecuciones</option></select></div>
                                    <div class="form-group col-md-3"><label>Próxima fecha programada</label><input type="text" class="form-control programado-proxima-real" readonly></div>
                                </div>

                                <div class="form-row">
                                    <div class="form-group col-md-3 programado-fecha-termino-grupo-real"><label>Fecha de término</label><input type="datetime-local" step="1" class="form-control programado-fecha-termino-real" name="fecha_termino" required></div>
                                    <div class="form-group col-md-3 programado-numero-pagos-grupo-real" style="display:none;"><label>Número de ejecuciones</label><input type="number" min="1" class="form-control programado-numero-pagos-real" name="numero_pagos" readonly></div>
                                    <div class="form-group col-md-9">
                                        <label>Vista previa de fechas generadas</label>
                                        <div class="form-row align-items-end mb-2">
                                            <div class="col-md-8"><input type="text" class="form-control programado-fecha-agregar-real" placeholder="dd/mm/aaaa HH:mm:ss"></div>
                                            <div class="col-md-4"><button type="button" class="btn btn-sm btn-success btn-block programado-agregar-fecha-real"><i class="plus icon"></i>Agregar fecha</button></div>
                                        </div>
                                        <div class="table-responsive">
                                            <table class="ui celled table unstackable structured mb-0">
                                                <thead><tr><th>No. pago</th><th>Fecha programada</th><th>Estatus</th><th>Acciones</th></tr></thead>
                                                <tbody class="programado-preview-body-real"><tr><td colspan="4" class="text-center text-muted">Selecciona periodicidad, inicio y término.</td></tr></tbody>
                                            </table>
                                        </div>
                                    </div>
                                </div>

                                <div class="alert alert-danger py-2 mb-0 programado-calendario-error-real" style="display:none;"></div>
                            </div>
                        </div>

                        <div class="tab-pane fade" id="prog-real-documentos-reglas" role="tabpanel">
                            <div class="form-step-card">
                                <div class="form-row">
                                    <div class="form-group col-md-3"><label>Programado por</label><input type="text" class="form-control programado-programado-por-real" value="{{ $usuarioBancos ? $usuarioBancos->nombre_completo : 'Usuario no disponible' }}" readonly></div>
                                    <div class="form-group col-md-3"><label>Preautorizado</label><select class="custom-select" name="preautorizado"><option value="1">Si</option><option value="0">No</option></select></div>
                                    <div class="form-group col-md-3"><label>Autorizado por</label><input type="text" class="form-control programado-autorizado-por-real" value="Pendiente de gerente" readonly></div>
                                    <div class="form-group col-md-3"><label>Fecha autorización</label><input type="text" class="form-control programado-fecha-autorizacion-real" value="-" readonly></div>
                                </div>
                                <div class="form-row programado-variable-auth-real">
                                    <div class="form-group col-md-6"><label>Requiere autorización si excede monto</label><select class="custom-select" name="requiere_autorizacion_si_excede"><option value="1">Si</option><option value="0">No</option></select></div>
                                    <div class="form-group col-md-6"><label>Monto máximo autorizado</label><input type="number" step="0.01" class="form-control" name="monto_maximo_permitido"></div>
                                </div>
                                <div class="form-row">
                                    <div class="form-group col-md-12"><label>Nota para gerente</label><textarea class="form-control" name="observaciones" rows="2" placeholder="Notas o condiciones para revisión de Gerencia."></textarea></div>
                                </div>
                                @include('Bancos.Real.partials._tabla_documentos_form', ['label' => 'Contrato / soporte'])
                            </div>
                        </div>
                    </div>
                </div>

                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal"><i class="times icon"></i>Cerrar</button>
                    <button type="button" class="btn btn-secondary programado-prev-real" style="display:none;"><i class="arrow left icon"></i>Anterior</button>
                    <button type="button" class="btn btn-primary programado-next-real"><span>Siguiente</span><i class="arrow right icon"></i></button>
                    <button type="submit" class="btn btn-primary programado-save-real" style="display:none;"><i class="save icon"></i><span class="programado-submit-text">Guardar programación</span></button>
                </div>
            </form>
        </div>
    </div>
</div>

<script>
    window.bancosCatalogosProgramadosRelacion = {!! $catalogosProgramadoJson !!};

    function programadoNormalizarTexto(valor) {
        return String(valor || '').replace(/\s+/g, ' ').trim();
    }

    function programadoCatalogoRelacion(tipo) {
        var catalogos = window.bancosCatalogosProgramadosRelacion || {};
        var tipoNormalizado = programadoNormalizarTexto(tipo);

        if (!tipoNormalizado || tipoNormalizado === 'Seleccionar') {
            return [];
        }

        if (catalogos[tipoNormalizado]) {
            return catalogos[tipoNormalizado];
        }

        var llaveEncontrada = Object.keys(catalogos).filter(function (llave) {
            return programadoNormalizarTexto(llave) === tipoNormalizado;
        })[0];

        return llaveEncontrada ? catalogos[llaveEncontrada] : [];
    }

    function programadoTipoOrigenSeleccionado($form) {
        var $origen = $form.find('.programado-origen-entidad-real').first();
        var tipo = programadoNormalizarTexto($origen.val());

        if (!tipo || tipo === 'Seleccionar') {
            tipo = programadoNormalizarTexto($origen.find('option:selected').attr('value'));
        }
        if (!tipo || tipo === 'Seleccionar') {
            tipo = programadoNormalizarTexto($origen.find('option:selected').text());
        }
        if ((!tipo || tipo === 'Seleccionar') && $origen.parent('.bootstrap-select').length) {
            tipo = programadoNormalizarTexto($origen.parent('.bootstrap-select').find('.filter-option-inner-inner').text());
        }

        return tipo;
    }

    function programadoOpcionesComoArray(opciones) {
        if ($.isArray(opciones)) {
            return opciones;
        }
        return $.map(opciones || {}, function (opcion) { return opcion; });
    }

    function programadoCatalogoEntidadActual($form) {
        var tipo = programadoTipoOrigenSeleccionado($form);
        var cuentaActual = $form.find('.programado-cuenta-real').val();
        var opciones = programadoOpcionesComoArray(programadoCatalogoRelacion(tipo));

        return $.grep(opciones, function (opcion) {
            if (!opcion || typeof opcion !== 'object') return false;
            if (tipo === 'Cuenta' && String(opcion.id) === String(cuentaActual)) return false;
            return opcion.id !== undefined && opcion.nombre;
        });
    }

    function pintarOpcionesEntidadProgramado($form, textoBusqueda) {
        var $dropdown = $form.find('.programado-entidad-dropdown-real');
        var filtro = programadoNormalizarTexto(textoBusqueda || '').toLowerCase();
        var html = '';

        $.each(programadoCatalogoEntidadActual($form), function (_, opcion) {
            var nombre = programadoNormalizarTexto(opcion.nombre);
            var nombreSeguro = $('<div>').text(nombre).html();

            if (filtro && nombre.toLowerCase().indexOf(filtro) === -1) {
                return;
            }

            html += '<div class="programado-entidad-option-real" data-id="' + opcion.id + '" data-nombre="' + nombreSeguro + '">' + nombreSeguro + '</div>';
        });

        if (!html) {
            html = '<div class="programado-entidad-option-real disabled">Sin resultados</div>';
        }

        $dropdown.html(html).show();
    }

    function actualizarEntidadProgramado($form) {
        var tipo = programadoTipoOrigenSeleccionado($form);
        var $wrapper = $form.find('.programado-entidad-wrapper-real');
        var $buscador = $form.find('.programado-entidad-buscador-real');
        var $dropdown = $form.find('.programado-entidad-dropdown-real');
        var $id = $form.find('.programado-entidad-id-real');
        var $libre = $form.find('.programado-entidad-libre-real');
        var $hidden = $form.find('.programado-entidad-nombre-real');
        var $error = $form.find('.programado-entidad-error-real');

        $form.find('.programado-label-entidad-real').text(!tipo || tipo === 'Otro' ? 'Entidad relacionada' : tipo + ' relacionado');
        $id.val('');
        $hidden.val('');
        $buscador.val('');
        $dropdown.empty().hide();
        $error.hide().text('');

        if (tipo === 'Otro') {
            $wrapper.hide();
            $buscador.prop('required', false).prop('disabled', true);
            $libre.show().prop('required', false).prop('disabled', false);
            $hidden.val($libre.val());
            return;
        }

        $wrapper.show();
        // El buscador visual no tiene name; no debe quedar required porque rompe submit en pestanas ocultas.
        $buscador.prop('required', false).prop('disabled', false);
        $libre.hide().prop('required', false).prop('disabled', true).val('');
    }

    function validarEntidadProgramado($form) {
        var tipo = programadoTipoOrigenSeleccionado($form);
        var $error = $form.find('.programado-entidad-error-real');

        if (tipo === 'Otro') {
            if (programadoNormalizarTexto($form.find('.programado-entidad-libre-real').val())) {
                $error.hide().text('');
                return true;
            }
            $error.text('Debe capturar la entidad relacionada.').show();
            return false;
        }

        if ($form.find('.programado-entidad-id-real').val()) {
            $error.hide().text('');
            return true;
        }

        $error.text('Debe seleccionar una entidad relacionada.').show();
        return false;
    }

    function actualizarMonedaProgramado($form) {
        var moneda = $form.find('.programado-cuenta-real option:selected').data('moneda') || 'MXN';
        $form.find('.programado-moneda-display-real').val(moneda);
        $form.find('.programado-moneda-real').val(moneda);
    }

    function parseFechaProgramada(valor) {
        valor = programadoNormalizarTexto(valor);
        if (!valor) return null;

        var matchVista = valor.match(/^(\d{2})\/(\d{2})\/(\d{4})\s+(\d{2}):(\d{2})(?::(\d{2}))?$/);
        if (matchVista) {
            return new Date(
                parseInt(matchVista[3], 10),
                parseInt(matchVista[2], 10) - 1,
                parseInt(matchVista[1], 10),
                parseInt(matchVista[4], 10),
                parseInt(matchVista[5], 10),
                parseInt(matchVista[6] || '0', 10)
            );
        }

        var normalizado = valor.replace(' ', 'T');
        if (/^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}$/.test(normalizado)) {
            normalizado += ':00';
        }

        var fecha = new Date(normalizado);
        return isNaN(fecha.getTime()) ? null : fecha;
    }

    function padProgramado(numero) {
        return numero < 10 ? '0' + numero : String(numero);
    }

    function formatoInputProgramado(fecha) {
        return fecha.getFullYear() + '-' + padProgramado(fecha.getMonth() + 1) + '-' + padProgramado(fecha.getDate()) + 'T' + padProgramado(fecha.getHours()) + ':' + padProgramado(fecha.getMinutes()) + ':' + padProgramado(fecha.getSeconds());
    }

    function formatoVistaProgramado(fecha) {
        return padProgramado(fecha.getDate()) + '/' + padProgramado(fecha.getMonth() + 1) + '/' + fecha.getFullYear() + ' ' + padProgramado(fecha.getHours()) + ':' + padProgramado(fecha.getMinutes()) + ':' + padProgramado(fecha.getSeconds());
    }

    function formatoSqlProgramado(fecha) {
        return fecha.getFullYear() + '-' + padProgramado(fecha.getMonth() + 1) + '-' + padProgramado(fecha.getDate()) + ' ' + padProgramado(fecha.getHours()) + ':' + padProgramado(fecha.getMinutes()) + ':' + padProgramado(fecha.getSeconds());
    }

    function addMesesProgramado(fecha, meses) {
        var originalDia = fecha.getDate();
        var siguiente = new Date(fecha.getTime());
        siguiente.setDate(1);
        siguiente.setMonth(siguiente.getMonth() + meses);
        var ultimoDia = new Date(siguiente.getFullYear(), siguiente.getMonth() + 1, 0).getDate();
        siguiente.setDate(Math.min(originalDia, ultimoDia));
        return siguiente;
    }

    function siguienteFechaProgramada(fecha, periodicidad) {
        var siguiente = new Date(fecha.getTime());
        if (periodicidad === 'Diario') siguiente.setDate(siguiente.getDate() + 1);
        else if (periodicidad === 'Semanal') siguiente.setDate(siguiente.getDate() + 7);
        else if (periodicidad === 'Quincenal') siguiente.setDate(siguiente.getDate() + 14);
        else if (periodicidad === 'Bimestral') siguiente = addMesesProgramado(siguiente, 2);
        else if (periodicidad === 'Trimestral') siguiente = addMesesProgramado(siguiente, 3);
        else if (periodicidad === 'Semestral') siguiente = addMesesProgramado(siguiente, 6);
        else if (periodicidad === 'Anual') siguiente.setFullYear(siguiente.getFullYear() + 1);
        else siguiente = addMesesProgramado(siguiente, 1);
        return siguiente;
    }

    function calcularFechasProgramado(periodicidad, inicio, termino) {
        var fechas = [];
        var cursor = new Date(inicio.getTime());
        var limite = 1000;
        while (cursor.getTime() <= termino.getTime()) {
            fechas.push(new Date(cursor.getTime()));
            if (fechas.length > limite) break;
            cursor = siguienteFechaProgramada(cursor, periodicidad);
        }
        return fechas;
    }

    function calcularFechasPorEjecucionesProgramado(periodicidad, inicio, total) {
        var fechas = [];
        var cursor = new Date(inicio.getTime());
        var limite = Math.min(parseInt(total || 0, 10), 1000);

        for (var i = 0; i < limite; i++) {
            fechas.push(new Date(cursor.getTime()));
            cursor = siguienteFechaProgramada(cursor, periodicidad);
        }

        return fechas;
    }

    function normalizarListaFechasProgramado(fechas) {
        var mapa = {};

        $.each(fechas || [], function (_, fecha) {
            var fechaObj = fecha instanceof Date ? fecha : parseFechaProgramada(fecha);
            if (!fechaObj) return;
            mapa[formatoSqlProgramado(fechaObj)] = new Date(fechaObj.getTime());
        });

        return $.map(mapa, function (fechaObj) { return fechaObj; }).sort(function (a, b) {
            return a.getTime() - b.getTime();
        });
    }

    function renderCalendarioProgramado($form, fechas, estatuses) {
        var fechasOrdenadas = normalizarListaFechasProgramado(fechas);
        var $tbody = $form.find('.programado-preview-body-real');
        var total = fechasOrdenadas.length;
        var html = '';

        if (!total) {
            $tbody.html('<tr><td colspan="4" class="text-center text-muted">Sin fechas programadas.</td></tr>');
            sincronizarResumenCalendarioProgramado($form);
            return [];
        }

        $.each(fechasOrdenadas, function (indice, fecha) {
            var fechaSql = formatoSqlProgramado(fecha);
            var estatus = estatuses && estatuses[fechaSql] ? estatuses[fechaSql] : 'Pendiente';
            var bloqueado = estatuses && estatuses[fechaSql + '_bloqueado'] ? true : false;
            var disabled = bloqueado ? ' readonly' : '';
            var accion = bloqueado
                ? '<span class="text-muted">Generado</span>'
                : '<button type="button" class="btn btn-sm btn-danger programado-eliminar-fecha-real"><i class="trash icon"></i>Eliminar</button>';

           html += '<tr>'
            + '<td class="programado-numero-row-real">' + (indice + 1) + ' de ' + total + '</td>'
            + '<td><input type="text" class="form-control form-control-sm programado-fecha-row-real" value="' + formatoVistaProgramado(fecha) + '"' + disabled + '></td>'
            + '<td><span class="status-pill status-warn">' + estatus + '</span></td>'
            + '<td>' + accion + '</td>'
            + '</tr>';
        });

        $tbody.html(html);
        sincronizarResumenCalendarioProgramado($form);
        return fechasOrdenadas;
    }

    function leerFechasTablaProgramado($form) {
        var fechas = [];
        $form.find('.programado-fecha-row-real').each(function () {
            var fecha = parseFechaProgramada($(this).val());
            if (fecha) {
                fechas.push(fecha);
                $(this).removeClass('is-invalid');
            } else {
                $(this).addClass('is-invalid');
            }
        });

        return normalizarListaFechasProgramado(fechas);
    }

    function sincronizarResumenCalendarioProgramado($form) {
        var fechas = leerFechasTablaProgramado($form);
        var total = fechas.length;
        var $rows = $form.find('.programado-preview-body-real tr');

        $rows.each(function (indice) {
            $(this).find('.programado-numero-row-real').text((indice + 1) + ' de ' + total);
        });

        $form.find('.programado-numero-pagos-real').val(total);
        $form.find('.programado-proxima-real').val(total ? formatoVistaProgramado(fechas[0]) : '');
        $form.find('.programado-fechas-hidden-real').val(JSON.stringify($.map(fechas, function (fecha) {
            return formatoSqlProgramado(fecha);
        })));

        return fechas;
    }

    function actualizarCalendarioProgramado($form, fechasForzadas, estatuses) {
        var periodicidad = $form.find('.programado-periodicidad-real').val();
        var inicio = parseFechaProgramada($form.find('.programado-fecha-inicio-real').val());
        var vigencia = $form.find('.programado-vigencia-real').val() || 'fecha';
        var termino = parseFechaProgramada($form.find('.programado-fecha-termino-real').val());
        var numeroEjecuciones = parseInt($form.find('.programado-numero-pagos-real').val() || '0', 10);
        var $error = $form.find('.programado-calendario-error-real');

        $error.hide().text('');
        actualizarVigenciaProgramado($form);

        if (fechasForzadas && fechasForzadas.length) {
            return renderCalendarioProgramado($form, fechasForzadas, estatuses);
        }

        if (!periodicidad || !inicio) {
            $form.find('.programado-preview-body-real').html('<tr><td colspan="4" class="text-center text-muted">Selecciona periodicidad e inicio.</td></tr>');
            sincronizarResumenCalendarioProgramado($form);
            return [];
        }

        if (vigencia === 'ejecuciones') {
            if (!numeroEjecuciones || numeroEjecuciones < 1) {
                $form.find('.programado-preview-body-real').html('<tr><td colspan="4" class="text-center text-muted">Captura el número de ejecuciones.</td></tr>');
                sincronizarResumenCalendarioProgramado($form);
                return [];
            }

            var fechasPorNumero = calcularFechasPorEjecucionesProgramado(periodicidad, inicio, numeroEjecuciones);
            if (fechasPorNumero.length) {
                $form.find('.programado-fecha-termino-real').val(formatoInputProgramado(fechasPorNumero[fechasPorNumero.length - 1]));
            }

            return renderCalendarioProgramado($form, fechasPorNumero);
        }

        if (!termino) {
            $form.find('.programado-preview-body-real').html('<tr><td colspan="4" class="text-center text-muted">Selecciona fecha de término.</td></tr>');
            sincronizarResumenCalendarioProgramado($form);
            return [];
        }

        if (termino.getTime() < inicio.getTime()) {
            $error.text('La fecha de termino no puede ser menor que la fecha de inicio.').show();
            return [];
        }

        var fechas = calcularFechasProgramado(periodicidad, inicio, termino);
        if (!fechas.length) {
            $error.text('La programacion no genera fechas de ejecucion.').show();
            renderCalendarioProgramado($form, []);
            return [];
        }

        return renderCalendarioProgramado($form, fechas);
    }

    function actualizarVigenciaProgramado($form) {
        var vigencia = $form.find('.programado-vigencia-real').val() || 'fecha';
        var porEjecuciones = vigencia === 'ejecuciones';

        $form.find('.programado-fecha-termino-grupo-real').toggle(!porEjecuciones);
        $form.find('.programado-fecha-termino-real').prop('required', !porEjecuciones);
        $form.find('.programado-numero-pagos-grupo-real').toggle(porEjecuciones);
        $form.find('.programado-numero-pagos-real').prop('readonly', !porEjecuciones).prop('required', porEjecuciones);
    }

    function actualizarTipoImporteProgramado($form) {
        var esVariable = $form.find('.programado-tipo-importe-real').val() === 'Variable';
        $form.find('.programado-alerta-variable-real').toggle(esVariable);
        $form.find('.programado-monto-base-real').prop('required', !esVariable);
        $form.find('.programado-variable-auth-real').toggle(esVariable);
        $form.find('.programado-variable-auth-real').find('input, select').prop('disabled', !esVariable);
    }

    function actualizarInfoAutorizacionProgramado($form, datos) {
        var usuarioActual = @json($usuarioBancos ? $usuarioBancos->nombre_completo : 'Usuario no disponible');
        $form.find('.programado-programado-por-real').val(datos && datos.creado_por_nombre ? datos.creado_por_nombre : usuarioActual);
        $form.find('.programado-autorizado-por-real').val(datos && datos.autorizado_por_nombre ? datos.autorizado_por_nombre : 'Pendiente de gerente');
        $form.find('.programado-fecha-autorizacion-real').val(datos && datos.fecha_autorizacion_vista ? datos.fecha_autorizacion_vista : '-');
    }

    function actualizarEstructuraMovimientoProgramado($form) {
        var tipo = $form.find('[name="tipo_movimiento"]').val() || 'Cargo';
        var mensaje = 'El importe se aplicara conforme al tipo de movimiento seleccionado.';

        if (tipo === 'Cargo') {
            mensaje = 'Cargo: la ejecucion registrara una salida de recursos en la cuenta seleccionada.';
            $form.find('.programado-monto-label-real').text('Monto base del cargo');
        } else if (tipo === 'Abono') {
            mensaje = 'Abono: la ejecucion registrara una entrada de recursos en la cuenta seleccionada.';
            $form.find('.programado-monto-label-real').text('Monto base del abono');
        } else if (tipo === 'Ajuste positivo') {
            mensaje = 'Ajuste positivo: movimiento manual simple que incrementa el saldo.';
            $form.find('.programado-monto-label-real').text('Monto del ajuste positivo');
        } else if (tipo === 'Ajuste negativo') {
            mensaje = 'Ajuste negativo: movimiento manual simple que disminuye el saldo y puede requerir autorizacion.';
            $form.find('.programado-monto-label-real').text('Monto del ajuste negativo');
        }

        $form.find('.programado-estructura-tipo-real').text(mensaje);
    }

    function aplicarEntidadProgramadoEditada($form, datos) {
        if (!datos) return;

        if (datos.entidad_id) {
            $form.find('.programado-entidad-id-real').val(datos.entidad_id);
        }
        if (datos.entidad_nombre) {
            $form.find('.programado-entidad-nombre-real').val(datos.entidad_nombre);
            $form.find('.programado-entidad-buscador-real').val(datos.entidad_nombre);
            $form.find('.programado-entidad-libre-real').val(datos.entidad_nombre);
        }
    }

    function calendarioDesdeDatosProgramado(datos) {
        if (!datos || !datos.calendario || !datos.calendario.length) {
            return { fechas: [], estatuses: {} };
        }

        var fechas = [];
        var estatuses = {};
        $.each(datos.calendario, function (_, item) {
            if (!item || !item.fecha_programada) return;
            var fecha = parseFechaProgramada(item.fecha_programada);
            if (!fecha) return;
            var sql = formatoSqlProgramado(fecha);
            fechas.push(fecha);
            estatuses[sql] = item.estatus || 'Pendiente';
            if (item.bloqueado) {
                estatuses[sql + '_bloqueado'] = true;
            }
        });

        return { fechas: fechas, estatuses: estatuses };
    }

    function indicePasoProgramado($form) {
        var $tabs = $form.find('.nav-pills a[data-toggle="pill"]');
        var $activo = $form.find('.nav-pills a.active');
        return $tabs.index($activo);
    }

    function actualizarBotonesPasoProgramado($form) {
        var $tabs = $form.find('.nav-pills a[data-toggle="pill"]');
        var indice = indicePasoProgramado($form);
        var ultimo = $tabs.length - 1;

        $form.find('.programado-prev-real').toggle(indice > 0);
        $form.find('.programado-next-real').toggle(indice < ultimo);
        $form.find('.programado-save-real').toggle(indice === ultimo);
    }

    function moverPasoProgramado($form, direccion) {
        var $tabs = $form.find('.nav-pills a[data-toggle="pill"]');
        var indice = indicePasoProgramado($form);
        var destino = indice + direccion;

        if (destino >= 0 && destino < $tabs.length) {
            $tabs.eq(destino).tab('show');
        }
    }

    function limpiarProgramadoReal() {
        var $form = $('#form_pago_programado_real');
        $form.attr('action', $form.data('store-action'));
        $form.removeData('programado-edit-id');
        $form.find('.programado-method-real').val('');
        $form[0].reset();
        $form.find('[name="fecha_inicio"]').val(formatoInputProgramado(new Date()));
        $form.find('.programado-fecha-agregar-real').val('');
        if ($.fn.selectpicker) {
            $form.find('.selectpicker').selectpicker('refresh');
        }
        $('#modalPagoProgramadoRealLabel').text('Nuevo pago programado');
        $form.find('.programado-submit-text').text('Guardar programacion');
        $form.find('.nav-pills a[href="#prog-real-datos"]').tab('show');
        actualizarEntidadProgramado($form);
        actualizarInfoAutorizacionProgramado($form, null);
        actualizarMonedaProgramado($form);
        actualizarTipoImporteProgramado($form);
        actualizarEstructuraMovimientoProgramado($form);
        actualizarVigenciaProgramado($form);
        actualizarCalendarioProgramado($form);
        actualizarBotonesPasoProgramado($form);
    }

    $(document).on('click', '.nuevo-programado-real', function () {
        limpiarProgramadoReal();
    });

    $('#modal_pago_programado_real').on('shown.bs.modal', function () {
        if ($.fn.selectpicker) {
            $(this).find('.selectpicker').each(function () {
                var $select = $(this);
                if ($select.parent('.bootstrap-select').length) {
                    $select.selectpicker('destroy');
                }
                $select.selectpicker({
                    liveSearch: true,
                    liveSearchStyle: 'contains',
                    liveSearchNormalize: true,
                    width: '100%',
                    size: 8,
                    dropupAuto: false,
                    noneSelectedText: $select.attr('title') || 'Seleccionar'
                });
            });
        }
        var $form = $('#form_pago_programado_real');
        var editId = $form.data('programado-edit-id');
        var datosEdit = editId && window.bancosProgramados ? window.bancosProgramados[editId] : null;
        var calendarioEdit = calendarioDesdeDatosProgramado(datosEdit);
        actualizarEntidadProgramado($form);
        aplicarEntidadProgramadoEditada($form, datosEdit);
        actualizarInfoAutorizacionProgramado($form, datosEdit);
        actualizarMonedaProgramado($form);
        actualizarTipoImporteProgramado($form);
        actualizarEstructuraMovimientoProgramado($form);
        actualizarVigenciaProgramado($form);
        actualizarCalendarioProgramado($form, calendarioEdit.fechas, calendarioEdit.estatuses);
        actualizarBotonesPasoProgramado($form);
    });

    $(document).on('shown.bs.tab', '#modal_pago_programado_real .nav-pills a[data-toggle="pill"]', function () {
        actualizarBotonesPasoProgramado($('#form_pago_programado_real'));
    });

    $(document).on('click', '.programado-next-real', function () {
        moverPasoProgramado($(this).closest('form'), 1);
    });

    $(document).on('click', '.programado-prev-real', function () {
        moverPasoProgramado($(this).closest('form'), -1);
    });

    $(document).on('change changed.bs.select', '.programado-origen-entidad-real, .programado-cuenta-real', function () {
        var $form = $(this).closest('form');
        actualizarEntidadProgramado($form);
        actualizarMonedaProgramado($form);
    });

    $(document).on('change input', '.programado-periodicidad-real, .programado-fecha-inicio-real, .programado-fecha-termino-real, .programado-vigencia-real, .programado-numero-pagos-real', function () {
        actualizarCalendarioProgramado($(this).closest('form'));
    });

    $(document).on('change blur', '.programado-fecha-row-real', function () {
        var $form = $(this).closest('form');
        var fechas = leerFechasTablaProgramado($form);
        renderCalendarioProgramado($form, fechas);
    });

    $(document).on('click', '.programado-eliminar-fecha-real', function () {
        var $form = $(this).closest('form');
        $(this).closest('tr').remove();
        renderCalendarioProgramado($form, leerFechasTablaProgramado($form));
    });

    $(document).on('click', '.programado-agregar-fecha-real', function () {
        var $form = $(this).closest('form');
        var $input = $form.find('.programado-fecha-agregar-real');
        var fecha = parseFechaProgramada($input.val());

        if (!fecha) {
            $input.addClass('is-invalid');
            return;
        }

        $input.removeClass('is-invalid').val('');
        var fechas = leerFechasTablaProgramado($form);
        fechas.push(fecha);
        renderCalendarioProgramado($form, fechas);
    });

    $(document).on('change', '.programado-tipo-importe-real', function () {
        actualizarTipoImporteProgramado($(this).closest('form'));
    });

    $(document).on('change', '#form_pago_programado_real [name="tipo_movimiento"]', function () {
        actualizarEstructuraMovimientoProgramado($(this).closest('form'));
    });

    $(document).on('focus click input', '.programado-entidad-buscador-real', function () {
        pintarOpcionesEntidadProgramado($(this).closest('form'), $(this).val());
    });

    $(document).on('click', '.programado-entidad-option-real', function () {
        if ($(this).hasClass('disabled')) return;

        var $form = $(this).closest('form');
        var id = $(this).data('id');
        var nombre = $(this).data('nombre');

        $form.find('.programado-entidad-id-real').val(id);
        $form.find('.programado-entidad-nombre-real').val(nombre);
        $form.find('.programado-entidad-buscador-real').val(nombre);
        $form.find('.programado-entidad-dropdown-real').hide();
        $form.find('.programado-entidad-error-real').hide().text('');
    });

    $(document).on('input', '.programado-entidad-libre-real', function () {
        var $form = $(this).closest('form');
        $form.find('.programado-entidad-nombre-real').val($(this).val());
        if (programadoNormalizarTexto($(this).val())) {
            $form.find('.programado-entidad-error-real').hide().text('');
        }
    });

    $(document).on('click', function (e) {
        if (!$(e.target).closest('.programado-entidad-buscador-real, .programado-entidad-dropdown-real').length) {
            $('.programado-entidad-dropdown-real').hide();
        }
    });

    $(document).on('submit', '#form_pago_programado_real', function (event) {
        var $form = $(this);

        if (!validarEntidadProgramado($form)) {
            event.preventDefault();
            $form.find('.nav-pills a[href="#prog-real-datos"]').tab('show');
            return;
        }

        var fechas = sincronizarResumenCalendarioProgramado($form);
        if (!fechas.length) {
            event.preventDefault();
            $form.find('.programado-calendario-error-real').text('Debe existir al menos una fecha en el calendario de ejecucion.').show();
            $form.find('.nav-pills a[href="#prog-real-calendario"]').tab('show');
        }
    });

    $(document).on('click', '.editar-programado-real', function () {
        var id = $(this).data('programado-id');
        var datos = window.bancosProgramados ? window.bancosProgramados[id] : null;
        var $form = $('#form_pago_programado_real');

        if (!datos) {
            return;
        }

        $form.attr('action', datos.update_url);
        $form.data('programado-edit-id', id);
        $form.find('.programado-method-real').val('PUT');
        $('#modalPagoProgramadoRealLabel').text('Editar pago programado ' + (datos.nombre_programacion || ''));
        $form.find('.programado-submit-text').text('Guardar cambios');

        $.each(datos, function (campo, valor) {
            var $input = $form.find('[name="' + campo + '"]');
            if ($input.length) {
                $input.val(valor);
            }
        });
        if ($.fn.selectpicker) {
            $form.find('.selectpicker').selectpicker('refresh');
        }
        var calendario = calendarioDesdeDatosProgramado(datos);
        actualizarEntidadProgramado($form);
        actualizarInfoAutorizacionProgramado($form, datos);
        actualizarMonedaProgramado($form);
        actualizarTipoImporteProgramado($form);
        actualizarEstructuraMovimientoProgramado($form);
        actualizarVigenciaProgramado($form);
        actualizarCalendarioProgramado($form, calendario.fechas, calendario.estatuses);
        aplicarEntidadProgramadoEditada($form, datos);
        actualizarBotonesPasoProgramado($form);
    });
</script>