@extends('layouts.default')
@section('content')
<!-- Modal Accion Factura -->
<div class="modal fade" id="accionFactura" tabindex="-1" role="dialog" data-bs-backdrop="static" data-bs-keyboard="false" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
        <div class="modal-header">
            <h5 class="modal-title" id="accionFacturaLabel">Descarga y envío de Factura</h5>
        </div>
        <div class="modal-body">  
            <div class="row">       
                <div class="col-6 col-sm-6 col-md-3 col-lg-3 col-xl-3">
                    <button class="btn btn-info" onclick="descargar('xml')"><i class="fa fa-file-code" style="font-size:40px"></i><br/>Descargar XML</button>
                    <input type="hidden" id="seriefolio"/>
                </div>
                <div class="col-6 col-sm-6 col-md-3 col-lg-3 col-xl-3">
                    <button class="btn btn-danger" onclick="descargar('pdf')"><i class="fa fa-file-pdf" style="font-size:40px"></i><br/>Descargar PDF</button>
                </div>
                <div class="col-12 col-sm-12 col-md-6 col-lg-6 col-xl-6">
                    <div class="form-group">
                        <label style="font-size:1.1em">Correo del cliente:</label>
                        <div style="text-align:right"><input type="text" style="border:#888 1px solid; margin-bottom:5px; padding: 5px; width:100%" id="correocliente"></div>
                        <div><button class="btn btn-primary btn-sm" onclick="enviarFactura()">Enviar</button>&nbsp;&nbsp;<span sytle="" id="mensajeMail"></span></div>
                    </div>
                </div>
            </div> 
        </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-secondary" id="accionFacturaClose" data-bs-dismiss="modal">Cerrar</button>
        </div>
        </div>
    </div>
</div>
<!-- End Modal -->
<!-- Modal Forma de Pago -->
<div class="modal fade" id="modalCobro" tabindex="-1" role="dialog" aria-labelledby="modalCobroLabel" aria-hidden="true">
    <div class="modal-dialog modal-xl" role="document" style="max-width: 90%;">
        <div class="modal-content">
        <div class="modal-body">
            <div class="row">
                <div class="col-12 col-sm-12 col-md-12 col-lg-8 col-xl-8">
                    <div style="border: #eee 1px solid; width:100%">
                        <div style="display:inline-block; padding: 10px; background-color: #eee; width: 75px">
                            <i class="fa-regular fa-money-bill-wave" style="font-size:2.5em; color:#888"></i>
                        </div>
                        <div style="display:inline-block; padding: 10px; width: 200px">
                            <label>($) Efectivo:</label>
                            <input type="number" class="x-form-control" id="pagoEfectivo" autocomplete="off"/>
                        </div>
                        <div style="display:inline-block; padding: 10px; width: 200px">
                            <label>($) Deposito en Efectivo:</label>
                            <input type="number" class="x-form-control" id="pagoDepositoEfectivo" autocomplete="off" />
                        </div>
                    </div>                    
                    <div style="border: #eee 1px solid; width:100%">
                        <div style="display:inline-block; padding: 10px; background-color: #eee; width: 75px">
                            <i class="fa-regular fa-credit-card" style="font-size:2.5em; color:#888"></i>
                        </div>
                        <div style="display:inline-block; padding: 10px; width: 200px">
                                <label>($) Tarjeta Débito:</label>
                                <input type="text" class="x-form-control" id="pagoTD" autocomplete="off" />
                        </div>
                        <div style="display:inline-block; padding: 10px; width: 200px">
                                <label>Banco:</label>
                                <select class="x-form-control" id="pagoTDBanco">

                                </select>
                        </div>
                        <div style="display:inline-block; padding: 10px; width: 180px">
                                <label>Referencia:</label>
                                <input type="number" class="x-form-control" id="pagoTDreferencia" autocomplete="off" />
                        </div>
                    </div>                 
                    <div style="border: #eee 1px solid; width:100%">
                        <div style="display:inline-block; padding: 10px; background-color: #eee; width: 75px">
                            <i class="fa-regular fa-credit-card" style="font-size:2.5em; color:#888"></i>
                        </div>
                        <div style="display:inline-block; padding: 10px; width: 200px">
                                <label>($) Tarjeta Crédito:</label>
                                <input type="text" class="x-form-control" id="pagoTC" autocomplete="off" />
                        </div>
                        <div style="display:inline-block; padding: 10px; width: 200px">
                                <label>Banco:</label>
                                <select class="x-form-control" id="pagoTCBanco">
                                    
                                </select>
                        </div>
                        <div style="display:inline-block; padding: 10px; width: 180px">
                                <label>Opción de Pago:</label>
                                <select class="x-form-control" id="pagoTCmodo"><option value="1">Una exhibición</value></select>
                        </div>
                        <div style="display:inline-block; padding: 10px; width: 180px">
                                <label>Referencia:</label>
                                <input type="number" class="x-form-control" id="pagoTCreferencia" autocomplete="off" />
                        </div>
                    </div>
                    <div style="border: #eee 1px solid; width:100%">
                        <div style="display:inline-block; padding: 10px; background-color: #eee; width: 75px">
                            <i class="fa-regular fa-money-check-dollar" style="font-size:2.5em; color:#888"></i>
                        </div>
                        <div style="display:inline-block; padding: 10px; width: 200px">
                                <label>($) Cheque:</label>
                                <input type="number" class="x-form-control" id="pagoCheque" autocomplete="off" />
                        </div>
                        <div style="display:inline-block; padding: 10px; width: 200px">
                                <label>Banco:</label>
                                <select class="x-form-control" id="pagoChequeBanco">
                                    
                                </select>
                        </div>
                        <div style="display:inline-block; padding: 10px; width: 180px">
                                <label>Número:</label>
                                <input type="number" class="x-form-control" id="pagoChequeNum" autocomplete="off" />
                        </div>
                    </div>    
                    <div style="border: #eee 1px solid; width:100%">
                        <div style="display:inline-block; padding: 10px; background-color: #eee; width: 75px">
                            <i class="fa-regular fa-left-right" style="font-size:2.5em; color:#888"></i>
                        </div>
                        <div style="display:inline-block; padding: 10px; width: 200px">
                                <label>($) Transferencia:</label>
                                <input type="number" class="x-form-control" id="pagoTransfer" autocomplete="off" />
                        </div>
                        <div style="display:inline-block; padding: 10px; width: 200px">
                                <label>Banco:</label>
                                <select class="x-form-control" id="pagoTransferBanco">
                                    
                                </select>
                        </div>
                        <div style="display:inline-block; padding: 10px; width: 180px">
                                <label>Folio:</label>
                                <input type="number" class="x-form-control" id="pagoTransferFolio" autocomplete="off" />
                        </div>
                    </div>    
                    <div style="border: #eee 1px solid; width:100%">
                        <div style="display:inline-block; padding: 10px; background-color: #eee; width: 75px">
                            <i class="fa-regular fa-credit-card-blank" style="font-size:2.5em; color:#888"></i>
                        </div>
                        <div style="display:inline-block; padding: 10px; width: 200px">
                                <label>($) Monedero E.:</label>
                                <input type="number" class="x-form-control" id="pagoMonedero" autocomplete="off" />
                        </div>
                        <div style="display:inline-block; padding: 10px; width: 200px">
                                <label>Compañía:</label>
                                <select class="x-form-control" id="pagoMonederoComp">
                                    
                                </select>
                        </div>
                        <div style="display:inline-block; padding: 10px; width: 180px">
                                <label>ID:</label>
                                <input type="number" class="x-form-control" id="pagoMonederoID" autocomplete="off" />
                        </div>
                    </div>   
                </div>
                <div class="col-12 col-sm-12 col-md-12 col-lg-4 col-xl-4" style="font-size:1.5em">
                    <div class="row">
                        <div class="col-6" style="text-align: right; font-weight:bold; font-size:1.6em">TOTAL ($):</div>
                        <div class="col-6" style="text-align: right; font-weight:bold; font-size:1.6em" id="cobroTotal">0.00</div>
                    </div>
                    <hr/>
                    <div class="row" id="divCobroEfectivo" style="display:none">
                        <div class="col-6" style="text-align: right; font-weight:bold; color:#6b6a6a">EFECTIVO ($):</div>
                        <div class="col-6" style="text-align: right; font-weight:bold; color:#6b6a6a" id="cobroEfectivo">0.00</div>
                    </div>
                    <div class="row" id="divCobroDepositoEfectivo" style="display:none">
                        <div class="col-6" style="text-align: right; font-weight:bold; color:#6b6a6a">DEP. EFECT. ($):</div>
                        <div class="col-6" style="text-align: right; font-weight:bold; color:#6b6a6a" id="cobroDepositoEfectivo">0.00</div>
                    </div>
                    <div class="row" id="divCobroTD" style="display:none">
                        <div class="col-6" style="text-align: right; font-weight:bold; color:#6b6a6a">T. DEBITO ($):</div>
                        <div class="col-6" style="text-align: right; font-weight:bold; color:#6b6a6a" id="cobroTD">0.00</div>
                    </div>
                    <div class="row" id="divCobroTC" style="display:none">
                        <div class="col-6" style="text-align: right; font-weight:bold; color:#6b6a6a">T. CREDITO ($):</div>
                        <div class="col-6" style="text-align: right; font-weight:bold; color:#6b6a6a" id="cobroTC">0.00</div>
                    </div>
                    <div class="row" id="divCobroTransferencia" style="display:none">
                        <div class="col-6" style="text-align: right; font-weight:bold; color:#6b6a6a">TRANSFER. ($):</div>
                        <div class="col-6" style="text-align: right; font-weight:bold; color:#6b6a6a" id="cobroTransferencia">0.00</div>
                    </div>
                    <div class="row" id="divCobroCheque" style="display:none">
                        <div class="col-6" style="text-align: right; font-weight:bold; color:#6b6a6a">CHEQUE ($):</div>
                        <div class="col-6" style="text-align: right; font-weight:bold; color:#6b6a6a" id="cobroCheque">0.00</div>
                    </div>
                    <div class="row" id="divCobroMonedero" style="display:none">
                        <div class="col-6" style="text-align: right; font-weight:bold; color:#6b6a6a">MONEDERO ($):</div>
                        <div class="col-6" style="text-align: right; font-weight:bold; color:#6b6a6a" id="cobroMonedero">0.00</div>
                    </div>
                    <div class="row">
                        <div class="col-6" style="text-align: right; font-weight:bold; color:#fc1c03">FALTANTE ($):</div>
                        <div class="col-6" style="text-align: right; font-weight:bold; color:#fc1c03" id="cobroFaltante">0.00</div>
                    </div>
                    <div class="row">
                        <div class="col-6" style="text-align: right; font-weight:bold; color:#227d29">CAMBIO ($):</div>
                        <div class="col-6" style="text-align: right; font-weight:bold; color:#227d29" id="cobroCambio">0.00</div>
                    </div>
                </div>
            </div>
        </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-danger" id="modalCobroClose" onclick="cerrarCobro()">Cerrar</button>
            <button type="button" class="btn btn-success" onclick="generarCobro()">Aplicar Cobro</button>
        </div>
        </div>
    </div>
</div>
<!-- End Modal -->
<!-- Modal Forma de Pago -->
<div class="modal fade" id="modalMovimientos" data-bs-keyboard="false" data-bs-backdrop="static" tabindex="-1" aria-labelledby="modalMovimientosLabel" aria-hidden="true">
    <div class="modal-dialog modal-xl" role="document" style="max-width: 90%;">
        <div class="modal-content">
        <div class="modal-body">
            <div class="row">
                <div class="col-md-4">
                    <div style="border: #eee 1px solid; width:100%"> 
                        <div style="padding: 10px">                      
                            <div class="form-group">
                                <div class="input-group date datepicker" id="cajadpfecha">
									<input type="text" class="form-control" value="10/12/2025" id="cajaFecha" readonly>
                                    <span class="input-group-text input-group-addon"><i class="fa fa-calendar"></i></span>
								</div>
                            </div>
                        </div>  
                        <div style="padding: 10px">
                            <label>Sucursal:</label>
                            <select class="x-form-control" id="cajasucursal" onchange="changeSucursal()"></select>
                        </div>      
                        <div style="padding: 10px">
                            <label>Tipo de Movimiento:</label>
                            <select class="x-form-control" id="cajamovimiento"></select>
                        </div>                        
                        <div style="padding: 10px">
                            <label>Monto ($):</label>
                            <input type="number" class="x-form-control" id="cajamonto" autocomplete="off" />
                        </div>                      
                        <div style="padding: 10px">
                            <label>Observaciones:</label>
                            <textarea class="form-control" id="cajaobservaciones"></textarea>
                        </div>
                    </div>     
                </div>
                <div class="col-md-8">
                <div class="table-responsive">
                        <table id="tablaMovimientos" class="table">
                        <thead>
                            <tr>
                                <th>Almacen</th>
                                <th>Movimiento</th>
                                <th>Monto</th>
                                <th>Fecha</th>
                                <th>Observ</th>
                            </tr>
                        </thead>
                        <tbody>
                        </tbody>
                        </table>
                    </div>    
                </div>
            </div>
        </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-danger" id="modalMovimientosClose" onclick="cerrarMovimientos()">Cerrar</button>
            <button type="button" class="btn btn-success" onclick="generarMovimiento()" id="btnGeneraMovimiento">Guardar</button>
        </div>
        </div>
    </div>
</div>
<!-- End Modal -->
<!-- Modal Corte Caja -->
<div class="modal fade" id="modalCorteCaja" tabindex="-1" role="dialog" aria-labelledby="modalCorteCajaLabel" aria-hidden="true">
    <div class="modal-dialog modal-xl" role="document" style="max-width: 90%;">
        <div class="modal-content">
        <div class="modal-body">
            <div class="row">
                <div class="col-md-4">
                    <div class="form-group">
                        <label>Fecha:</label>
                        <div class="input-group date datepicker" id="cortedpfecha">
                            <input type="text" class="form-control" value="10/12/2025" id="cortefecha" >
                            <span class="input-group-text input-group-addon"><i class="fa fa-calendar"></i></span>
                        </div>
                    </div>
                </div>
                <div class="col-md-4"> 
                    <div style="padding: 10px">
                        <label>Sucursal:</label>
                        <select class="x-form-control" id="cortesucursal"></select>
                    </div>
                </div>
                <div class="col-md-4"> 
                    <div style="padding: 10px">
                        <label>Turno:</label>
                        <select class="x-form-control" id="corteturno"></select>
                    </div>
                </div>
            </div>
        </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-danger" id="modalMovimientosClose" onclick="cerrarCorte()">Cerrar</button>
            <button type="button" class="btn btn-secondary" onclick="generarPreCorteCaja()" id="btnAbrirPreCorte">Precorte</button>
            <button type="button" class="btn btn-success" onclick="generarCorteCaja()" id="btnAbrirCorte">Corte</button>
        </div>
        </div>
    </div>
</div>
<!-- End Modal -->
<!-- Modal Facturar Venta -->
<div class="modal fade" id="modalFacturar" data-bs-keyboard="false" data-bs-backdrop="static" tabindex="-1" aria-labelledby="staticBackdropLabel" aria-hidden="true">
    <div class="modal-dialog modal-xl" role="document" style="max-width: 90%;">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title" id="modalFacturarTitle" style="font-size:1.4em">Formulario de Facturación</h4>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-6 col-sm-6 col-md-6 col-lg-4 col-xl-4">     
                        <span class="x-label">Nombre o Razón Social:</span>
                        <div class="input-group">
                            <input type="text" style="display:none" id="factIdCliente">
                            <input type="text" style="display:none" id="factIdPersona">
                            <input type="text" style="display:none" id="factIdDireccion">
                            <input type="text" style="display:none" id="factTipoCliente">
                            <input type="text" class="form-control x-form-control-sm" style="padding:5px !important" id="factNombre" autocomplete="off" />
                            <div class="input-group-append">
                                <button class="btn btn-sm btn-secondary" type="button" data-bs-toggle="modal" data-bs-target="#selCliente" onclick="abreModalSelClientes()">
                                    <i class="mdi mdi-magnify" style="font-size:1em"></i>
                                </button>
                            </div>
                        </div>   
                    </div>
                    <!--<div class="col-md-4">
                        <div class="form-group">
                            <span class="x-label">Nombre o Razón Social:</span>
                            <input type="text" style="display:none" id="factIdCliente">
                            <input type="text" style="display:none" id="factIdPersona">
                            <input type="text" style="display:none" id="factIdDireccion">
                            <input type="text" style="display:none" id="factTipoCliente">
                            <input type="text" class="x-form-control" id="factNombre" autocomplete="off" />
                        </div>
                    </div>-->
                    <div class="col-6 col-sm-6 col-md-6 col-lg-4 col-xl-4">
                        <div class="form-group">
                            <span class="x-label">Régimen Fiscal:</span>
                            <select class="x-form-control" id="factRegimen"></select>
                        </div>
                    </div>
                    <div class="col-6 col-sm-6 col-md-6 col-lg-4 col-xl-4">
                        <div class="form-group">
                            <span class="x-label">Uso de CFDI:</span>
                            <select class="x-form-control" id="factCfdi"></select>
                        </div>
                    </div>
                    <div class="col-3 col-sm-3 col-md-3 col-lg-2 col-xl-2">
                        <div class="form-group">
                            <span class="x-label">RFC:</span>
                            <input type="text" maxlength="13" class="x-form-control text-uppercase" id="factRfc" autocomplete="off" />
                        </div>
                    </div>                  
                    <div class="col-3 col-sm-3 col-md-3 col-lg-2 col-xl-2">
                        <div class="form-group">
                            <span class="x-label">CURP:</span>
                            <input type="text" maxlength="18" class="x-form-control text-uppercase" id="factCurp" autocomplete="off" />
                        </div>
                    </div>
                    
                    <div class="col-3 col-sm-3 col-md-3 col-lg-2 col-xl-2">
                        <div class="form-group">
                            <span class="x-label">Telefono:</span>
                            <input type="number" maxlength="10" class="x-form-control" id="factTelefono" autocomplete="off"  />
                        </div>
                    </div>  
                    <div class="col-3 col-sm-3 col-md-3 col-lg-2 col-xl-2">                        
                        <div class="form-group">
                            <span class="x-label">Email:</span>
                            <input type="text" class="x-form-control" id="factEmail" autocomplete="off"/>
                        </div>
                    </div>
                    <div class="col-2 col-sm-2 col-md-2 col-lg-1 col-xl-1">
                        <div class="form-group">
                            <span class="x-label">C.P:</span>
                            <input type="number" maxlength="5" class="x-form-control" id="factCodigopostal" autocomplete="off"  />
                        </div>
                    </div>
                    <div class="col-4 col-sm-4 col-md-4 col-lg-3 col-xl-3">                        
                        <div class="form-group">
                            <span class="x-label">Calle:</span>
                            <input type="text" class="x-form-control" id="factCalle" autocomplete="off"/>
                        </div>
                    </div>
                    <div class="col-3 col-sm-3 col-md-3 col-lg-3 col-xl-3">
                        <div class="row">
                            <div class="col-6">                        
                                <div class="form-group">
                                    # Exterior:<br/>
                                    <input type="text" class="x-form-control" id="factNumExterior" autocomplete="off"/>
                                </div>
                            </div>
                            <div class="col-6">                        
                                <div class="form-group">
                                    # Interior:<br/>
                                    <input type="text" class="x-form-control" id="factNumInterior" autocomplete="off"/>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-3 col-sm-3 col-md-3 col-lg-2 col-xl-2">                        
                        <div class="form-group">
                            <span class="x-label">Colonia:</span>
                            <input type="text" class="x-form-control" id="factColonia" autocomplete="off"/>
                        </div>
                    </div>
                    <div class="col-2 col-sm-2 col-md-2 col-lg-2 col-xl-2">                        
                        <div class="form-group">
                            <span class="x-label">Pais:</span>
                            <select class="x-form-control" id="factPais" onchange="getEstados()">

                            </select>
                        </div>
                    </div>
                    <div class="col-2 col-sm-2 col-md-2 col-lg-2 col-xl-2">                        
                        <div class="form-group">
                            <span class="x-label">Estado:</span>
                            <select class="x-form-control" id="factEstado" onchange="getMunicipios()">

                            </select>
                        </div>
                    </div>
                    <div class="col-2 col-sm-2 col-md-2 col-lg-2 col-xl-2">                        
                        <div class="form-group">
                            <span class="x-label">Municipio:</span>
                            <select class="x-form-control" id="factMunicipio">

                            </select>
                        </div>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-danger" id="modalFacturarClose">Cerrar</button>
                <button type="button" class="btn btn-success" onclick="facturarVenta()" id="facturarVenta">Facturar</button>
            </div>
        </div>
    </div>
</div>
<!-- End Modal -->
<!-- Modal Clientes -->
<div class="modal fade" id="selCliente" tabindex="-1" role="dialog" aria-labelledby="selClienteLabel" aria-hidden="true">
    <div class="modal-dialog modal-xl" role="document" style="max-width: 90%;">
        <div class="modal-content">
        <div class="modal-header">
            <h5 class="modal-title" id="selClienteLabel">Seleccione un Cliente</h5>
            <div class="close" style="width:50%">
                <input type="text" class="form-control" id="searchCliente" placeholder="Escribe el nombre o clave del cliente" autocomplete="off" />
            </div>
        </div>
        <div class="modal-body">
            <div class="table-responsive" style="height:400px;overflow:auto">
                <table class="table table-striped">
                    <thead>
                        <tr>
                            <th>Clave</th>
                            <th>Nombre</th>
                            <th>RFC</th>
                            <th>Vendedor</th>
                        </tr>
                    </thead>
                    <tbody id="bodyClientes"></tbody>
                </table>
            </div>
        </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-secondary" id="selClienteClose" data-dismiss="modal">Cerrar</button>
        </div>
        </div>
    </div>
</div>
<!-- End Modal -->
<div class="row">
    <div class="col-12 col-md-8">
        <div class="card">
            <div class="card-body">
                <div class="col-md-12" style="text-align:right;display:none;padding:5px;color:red" id="msgTurno"></div>                
                <div class="row">
                    <div class="col-md-2">
                        <div class="form-group">
                            <span class="x-label">FOLIO:</span>
                            <input type="text" class="x-form-control" id="folio" placeholder="----" disabled autocomplete="off" />
                            <input type="text" style="display:none" id="idPedido">
                            <input type="text" style="display:none" id="iPedido">
                        </div>
                    </div>
                    <div class="col-md-4">
                        <div class="form-group">
                            <span class="x-label">Cliente:</span>
                            <input type="text" class="x-form-control" id="cliente" placeholder="" readonly autocomplete="off" />
                            <input type="text" style="display:none" id="clienteHidden">
                        </div>
                    </div>
                    <div class="col-3">
                        <div class="form-group">
                            <span class="x-label">Almacen:</span>
                            <input type="text" class="x-form-control" id="almacen" placeholder="" readonly autocomplete="off" />
                            <input type="text" style="display:none" id="almacenHidden">
                        </div>
                    </div>
                    <div class="col-3">
                        <div class="form-group">
                            <span class="x-label">Vendedor:</span>
                            <input type="text" class="x-form-control" id="vendedor" placeholder="" readonly autocomplete="off"  />
                            <input type="text" style="display:none" id="vendedorHidden">
                        </div>
                    </div>
                    <div class="col-3">                        
                        <div class="form-group">
                            <span class="x-label">Fecha:</span>
                            <input type="text" class="x-form-control" id="fecha" value=""  readonly autocomplete="off"/>
                        </div>
                    </div>
                    <div class="col-3">
                        <div class="form-group">
                            <span class="x-label">Tipo de Venta:</span>
                            <select class="x-form-control" id="metodopago" disabled></select>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="form-group">
                            <span class="x-label">Observaciones:</span>
                            <input type="text" class="x-form-control" id="observaciones" autocomplete="off" readonly></textarea>
                        </div>
                    </div>
                </div>
                <div class="row" style="height:300px; overflow:auto">
                    <table class="table table-striped">
                        <thead>
                            <tr>
                                <th>Imagen</th>
                                <th>Codigo</th>
                                <th style="white-space: nowrap;text-overflow: ellipsis;overflow: hidden">Descripcion</th>
                                <th>Precio U.</th>
                                <th>Cantidad</th>
                                <th>Descuento</th>
                                <th>Importe</th>
                                <th></th>
                            </tr>
                        </thead>
                        <tbody id="detalle">
                            
                        </tbody>
                    </table>
                </div>                
                <div class="row" style="padding-top:20px">
                    <div class="col-7 col-sm-7 col-md-7 col-lg-9 col-xl-9">
                        <div style="float:left; margin-right:5px">
                            <button type="button" class="btn btn-success" style="margin:3px; width:140px" onclick="cobrar()" id="btnCobrar" disabled>
                                <i class="mdi mdi-check" style="font-size:3.4em"></i>
                                <br/>
                                Cobrar
                            </button>                        
                            <!-- <button type="button" class="btn btn-danger" style="margin:3px" onclick="cancelar()" id="btnCancelar" disabled>
                            <i class="mdi mdi-close" style="font-size:3.4em"></i>
                            <br/>
                            Cancelar
                            </button>     -->
                        </div>
                        <div style="display:block">             
                            <button type="button" class="btn btn-danger btn-icon-text" style="margin:3px; width:140px" onclick="cancelar()" id="btnCancelar" disabled>
                                Cancelar
                                <i class="ti-trash btn-icon-append"></i>                                                                              
                            </button>                 
                            <button type="button" class="btn btn-info btn-icon-text" style="margin:3px; width:140px; display:none" onclick="openAcciones()" id="btnDescargar">
                                Descargar
                                <i class="mdi mdi-arrow-down-bold"></i>                                                                              
                            </button>            
                            <button type="button" class="btn btn-info btn-icon-text" style="margin:3px; width:140px" onclick="facturar(0)" id="btnFacturar" disabled>
                                Facturar
                                <i class="ti-receipt btn-icon-append"></i>                                                                              
                            </button>    
                            <button type="button" class="btn btn-warning btn-icon-text" style="margin:3px; width:140px" onclick="imprimirTicketCaja()" id="btnImprimir">
                                Imprimir
                            <i class="ti-printer btn-icon-append"></i>                                                                              
                            </button>
                            <button type="button" class="btn btn-light btn-icon-text" style="margin:3px; width:140px" onclick="reinicia()" >
                                Limpiar
                                <i class="ti-file btn-icon-append"></i>                                                                              
                            </button>   
                            <button type="button" class="btn btn-secondary btn-icon-text" style="margin:3px; width:140px" onclick="abrirMovimientos()" id="btnMovimientos">
                                Caja
                                <i class="ti-wallet btn-icon-append"></i>                                                                              
                            </button>
                            <button type="button" class="btn btn-primary btn-icon-text" style="margin:3px; width:140px" onclick="abrirCorteCaja()" id="btnCorteCaja">
                                Corte
                                <i class="ti-notepad btn-icon-append"></i>                                                                              
                            </button>
                        </div>
                    </div>
                    <div class="col-5 col-sm-5 col-md-5 col-lg-3 col-xl-3">
                        <div class="row">
                            <div class="col-md-6">
                                Subtotal:
                            </div>
                            <div class="col-md-6" style="text-align:right" id="subtotal">
                                $ 0.00
                            </div>                    
                            <div class="col-md-6">
                                Desc.:
                            </div>
                            <div class="col-md-6" style="text-align:right" id="descuento">
                                $ 0.00
                            </div>                    
                            <div class="col-md-6">
                                I.V.A:
                            </div>
                            <div class="col-md-6" style="text-align:right" id="iva">
                                $ 0.00
                            </div>                   
                            <!-- <div class="col-md-6">
                                Imp. Ret:
                            </div>
                            <div class="col-md-6" style="text-align:right">
                                $ 0.00
                            </div>                    -->
                            <div class="col-md-6">
                                <b>TOTAL:</b>
                            </div>
                            <div class="col-md-6" style="text-align:right" id="total">
                                <b>$ 0.00</b>
                            </div>
                        </div>
                    </div>                    
                </div>
            </div>
        </div>
    </div>
    <div class="col-12 col-md-4">
        <div class="card">
            <div class="card-body">             
                <div style="padding:10px">     
                    <div class="row">
                        <div class="col-8">                        
                            <div class="form-group">
                                <div class="input-group date datepicker" id="dpFecha">
									<input type="text" class="form-control" value="10/12/2025" id="busFecha">
                                    <span class="input-group-text input-group-addon"><i class="fa fa-calendar"></i></span>
								</div>
                            </div>
                        </div>
                        <div class="col-4" style="text-align:right">                           
                            <button class="btn btn-sm btn-primary" type="button" id="btnBusRemisiones">
                                <i class="mdi mdi-binoculars" style="font-size:1.8em"></i>
                            </button>
                        </div>
                    </div>    
                </div>
                <div id="searchresult" style="height: 520px; overflow:auto">                                    
                </div>
            </div>
        </div>
    </div>
</div>
@stop
@section('jspage')
  <script src="jsprod/misc.js"></script>
  <script src="jsprod/caja.js"></script>
@stop