@extends('layouts.app', ['activePage' => 'cuentascontables', 'menuParent' => 'catalogos', 'titlePage' => __('Contabilidad - Cuentas contables')])
@section('content')
@include('includes.tailwind')

<div class="content">
    <div class="container-fluid mt-4">
        <div class="row mb-4">
            <div class="col-6">
                <h6 class="text-xl font-semibold text-gray-800">Cuentas contables</h6>
            </div>
        </div>
        <div class="row">
            <div class="col-md-12">
                <div class="bg-white rounded-lg shadow-md">
                    <div class="p-6">
                        <div class="grid grid-cols-12 gap-4 mb-4">
                            <div class="col-span-3">
                                <label class="block text-sm font-medium text-gray-700 mb-1">Cuenta agrupadora: <span class="text-red-500">*</span></label>
                                <select id="cuentaAgrupadoraFilter" class="select2 w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500  listado-cuentas-mayor" data-size="7" data-width="100%" data-style="select-with-transition" data-live-search="true">
                                    <option value="" disabled selected>-Todas-</option>
                                    @foreach($data['cuentasAgrupador'] as $c)
                                    <option value="{{$c->cuenta}}">({{$c->numero_cuenta}}) {{$c->cuenta}}</option>
                                    @endforeach
                                </select>

                            </div>
                            <div class="col-span-2 mt-4">
                                <button type="button" class="btn btn-primary btn-sm" onclick="getCuentasContables()">
                                    <i class="material-icons">search</i> Buscar
                                </button>
                            </div>

                            <div class="col-span-7 text-right mt-4">
                                <button type="button" class="px-4 py-1.5 border border-gray-300 shadow-sm text-sm font-medium rounded-md text-gray-700 bg-[#0A415F] hover:bg-[#083549] text-white transition-colors duration-200" onclick="abrirModalNuevaCuentaGlobal()">
                                    <i class="material-icons align-middle text-sm">add_circle</i> Agregar cuenta contable
                                </button>
                                <button type="button" class="px-4 py-1.5 border border-gray-300 shadow-sm text-sm font-medium rounded-md text-gray-700 bg-[#0A415F] hover:bg-[#083549] text-white transition-colors duration-200 mr-2" data-toggle="modal" data-target="#modal-generar-xml-cuentas-contables">
                                    <i class="material-icons align-middle text-sm">file_present</i> Generar XML
                                </button>
                                <a href="{{route('cuentas-contables.index-importar-excel')}}" class="px-4 py-2 border border-gray-300 shadow-sm text-sm font-medium rounded-md text-gray-700 bg-[#0A415F] hover:bg-[#083549] text-white transition-colors duration-200 mr-2">
                                    <i class="material-icons align-middle text-sm">upload_file</i> Importar
                                </a>
                                <a href="{{route('cuentas-contables.ajusteSaldos')}}" class="px-4 py-2 border border-gray-300 shadow-sm text-sm font-medium rounded-md text-gray-700 bg-[#0A415F] hover:bg-[#083549] text-white transition-colors duration-200 mr-2">
                                    <i class="material-icons align-middle text-sm">balance</i> Ajuste de saldos
                                </a>
                            </div>
                        </div>

                        <!-- Buscador de cuentas -->
                        <div class="mb-4" id="buscador-container" style="display: none;">
                            <div class="grid grid-cols-12 gap-4 mb-4">
                                <div class="col-span-6">
                                    <div class="relative">
                                        <input type="text" id="buscador-cuentas" class="w-full px-4 py-2 pl-12 pr-32 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" placeholder="Buscar cuentas por código, descripción o agrupador SAT...">
                                        <div class="absolute inset-y-0 right-0 pr-3 flex items-center">
                                            <span id="contador-resultados" class="text-sm text-gray-500 bg-gray-100 px-2 py-1 rounded-full"></span>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-span-6 text-right">
                                    <button type="button" class="btn-exportar px-4 py-1.5 border border-gray-300 shadow-sm text-sm font-medium rounded-md text-gray-700 bg-green-600 hover:bg-green-700 text-white transition-colors duration-200 mr-2" onclick="exportarCuentasContables('excel')" style="display: none;">
                                        <i class="material-icons align-middle text-sm">file_present</i> Exportar EXCEL
                                    </button>
                                    <button type="button" class="btn-exportar px-4 py-1.5 border border-gray-300 shadow-sm text-sm font-medium rounded-md text-gray-700 bg-red-600 hover:bg-red-700 text-white transition-colors duration-200 mr-2" onclick="exportarCuentasContables('pdf')" style="display: none;">
                                        <i class="material-icons align-middle text-sm">picture_as_pdf</i> Exportar PDF
                                    </button>
                                </div>
                            </div>
                        </div>

                        <!-- Tabla de cuentas contables -->
                        <div class="overflow-x-auto table-scroll">
                            <table class="min-w-full bg-white border border-gray-200 rounded-lg shadow-sm ">
                                <thead class="bg-gray-50 border-b border-gray-200 sticky-top">
                                    <tr>
                                        <th class="px-3 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
                                            Número de cuenta
                                        </th>
                                        <th class="px-3 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
                                            Nombre de la cuenta
                                        </th>
                                        <th class="px-3 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
                                            Tipo
                                        </th>
                                        <th class="px-3 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
                                            Agrupador SAT
                                        </th>
                                        <th class="px-3 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
                                            Moneda
                                        </th>
                                        <th class="px-3 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
                                            Cuenta Complementaria
                                        </th>
                                        <th class="px-3 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
                                            Estatus
                                        </th>
                                        <th class="px-3 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
                                            Acciones
                                        </th>
                                    </tr>
                                </thead>
                                <tbody id="tabla-cuentas-contables" class="divide-y divide-gray-200">
                                    <!-- Las cuentas se cargarán dinámicamente aquí -->
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="modal fade draggable" id="modal-agregar-cuenta-hija" tabindex="-1" role="dialog" aria-hidden="true" style="z-index: 1200;">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header bg-gray-50 border-b border-gray-200 px-6 py-4">
                <h5 class="modal-title text-lg font-semibold text-gray-900">Actualizar cuenta contable</h5>
                <button type="button" class="close text-gray-400 hover:text-gray-500" data-dismiss="modal" aria-label="Close">
                    <i class="material-icons">close</i>
                </button>
            </div>
            <div class="modal-body p-6">
                <!-- Select para elegir cuenta padre -->
                <div class="mb-4">
                    <label class="block text-sm font-medium text-gray-700 mb-2">Cuenta padre: <span class="text-red-500">*</span></label>
                    <select id="select-cuenta-padre" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 select2-modal" onchange="actualizarNumeroCuenta()">
                        <option value="" disabled selected>-Selecciona una cuenta padre-</option>
                        @foreach($data['cuentasContables'] as $cuenta)
                        <option value="{{$cuenta->id}}" data-cuenta="{{$cuenta->cuenta}}" data-numero="{{$cuenta->numero_cuenta}}" data-agrupador-sat="{{$cuenta->agrupador_sat}}">{{$cuenta->cuenta}} - {{$cuenta->numero_cuenta}}</option>
                        @endforeach
                    </select>
                </div>

                <div class="grid grid-cols-12 gap-4">
                    <div class="col-span-4">
                        <label class="block text-sm font-medium text-gray-700 mb-1">Número de cuenta: <span class="text-red-500">*</span></label>
                        <input type="text" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" id="numero_cuenta_hija" placeholder="Ingrese el número de cuenta">
                    </div>
                    <div class="col-span-4">
                        <label class="block text-sm font-medium text-gray-700 mb-1">Nombre de la cuenta: <span class="text-red-500">*</span></label>
                        <input type="text" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" id="cuenta_contable_hija" placeholder="Ingrese la cuenta contable">
                    </div>
                    <div class="col-span-4">
                        <label class="block text-sm font-medium text-gray-700 mb-1">Código agrupador SAT: <span class="text-red-500">*</span></label>
                        <select class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 select2-modal" id="codigo_agrupador_sat_hija" data-size="7" data-width="100%" data-style="select-with-transition" data-live-search="true">
                            <option value="" disabled selected>-Selecciona-</option>
                            @foreach($data['agrupador_sat'] as $a)
                            <option value="{{$a->codigo_agrupador}}">{{$a->codigo_agrupador}} - {{$a->descripcion}}</option>
                            @endforeach
                        </select>
                    </div>
                    <div class="col-span-4">
                        <label class="block text-sm font-medium text-gray-700 mb-1">Cuenta complementaria: </label>
                        <select class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 select2-modal" id="cuenta_complementaria_hija" data-size="7" data-width="100%" data-style="select-with-transition" data-live-search="true">
                            <option value="">-Selecciona-</option>
                            @foreach($data['cuentasContables'] as $c)
                            <option value="{{$c->id}}">({{$c->numero_cuenta}}) {{$c->cuenta}}</option>
                            @endforeach
                        </select>
                    </div>
                </div>
            </div>
            <div class="modal-footer px-6 py-4 bg-gray-50 border-t border-gray-200">
                <button type="button" class="bg-transparent text-red-500 hover:text-red-600 mr-2 px-4 py-2 rounded-md text-sm font-medium transition-colors duration-200" data-dismiss="modal">Cerrar</button>
                <button type="button" class="bg-[#0A415F] hover:bg-[#083549] text-white px-4 py-2 rounded-md text-sm font-medium transition-colors duration-200" onclick="guardarCuentaHija()">Guardar</button>
            </div>
        </div>
    </div>
</div>


<div class="modal fade draggable backdrop-blur-sm" id="modal-redireccion-importacion" tabindex="-1" role="dialog" aria-hidden="true" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header bg-gradient-to-r from-blue-600 to-blue-800 px-6 py-4">
                <div class="flex items-center">
                    <i class="material-icons text-white mr-2">warning</i>
                    <h5 class="modal-title text-lg font-semibold text-white">No hay cuentas contables registradas</h5>
                </div>
            </div>
            <div class="modal-body p-8">
                <div class="text-center mb-8">
                    <div class="flex justify-center mb-4">
                        <i class="material-icons text-yellow-500 text-5xl">folder_open</i>
                    </div>
                    <p class="text-gray-700 text-lg">No existen cuentas contables registradas. Para comenzar, es necesario importar las cuentas desde la sección de importación. ¿Desea continuar?</p>
                </div>
                <div class="flex justify-center space-x-4">
                    <button onclick="window.history.back()" class="bg-gray-500 hover:bg-gray-600 text-white px-6 py-2 rounded-md text-sm font-medium transition-colors duration-200 flex items-center">
                        <i class="material-icons mr-2">arrow_back</i>
                        Volver
                    </button>
                    <a href="{{route('cuentas-contables.index-importar-excel')}}" class="bg-[#0A415F] hover:bg-[#083549] text-white px-6 py-2 rounded-md text-sm font-medium transition-colors duration-200 flex items-center">
                        <i class="material-icons mr-2">cloud_upload</i>
                        Ir a importación
                    </a>
                </div>
            </div>
        </div>
    </div>
</div>



<div class="modal fade draggable" id="modal-generar-xml-cuentas-contables" tabindex="-1" role="dialog" aria-hidden="true" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog modal-sm" role="document">
        <div class="modal-content">
            <div class="modal-header bg-gray-50 border-b border-gray-200 px-6 py-4">
                <h5 class="modal-title text-lg font-semibold text-gray-900">Generar XML de cuentas contables</h5>
            </div>
            <div class="modal-body p-6">
                <div class="grid grid-cols-12 gap-4">
                    <div class="col-span-12">
                        <label class="block text-sm font-medium text-gray-700 mb-1">Mes: <span class="text-red-500">*</span></label>
                        <input type="month" id="mes-generar-xml" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" required>
                    </div>
                </div>
            </div>
            <div class="modal-footer px-6 py-4 bg-gray-50 border-t border-gray-200">
                <button type="button" class="bg-transparent text-red-500 hover:text-red-600 mr-2 px-4 py-2 rounded-md text-sm font-medium transition-colors duration-200" data-dismiss="modal">Cerrar</button>
                <button type="button" class="bg-[#0A415F] hover:bg-[#083549] text-white px-4 py-2 rounded-md text-sm font-medium transition-colors duration-200" onclick="generarXMlCuentasContables()">Generar XML</button>
            </div>
        </div>
    </div>
</div>



<input type="hidden" id="compl_hidden" value="0">

<style>
    .select2-container {
        width: 100% !important;
    }

    .select2-container .select2-selection--single {
        height: 40px !important;
    }

    .select2-container .select2-selection--single .select2-selection__rendered {
        line-height: 40px !important;
    }

    /* Estilos para la tabla */
    .cuenta-fila {
        transition: background-color 0.2s ease;
    }

    .cuenta-fila:hover {
        background-color: #f8fafc;
    }

    .cuenta-fila.nivel-indent {
        background-color: #fafbfc;
    }

    .cuenta-fila.nivel-indent:hover {
        background-color: #f1f5f9;
    }

    /* Estilos para los botones de acción */
    .btn-accion {
        padding: 0.25rem;
        border-radius: 0.375rem;
        transition: all 0.2s ease;
        border: none;
        background: transparent;
        cursor: pointer;
    }

    .btn-accion:hover {
        background-color: #f3f4f6;
        transform: scale(1.1);
    }

    /* Estilos para los badges de estatus */
    .estatus-badge {
        padding: 0.25rem 0.5rem;
        border-radius: 0.375rem;
        font-size: 0.75rem;
        font-weight: 500;
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

    .estatus-activo {
        background-color: #dcfce7;
        color: #166534;
    }

    .estatus-inactivo {
        background-color: #fef3c7;
        color: #92400e;
    }

    /* Estilos para el indentado de niveles */
    .nivel-indent td:first-child {
        border-left: 3px solid #e5e7eb;
    }

    /* Estilos para la tabla responsive */
    .overflow-x-auto {
        border-radius: 0.5rem;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    }

    /* Estilos para los iconos de carpeta y documento */
    .material-icons {
        font-size: 1rem;
    }

    /* Estilos para el hover de las filas */
    .cuenta-fila:hover td {
        background-color: #f8fafc;
    }

    /* Estilos para filas expandidas */
    .cuenta-fila.expanded {
        background-color: #f0f9ff;
    }

    .cuenta-fila.expanded:hover {
        background-color: #e0f2fe;
    }

    /* Estilos para el indentado visual */
    .cuenta-fila[data-nivel="2"] td:first-child {
        border-left: 3px solid #dbeafe;
    }

    .cuenta-fila[data-nivel="3"] td:first-child {
        border-left: 3px solid #bfdbfe;
    }

    .cuenta-fila[data-nivel="4"] td:first-child {
        border-left: 3px solid #93c5fd;
    }

    .cuenta-fila[data-nivel="5"] td:first-child {
        border-left: 3px solid #60a5fa;
    }

    /* Estilos para reducir padding y tamaño de letra */
    .cuenta-fila td {
        padding: 0.5rem 0.75rem !important;
        font-size: 0.875rem !important;
    }

    .cuenta-fila .cuenta-codigo {
        font-size: 0.875rem !important;
        font-weight: 600;
    }

    .cuenta-fila .cuenta-descripcion {
        font-size: 0.8rem !important;
    }

    /* Estilos para el buscador */
    #buscador-cuentas {
        transition: all 0.2s ease;
        border: 2px solid #e5e7eb;
        padding-left: 3rem !important;
        /* Espacio para el icono de búsqueda */
        padding-right: 8rem !important;
        /* Espacio para el contador y botón de limpiar */
    }

    #buscador-cuentas:focus {
        box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
        border-color: #3b82f6;
    }

    #buscador-cuentas::placeholder {
        color: #9ca3af;
        font-style: italic;
    }

    /* Icono de búsqueda */
    #buscador-cuentas+.relative>.absolute:first-of-type {
        left: 1rem;
        z-index: 10;
    }

    /* Contador de resultados */
    #contador-resultados {
        font-size: 0.75rem;
        font-weight: 500;
        background: linear-gradient(135deg, #f3f4f6 0%, #e5e7eb 100%);
        border: 1px solid #d1d5db;
        transition: all 0.2s ease;
        min-width: 4rem;
        text-align: center;
        z-index: 5;
    }

    /* Botón de limpiar */
    #btn-limpiar-busqueda {
        transition: all 0.2s ease;
        border-radius: 50%;
        width: 24px;
        height: 24px;
        display: flex;
        align-items: center;
        justify-content: center;
        right: 5rem !important;
        z-index: 15;
    }

    #btn-limpiar-busqueda:hover {
        background-color: #f3f4f6;
        transform: scale(1.1);
    }

    /* Asegurar que no haya solapamientos */
    .relative {
        position: relative;
    }

    .relative input {
        position: relative;
        z-index: 1;
    }

    /* Estilos para el mensaje de no resultados */
    #mensaje-no-resultados td {
        background-color: #f9fafb;
        border-left: 4px solid #f59e0b;
    }

    #mensaje-no-resultados .material-icons {
        font-size: 3rem;
        margin-bottom: 0.5rem;
    }

    /* Estilos para el select de cuenta padre */
    #select-cuenta-padre {
        border: 2px solid #e5e7eb;
        transition: all 0.2s ease;
    }

    #select-cuenta-padre:focus {
        border-color: #3b82f6;
        box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
    }

    .table-scroll {
        max-height: 600px;
        overflow-y: auto;
        width: 100%;
    }
</style>
@endsection


@push('js')
<script>
    $(document).ready(function() {

        $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
        });

        var existCuentas = @json($data['existCuentas']);
        if (existCuentas == false) {
            $('#modal-redireccion-importacion').modal('show');
        }

        $('.select2').select2({
            placeholder: "-Selecciona-",
            width: '100%',
        });

        // Inicializar Select2 para el modal de agregar cuenta hija
        $('#modal-agregar-cuenta-hija .select2-modal').select2({
            placeholder: "-Selecciona-",
            width: '100%',
            dropdownParent: $('#modal-agregar-cuenta-hija')
        });

        $('#modal-generar-xml-cuentas-contables .select2').select2({
            placeholder: "-Selecciona-",
            width: '100%',
            dropdownParent: $('#modal-generar-xml-cuentas-contables')
        });

        // Inicializar el buscador
        inicializarBuscador();

        // Limpiar modal cuando se cierre
        $('#modal-agregar-cuenta-hija').on('hidden.bs.modal', function() {
            limpiarModalNuevaCuenta();
        });
    });

    function inicializarBuscador() {
        $('#buscador-cuentas').on('input', function() {
            const termino = $(this).val().toLowerCase();
            filtrarTabla(termino);
            actualizarContadorResultados();
        });

        // Agregar funcionalidad de búsqueda con Enter
        $('#buscador-cuentas').on('keypress', function(e) {
            if (e.which === 13) { // Enter key
                e.preventDefault();
                const termino = $(this).val().toLowerCase();
                filtrarTabla(termino);
                actualizarContadorResultados();
            }
        });

        // Agregar botón de limpiar búsqueda
        $('#buscador-cuentas').on('input', function() {
            if ($(this).val().length > 0) {
                if ($('#btn-limpiar-busqueda').length === 0) {
                    $(this).parent().append('<button id="btn-limpiar-busqueda" class="absolute  mt-2 inset-y-0 right-20 flex items-center text-gray-400 hover:text-gray-600" onclick="limpiarBusqueda()"><i class="material-icons text-sm">clear</i></button>');
                }
            } else {
                $('#btn-limpiar-busqueda').remove();
            }
        });
    }

    function filtrarTabla(termino) {
        let filasVisibles = 0;
        const totalFilas = $('.cuenta-fila').length;

        $('.cuenta-fila').each(function() {
            const $fila = $(this);
            const cuenta = $fila.find('.cuenta-codigo').text().toLowerCase();
            const descripcion = $fila.find('.cuenta-descripcion').text().toLowerCase();
            const agrupador = $fila.find('td:eq(3)').text().toLowerCase();
            const tipo = $fila.find('td:eq(2)').text().toLowerCase();
            const moneda = $fila.find('td:eq(4)').text().toLowerCase();
            const cuentaComplementaria = $fila.find('td:eq(5)').text().toLowerCase(); // Filtrar por cuenta complementaria

            const coincide = cuenta.includes(termino) ||
                descripcion.includes(termino) ||
                agrupador.includes(termino) ||
                tipo.includes(termino) ||
                moneda.includes(termino) ||
                cuentaComplementaria.includes(termino); // Incluir la cuenta complementaria en la búsqueda

            if (termino === '' || coincide) {
                $fila.show();
                filasVisibles++;
            } else {
                $fila.hide();
            }
        });

        // Actualizar contador de resultados
        $('#contador-resultados').text(`${filasVisibles} de ${totalFilas}`);

        // Mostrar mensaje si no hay resultados
        if (termino !== '' && filasVisibles === 0) {
            if ($('#mensaje-no-resultados').length === 0) {
                $('#tabla-cuentas-contables').append(`
                    <tr id="mensaje-no-resultados">
                        <td colspan="7" class="text-center py-8 text-gray-500">
                            <i class="material-icons text-gray-400 text-4xl mb-2">search_off</i>
                            <p>No se encontraron cuentas que coincidan con "${termino}"</p>
                        </td>
                    </tr>
                `);
            }
        } else {
            $('#mensaje-no-resultados').remove();
        }
    }

    function actualizarContadorResultados() {
        const filasVisibles = $('.cuenta-fila:visible').length;
        const totalFilas = $('.cuenta-fila').length;
        $('#contador-resultados').text(`${filasVisibles} de ${totalFilas}`);
    }

    function limpiarBusqueda() {
        $('#buscador-cuentas').val('');
        filtrarTabla('');
        actualizarContadorResultados();
        $('#btn-limpiar-busqueda').remove();
        $('#mensaje-no-resultados').remove();
    }

    function limpiarModalNuevaCuenta() {
        $('#select-cuenta-padre').val('').trigger('change');
        $('#cuenta_contable_hija').val('');
        $('#codigo_agrupador_sat_hija').val('').trigger('change');
        $('#cuenta_complementaria_hija').val('').trigger('change');
        $('#numero_cuenta_hija').val('');
        cuentaPadreId = '';
        cuentaContableId = '';
    }

    function getCuentasContables() {
        var cuentaAgrupadoraFilter = $('#cuentaAgrupadoraFilter option:selected').val();

        $('#tabla-cuentas-contables').html(`
            <tr style="text-align: center;">
                <td colspan="7" class="text-center py-8 align-middle" style="vertical-align: middle;">
                    <div style="display: flex; flex-direction: column; align-items: center; justify-content: center;">
                        <svg class="animate-spin h-10 w-10 text-blue-700 mb-2 mx-auto" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
                            <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
                            <path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8v4a4 4 0 00-4 4H4z"></path>
                        </svg>
                        <span class="text-lg font-semibold text-blue-700 text-center">Cargando cuentas...</span>
                    </div>
                </td>
            </tr>
        `);

        $.ajax({
            url: "{{route('cuentas-contables.get-cuentas-contables')}}",
            type: "POST",
            data: {
                cuentaAgrupadoraFilter: cuentaAgrupadoraFilter,
            },
            success: function(response) {
                renderizarTabla(response);
                // Mostrar el buscador y los botones de exportar después de cargar las cuentas
                $('#buscador-container').show();
                $('.btn-exportar').show();
                // Limpiar el buscador y actualizar contador
                $('#buscador-cuentas').val('');
                actualizarContadorResultados();
            },
            error: function() {
                $('#tabla-cuentas-contables').html('<tr><td colspan="7" class="text-center py-8"><i class="material-icons text-red-400 text-4xl mb-2">error</i><p class="text-red-500">Error al cargar las cuentas</p></td></tr>');
            }
        });
    }

    function renderizarTabla(cuentas) {
        if (!cuentas || cuentas.length === 0) {
            $('#tabla-cuentas-contables').html('<tr><td colspan="7" class="text-center py-8"><i class="material-icons text-gray-400 text-4xl mb-2">folder_open</i><p class="text-gray-500">No se encontraron cuentas</p></td></tr>');
            return;
        }

        let html = '';
        cuentas.forEach(function(cuenta, index) {
            html += generarFilaTabla(cuenta, index);
        });

        $('#tabla-cuentas-contables').html(html);

        // Inicializar eventos de la tabla
        inicializarEventosTabla();
    }

    function generarFilaTabla(cuenta, index) {
        const esGrupo = cuenta.es_grupo;
        const tieneHijas = cuenta.hijas && Array.isArray(cuenta.hijas) && cuenta.hijas.length > 0;
        const lengthHijas = tieneHijas ? cuenta.hijas.length : 0;
        const lastHijaNumeroCuenta = tieneHijas ? cuenta.hijas[cuenta.hijas.length - 1].numero_cuenta : '';

        let html = '';

        // Fila principal de la cuenta
        html += `
            <tr class="cuenta-fila ${cuenta.nivel > 1 ? 'nivel-indent' : ''}" data-cuenta-id="${cuenta.id}" data-nivel="${cuenta.nivel || 1}">
                <td class="px-3 py-2 text-left text-sm font-medium text-gray-900">
                    <div class="flex items-center gap-2" style="margin-left: ${((cuenta.nivel || 1) - 1) * 20}px;">
                        ${esGrupo ? '<i class="material-icons text-blue-600">folder</i>' : '<i class="material-icons text-gray-500">description</i>'}
                        <span class="cuenta-codigo">${cuenta.cuenta}</span>
                        <span class="cuenta-descripcion text-gray-600"></span>
                    </div>
                </td>
                <td class="px-3 py-2 text-right text-sm text-gray-500">
                    ${cuenta.numero_cuenta || 'N/A'}
                </td>
                <td class="px-3 py-2 text-left text-sm text-gray-500">
                    ${cuenta.tipo_cuenta || 'No especificado'}
                </td>
                <td class="px-3 py-2 text-left text-sm text-gray-500">
                    ${cuenta.agrupador_sat ? cuenta.agrupador_sat : 'No asignado'}
                    ${cuenta.agrupador && cuenta.agrupador.descripcion ? `<br><span class="text-gray-400 ">${cuenta.agrupador.descripcion}</span>` : ''}
                </td>
                <td class="px-3 py-2 text-left text-sm text-gray-500">
                    ${cuenta.moneda && cuenta.moneda.nombre ? cuenta.moneda.nombre : 'No definida'}
                </td>
                <td class="px-3 py-2 text-left text-sm text-gray-500">
                    ${cuenta.id_cuenta_contable_complementaria ? `${cuenta.cuentaComplementaria.cuenta}` : ''}
                </td>
                <td class="px-3 py-2 text-left text-sm text-gray-500">
                    <span class="estatus-badge ${cuenta.estatus === 'Activo' ? 'estatus-activo' : 'estatus-inactivo'}">${cuenta.estatus || 'Activo'}</span>
                </td>
                <td class="px-3 py-2 text-left text-sm text-gray-500">
                    <div class="flex items-center gap-2">
                        <button class="btn-accion btn-agregar" onclick="agregarCuentaHija(${cuenta.id}, '${cuenta.cuenta}', '${cuenta.numero_cuenta}','${cuenta.agrupador_sat}', ${lengthHijas}, '${lastHijaNumeroCuenta}')" title="Agregar cuenta hija">
                            <i class="material-icons text-sm text-blue-600">add</i>
                        </button>
                        <button class="btn-accion btn-editar" onclick="getCuenta(${cuenta.id})" title="Editar cuenta">
                            <i class="material-icons text-sm text-green-600">edit</i>
                        </button>
                        <button class="btn-accion btn-eliminar" onclick="eliminarCuenta(${cuenta.id})" title="Eliminar cuenta">
                            <i class="material-icons text-sm text-red-600">delete</i>
                        </button>
                        <button class="btn-accion btn-estatus" onclick="cambiarEstatus(${cuenta.id}, '${cuenta.estatus === 'Activo' ? 'Cancelado' : 'Activo'}')" title="${cuenta.estatus === 'Activo' ? 'Desactivar' : 'Activar'} cuenta">
                            <i class="material-icons text-sm ${cuenta.estatus === 'Activo' ? 'text-yellow-600' : 'text-green-600'}">${cuenta.estatus === 'Activo' ? 'visibility_off' : 'visibility'}</i>
                        </button>
                    </div>
                </td>
            </tr>
        `;

        // Si tiene hijas, agregar las filas de las cuentas hijas
        if (tieneHijas) {
            cuenta.hijas.forEach(function(hija, hijoIndex) {
                html += generarFilaTabla(hija, `${index}-${hijoIndex}`);
            });
        }

        return html;
    }

    function inicializarEventosTabla() {
        // No hay eventos de acordeón para la tabla, ya que la estructura es plana
        // Las acciones de editar, eliminar, cambiar estatus, etc. se manejan con botones
        // y la estructura de la tabla permite expandir/contraer filas.
    }

    function exportarCuentasContables(type) {
        var cuentaAgrupadoraFilter = $('#cuentaAgrupadoraFilter option:selected').val();
        $('#loadingLoad').modal('show');
        $.ajax({
            url: "{{route('cuentas-contables.exportar-cuentas-contables')}}",
            type: 'POST',
            data: {
                export: type,
                cuentaAgrupadoraFilter: cuentaAgrupadoraFilter
            },
            success: function(response) {
                if (response.success) {
                    // Crear un enlace temporal para descargar el archivo
                    var link = document.createElement('a');
                    link.href = response.file.url;
                    link.download = response.file.filename;
                    link.click();
                } else {
                    showNotification('error', 'top', 'center', 'danger', '¡ERROR!', 'Error al exportar el archivo.');
                }
            },
            error: function(xhr, status, error) {
                console.error('Error al exportar:', error);
                showNotification('error', 'top', 'center', 'danger', '¡ERROR!', 'Error al exportar el archivo.');
            },
            complete: function() {
                setTimeout(() => {
                    $('#loadingLoad').modal('hide');
                }, 2000);
            }
        });
    }

    var cuentaPadreId = '';
    var cuentaContableId = '';

    function agregarCuentaHija(cuentaPadre, cuentaPadreCuenta, cuentaPadreNumeroCuenta, agrupadorSat, lengthHijas, lastHijaNumeroCuenta) {
        cuentaPadreId = cuentaPadre;

        // Seleccionar automáticamente la cuenta padre en el select
        $('#select-cuenta-padre').val(cuentaPadre).trigger('change');

        if (lengthHijas > 0) {
            let siguienteValor = parseInt(lastHijaNumeroCuenta.slice(-1)) + 1;
            let nuevaCuenta = lastHijaNumeroCuenta.slice(0, -1) + siguienteValor;
            $('#numero_cuenta_hija').val(nuevaCuenta);
        } else {
            $('#numero_cuenta_hija').val(cuentaPadreNumeroCuenta);
        }

        // Limpiar campos del modal
        $('#cuenta_contable_hija').val('');
        $('#codigo_agrupador_sat_hija').val(agrupadorSat || '').trigger('change');
        $('#cuenta_complementaria_hija').val('').trigger('change'); // Limpiar cuenta complementaria

        // Cambiar el título del modal
        $('.modal-title').text('Agregar cuenta contable hija');

        $('#modal-agregar-cuenta-hija').modal('show');
    }

    function guardarCuentaHija() {
        var cuentaContable = $('#cuenta_contable_hija').val();
        var numeroCuenta = $('#numero_cuenta_hija').val();
        var codigoAgrupadorSat = $('#codigo_agrupador_sat_hija').val();
        var cuentaComplementaria = $('#cuenta_complementaria_hija').val(); // Obtener la cuenta complementaria
        var cuentaPadreSeleccionada = $('#select-cuenta-padre').val();

        // Validaciones
        if (cuentaContable == '' || numeroCuenta == '' || codigoAgrupadorSat == '') {
            showNotification('error', 'top', 'center', 'danger', '¡ERROR!', 'Debes completar todos los campos obligatorios.');
            return false;
        }

        // Si no hay cuentaPadreId (cuando se abre desde el botón global), usar la seleccionada del select
        if (!cuentaPadreId && cuentaPadreSeleccionada) {
            cuentaPadreId = cuentaPadreSeleccionada;
        }

        if (!cuentaPadreId) {
            showNotification('error', 'top', 'center', 'danger', '¡ERROR!', 'Debes seleccionar una cuenta padre.');
            return false;
        }

        $('#loadingLoad').modal('show');

        $.ajax({
                url: "{{ route('cuentas-contables.save-cuenta')}}",
                type: 'POST',
                dataType: 'json',
                data: {
                    id: cuentaContableId,
                    cuenta: cuentaContable,
                    numero_cuenta: numeroCuenta,
                    id_cuenta_padre: cuentaPadreId,
                    estatus: 'Activo',
                    codigoAgrupadorSat: codigoAgrupadorSat,
                    id_cuenta_contable_complementaria: cuentaComplementaria,
                },
            })
            .done(function(resp) {
                if (resp.status === 'success') {
                    showNotification('success', 'top', 'center', 'success', '¡HECHO!', resp.message);
                    $('#modal-agregar-cuenta-hija').modal('hide');

                    if (cuentaContableId) {
                        // Es una edición - actualizar la fila existente
                        actualizarFilaEnGrid(resp.cuenta);
                    } else {
                        // Es una nueva cuenta - obtener información completa y agregar al grid
                        if (resp.cuenta && resp.cuenta.id) {
                            obtenerInformacionCompletaCuenta(resp.cuenta.id)
                                .then(cuentaCompleta => {
                                    agregarCuentaAlGrid(cuentaCompleta);
                                })
                                .catch(error => {
                                    console.error('Error al obtener información completa:', error);
                                    // Si falla, recargar todo
                                    getCuentasContables();
                                });
                        } else {
                            // Si no hay información de la cuenta, recargar todo
                            getCuentasContables();
                        }
                    }

                    // Limpiar el modal
                    limpiarModalNuevaCuenta();
                    return false;
                }
                showNotification('error', 'top', 'center', 'danger', '¡ERROR!', resp.message);
            })
            .fail(function() {
                showNotification('error', 'top', 'center', 'danger', '¡ERROR!', 'Error al guardar la cuenta contable.');
            })
            .always(function() {
                setTimeout(() => {
                    $('#loadingLoad').modal('hide');
                }, 2000);
            });
    }

    function obtenerInformacionCompletaCuenta(id) {
        console.log('Obteniendo información completa para cuenta ID:', id);
        return new Promise((resolve, reject) => {
            $.ajax({
                    url: "{{ route('cuentas-contables.get-cuenta-contable')}}",
                    type: 'POST',
                    dataType: 'json',
                    data: {
                        id: id
                    },
                })
                .done(function(resp) {
                    console.log('Respuesta del servidor para cuenta completa:', resp);
                    if (resp.data) {
                        resolve(resp.data);
                    } else {
                        reject('No se recibieron datos de la cuenta');
                    }
                })
                .fail(function(xhr, status, error) {
                    console.error('Error AJAX al obtener cuenta completa:', {
                        xhr,
                        status,
                        error
                    });
                    reject('Error al obtener información de la cuenta: ' + error);
                });
        });
    }

    function agregarCuentaAlGrid(cuentaNueva) {
        // Asegurar que la cuenta tenga las propiedades necesarias
        if (!cuentaNueva || !cuentaNueva.id) {
            console.error('Cuenta nueva inválida:', cuentaNueva);
            getCuentasContables();
            return;
        }

        // Obtener información de la cuenta padre para determinar la posición
        const cuentaPadreId = cuentaNueva.id_cuenta_padre;
        const $filaPadre = $(`[data-cuenta-id="${cuentaPadreId}"]`);

        if ($filaPadre.length === 0) {
            // Si no se encuentra la cuenta padre, recargar todo
            console.warn('No se encontró la cuenta padre:', cuentaPadreId);
            getCuentasContables();
            return;
        }

        // Determinar el nivel de la nueva cuenta (nivel padre + 1)
        const nivelPadre = parseInt($filaPadre.attr('data-nivel')) || 1;
        const nivelNuevo = nivelPadre + 1;

        // Crear la nueva fila con el nivel correcto y propiedades por defecto
        const cuentaParaGrid = {
            ...cuentaNueva,
            nivel: nivelNuevo,
            hijas: cuentaNueva.hijas || [],
            es_grupo: cuentaNueva.es_grupo || false,
            tipo_cuenta: cuentaNueva.tipo_cuenta || 'No especificado',
            agrupador_sat: cuentaNueva.agrupador_sat || null,
            agrupador: cuentaNueva.agrupador || null,
            moneda: cuentaNueva.moneda || null,
            estatus: cuentaNueva.estatus || 'Activo'
        };

        const nuevaFila = generarFilaTabla(cuentaParaGrid, 'nueva');

        // Buscar la posición correcta para insertar (después de la cuenta padre y sus hijas)
        let $posicionInsercion = $filaPadre;

        // Si la cuenta padre tiene hijas, insertar después de la última hija
        let $siguienteFila = $filaPadre.next();
        while ($siguienteFila.length > 0 &&
            $siguienteFila.hasClass('cuenta-fila') &&
            parseInt($siguienteFila.attr('data-nivel')) > nivelPadre) {
            $posicionInsercion = $siguienteFila;
            $siguienteFila = $siguienteFila.next();
        }

        // Insertar la nueva fila en la posición correcta
        $posicionInsercion.after(nuevaFila);

        // Actualizar contador de resultados si hay búsqueda activa
        if ($('#buscador-cuentas').val()) {
            actualizarContadorResultados();
        }

        // Mostrar notificación de éxito
        //showNotification('success', 'top', 'center', 'success', '¡ÉXITO!', 'Cuenta agregada exitosamente al grid.');
    }

    function actualizarFilaEnGrid(cuentaActualizada) {
        // Buscar la fila existente por ID
        const $filaExistente = $(`[data-cuenta-id="${cuentaActualizada.id}"]`);

        if ($filaExistente.length === 0) {
            // Si no se encuentra la fila, recargar todo
            getCuentasContables();
            return;
        }

        // Actualizar los datos de la fila
        $filaExistente.find('.cuenta-codigo').text(cuentaActualizada.cuenta);
        $filaExistente.find('.cuenta-descripcion').text(` | ${cuentaActualizada.numero_cuenta}`);
        $filaExistente.find('td:eq(1)').text(cuentaActualizada.numero_cuenta || 'N/A');
        $filaExistente.find('td:eq(2)').text(cuentaActualizada.tipo_cuenta || 'No especificado');

        // Actualizar agrupador SAT
        let agrupadorText = cuentaActualizada.agrupador_sat ? cuentaActualizada.agrupador_sat : 'No asignado';
        if (cuentaActualizada.agrupador && cuentaActualizada.agrupador.descripcion) {
            agrupadorText += `<br><span class="text-gray-400">${cuentaActualizada.agrupador.descripcion}</span>`;
        }
        $filaExistente.find('td:eq(3)').html(agrupadorText);

        // Actualizar moneda
        $filaExistente.find('td:eq(4)').text(cuentaActualizada.moneda ? cuentaActualizada.moneda.nombre : 'No definida');

        // Actualizar cuenta complementaria
        const cuentaComplementariaText = cuentaActualizada.id_cuenta_contable_complementaria ?
            `(${cuentaActualizada.numero_cuenta_complementaria}) ${cuentaActualizada.cuenta_complementaria}` :
            '';
        $filaExistente.find('td:eq(5)').text(cuentaComplementariaText);

        // Actualizar estatus si cambió
        if (cuentaActualizada.estatus) {
            const estatusClass = cuentaActualizada.estatus === 'Activo' ? 'estatus-activo' : 'estatus-inactivo';
            $filaExistente.find('.estatus-badge').removeClass('estatus-activo estatus-inactivo').addClass(estatusClass).text(cuentaActualizada.estatus);
        }

        // Actualizar contador de resultados si hay búsqueda activa
        if ($('#buscador-cuentas').val()) {
            actualizarContadorResultados();
        }

        // Mostrar notificación de éxito
        //showNotification('success', 'top', 'center', 'success', '¡ÉXITO!', 'Cuenta actualizada exitosamente en el grid.');
    }

    function nuevaCuenta() {
        $('#modal-cuentas-contables').modal('show');
        limpiarModal();

    }

    function getCuenta(id) {
        $.ajax({
                url: "{{ route('cuentas-contables.get-cuenta-contable')}}",
                type: 'POST',
                dataType: 'json',
                data: {
                    id: id,

                },
            })
            .done(function(resp) {
                $('.modal-title').text('Actualizar cuenta contable');
                cuentaContableId = id;
                cuentaPadreId = resp.data['padre']['id'];
                $('#cuenta_contable_hija').val(resp.data['cuenta']);
                $('#codigo_agrupador_sat_hija').val(resp.data['agrupador_sat']).trigger('change');
                $('#cuenta_complementaria_hija').val(resp.data['id_cuenta_contable_complementaria']).trigger('change');
                $('#numero_cuenta_hija').val(resp.data['numero_cuenta']);
                $('#select-cuenta-padre').val(resp.data['padre']['id']);
                $('#modal-agregar-cuenta-hija').modal('show');
            })

            .fail(function() {
                console.log("error");
            })
            .always(function() {
                console.log("complete");
            });
    }

    function eliminarCuenta(id) {
        Swal.fire({
            title: '¿Estás seguro de eliminar?',
            text: "Esta acción no es reversible",
            icon: 'warning',
            showCancelButton: true,
            confirmButtonColor: '#3085d6',
            cancelButtonColor: '#d33',
            cancelButtonText: 'Cancelar',
            confirmButtonText: 'Sí, eliminado'
        }).then((result) => {
            if (result.value) {
                $('#loadingLoad').modal('show');
                $.ajax({
                        url: "{{ route('cuentas-contables.delete-cuenta')}}",
                        type: 'POST',
                        dataType: 'json',
                        data: {
                            id: id,
                        },
                    })
                    .done(function(resp) {
                        if (resp.status == 'success') {
                            showNotification('success', 'top', 'center', 'success', '¡HECHO!', resp.mensaje);

                            // Eliminar la fila del grid dinámicamente
                            const $filaEliminada = $(`[data-cuenta-id="${id}"]`);
                            if ($filaEliminada.length > 0) {
                                $filaEliminada.remove();

                                // Actualizar contador de resultados si hay búsqueda activa
                                if ($('#buscador-cuentas').val()) {
                                    actualizarContadorResultados();
                                }
                            }

                            return false;
                        }
                        showNotification('error', 'top', 'center', 'danger', '¡ERROR!', resp.mensaje);

                    })
                    .fail(function() {
                        console.log("error");
                    })
                    .always(function() {
                        console.log("complete");
                        setTimeout(() => {
                            $('#loadingLoad').modal('hide');
                        }, 2000);
                    });
            }
        })
    }

    function cambiarEstatus(id, tipo) {

        //Si es tipo 1 es para desactivar, si es tipo 2 es para activar
        var mensaje = '';
        var estatus = '';
        if (tipo == 'Cancelado') {
            mensaje = '¿Estás seguro de desactivar?';
            estatus = 'Cancelado';
        } else {
            mensaje = '¿Estás seguro de activar?';
            estatus = 'Activo';
        }

        Swal.fire({
            title: mensaje,
            showCancelButton: true,
            confirmButtonColor: '#3085d6',
            cancelButtonColor: '#d33',
            cancelButtonText: 'Cancelar',
            confirmButtonText: 'Sí',
            icon: 'warning'
        }).then((result) => {
            if (result.value) {
                $('#loadingLoad').modal('show');
                $.ajax({
                        url: "{{ route('cuentas-contables.cambiar-estatus')}}",
                        type: 'POST',
                        dataType: 'json',
                        data: {
                            id: id,
                            estatus: estatus,
                        },
                    })
                    .done(function(resp) {
                        if (resp.status == 'success') {

                            showNotification('success', 'top', 'center', 'success', '¡HECHO!', resp.mensaje);

                            // Actualizar el estatus en el grid dinámicamente
                            const $fila = $(`[data-cuenta-id="${id}"]`);
                            if ($fila.length > 0) {
                                const $estatusBadge = $fila.find('.estatus-badge');
                                $estatusBadge.removeClass('estatus-activo estatus-inactivo');

                                if (estatus === 'Activo') {
                                    $estatusBadge.addClass('estatus-activo').text('Activo');
                                } else {
                                    $estatusBadge.addClass('estatus-inactivo').text('Cancelado');
                                }

                                // Actualizar contador de resultados si hay búsqueda activa
                                if ($('#buscador-cuentas').val()) {
                                    actualizarContadorResultados();
                                }
                            }

                            return false;
                        }
                        showNotification('error', 'top', 'center', 'danger', '¡ERROR!', resp.mensaje);

                    })
                    .fail(function() {
                        console.log("error");
                    })
                    .always(function() {
                        console.log("complete");
                        setTimeout(() => {
                            $('#loadingLoad').modal('hide');
                        }, 2000);
                    });
            }
        })
    }

    function generarXMlCuentasContables() {

        $('#loadingLoad').modal('show');
        $.ajax({
                url: "{{ route('cuentas-contables.generar-xml-cuentas-contables')}}",
                type: 'POST',
                dataType: 'json',
                data: {
                    mes: $('#mes-generar-xml').val(),
                }
            })
            .done(function(resp) {
                $('#loadingLoad').modal('hide');
                if (resp.success) {
                    Swal.fire({
                        icon: 'success',
                        title: '¡ÉXITO!',
                        text: resp.message
                    });

                    // Crear elemento temporal para descargar XML
                    if (resp.file) {
                        let linkXML = document.createElement('a');
                        linkXML.href = resp.file;
                        linkXML.download = resp.fileName;
                        document.body.appendChild(linkXML);
                        linkXML.click();
                        document.body.removeChild(linkXML);
                    }

                    // Crear elemento temporal para descargar TXT si existe
                    if (resp.cuentaSinCodigoAgrupador) {
                        let linkTXT = document.createElement('a');
                        linkTXT.href = resp.cuentaSinCodigoAgrupador;
                        linkTXT.download = 'CuentasSinCodigoAgrupador.txt';
                        document.body.appendChild(linkTXT);
                        linkTXT.click();
                        document.body.removeChild(linkTXT);
                    }
                } else {
                    Swal.fire({
                        icon: 'error',
                        title: '¡ERROR!',
                        text: resp.message
                    });
                }
            })
            .fail(function() {
                $('#loadingLoad').modal('hide');
                Swal.fire({
                    icon: 'error',
                    title: '¡ERROR!',
                    text: 'Error al generar el XML'
                });
            }).always(function() {
                setTimeout(() => {
                    $('#loadingLoad').modal('hide');
                }, 2000);
            });
    }

    function abrirModalNuevaCuentaGlobal() {
        // Limpiar el modal antes de abrirlo
        limpiarModalNuevaCuenta();

        // Cambiar el título del modal
        $('.modal-title').text('Agregar cuenta contable');

        $('#modal-agregar-cuenta-hija').modal('show');
    }

    function actualizarNumeroCuenta() {
        const selectedOption = $('#select-cuenta-padre').find('option:selected');
        const agrupadorSat = selectedOption.data('agrupador-sat');
        if (selectedOption.val() !== '') {
            const numero = selectedOption.data('numero');
            $('#numero_cuenta_hija').val(numero);
            $('#codigo_agrupador_sat_hija').val(agrupadorSat).change();
        } else {
            $('#numero_cuenta_hija').val('');
        }
    }
</script>
@endpush