@extends('layouts.app', ['activePage' => 'retextranjeri', 'menuParent' => '', 'titlePage' => ''])

@section('content')
@include('includes.tailwind')

<style>
  .ui-autocomplete-input {
    font-size: 14px;
    z-index: 900;
    position: relative;
  }

  .ui-menu .ui-menu-item a {
    font-size: 12px;
  }

  .ui-autocomplete {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1100 !important;
    float: left;
    display: none;
    padding: 4px 0;
    margin: 2px 0 0 0;
    list-style: none;
    background-color: #ffffff;
    border-color: #ccc;
    border-color: rgba(0, 0, 0, 0.2);
    border-style: solid;
    border-width: 1px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    -webkit-background-clip: padding-box;
    -moz-background-clip: padding;
    background-clip: padding-box;
  }

  .ui-autocomplete {
    max-height: 200px;
    overflow-y: auto;
    /* prevent horizontal scrollbar */
    overflow-x: hidden;
    /* add padding to account for vertical scrollbar */
    padding-right: 20px;
  }

  .ui-menu-item>a.ui-corner-all {
    display: block;
    padding: 3px 15px;
    clear: both;
    font-weight: normal;
    line-height: 18px;
    color: #555555;
    white-space: nowrap;
    text-decoration: none;
  }

  .ui-state-hover,
  .ui-state-active {
    color: #ffffff;
    text-decoration: none;
    background-color: #0088cc;
    border-radius: 0px;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    background-image: none;
  }

  #fixed-bar {
    bottom: 0;
    height: 34px;
    padding: 13px 0 4px;
    position: fixed;
    width: 100%;
    z-index: 5000;
  }

  .subDiv {
    position: absolute;
    bottom: 10px;
    width: 100%;
  }

  /* .table-responsive {
    max-height: 400px;
  }

  thead th {
    font-size: 0.6em;
    padding: 1px !important;
    height: 15px;
  }

  .table td {
    padding: 0;
    font-size: 0.6em;
    padding: 1px !important;
    height: 15px;
    border: none !important;
    border-right: none !important;
  } */

  .inputsrounder {
    -webkit-border-radius: 9px;
    -moz-border-radius: 9px;
    border-radius: 9px;
    border: 1px solid #2d9fd9;
    /*color: #a0d18c;*/
    width: 250px;
    height: 30px;
    padding-left: 10px;
  }

  .inputsrounder:focus {
    outline: none;
    border: .5px solid #a0d18c;
    /*color: #2d9fd9;*/
  }

  .accordion-button:before {
    order: -1;
    margin-left: 0;
    margin-right: 0.5em;
  }

  @media only screen and (max-width: 600px) {
    .lista {
      height: 120vh !important;
    }
  }

  textarea.responsive-textarea {
    width: 100%;
    resize: vertical;
  }

  /* En esta vista, perfectScrollbar sobre .main-panel rompe position: sticky */
  .main-panel {
    overflow: visible !important;
  }

  .perfect-scrollbar-on .main-panel {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }
</style>
<input type="hidden" id="concartaporte">
@if (isset($data['venta']))
<input type="hidden" id="idVentaCargada" value="{{ $data['venta']->id }}">
<input type="hidden" id="tipoVentaCargada" value="{{ $data['venta']->tipo_documento }}">
@if ($data['venta']->factura==null)
<input type="hidden" id="idDocHv" value="">
@else
<input type="hidden" id="idDocHv" value="{{ $data['venta']->factura->id }}">
@endif

@else
<input type="hidden" id="idVentaCargada" value="">
<input type="hidden" id="idDocHv" value="">
<input type="hidden" id="tipoVentaCargada" value="">
@endif

<input type="hidden" id="soloventa">
<input type="hidden" id="dias_vigencia_csd" value="{{ $data['dias_vigencia_csd']['dias'] }}">
<input type="hidden" id="idPrefact">
<div class="content ">
  <div class="container-fluid mt-4">
    <input type="hidden" id="nomEmpresa" value="{{ $data['empresa']->nombreorganizacion }}">
    <div class="row gy-3 mb-3 ">
      <div class="col-lg-9 h-100">
        <div class="bg-white border border-slate-200 rounded-lg shadow-sm px-4 pt-4 pb-2 mb-2 h-100">
          <div class="flex items-start justify-between mb-1">
            <div>
              <h6 class="text-lg font-semibold text-slate-900 ">CFDI de retenciones al extranjero</h6>
              <p class="text-sm text-slate-500">Captura y timbra el CFDI de retenciones con la información fiscal del receptor en el extranjero.</p>
            </div>
          </div>
          <section class="bg-gray-25 rounded-lg border border-gray-200 p-3 mb-2">
            <div class="flex items-center gap-3 mb-2">
              <span class="h-10 w-10 rounded-lg border border-slate-900 flex items-center justify-center text-lg text-slate-900"> <i class="material-icons text-slate-900">person</i></span>
              <div>
                <h6 class="text-sm font-semibold text-slate-900">DATOS GENERALES DEL CFDI</h6>
                <p class="text-sm text-slate-700 mb-0">Selecciona receptor, datos fiscales y condiciones de pago para generar la retención.</p>
              </div>
            </div>
            <div class="grid grid-cols-12 gap-4 ">
              <div class="col-span-4">
                <label class="block text-sm text-gray-700">
                  Cliente/Receptor: <span class="text-red-500">*</span>
                </label>
                <select id="buscaCliente" class="select2 w-full px-3 py-1 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 ">
                  <option value="0">-Selecciona Cliente/Receptor-</option>
                  @foreach ($data['clientes'] as $c)
                  <option value="{{ $c->id }}">{{ $c->razon_social }}</option>
                  @endforeach
                </select>
                <!-- <button class="inline-flex items-center justify-center bg-[#0A415F] hover:bg-[#083549] text-white p-2 rounded-full transition-colors duration-200" onclick="newCliente();" title="Agregar nuevo cliente" style="cursor:pointer; min-width: 40px; min-height: 40px;">
                  <i class="material-icons text-white" style="font-size: 20px;">person_add</i>
                </button> -->
              </div>
              <div class="col-span-2">
                <label class="block text-sm text-gray-700">RFC:<span class="text-danger">*</span></label>
                <input type="text" class="w-full px-3 py-1  border border-gray-300 rounded-md" id="rfc" disabled>
              </div>
              <div class="col-span-2">
                <label class="block text-sm text-gray-700"> Tipo:<span class="text-danger">*</span></label>
                <select id="tipodocumento" class="select2 w-full px-3 py-1 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 " data-size="7" id="tipo" onchange="getSerie();">
                  @foreach ($data['tipos_documentos'] as $t)
                  <option value="{{ $t->id }}">{{ $t->tipo }}</option>
                  @endforeach
                </select>
              </div>
              <div class="col-span-2">
                <label class="block text-sm text-gray-700">Serie:<span class="text-danger">*</span></label>
                <select class="select2 w-full px-3 py-1 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 " id="serie">
                  @foreach ($data['series'] as $s)
                  <option value="{{ $s->id }}">{{ $s->serie }}</option>
                  @endforeach
                </select>
              </div>
              <div class="col-span-2">
                <label class="block text-sm text-gray-700">Moneda:<span class="text-danger">*</span></label>
                <select class="select2 w-full px-3 py-1 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 " id="moneda" onchange="tipoCambio();">
                  @foreach ($data['monedas'] as $u)
                  <option value="{{ $u->id }}">{{ $u->nombre }}</option>
                  @endforeach
                </select>
              </div>
            </div>
            <div class="grid grid-cols-12 gap-4 mt-2">
              <div class="col-span-2">
                <label class="block text-sm text-gray-700">Uso de CFDI:<span class="text-danger">*</span></label>
                <select id="usocfdi" class="select2 w-full px-3 py-1 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 " data-size="7">
                  <option value="0">-Selecciona-</option>
                  @foreach ($data['usocfdi'] as $u)
                  <option value="{{ $u->id }}">{{ $u->c_usocfdi }} - {{ $u->descripcion }}</option>
                  @endforeach
                </select>
              </div>
              <div class="col-span-2">
                <label class="block text-sm text-gray-700">Forma de pago:<span class="text-danger">*</span></label>
                <select id="metodopago" class="select2 w-full px-3 py-1 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 " onchange="revisaMP();">
                  @foreach ($data['formapago'] as $fp)
                  <option value="{{ $fp->idFormapago }}" clave="{{ $fp->claveSat }}">{{ $fp->claveSat }} - {{ $fp->nombre }}</option>
                  @endforeach
                </select>
              </div>
              <div class="col-span-2">
                <label class="block text-sm text-gray-700">Método de pago:<span class="text-danger">*</span></label>
                <select class="select2 w-full px-3 py-1 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 " id="formapago">
                  <option value="PUE">PUE</option>
                  <option value="PPD">PPD</option>
                </select>
              </div>
              <div class="col-span-3">
                <label class="block text-sm text-gray-700">Condiciones de pago:</label>
                <select class="select2 w-full px-3 py-1 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 " id="plazo">
                  @foreach ($data['plazos'] as $u)
                  <option value="{{ $u->id }}">{{ $u->nombre }}</option>
                  @endforeach
                </select>
              </div>
              <div class="col-span-1 flex items-center mt-4">
                <button class="px-3 py-1.5 bg-transparent border hover:text-green-600 text-xs font-medium rounded-md transition-colors duration-200 flex mb-2 items-center gap-2" title="Crear nuevo plazo" onclick="nuevoPlazo()">
                  <i class="material-icons text-sm">add</i>
                </button>
              </div>
            </div>
          </section>
          <section class="bg-gray-25 rounded-lg border border-gray-200 p-3">
            <!-- NO SE USA DESDE AQUI -->
            <div class="row" style="display: none;">
              <div class="col-md-3 col-sm-6">
                <button class="btn btn-primary btn-sm btn-block btn-outline" onclick="buscaProd();"><i class="fa fa-search" aria-hidden="true"></i>
                  Busca Producto
                </button>
              </div>
              @foreach ($data['empresa']->retenciones as $imp)
              <div class="col-md-2 col-sm-6">
                <div class="form-check form-check-inline">
                  <div class="form-check">
                    <label class="form-check-label">
                      @if ($imp->impuesto->impuesto=='IVAR')
                      <input class="form-check-input impuescheck ivasrets" type="radio" id="check_{{ $imp->id_impuesto }}" impuesto="{{ $imp->impuesto->impuesto }}" value="{{ $imp->impuesto->tasa }}" onclick="calculaTotales();" name='ivasretenidos' idimpuesto="{{ $imp->id_impuesto }}">
                      @else
                      <input class="form-check-input impuescheck isrcheck" type="checkbox" id="check_{{ $imp->id_impuesto }}" impuesto="{{ $imp->impuesto->impuesto }}" value="{{ $imp->impuesto->tasa }}" onclick="calculaTotales();" idimpuesto="{{ $imp->id_impuesto }}">
                      @endif

                      {{ $imp->impuesto->impuesto }} {{ $imp->impuesto->tasa }}%
                      <span class="form-check-sign">
                        <span class="check"></span>
                      </span>
                    </label>
                  </div>
                </div>
              </div>
              @endforeach

              @if($data['empresa']->ish =='1')
              <div class="col-md-3 col-sm-6">
                <div class="input-group" title="Seleccionar tipo de documento">
                  <div class="input-group-prepend">
                    <span class="input-group-text">
                      ISH
                    </span>
                  </div>
                  <select id="porcentajeISH" class="select2 w-full px-3 py-1 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" data-width="50%" data-style="select-with-transition" data-live-search="true" onchange="calculaTotales();">
                    <option value="0" idish="0">No Aplica</option>
                    @foreach ($data['empresa']->ishs->where('estatus',1) as $ish)
                    <option value="{{ $ish->porcentaje }}" idish="{{ $ish->id }}">{{ $ish->porcentaje }}%</option>
                    @endforeach
                  </select>
                </div>
              </div>
              @else
              <div class="col-md-3 col-sm-6" style="display: none;">
                <div class="input-group" title="Seleccionar tipo de documento">
                  <div class="input-group-prepend">
                    <span class="input-group-text">
                      ISH
                    </span>
                  </div>
                  <select id="porcentajeISH" class="select2 w-full px-3 py-1 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" data-width="50%" data-style="select-with-transition" data-live-search="true" onchange="calculaTotales();">
                    <option value="0" idish="0">No Aplica</option>
                  </select>
                </div>
              </div>
              @endif
            </div>
            <div class="row" style="height: 45vh;overflow: auto;border-bottom: 0px solid gray;display: none;">
              <div class="col-12">
                <div class="table-responsive">
                  <table class="table table-sm table-hover no-cellpadding">
                    <thead class="h-25">
                      <tr style="border-bottom: solid; color: #0170ff;">
                        <th style="width: 10%;">Código</th>
                        <th style="width: 40%;">Descripción</th>
                        <th style="width: 5%;">Cantidad</th>
                        <th style="width: 10%;">Precio U.</th>
                        <th style="width: 10%;"> Subtotal</th>
                        <th style="width: 10%;">
                          <span class="input-group-text pl-0" style="color: #0170ff; cursor: pointer;" title="Descuento % o monto">
                            Desc. <i class="fa fa-dollar text-info modo-ganancia" id="modo-descuento" data-modo="cantidad" data-servicio="descuento"></i>
                          </span>
                        </th>
                        <th style="width: 2%;">Acciones</th>
                      </tr>
                    </thead>
                    <tbody id="bodyItems">
                      <tr contador="1" class="itemsFact" id="itemList_1">
                        <td>
                          <input class="itemsInput inputsrounder" type="text" style="width: 100%;" id="code_1" contador="1">
                        </td>
                        <td>
                          <input type="text" style="width: 100%;" id="desc_1" class="inputsrounder">
                        </td>
                        <td>
                          <input type="number" style="width: 100%;" id="cant_1" class="inputsrounder" onkeyup="calculaTotales();">
                        </td>
                        <td>
                          <input type="number" style="width: 100%;" id="precio_1" class="inputsrounder" onkeyup="calculaTotales();">
                        </td>
                        <td>
                          <input type="text" style="width: 100%;" id="subtotal_1" class="inputsrounder" readonly>
                        </td>
                        <td>
                          <input type="number" style="width: 100%;" id="descuento_1" class="inputsrounder" onkeyup="calculaTotales(1);">
                        </td>
                        <td>
                          <button class="btn btn-link btn-xsm mr-1" onclick="removeItem0(1);"><i class="material-icons">close</i></button>
                        </td>
                      </tr>
                    </tbody>
                  </table>
                </div>
              </div>
            </div>
            <!-- NO SE USA HASTA AQUI -->

            <div class="flex items-center gap-3 mb-2">
              <span class="h-10 w-10 rounded-lg border border-slate-900 flex items-center justify-center text-lg text-slate-900"> <i class="material-icons text-slate-900">receipt</i></span>
              <div>
                <h6 class="text-sm font-semibold text-slate-900">DATOS DE LA RETENCIÓN</h6>
                <p class="text-sm text-slate-700 mb-0">Selecciona la clave de retención, concepto y período fiscal para registrar los detalles.</p>
              </div>
            </div>
            <div class="grid grid-cols-12 gap-4 muestra">
              <div class="col-span-4">
                <label class="block text-sm text-gray-700 mb-1">Clave: <span class="text-danger">*</span></label>
                <select class="select2 w-full px-3 py-1 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 " id="clave_ret">
                  @foreach ($data['claves_retencion'] as $c)
                  @if($c->clave=='18')
                  <option value="{{ $c->clave }}" selected>({{ $c->clave }}) {{ $c->descripcion }}</option>
                  @else
                  <option value="{{ $c->clave }}">({{ $c->clave }}) {{ $c->descripcion }}</option>
                  @endif
                  @endforeach
                </select>
              </div>
              <div class="col-span-8">
                <label class="block text-sm text-gray-700 mb-1">Concepto: <span class="text-danger">*</span></label>
                <input type="text" class="w-full px-3 py-1  border border-gray-300 rounded-md" id="concepto_ret">
              </div>
            </div>
            <div class="grid grid-cols-12 gap-4 mt-2 muestra">
              <div class="col-span-4">
                <label class="block text-sm text-gray-700 mb-1">Ejercicio: <span class="text-danger">*</span></label>
                <select class="select2 w-full px-3 py-1 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 " data-size="7" id="ejercicio_ret">
                  <option value="2026">2026</option>
                  <option value="2025">2025</option>
                  <option value="2024">2024</option>
                  <option value="2023">2023</option>
                  <option value="2022">2022</option>
                </select>
              </div>
              <div class="col-span-4">
                <label class="block text-sm text-gray-700 mb-1">Mes inicial: <span class="text-danger">*</span></label>
                <select class="select2 w-full px-3 py-1 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 " id="mes_inicio_ret">
                  <option value="01">Enero</option>
                  <option value="02">Febrero</option>
                  <option value="03">Marzo</option>
                  <option value="04">Abril</option>
                  <option value="05">Mayo</option>
                  <option value="06">Junio</option>
                  <option value="07">Julio</option>
                  <option value="08">Agosto</option>
                  <option value="09">Septiembre</option>
                  <option value="10">Octubre</option>
                  <option value="11">Noviembre</option>
                  <option value="12">Diciembre</option>
                </select>
              </div>
              <div class="col-span-4">
                <label class="block text-sm text-gray-700 mb-1">Mes final: <span class="text-danger">*</span></label>
                <select class="select2 w-full px-3 py-1 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 " id="mes_fin_ret">
                  <option value="01">Enero</option>
                  <option value="02">Febrero</option>
                  <option value="03">Marzo</option>
                  <option value="04">Abril</option>
                  <option value="05">Mayo</option>
                  <option value="06">Junio</option>
                  <option value="07">Julio</option>
                  <option value="08">Agosto</option>
                  <option value="09">Septiembre</option>
                  <option value="10">Octubre</option>
                  <option value="11">Noviembre</option>
                  <option value="12">Diciembre</option>
                </select>
              </div>
            </div>
            <section class="bg-gray-25 rounded-lg border border-gray-200 p-3 my-2">
              <div class="flex items-center gap-3 mb-2">
                <span class="h-10 w-10 rounded-lg border border-slate-900 flex items-center justify-center text-lg text-slate-900"> <i class="material-icons text-slate-900">attach_money</i></span>
                <div>
                  <h6 class="text-sm font-semibold text-slate-900">TOTALES</h6>
                </div>
              </div>
              <div class="grid grid-cols-12 gap-4 ">
                <div class="col-span-3">
                  <label class="block text-sm text-gray-700 mb-1">Total: <span class="text-danger">*</span></label>
                  <input type="number" step="any" class="w-full px-3 py-1  border border-gray-300 rounded-md" id="total_ret" onkeyup="calculaTotalesRet();">
                </div>
                <div class="col-span-3">
                  <label class="block text-sm text-gray-700 mb-1">Total gravado: <span class="text-danger">*</span></label>
                  <input type="number" step="any" class="w-full px-3 py-1  border border-gray-300 rounded-md" id="gravado_ret">
                </div>
                <div class="col-span-3">
                  <label class="block text-sm text-gray-700 mb-1">Total exento: <span class="text-danger">*</span></label>
                  <input type="number" step="any" class="w-full px-3 py-1  border border-gray-300 rounded-md" id="excento_ret">
                </div>
                <div class="col-span-3">
                  <label class="block text-sm text-gray-700 mb-1">Total retenido: <span class="text-danger">*</span></label>
                  <input type="number" step="any" class="w-full px-3 py-1  border border-gray-300 rounded-md" id="retenido_ret">
                </div>
              </div>
            </section>
            <section class="bg-gray-25 rounded-lg border border-gray-200 p-3 my-2">

              <div class="flex items-center gap-3 mb-2">
                <span class="h-10 w-10 rounded-lg border border-slate-900 flex items-center justify-center text-lg text-slate-900"> <i class="material-icons text-slate-900">balance</i></span>
                <div>
                  <h6 class="text-sm font-semibold text-slate-900">IMPUESTOS DE RETENCION</h6>
                </div>
              </div>
              <div class="grid grid-cols-12 gap-4 ">
                <div class="col-span-3">
                  <label class="block text-sm text-gray-700 mb-1">Base: <span class="text-danger">*</span></label>
                  <input type="number" step="any" class="w-full px-3 py-1  border border-gray-300 rounded-md" id="base_ret">
                </div>
                <div class="col-span-3">
                  <label class="block text-sm text-gray-700 mb-1">Tipo de impuesto: <span class="text-danger">*</span></label>
                  <select class="select2 w-full px-3 py-1 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 " id="tipo_impuesto_ret">
                    @foreach ($data['impuestos2'] as $key => $i)
                    <option value="{{ $i->c_impuesto }}" idimpuesto="{{ $i->id }}">{{ $i->impuesto }}</option>
                    @endforeach
                  </select>
                </div>
                <div class="col-span-3">
                  <label class="block text-sm text-gray-700 mb-1">Monto: <span class="text-danger">*</span></label>
                  <input type="text" class="w-full px-3 py-1  border border-gray-300 rounded-md" id="monto_ret">
                </div>
                <div class="col-span-3">
                  <label class="block text-sm text-gray-700 mb-1">Tipo de pago: <span class="text-danger">*</span></label>
                  <select class="select2 w-full px-3 py-1 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 " id="tipo_pago_ret">
                    <option value="01">Pago definitivo IVA</option>
                    <option value="02">Pago definitivo IEPS</option>
                    <option value="03">Pago definitivo ISR</option>
                    <option value="04">Pago provisional ISR</option>
                  </select>
                </div>
              </div>
              <div class="grid grid-cols-12 gap-4 mt-2">
                <div class="col-span-12 flex justify-end">
                  <button class="px-3 py-1.5 bg-transparent border hover:text-green-600 text-xs font-medium rounded-md transition-colors duration-200 flex mb-2 items-center gap-2" onclick="agregaImpuestoRet();">
                    <i class="fas fa-plus"></i> Agregar impuesto
                  </button>
                </div>
              </div>
              <div class="grid grid-cols-12 gap-4 mt-2">
                <div class="col-span-12">
                  <div class="overflow-x-auto rounded-lg border border-gray-200 shadow-sm">
                    <table class="w-full text-sm table-fixed">
                      <thead class="sticky-top">
                        <tr class="bg-gradient-to-r from-gray-50 to-gray-100 border-b-2 border-gray-200">
                          <th class="px-4 py-3 text-left font-semibold text-gray-700 uppercase tracking-wide text-[11px]">BASE</th>
                          <th class="px-4 py-3 text-left font-semibold text-gray-700 uppercase tracking-wide text-[11px]">TIPO DE IMPUESTO</th>
                          <th class="px-4 py-3 text-left font-semibold text-gray-700 uppercase tracking-wide text-[11px]">MONTO</th>
                          <th class="px-4 py-3 text-left font-semibold text-gray-700 uppercase tracking-wide text-[11px]">TIPO DE PAGO</th>
                          <th class="px-4 py-3 text-left font-semibold text-gray-700 uppercase tracking-wide text-[11px]">ACCIONES</th>
                        </tr>
                      </thead>
                      <tbody id="tableBoduImpuesRetecniones" class="divide-y divide-gray-200">
                      </tbody>
                    </table>
                  </div>
                </div>
              </div>
            </section>
            <section class="bg-gray-25 rounded-lg border border-gray-200 p-3 my-2">
              <div class="flex items-center gap-3 mb-2">
                <span class="h-10 w-10 rounded-lg border border-slate-900 flex items-center justify-center text-lg text-slate-900"> <i class="material-icons text-slate-900">person</i></span>
                <div>
                  <h6 class="text-sm font-semibold text-slate-900">BENEFICIARIO</h6>
                </div>
              </div>
              <div class="grid grid-cols-12 gap-4 mt-2">
                <div class="col-span-3">
                  <label class="block text-sm text-gray-700 mb-1">¿Es beneficiario del cobro?: <span class="text-danger">*</span></label>
                  <select class="select2 w-full px-3 py-1 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 " id="es_beneficiario">
                    <option value="1">Sí</option>
                    <option value="0">No</option>
                  </select>
                </div>
                <div class="col-span-3">
                  <label class="block text-sm text-gray-700 mb-1">País: <span class="text-danger">*</span></label>
                  <select class="select2 w-full px-3 py-1 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" id="pais_retencion">
                    @foreach ($data['paises'] as $r)
                    <option value="{{ $r->clave }}">{{ $r->pais }} ({{ $r->clave }})</option>
                    @endforeach
                  </select>
                </div>
                <div class="col-span-6">
                  <label class="block text-sm text-gray-700 mb-1">Concepto: <span class="text-danger">*</span></label>
                  <select class="select2 w-full px-3 py-1 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" id="clave_contribuyente">
                    @foreach ($data['claves_contribuyente'] as $e)
                    <option value="{{ $e->clave }}">{{ $e->descripcion }}</option>
                    @endforeach
                  </select>
                </div>
              </div>
              <div class="grid grid-cols-12 gap-4 mt-2">
                <div class="col-span-12">
                  <label class="block text-sm text-gray-700 mb-1">Descripción: <span class="text-danger">*</span></label>
                  <input type="text" class="w-full px-3 py-1  border border-gray-300 rounded-md" id="conceptos_retenciones">
                </div>
              </div>
            </section>

          </section>
        </div>

        <div class="bg-white border border-slate-200 rounded-lg shadow-sm px-4 pt-4 pb-2 mb-2 h-100">
          <div class="flex items-start justify-between mb-1">
            <div>
              <h6 class="text-sm font-semibold text-slate-900 ">NOTAS DEL CFDI DE RETENCIONES</h6>
              <p class="text-sm text-slate-500">Selecciona una nota existente o ingresa una nota manual.</p>
            </div>
          </div>
          <section class="bg-gray-25 rounded-lg border border-gray-200 p-3 mb-2">
            <div class="grid grid-cols-12 gap-4 ">
              <div class="col-span-12">
                <label class="block text-sm text-gray-700 mb-1">Notas existentes:</label>
                <select id="leye" class="select2 w-full px-3 py-1 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" onchange="agregaLeyenda()">
                  <option value="0">-Selecciona-</option>
                  @foreach ($data['documentos_leyenda'] as $f)
                  <option value="{{ $f->id }}" ley="{{ base64_encode(utf8_decode($f->leyenda)) }}">{{ substr($f->leyenda,0,100).'...' }}</option>
                  @endforeach
                </select>
              </div>
            </div>
            <div class="grid grid-cols-12 gap-4 mt-2">
              <div class="col-span-12">
                <label class="block text-sm text-gray-700 mb-1">Notas manual:</label>
                <textarea class="w-full px-3 py-1  border border-gray-300 rounded-md" id="notas" rows="4" cols="12"></textarea>
              </div>
            </div>
          </section>
        </div>
      </div>
      <!-- end col-md-12 -->
      <div class="col-md-3 self-start md:sticky md:top-5 h-fit z-20">
        <div class="bg-white border border-slate-200 rounded-lg shadow-sm p-3 mb-2">
          <div class="space-y-3">
            <div class="cardsEstatus" id="estatusNueva">
              <div class="rounded-lg bg-gradient-to-br from-blue-600 to-blue-700 text-white shadow-lg hover:shadow-xl transition-shadow">
                <div class="px-4 py-3">
                  <div class="flex items-center gap-3 mb-2">
                    <i class="material-icons text-lg">description</i>
                    <div>
                      <p class="text-sm font-semibold">Estatus: Nueva</p>
                      <p class="text-sm text-blue-100">Documento nuevo</p>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="cardsEstatus" style="display: none;" id="estatusGenerada">
              <div class="rounded-lg bg-gradient-to-br from-amber-500 to-amber-600 text-amber-950 shadow-lg hover:shadow-xl transition-shadow">
                <div class="px-4 py-3">
                  <div class="flex items-center gap-3 mb-2">
                    <i class="material-icons text-lg">schedule</i>
                    <div>
                      <p class="text-sm font-semibold">Estatus: Generada</p>
                      <p class="text-sm font-medium">Pendiente de pago</p>
                    </div>
                  </div>
                  <p class="idDocumento text-sm font-medium ml-11">FF-459</p>
                </div>
              </div>
            </div>
            <div class="cardsEstatus" style="display: none;" id="estatusPagada">
              <div class="rounded-lg bg-gradient-to-br from-emerald-600 to-emerald-700 text-white shadow-lg hover:shadow-xl transition-shadow">
                <div class="px-4 py-3">
                  <div class="flex items-center gap-3 mb-2">
                    <i class="material-icons text-lg">check_circle</i>
                    <div>
                      <p class="text-sm font-semibold">Estatus: Pagada</p>
                      <p class="text-sm text-emerald-100">Completamente pagada</p>
                    </div>
                  </div>
                  <p class="idDocumento text-sm font-medium ml-11">FS-459</p>
                </div>
              </div>
            </div>

            <div class="cardsEstatus" style="display: none;" id="estatusCancelada">
              <div class="rounded-lg bg-gradient-to-br from-red-600 to-red-700 text-white shadow-lg hover:shadow-xl transition-shadow">
                <div class="px-4 py-3">
                  <div class="flex items-center gap-3 mb-2">
                    <i class="material-icons text-lg">cancel</i>
                    <div>
                      <h4 class="text-sm font-semibold">Estatus: Cancelada</h4>
                      <p class="text-sm text-red-100">Documento cancelado</p>
                    </div>
                  </div>
                  <p class="idDocumento text-sm font-medium ml-11">FS-459</p>
                </div>
              </div>
            </div>

            <div class="cardsEstatus" style="display: none;" id="estatusProcesoCancelada">
              <div class="rounded-lg bg-gradient-to-br from-orange-500 to-orange-600 text-orange-950 shadow-lg hover:shadow-xl transition-shadow">
                <div class="px-4 py-3">
                  <div class="flex items-center gap-3 mb-2">
                    <i class="material-icons text-lg">pending_actions</i>
                    <div>
                      <h4 class="text-sm font-semibold">Estatus: En Cancelación</h4>
                      <p class="text-sm font-medium">Proceso en progreso</p>
                    </div>
                  </div>
                  <p class="idDocumento text-sm font-medium ml-11">FS-459</p>
                </div>
              </div>
            </div>

            <div class="rounded-lg border border-slate-200 bg-slate-50 px-3 py-2 space-y-2">
              <div class="flex items-center justify-between min-h-[32px]">
                <h5 class="m-0 text-sm font-medium text-slate-700">Subtotal:</h5>
                <div class="text-sm font-semibold text-slate-900" id="subtotalLabel">$0.00</div>
              </div>
              <div class="flex items-center justify-between min-h-[32px]">
                <h5 class="m-0 text-sm font-medium text-slate-700">Descuento:</h5>
                <div class="text-sm font-semibold text-slate-900" id="descuentoLabel">$0.00</div>
                <input type="hidden" id="descuentodescuento">
              </div>
              <div class="flex items-center justify-between min-h-[32px]">
                <h5 class="m-0 text-sm font-medium text-slate-700">IVA 16%:</h5>
                <div class="text-sm font-semibold text-slate-900" id="ivaLabel">$0.00</div>
              </div>
              <div class="flex items-center justify-between min-h-[32px]" style="display: none;" id="divIvaRet">
                <h5 class="m-0 text-sm font-medium text-slate-700" id="IVAretDisplay">IVA Ret:</h5>
                <div class="text-sm font-semibold text-slate-900" id="IvaRetLabel">$0.00</div>
              </div>
              <div class="flex items-center justify-between min-h-[32px]" style="display: none;" id="divIsr">
                <h5 class="m-0 text-sm font-medium text-slate-700" id="ISRDisplay">ISR:</h5>
                <div class="text-sm font-semibold text-slate-900" id="isrLabel">$0.00</div>
              </div>
              <div class="flex items-center justify-between min-h-[32px]" style="display: none;" id="divIsh">
                <h5 class="m-0 text-sm font-medium text-slate-700" id="ISHDisplay">ISH:</h5>
                <div class="text-sm font-semibold text-slate-900" id="ishLabel">$0.00</div>
              </div>
              <div>
                <input type="hidden" id="totalInputHidden">
                <input type="hidden" id="IvaInputHidden">
              </div>
              <div class="flex items-center justify-between border-t border-slate-200 pt-2">
                <h3 class="m-0 text-lg font-semibold text-slate-900">Total</h3>
                <div class="text-right">
                  <h3 class="m-0 text-lg font-bold text-slate-900" id="totalLabel">$0.00</h3>
                  <input type="hidden" id="totaltotal">
                </div>
              </div>
            </div>

            <div class="rounded-lg border border-slate-200 bg-slate-50 p-3">
              <div class="mb-3 text-center">
                <h4 class="m-0 text-sm font-semibold text-slate-900">Acciones</h4>
              </div>
              <div class="space-y-2">
                <div>
                  <button type="button" class="w-full rounded-lg bg-gradient-to-r from-emerald-600 to-green-600 px-3 py-2.5 text-sm font-semibold text-white shadow-sm transition hover:from-emerald-700 hover:to-green-700 focus:outline-none focus:ring-2 focus:ring-emerald-400 focus:ring-offset-1"
                    style="box-shadow: 0 4px 14px rgba(16,185,129,0.22);" id="btnRetencion">Timbrar</button>
                  <button type="button" class="mt-2 flex w-full items-center justify-center gap-2 rounded-lg border border-emerald-200 bg-white px-3 py-2.5 text-sm font-semibold text-emerald-700 transition hover:bg-emerald-50 hover:border-emerald-300 focus:outline-none focus:ring-2 focus:ring-emerald-300 focus:ring-offset-1" onclick="relaciones(1);">
                    <i class="fa fa-link" aria-hidden="true"></i>
                    UUID Relacionados
                  </button>
                  <button type="button" class="mt-2 flex w-full items-center justify-center gap-2 rounded-lg border border-emerald-200 bg-white px-3 py-2.5 text-sm font-semibold text-emerald-700 transition hover:bg-emerald-50 hover:border-emerald-300 focus:outline-none focus:ring-2 focus:ring-emerald-300 focus:ring-offset-1" onclick="aplicacionNotas(2);">
                    <i class="fa fa-sticky-note" aria-hidden="true"></i>
                    Aplicacion notas de crédito
                  </button>
                </div>

                <div id="divProgramar" style="display: none;">
                  <button class="w-full rounded-md bg-sky-600 px-3 py-2 text-sm font-medium text-white transition hover:bg-sky-700" id="btnProgramar" onclick="modalPrgramar();">Programar Factura</button>
                </div>

                <div id="divTimbrarPrefact" style="display: none;">
                  <button class="w-full rounded-md bg-emerald-600 px-3 py-2 text-sm font-medium text-white transition hover:bg-emerald-700" id="btnTimbraPrefact" onclick="timbrarPrefactura();"> Timbrar Pre-Factura</button>
                </div>

                <div id="divPrefactura" style="display:none;">
                  <button class="w-full rounded-md bg-blue-600 px-3 py-2 text-sm font-medium text-white transition hover:bg-blue-700" id="btnPreFactura">Pre-Facturar</button>
                </div>

                <div class="grid grid-cols-3 gap-2" id="divArchivos" style="display: none;">
                  <div>
                    <button class="w-full rounded-md border border-slate-300 bg-white px-2 py-1 text-slate-700 transition hover:bg-slate-100" title="Enviar" onclick="enviabutton()"><i class="fa fa-envelope" aria-hidden="true"></i></button>
                  </div>
                  <div>
                    <a class="flex w-full items-center justify-center rounded-md border border-slate-300 bg-white px-2 py-2 text-slate-700 transition hover:bg-slate-100" href="#" id="btnXmlView" target="_blank"><i class="fa fa-file-code" aria-hidden="true"></i></a>
                  </div>
                  <div>
                    <a class="flex w-full items-center justify-center rounded-md border border-slate-300 bg-white px-2 py-2 text-slate-700 transition hover:bg-slate-100" href="#" id="btnPdfView" target="_blank"><i class="fa fa-file-pdf" aria-hidden="true"></i></a>
                  </div>
                </div>

                <div id="divAcciones" style="display: none;">
                  <!--<button class="btn btn-primary btn-block btn-sm" align="center" id="btnAcciones" onclick="relaciones();">Acciones</button>-->
                  <details class="group relative">
                    <summary class="flex w-full cursor-pointer list-none items-center justify-center rounded-md bg-blue-600 px-3 py-2 text-sm font-medium text-white transition hover:bg-blue-700">
                      Acciones
                    </summary>
                    <div class="absolute right-0 z-20 mt-2 w-full rounded-md border border-slate-200 bg-white p-1 shadow-lg">
                      <a class="block rounded px-3 py-2 text-sm text-slate-700 hover:bg-slate-100" href="javascript:;" onclick="relaciones(1);">UUID Relacionados</a>
                      <a class="block rounded px-3 py-2 text-sm text-slate-700 hover:bg-slate-100" href="javascript:;" onclick="aplicacionNotas(2);">Aplicacion Notas de Crédito</a>
                      <!--<a class="block rounded px-3 py-2 text-sm text-slate-700 hover:bg-slate-100" href="javascript:;" onclick="cartaPorte();">Carta Porte</a>-->
                    </div>
                  </details>
                </div>

                <div id="divDiasTimbrado">
                  <select id="diasTimbrado" class="select2 w-full px-3 py-1 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 ">
                    <option value="0">Hoy</option>
                    <option value="1">1 día</option>
                    <option value="2">2 días</option>
                    <option value="3">3 días</option>
                  </select>
                </div>

                <div id="divDeposito" style="display:none;">
                  <button class="w-full rounded-md border border-slate-300 bg-white px-3 py-2 text-sm font-medium text-slate-700 transition hover:bg-slate-100" id="btnDeposito" onclick="aplicarDeposito();">aplicar Depósito</button>
                </div>

                <div id="divCancelar" style="display:none;">
                  <button class="w-full rounded-md bg-red-600 px-3 py-2 text-sm font-medium text-white transition hover:bg-red-700" id="btnPagar" onclick="cancelarModal();">Cancelar</button>
                </div>

                <div id="divNuevodocumento" style="display:none;">
                  <button class="w-full rounded-md bg-blue-600 px-3 py-2 text-sm font-medium text-white transition hover:bg-blue-700" id="btnRestaurar" onclick="restaurar();">Nueva</button>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>



<div class="modal fade" id="modalBuscaProducto">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
      <div class="modal-header">
        <h4 class="modal-title">Busca Producto</h4>
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
      </div>
      <div class="modal-body">
        <div class="row">
          <div class="col-10">
            <div class="form-group filled bmd-form-group">
              <label>Nombre</label>
              <input type="text" class="form-control form-control-sm" id="buscadorProducto">
            </div>
          </div>
          <div class="col-1">
            <div class="form-group filled bmd-form-group">
              <button class="btn btn-primary btn-sm" title="Nuevo Cliente" onclick="newProducto();">
                <i class="fa fa-plus" aria-hidden="true"></i>
              </button>
            </div>
          </div>
        </div>
        <div class="row" style="height: 50vh;overflow: auto;">
          <div class="col-12">
            <div class="table-sm table-responsive">
              <table class="table table-hover table-sm" id="tableBuscadorProductos">
                <thead>
                  <tr style="border-bottom: solid; color: #0170ff ;">
                    <th width="10%">Código</th>
                    <th>Descripción</th>
                    <th width="15%">Precio</th>
                    <th width="5%"></th>
                  </tr>
                </thead>
                <tbody id="tableBuscadorProductosBody">
                  @foreach ($data['productos'] as $p)
                  <tr>
                    <td>{{ $p->codigo }}</td>
                    <td>{{ $p->descripcion }}</td>
                    <td>{{ number_format($p->subtotal,2) }}</td>
                    <td><button class="btn btn-primary btn-sm" onclick="agregaProdBuscador('{{ $p->codigo }}')">+</button></td>
                  </tr>
                  @endforeach
                </tbody>
              </table>
            </div>
          </div>
        </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Cerrar</button>
      </div>
    </div>
  </div>
</div>

<div class="modal fade" id="modalNewCliente">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
      <div class="modal-header bg-gray-50 border-b border-gray-200 px-6 py-4">
        <h4 class="modal-title text-lg font-semibold text-gray-900">Creación de cliente</h4>
        <button type="button" class="close text-gray-400 hover:text-gray-600 transition-colors" data-dismiss="modal" aria-hidden="true">
          <i class="material-icons">close</i>
        </button>
      </div>
      <div class="modal-body">
        <div class="row">
          <div class="col-md-8">
            <label class="block text-sm text-gray-700">Nombre o razón social:<span class="text-danger">*</span></label>
            <input type="text" class="w-full px-3 py-1  border border-gray-300 rounded-md" id="razon_social_c" style="text-transform:uppercase">
          </div>
          <div class="col-md-4">
            <label class="block text-sm text-gray-700">RFC:<span class="text-danger">*</span></label>
            <input type="text" class="w-full px-3 py-1  border border-gray-300 rounded-md" id="rfc_c" tyle="text-transform:uppercase" maxlength="13" onblur="validaRFC();">
          </div>
        </div>
        <div class="row" id="rowsExtranjeros" style="display: none;">
          <div class="col-md-6">
            <label class="block text-sm text-gray-700">CIF:<span class="text-danger">*</span></label>
            <input type="text" class="w-full px-3 py-1  border border-gray-300 rounded-md" id="cif" style="text-transform:uppercase" maxlength="13">
          </div>
        </div>
        <div class="row">
          <div class="col-md-6">
            <label class="block text-sm text-gray-700">Regimen fiscal:<span class="text-danger">*</span></label>
            <select class="select2 w-full px-3 py-1 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" id="regimen">
              <option value="">-Selecciona una opción-</option>
              @foreach ($data['regimen'] as $r)
              <option value="{{ $r->id }}">{{ $r->descripcion }} ({{ $r->c_regimenfiscal }})</option>
              @endforeach
            </select>
          </div>
          <div class="col-md-6">
            <label class="block text-sm text-gray-700">Uso de CFDI: <span class="text-danger">*</span></label>
            <select class="select2 w-full px-3 py-1 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" id="usocfdi_c">
              <option value="">-Selecciona una opción-</option>
              @foreach ($data['usocfdi'] as $r)
              <option value="{{ $r->id }}">{{ $r->descripcion }} ({{ $r->c_usocfdi }})</option>
              @endforeach
            </select>
          </div>
        </div>
        <div class="row">
          <div class="col-md-4">
            <label class="block text-sm text-gray-700">Correo:</label>
            <input type="email" class="w-full px-3 py-1  border border-gray-300 rounded-md" id="correo_c">
          </div>
          <div class="col-md-4">
            <label class="block text-sm text-gray-700">Teléfono:</label>
            <input type="text" class="w-full px-3 py-1  border border-gray-300 rounded-md" id="telefono">
          </div>
          <div class="col-md-4">
            <label class="block text-sm text-gray-700">Contacto:</label>
            <input type="text" class="w-full px-3 py-1  border border-gray-300 rounded-md" id="contacto">
          </div>
        </div>
        <div class="row">
          <div class="col-md-12">
            <label class="block text-sm text-gray-700">Dirección:</label>
            <input type="text" class="w-full px-3 py-1  border border-gray-300 rounded-md" id="direccion">
          </div>
        </div>
        <div class="row">
          <div class="col-md-4">
            <label class="block text-sm text-gray-700">Pais:<span class="text-danger">*</span></label>
            <select class="select2 w-full px-3 py-1 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" id="pais" onchange="getEstado();">
              @foreach ($data['paises'] as $r)
              <option value="{{ $r->idpais }}">{{ $r->pais }} ({{ $r->clave }})</option>
              @endforeach
            </select>
          </div>
          <div class="col-md-3">
            <label class="block text-sm text-gray-700">Estado:</label>
            <select class="select2 w-full px-3 py-1 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" id="estado" onchange="getMunicipios();">
              <option value="">-Selecciona una opción-</option>
              @foreach ($data['estados'] as $r)
              <option value="{{ $r->idestado }}">{{ $r->estado }}</option>
              @endforeach
            </select>
          </div>
          <div class="col-md-1 flex items-center mt-4">
            <button class="px-3 py-1.5 bg-transparent border hover:text-green-600 text-xs font-medium rounded-md transition-colors duration-200 flex mb-2 items-center gap-2" title="Crear nuevo estado " onclick="agregarPEM(2)">
              <i class="material-icons text-sm">add</i>
            </button>
          </div>
          <div class="col-md-3">
            <label class="block text-sm text-gray-700">Municipio:</label>
            <select class="select2 w-full px-3 py-1 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" id="municipios">
              <option value="0">-Selecciona una opción-</option>
              @foreach ($data['municipios'] as $r)
              <option value="{{ $r->idmunicipio }}">{{ $r->municipio }}</option>
              @endforeach
            </select>
          </div>
          <div class="col-md-1 flex items-center mt-4">
            <button class="px-3 py-1.5 bg-transparent border hover:text-green-600 text-xs font-medium rounded-md transition-colors duration-200 flex mb-2 items-center gap-2" title="Crear nuevo municipio " onclick="agregarPEM(3)">
              <i class="material-icons text-sm">add</i>
            </button>
          </div>
        </div>
        <div class="row">
          <div class="col-md-4">
            <label class="block text-sm text-gray-700">Código postal: <span class="text-danger">*</span></label>
            <input type="text" class="w-full px-3 py-1  border border-gray-300 rounded-md" id="codigo_postal">
          </div>
          <div class="col-md-4">
            <label class="block text-sm text-gray-700">Cuenta bancaria:</label>
            <input type="text" class="w-full px-3 py-1  border border-gray-300 rounded-md" id="cuenta_bancaria">
          </div>
          <div class="col-md-4">
            <label class="block text-sm text-gray-700">Forma de pago: <span class="text-danger">*</span></label>
            <select class="select2 w-full px-3 py-1 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" id="metodo_pago">
              @foreach ($data['formapago'] as $fp)
              <option value="{{ $fp->idFormapago }}">{{ $fp->claveSat }} - {{ $fp->nombre }}</option>
              @endforeach
            </select>
          </div>
        </div>
      </div>
      <div class="modal-footer bg-white border-t border-blue-200 px-6 pt-2 pb-4 flex justify-end gap-2">
        <button type="button" class="flex items-center gap-2 bg-transparent text-gray-600 hover:text-red-600 border border-gray-300 hover:border-red-500 mr-2 px-4 py-2 rounded-md text-sm font-medium transition-colors duration-200 shadow-sm" data-dismiss="modal">
          Cerrar
        </button>
        <button type="button" class="flex items-center gap-2 bg-gradient-to-r from-emerald-600 to-green-600 text-white border border-blue-600 px-4 py-2 rounded-md text-sm font-medium transition-colors duration-200 shadow-sm" onclick="guardarCliente();">
          <i class="material-icons text-sm">save</i>
          Guardar</button>
      </div>
    </div>
  </div>
</div>


<div class="modal fade" id="modalNewProducto">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h4 class="modal-title">Nuevo Producto</h4>
        <input type="hidden" id="idproducto">
      </div>
      <div class="modal-body">
        <div class="row">
          <div class="col-md-3">
            <div class="form-group filled">
              <label class="">Código: <span class="text-danger">*</span></label>
              <input type="text" class="form-control" id="codigo">
            </div>
          </div>
        </div>
        <div class="row">
          <div class="col-md-12">
            <div class="form-group filled">
              <label class="">Descripción: <span class="text-danger">*</span></label>
              <input type="text" class="form-control" id="descripcion">
            </div>
          </div>
        </div>
        <div class="row">
          <div class="col-md-3">
            <div class="form-group filled" style="padding-top: 2%">
              <label class="">Clave SAT: <span class="text-danger">*</span></label>
              <input type="text" class="form-control" id="clavesat" maxlength="8" required>
            </div>
          </div>
          <div class="col-md-3">
            <div class="form-group filled">
              <label class="">Clave Unidad SAT: <span class="text-danger">*</span></label>
              <select id="unidadsat" class="select2 w-full px-3 py-1 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" data-size="7">
                @foreach ($data['unidad'] as $key => $i)
                <option value="{{ $i->id }}">{{ $i->clave_unidad_sat }} - {{ $i->descripcion }}</option>
                @endforeach
              </select>
            </div>
          </div>
          <div class="col-md-2">
            <div class="form-group filled">
              <button class="btn btn-primary btn-sm" onclick="nuevaUnidad()">+</button>
            </div>
          </div>
          <div class="col-md-4">
            <div class="form-group filled">
              <label class="">Tipo de IVA: <span class="text-danger">*</span></label>
              <select id="tipoIva" class="select2 w-full px-3 py-1 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" data-size="7">
                @foreach ($data['impuestos'] as $key => $i)
                <option value="{{ $i->id }}">{{ ($i->impuesto=='IVAE') ? 'Exento' : number_format($i->tasa,2).'%' }}</option>
                @endforeach
              </select>
            </div>
          </div>
        </div>

        <div class="row">
          <div class="col-md-4">
            <label class="p-0 m-0" for="totalHotel">Subtotal:</label>
            <div class="input-group">
              <div class="input-group-prepend">
                <span class="input-group-text pl-0">
                  <i class="fa fa-dollar"></i>
                </span>
              </div>
              <input type="number" class="form-control" id="subtotal" placeholder="0.00">
            </div>
          </div>
        </div>


      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Cerrar</button>
        <button type="button" class="btn btn-primary" onclick="guardaProd();">Guardar</button>
      </div>
    </div>
  </div>
</div>

<div class="modal fade" id="modalNuevaUnidad">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h4 class="modal-title">Nueva Unidad</h4>
      </div>
      <div class="modal-body">
        <div class="row">
          <div class="col-12">
            <label>Unidad SAT:<span class="text-danger">*</span></label>
            <input type="text" class="form-control" id="clave_unidadsat" maxlength="4">
          </div>
        </div>
        <div class="row">
          <div class="col-12">
            <label>Descripción:<span class="text-danger">*</span></label>
            <input type="text" class="form-control" id="descUsat">
          </div>
        </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Cerrar</button>
        <button type="button" class="btn btn-primary" onclick="guardaUnidadSAT();">Guardar</button>
      </div>
    </div>
  </div>
</div>


<div class="modal fade" id="modalTipoCambio" data-backdrop="static" data-keyboard="false">
  <div class="modal-dialog modal-sm">
    <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">
          Moneda diferente a MXN
        </h5>
        <button type="button" class="close text-gray-400 hover:text-gray-600" data-dismiss="modal" aria-label="Close">
          <i class="material-icons">close</i>
        </button>
      </div>
      <div class="modal-body px-4 py-2">
        <div class="mb-2">
          <label class="block text-sm text-gray-700 mb-1">Tipo de cambio: <span class="text-danger">*</span></label>
          <input type="number" step="any" class="w-full px-3 py-1  border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" id="tipo_cambio">
        </div>
      </div>
      <div class="modal-footer bg-white border-t border-blue-200 px-6 pt-2 pb-4 flex justify-end gap-2">
        <button type="button" class="flex items-center gap-2 bg-gradient-to-r from-emerald-600 to-green-600 text-white border border-blue-600 px-4 py-2 rounded-md text-sm font-medium transition-colors duration-200 shadow-sm" onclick="validaTP();">
          <i class="material-icons text-sm">save</i>
          Guardar
        </button>
      </div>
    </div>
  </div>
</div>


<div class="modal fade" id="modalComprobante2">
  <div class="modal-dialog ">
    <div class="modal-content">
      <div class="modal-header bg-gray-50 border-b border-gray-200 px-6 py-4">
        <h4 class="modal-title text-lg font-semibold text-gray-900">Enviar correo</h4>
        <button type="button" class="close text-gray-400 hover:text-gray-600 transition-colors" data-dismiss="modal" aria-hidden="true">
          <i class="material-icons">close</i>
        </button>
      </div>
      <div class="modal-body px-6 py-4">
        <div class="grid grid-cols-2 gap-4">
          <div class="col-span-1">
            <div class="flex flex-col items-center p-4 border-2 border-dashed border-gray-300 rounded-lg hover:border-red-500 hover:bg-red-50 transition-all cursor-pointer group">
              <a href="" id="downloadPdf" target="_blank" class="flex flex-col items-center w-full text-center group-hover:text-red-600 transition-colors">
                <i class="fa-regular fa-file-pdf fa-2xl mb-2"></i>
                <span class="text-sm font-medium text-gray-700 group-hover:text-red-600 mt-2">Descargar PDF</span>
              </a>
            </div>
          </div>
          <div class="col-span-1">
            <div class="flex flex-col items-center p-4 border-2 border-dashed border-gray-300 rounded-lg hover:border-blue-500 hover:bg-blue-50 transition-all cursor-pointer group">
              <a href="" id="downloadXml" target="_blank" class="flex flex-col items-center w-full text-center group-hover:text-blue-600 transition-colors">
                <i class="fa-regular fa-file-code fa-2xl mb-2"></i>
                <span class="text-sm font-medium text-gray-700 group-hover:text-blue-600 mt-2">Descargar XML</span>
              </a>
            </div>
          </div>
        </div>
        <div class="grid grid-cols-12 gap-6 mt-2">
          <!-- Formulario de correo -->
          <div class="col-span-12 space-y-4">
            <!-- Campo Para -->
            <div class="mb-2">
              <label class="block text-sm font-medium text-gray-700">
                Para: <span class="text-red-500">*</span>
              </label>
              <input type="text" class="w-full px-3 py-1 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent transition-all" id="emailClienteM" placeholder="correo@ejemplo.com">
            </div>

            <!-- Campo CC -->
            <div class="mb-2">
              <label class="block text-sm font-medium text-gray-700">CC:</label>
              <input type="text" class="w-full px-3 py-1 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent transition-all" id="cc" placeholder="correo2@ejemplo.com">
            </div>

            <!-- Campo Asunto -->
            <div class="mb-2">
              <label class="block text-sm font-medium text-gray-700">
                Asunto: <span class="text-red-500">*</span>
              </label>
              <input type="text" class="w-full px-3 py-1 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent transition-all" id="asuntoModal" placeholder="Asunto del correo">
            </div>

            <!-- Editor de texto -->
            <div class="mb-2">
              <label class="block text-sm font-medium text-gray-700">Mensaje:</label>
              <textarea class="summernote w-full rounded-lg border border-gray-300" id="notasfacturaModal" cols="12" rows="6"></textarea>
            </div>
          </div>
        </div>
      </div>

      <div class="modal-footer bg-gray-50 border-t border-gray-200 px-6 pt-4 pb-4 flex justify-end gap-2">
        <button type="button" class="px-4 py-2 border border-gray-300 rounded-lg text-gray-700 font-medium hover:bg-gray-100 transition-colors text-sm" data-dismiss="modal">Cerrar</button>
        <button type="button" class="flex items-center gap-2 px-4 py-2 bg-gradient-to-r from-blue-600 to-blue-700 text-white rounded-lg font-medium hover:from-blue-700 hover:to-blue-800 transition-all shadow-sm text-sm  " onclick="enviarFactura();">
          <i class="material-icons text-sm">send</i>
          Enviar
        </button>
      </div>
    </div>
  </div>
</div>


<div class="modal fade" id="modalAplicaDeposito">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
      <div class="modal-header bg-gray-50 border-b border-gray-200 px-6 py-4">
        <h4 class="modal-title text-lg font-semibold text-gray-900">Nuevo depósito</h4>
        <button type="button" class="close text-gray-400 hover:text-gray-600 transition-colors" data-dismiss="modal" aria-hidden="true">
          <i class="material-icons">close</i>
        </button>
      </div>
      <div class="modal-body px-6 py-4">
        <div class="grid grid-cols-12 gap-4 mb-6">
          <div class="col-span-3">
            <label class="block text-sm font-medium text-gray-700 mb-2">Fecha de pago: <span class="text-red-500">*</span></label>
            <input type="text" class="datetimepicker w-full px-3 py-1  border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent transition-all" id="fecha" placeholder="10/01/2022" />
          </div>
          <div class="col-span-3">
            <label class="block text-sm font-medium text-gray-700 mb-2">Forma de pago: <span class="text-red-500">*</span></label>
            <select id="fpp" class="select2 w-full px-3 py-1 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent transition-all">
              <option value="0">-Selecciona una opción</option>
              @foreach ($data['formapago'] as $fp)
              <option value="{{ $fp->idFormapago }}">{{ $fp->claveSat }} - {{ $fp->nombre }}</option>
              @endforeach
            </select>
          </div>
          <div class="col-span-3">
            <label class="block text-sm font-medium text-gray-700 mb-2">Moneda: <span class="text-red-500">*</span></label>
            <select id="monedaPago" class="select2 w-full px-3 py-1 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent transition-all">
              <option value="0">-Selecciona una opción</option>
              @foreach ($data['monedas'] as $u)
              <option value="{{ $u->id }}">{{ $u->nombre }}</option>
              @endforeach
            </select>
          </div>
          <div class="col-span-3">
            <label class="block text-sm font-medium text-gray-700 mb-2">Tipo de cambio:</label>
            <input type="number" step="any" class="w-full px-3 py-1  border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent transition-all" id="tipo_cambioPago" />
          </div>
        </div>

        <div class="mb-4">
          <button class="flex rounded-md bg-blue-600 px-3 py-2 text-sm font-medium text-white transition hover:bg-blue-700" onclick="verNotasCredito();">
            <i class="material-icons text-sm">add</i>
            Agregar factura
          </button>
        </div>

        <div class="mb-6">
          <div class="overflow-x-auto rounded-lg border border-gray-200 shadow-sm">
            <table class="w-full text-sm">
              <thead class="sticky-top" style="font-size: 12px;">
                <tr class="bg-gradient-to-r from-gray-50 to-gray-100 border-b-2 border-gray-200">
                  <th class="px-4 py-2 text-left font-semibold text-gray-700 uppercase tracking-wide text-[11px]" width="3%"></th>
                  <th class="px-4 py-2 text-left font-semibold text-gray-700 uppercase tracking-wide text-[11px]">Serie</th>
                  <th class="px-4 py-2 text-left font-semibold text-gray-700 uppercase tracking-wide text-[11px]">Folio</th>
                  <th class="px-4 py-2 text-left font-semibold text-gray-700 uppercase tracking-wide text-[11px]">Moneda</th>
                  <th class="px-4 py-2 text-left font-semibold text-gray-700 uppercase tracking-wide text-[11px]">Tipo Cambio</th>
                  <th class="px-4 py-2 text-left font-semibold text-gray-700 uppercase tracking-wide text-[11px]">Saldo</th>
                  <th class="px-4 py-2 text-left font-semibold text-gray-700 uppercase tracking-wide text-[11px]">Monto A Pagar</th>
                </tr>
              </thead>
              <tbody id="bodyTablePagos" class="divide-y divide-gray-200">
              </tbody>
            </table>
          </div>
        </div>

        <div class="bg-blue-50 border border-blue-200 rounded-lg p-4">
          <div class="flex items-center justify-between">
            <span class="text-sm font-semibold text-gray-700 uppercase tracking-wide">Total Depósito:</span>
            <span class="text-lg font-bold text-blue-600" id="labelPagadoSD">$0.00</span>
          </div>
        </div>
      </div>

      <input type="hidden" id="idPagoRealizado">
      <div class="modal-footer bg-white border-t border-blue-200 px-6 pt-2 pb-4 flex justify-end gap-2">
        <button type="button" class="flex items-center gap-2 bg-transparent text-gray-600 hover:text-red-600 border border-gray-300 hover:border-red-500 mr-2 px-4 py-2 rounded-md text-sm font-medium transition-colors duration-200 shadow-sm" data-dismiss="modal">Cerrar</button>
        <button type="button" class="flex items-center gap-2 bg-gradient-to-r from-emerald-600 to-green-600 text-white border border-blue-600 px-4 py-2 rounded-md text-sm font-medium transition-colors duration-200 shadow-sm" onclick="guardarPago();" id="btn_generarPago">
          <i class="material-icons text-sm">save</i>
          Generar
        </button>
        <button type="button" class="flex items-center gap-2 bg-gradient-to-r from-emerald-600 to-green-600 text-white border border-blue-600 px-4 py-2 rounded-md text-sm font-medium transition-colors duration-200 shadow-sm" onclick="timbrarPago();" id="btn_timbrarPago">
          <i class="material-icons text-sm">check_circle</i>
          Timbrar
        </button>
      </div>
    </div>
  </div>
</div>

<div class="modal fade modalEsc" id="modalCancelar">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header bg-gray-50 border-b border-gray-200 px-6 py-4">
        <h4 class="modal-title text-lg font-semibold text-gray-900">Cancelar factura</h4>
        <button type="button" class="close text-gray-400 hover:text-gray-600 transition-colors" data-dismiss="modal" aria-hidden="true">
          <i class="material-icons">close</i>
        </button>
      </div>
      <div class="modal-body">
        <!--<input type="hidden" id="idDocHv">
        <input type="hidden" id="idVentaHv">-->
        <div class="row">
          <div class="col-12">

            <label for="motivo_cancelacion" class="block text-sm font-medium text-gray-700">Motivo de cancelación:<span class="text-danger">*</span></label>
            <select class="select2 w-full px-3 py-1 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent transition-all" id="motivo_cancelacion" onchange="muestraRel();">
              <option value="01">(01) Comprobantes emitidos con errores con relación</option>
              <option value="02" selected>(02) Comprobantes emitidos con errores sin relación</option>
              <option value="03">(03) No se llevó a cabo la operación</option>
              <option value="04">(04) Operación nominativa relacionada en una factura global</option>
            </select>
          </div>
        </div>
        <div class="row mt-2" id="uuidRelaCancelRow" style="display: none;">
          <div class="col-6">
            <label class="block text-sm text-gray-700">Serie:<span class="text-danger">*</span></label>
            <input type="text" class="w-full px-3 py-1  border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent transition-all" id="serieRelaCancel">
          </div>
          <div class="col-6">
            <label class="block text-sm text-gray-700">Folio:<span class="text-danger">*</span></label>
            <input type="text" class="w-full px-3 py-1  border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent transition-all" id="folioRelaCancel">
          </div>
        </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="px-4 py-2 border border-gray-300 rounded-lg text-gray-700 font-medium hover:bg-gray-100 transition-colors text-sm" data-dismiss="modal">Cerrar</button>
        <button type="button" class="px-4 py-2 bg-blue-500 ml-1  text-white rounded-lg font-medium hover:bg-blue-600 transition-colors text-sm" onclick="agregaFacturaCancelacion();" id="btnMuestraFacRelaCancel" style="display: none;">
          <i class="material-icons text-sm">add</i>
          Agregar factura
        </button>
        <button type="button" class="px-4 py-2 bg-red-500 ml-1 text-white rounded-lg font-medium hover:bg-red-600 transition-colors text-sm" onclick="cancelaDocumento();">
          <i class="material-icons text-sm">check_circle</i>
          Cancelar factura
        </button>
      </div>
    </div>
  </div>
</div>
<div class="modal fade" id="modalRelaciones">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header bg-gray-50 border-b border-gray-200 px-6 py-4">
        <h4 class="modal-title text-lg font-semibold text-gray-900" id="titleRelaciones">UUID Relacionados</h4>
        <h4 class="modal-title text-lg font-semibold text-gray-900" id="titleNotacCredito">Aplica a Nota de Credito</h4>
        <button type="button" class="close text-gray-400 hover:text-gray-600" data-dismiss="modal" aria-label="Close">
          <i class="material-icons">close</i>
        </button>
      </div>
      <div class="modal-body px-4 py-2">
        <input type="hidden" id="tipoAccion">
        <div class="mb-2">
          <label class="block text-sm  text-gray-700 mb-1">Relacion:</label>
          <select id="tipoRelacion" class="select2 w-full px-3 py-1 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
            <option value="0">-Selecciona-</option>
            @foreach ($data['tipos_relacion'] as $key => $i)
            <option value="{{ $i->c_tiporelacion }}">{{ $i->c_tiporelacion }} - {{ $i->descripcion }}</option>
            @endforeach
          </select>
        </div>
        <div class="mb-2">
          <div class="overflow-x-auto rounded-lg border border-gray-200 shadow-sm">
            <table class="w-full text-sm table-fixed">
              <thead class="sticky-top">
                <tr class="bg-gradient-to-r from-gray-50 to-gray-100 border-b-2 border-gray-200">
                  <th class="px-4 py-2 text-left font-semibold text-gray-700 uppercase tracking-wide text-[11px]">Serie</th>
                  <th class="px-4 py-2 text-left font-semibold text-gray-700 uppercase tracking-wide text-[11px]">Folio</th>
                  <th class="px-4 py-2 text-left font-semibold text-gray-700 uppercase tracking-wide text-[11px]">UUID</th>
                  <th class="px-4 py-2 text-center font-semibold text-gray-700 uppercase tracking-wide text-[11px]">Acciones</th>
                </tr>
              </thead>
              <tbody id="divBodyRelacionados" class="divide-y divide-gray-200">
              </tbody>
            </table>
          </div>
        </div>
      </div>
      <div class="modal-footer bg-white border-t border-blue-200 px-6 pt-2 pb-4 flex justify-end gap-2">
        <button type="button" class="flex items-center gap-2 bg-blue-500 hover:bg-blue-600 text-white border border-blue-600 px-4 py-2 rounded-md text-sm font-medium transition-colors duration-200 shadow-sm" onclick="verFacturas();">
          <i class="material-icons text-sm">search</i>
          Agregar factura
        </button>
        <button type="button" data-dismiss="modal" class="flex items-center gap-2 bg-gradient-to-r from-emerald-600 to-green-600 text-white border border-blue-600 px-4 py-2 rounded-md text-sm font-medium transition-colors duration-200 shadow-sm">
          <i class="material-icons text-sm">save</i>
          Guardar
        </button>
      </div>
    </div>
  </div>
</div>

<div class="modal fade" id="modalFacturasRelacion">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
      <div class="modal-header bg-gray-50 border-b border-gray-200 px-6 py-4">
        <h4 class="modal-title text-lg font-semibold text-gray-900">Listado de facturas</h4>
        <button type="button" class="close text-gray-400 hover:text-gray-600" data-dismiss="modal" aria-label="Close">
          <i class="material-icons">close</i>
        </button>
      </div>
      <div class="modal-body px-4 py-2">
        <div class="mb-2">
          <div class="overflow-x-auto rounded-lg border border-gray-200 shadow-sm">
            <table class="w-full text-sm">
              <thead class="sticky-top" style="font-size: 12px;">
                <tr class="bg-gradient-to-r from-gray-50 to-gray-100 border-b-2 border-gray-200">
                  <th class="px-4 py-2 text-left font-semibold text-gray-700 uppercase tracking-wide text-[11px]">SERIE</th>
                  <th class="px-4 py-2 text-left font-semibold text-gray-700 uppercase tracking-wide text-[11px]">FOLIO</th>
                  <th class="px-4 py-2 text-left font-semibold text-gray-700 uppercase tracking-wide text-[11px]">FECHA</th>
                  <th class="px-4 py-2 text-left font-semibold text-gray-700 uppercase tracking-wide text-[11px]">IMPORTE</th>
                  <th class="px-4 py-2 text-left font-semibold text-gray-700 uppercase tracking-wide text-[11px]">SALDO</th>
                  <th class="px-4 py-2 text-center font-semibold text-gray-700 uppercase tracking-wide text-[11px]"></th>
                </tr>
              </thead>
              <tbody id="bodyFacturas" class="divide-y divide-gray-200">

              </tbody>
            </table>
          </div>
        </div>
      </div>
      <div class="modal-footer bg-white border-t border-blue-200 px-6 pt-2 pb-4 flex justify-end gap-2">
        <button type="button" class="flex items-center gap-2 bg-blue-500 hover:bg-blue-600 text-white border border-blue-600 px-4 py-2 rounded-md text-sm font-medium transition-colors duration-200 shadow-sm" onclick="agregarFact();" id="btnAgregaFact">
          <i class="material-icons text-sm">add</i>
          Agregar
        </button>
        <button type="button" class="flex items-center gap-2 bg-blue-500 hover:bg-blue-600 text-white border border-blue-600 px-4 py-2 rounded-md text-sm font-medium transition-colors duration-200 shadow-sm" onclick="agregarFact2();" id="btnAgregaFactCancelacion">
          <i class="material-icons text-sm">add</i>
          Agregar
        </button>
      </div>
    </div>
  </div>
</div>


<div class="modal fade" id="modalAplicaciones">
  <div class="modal-dialog">
    <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" id="comprobanteName">Aplicación de notas de crédito</h5>
        <button type="button" class="close text-gray-400 hover:text-gray-600" data-dismiss="modal" aria-label="Close">
          <i class="material-icons">close</i>
        </button>
      </div>
      <div class="modal-body px-4 py-4">
        <div class="mb-4">
          <label class="block text-sm text-center font-semibold text-blue-600 mb-3 text-uppercase">Notas de Crédito Aplicadas</label>
          <div class="overflow-x-auto rounded-lg border border-gray-200 shadow-sm">
            <table class="w-full text-sm table-fixed">
              <thead class="sticky-top">
                <tr class="bg-gradient-to-r from-gray-50 to-gray-100 border-b-2 border-gray-200">
                  <th class="px-4 py-3 text-left font-semibold text-gray-700 uppercase tracking-wide text-[11px]">Serie</th>
                  <th class="px-4 py-3 text-left font-semibold text-gray-700 uppercase tracking-wide text-[11px]">Folio</th>
                  <th class="px-4 py-3 text-left font-semibold text-gray-700 uppercase tracking-wide text-[11px]">Monto</th>
                  <th class="px-4 py-3 text-left font-semibold text-gray-700 uppercase tracking-wide text-[11px]">Fecha</th>
                </tr>
              </thead>
              <tbody id="divBodyAplicados" class="divide-y divide-gray-200">
              </tbody>
            </table>
          </div>
        </div>
      </div>
      <div class="modal-footer bg-white border-t border-blue-200 px-6 pt-2 pb-4 flex justify-end gap-2">
        <button type="button" class="flex items-center gap-2 bg-blue-500 hover:bg-blue-600 text-white border border-blue-600 px-4 py-2 rounded-md text-sm font-medium transition-colors duration-200 shadow-sm" onclick="verNotasCredito();">
          <i class="material-icons text-sm">add</i>
          Agregar nota de crédito
        </button>
        <button type="button" class="flex items-center gap-2 bg-gradient-to-r from-emerald-600 to-green-600 text-white border border-emerald-600 px-4 py-2 rounded-md text-sm font-medium transition-colors duration-200 shadow-sm" onclick="aplicarNotaCredito();">
          <i class="material-icons text-sm">save</i>
          Aplicar
        </button>
      </div>
    </div>
  </div>
</div>

<div class="modal fade" id="modalAplicacionNotas">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
      <div class="modal-header bg-gray-50 border-b border-gray-200 px-6 py-4">
        <h4 class="modal-title text-lg font-semibold text-gray-900">Listado de facturas</h4>
        <button type="button" class="close text-gray-400 hover:text-gray-600" data-dismiss="modal" aria-label="Close">
          <i class="material-icons">close</i>
        </button>
      </div>
      <div class="modal-body px-4 py-2">
        <div class="overflow-x-auto rounded-lg border border-gray-200 shadow-sm">
          <table class="w-full text-sm table-fixed">
            <thead class="sticky-top" style="font-size: 12px;">
              <tr class="bg-gradient-to-r from-gray-50 to-gray-100 border-b-2 border-gray-200">
                <th class="px-4 py-3 text-left font-semibold text-gray-700 uppercase tracking-wide text-[11px]">Serie</th>
                <th class="px-4 py-3 text-left font-semibold text-gray-700 uppercase tracking-wide text-[11px]">Folio</th>
                <th class="px-4 py-3 text-left font-semibold text-gray-700 uppercase tracking-wide text-[11px]">Fecha</th>
                <th class="px-4 py-3 text-left font-semibold text-gray-700 uppercase tracking-wide text-[11px]">Moneda</th>
                <th class="px-4 py-3 text-left font-semibold text-gray-700 uppercase tracking-wide text-[11px]">F.P</th>
                <th class="px-4 py-3 text-left font-semibold text-gray-700 uppercase tracking-wide text-[11px]">M.P</th>
                <th class="px-4 py-3 text-left font-semibold text-gray-700 uppercase tracking-wide text-[11px]">Importe</th>
                <th class="px-4 py-3 text-left font-semibold text-gray-700 uppercase tracking-wide text-[11px]">Saldo</th>
                <th class="px-4 py-3 text-center font-semibold text-gray-700 uppercase tracking-wide text-[11px]"></th>
              </tr>
            </thead>
            <tbody id="bodyFacAplicadas" class="divide-y divide-gray-200">
            </tbody>
          </table>
        </div>
      </div>
      <div class="modal-footer bg-white border-t border-blue-200 px-6 pt-2 pb-4 flex justify-end gap-2">
        <button type="button" class="flex items-center gap-2 bg-transparent text-gray-600 hover:text-red-600 border border-gray-300 hover:border-red-500 mr-2 px-4 py-2 rounded-md text-sm font-medium transition-colors duration-200 shadow-sm" data-dismiss="modal">
          Cerrar
        </button>
        <button type="button" class="flex items-center gap-2 bg-gradient-to-r from-emerald-600 to-green-600 text-white border border-emerald-600 px-4 py-2 rounded-md text-sm font-medium transition-colors duration-200 shadow-sm" onclick="agregarNota();">
          <i class="material-icons text-sm">add</i>
          Agregar
        </button>
      </div>
    </div>
  </div>
</div>

<div class="modal fade" id="modalLeyendas">
  <div class="modal-dialog modal-sm">
    <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">
          Leyendas Documentos
        </h5>
        <button type="button" class="close text-gray-400 hover:text-gray-600" data-dismiss="modal" aria-label="Close">
          <i class="material-icons">close</i>
        </button>
      </div>
      <div class="modal-body px-4 py-2">
        <div class="mb-2">
          <label class="block text-sm text-gray-700 mb-1">Leyenda:</label>
          <select id="leye" class="select2 w-full px-3 py-1 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
            <option value="0">-Selecciona-</option>
            @foreach ($data['documentos_leyenda'] as $f)
            <option value="{{ $f->id }}" ley="{{ base64_encode(utf8_decode($f->leyenda)) }}">{{ substr($f->leyenda,0,30).'...' }}</option>
            @endforeach
          </select>
        </div>
      </div>
      <div class="modal-footer bg-white border-t border-blue-200 px-6 pt-2 pb-4 flex justify-end gap-2">
        <button type="button" class="flex items-center gap-2 bg-gray-500 hover:bg-gray-600 text-white border border-gray-600 px-4 py-2 rounded-md text-sm font-medium transition-colors duration-200 shadow-sm" data-dismiss="modal">
          <i class="material-icons text-sm">close</i>
          Cerrar
        </button>
        <button type="button" class="flex items-center gap-2 bg-gradient-to-r from-emerald-600 to-green-600 text-white border border-emerald-600 px-4 py-2 rounded-md text-sm font-medium transition-colors duration-200 shadow-sm" onclick="agregaLeyenda();">
          <i class="material-icons text-sm">save</i>
          Agregar
        </button>
      </div>
    </div>
  </div>
</div>

<div class="modal fade" id="modalProgramar">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h4 class="modal-title">Programar Factura</h4>
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
      </div>
      <div class="modal-body">
        <div class="row">
          <div class="col-md-12">
            <div class="form-group filled bmd-form-group">
              <label class="bmd-label-static">Frecuencia:</label>
              <select id="periocidadF" class="select2 w-full px-3 py-1 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" onchange="muestraanio();">
                <option value="1">Mensual</option>
                <option value="2">Anual</option>
              </select>
            </div>
          </div>
        </div>
        <div class="row">
          <div class="col-md-12">
            <div class="form-group filled bmd-form-group">
              <label class="bmd-label-static">Fecha Inicio:<span class="text-danger">*</span></label>
              <input type="text" class="form-control datetimepicker" id="fechaInicioPrograma">
            </div>
          </div>
        </div>
        <div class="row">
          <div class="col-md-12">
            <div class="form-group filled bmd-form-group">
              <label class="bmd-label-static">Repeticiones:<span class="text-danger">*</span></label>
              <input type="text" class="form-control" id="periocidad">
            </div>
          </div>
        </div>
        <div class="row">
          <div class="col-md-12">
            <div class="form-group filled bmd-form-group">
              <label class="bmd-label-static">Concepto:<span class="text-danger">*</span></label>
              <input type="text" class="form-control" id="concepto_programa">
            </div>
          </div>
        </div>
        <div class="row">
          <div class="col-md-12">
            <div class="form-group filled bmd-form-group">
              <label class="bmd-label-static">Complementar concepto:</label>
              <!--<select id="complementoConcepto" class="select2 w-full px-3 py-1 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
                    <option value="0">-Selecciona-</option>
                    <option value="1">Fecha Completa</option>
                    <option value="2">Mes y Año</option>
                  </select>-->
            </div>
          </div>
        </div>
        <div class="row">
          <div class="col-md-6">
            <div class="form-group filled bmd-form-group">
              <label class="bmd-label-static">Mes:</label>
              <select id="complementoConceptoMes" class="select2 w-full px-3 py-1 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
                <option value="0">-Selecciona-</option>
                <option value="1">ENERO</option>
                <option value="2">FEBRERO</option>
                <option value="3">MARZO</option>
                <option value="4">ABRIL</option>
                <option value="5">MAYO</option>
                <option value="6">JUNIO</option>
                <option value="7">JULIO</option>
                <option value="8">AGOSTO</option>
                <option value="9">SEPTIEMBRE</option>
                <option value="10">OCTUBRE</option>
                <option value="11">NOVIEMBRE</option>
                <option value="12">DICIEMBRE</option>
              </select>
            </div>
          </div>
          <div class="col-md-6" id="anioconcepto" style="display: none;">
            <div class="form-group filled bmd-form-group">
              <label class="bmd-label-static">Año:</label>
              <select id="complementoConceptoAnio" class="select2 w-full px-3 py-1 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
                <option value="0">-Selecciona-</option>
                <option value="2024">2025</option>
                <option value="2026">2026</option>
                <option value="2027">2027</option>
                <option value="2028">2028</option>
                <option value="2029">2029</option>
                <option value="2030">2030</option>
              </select>
            </div>
          </div>
        </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Cerrar</button>
        <button type="button" class="btn btn-primary" onclick="guardarFactProgramada();">Guardar</button>
      </div>
    </div>
  </div>
</div>

<div class="modal fade" id="modalEstado" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-sm">
    <div class="modal-content">
      <div class="modal-header bg-gray-50 border-b border-gray-200 px-6 py-4">
        <h4 class="modal-title text-lg font-semibold text-gray-900">Agregar estado</h4>
        <button type="button" class="close text-gray-400 hover:text-gray-600 transition-colors" data-dismiss="modal" aria-hidden="true">
          <i class="material-icons">close</i>
        </button>
      </div>
      <div class="modal-body">
        <div class="mb-2">
          <label for="examplePass" class="block text-sm text-gray-700 mb-1">Descripción: <span class="text-danger">*</span></label>
          <input type="text" class="w-full px-3 py-1  border border-gray-300 rounded-md" id="descripcionestado">
        </div>
        <div class="mb-2">
          <label for="examplePass" class="block text-sm text-gray-700 mb-1">Clave: <span class="text-danger">*</span></label>
          <input type="text" class="w-full px-3 py-1  border border-gray-300 rounded-md" id="claveestado">
        </div>
        <div class="mb-2">
          <label for="examplePass" class="block text-sm text-gray-700 mb-1">Pais: <span class="text-danger">*</span></label>
          <select id="id_pais" class="select2 w-full px-3 py-1 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" data-width="100%" data-style="select-with-transition" title="País:" data-live-search="true">
            @foreach($data['paises'] as $p)
            <option value="{{$p->idpais}}" nombre="{{$p->pais}}">{{$p->pais}}</option>
            @endforeach
          </select>
        </div>
      </div>
      <div class="modal-footer bg-white border-t border-blue-200 px-6 pt-2 pb-4 flex justify-end gap-2">
        <button type="button" class="flex items-center gap-2 bg-gray-500 hover:bg-gray-600 text-white border border-gray-600 px-4 py-2 rounded-md text-sm font-medium transition-colors duration-200 shadow-sm" data-dismiss="modal">
          <i class="material-icons text-sm">close</i>
          Cerrar
        </button>
        <button type="button" class="flex items-center gap-2 bg-gradient-to-r from-emerald-600 to-green-600 text-white border border-emerald-600 px-4 py-2 rounded-md text-sm font-medium transition-colors duration-200 shadow-sm" onclick="guardarEstamuni(2);">
          <i class="material-icons text-sm">save</i>
          Guardar
        </button>
      </div>
    </div>
  </div>
</div>

<div class="modal fade" id="modalMunicipio" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-sm">
    <div class="modal-content">
      <div class="modal-header bg-gray-50 border-b border-gray-200 px-6 py-4">
        <h4 class="modal-title text-lg font-semibold text-gray-900">Agregar municipio</h4>
        <button type="button" class="close text-gray-400 hover:text-gray-600 transition-colors" data-dismiss="modal" aria-hidden="true">
          <i class="material-icons">close</i>
        </button>
      </div>
      <div class="modal-body">
        <div class="mb-2">
          <label for="examplePass" class="block text-sm text-gray-700 mb-1">Descripción: <span class="text-danger">*</span></label>
          <input type="text" class="w-full px-3 py-1  border border-gray-300 rounded-md" id="descripcionmunicipio">
        </div>

        <div class="mb-2">
          <label for="examplePass" class="block text-sm text-gray-700 mb-1">Estado: <span class="text-danger">*</span></label>
          <select id="id_estado" class="select2 w-full px-3 py-1 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" data-width="100%" data-style="select-with-transition" title="Estado:" data-live-search="true">
            @foreach($data['estados'] as $es)
            <option value="{{$es->idestado}}">{{$es->estado}}</option>
            @endforeach
          </select>
        </div>
      </div>
      <div class="modal-footer bg-white border-t border-blue-200 px-6 pt-2 pb-4 flex justify-end gap-2">
        <button type="button" class="flex items-center gap-2 bg-gray-500 hover:bg-gray-600 text-white border border-gray-600 px-4 py-2 rounded-md text-sm font-medium transition-colors duration-200 shadow-sm" data-dismiss="modal">
          <i class="material-icons text-sm">close</i>
          Cerrar
        </button>
        <button type="button" class="flex items-center gap-2 bg-gradient-to-r from-emerald-600 to-green-600 text-white border border-emerald-600 px-4 py-2 rounded-md text-sm font-medium transition-colors duration-200 shadow-sm" onclick="guardarEstamuni(3);">
          <i class="material-icons text-sm">save</i>
          Guardar
        </button>
      </div>
    </div>
  </div>
</div>

<div class="modal fade" id="modalPlazo">
  <div class="modal-dialog modal-sm">
    <div class="modal-content">
      <div class="modal-header bg-gray-50 border-b border-gray-200 px-6 py-4">
        <h4 class="modal-title text-lg font-semibold text-gray-900">Agregar plazo</h4>
        <button type="button" class="close text-gray-400 hover:text-gray-600 transition-colors" data-dismiss="modal" aria-hidden="true">
          <i class="material-icons">close</i>
        </button>
      </div>
      <div class="modal-body">
        <div class="mb-2">
          <label for="examplePass" class="block text-sm text-gray-700 mb-1">Descripción: <span class="text-danger">*</span></label>
          <input type="text" class="w-full px-3 py-1  border border-gray-300 rounded-md" id="descPlazo">
        </div>
        <div class="mb-2">
          <label for="examplePass" class="block text-sm text-gray-700 mb-1">Dias: <span class="text-danger">*</span></label>
          <input type="text" class="w-full px-3 py-1  border border-gray-300 rounded-md" id="diasPlazo">
        </div>
      </div>
      <div class="modal-footer bg-white border-t border-blue-200 px-6 pt-2 pb-4 flex justify-end gap-2">
        <button type="button" class="flex items-center gap-2 bg-gray-500 hover:bg-gray-600 text-white border border-gray-600 px-4 py-2 rounded-md text-sm font-medium transition-colors duration-200 shadow-sm" data-dismiss="modal">
          <i class="material-icons text-sm">close</i>
          Cerrar
        </button>
        <button type="button" class="flex items-center gap-2 bg-gradient-to-r from-emerald-600 to-green-600 text-white border border-emerald-600 px-4 py-2 rounded-md text-sm font-medium transition-colors duration-200 shadow-sm" onclick="guardarPlazo();">
          <i class="material-icons text-sm">save</i>
          Guardar
        </button>
      </div>
    </div>
  </div>
</div>

@include('operaciones.carta_porte')
<style>
  /* td {
    font-size: .8em !important;
  }

  table>thead>tr>th {
    font-size: .95em !important;
  } */

  /* #gridFacturas>tbody>tr {
    cursor: pointer;
  } */

  #gridFacturas {
    display: block;
    /* overflow-x: auto; */
    /* overflow-y: auto; */
    /* height: 500px; */
    overflow: scroll;
  }

  #gridFacturasPendientes {
    display: block;
    height: 400px;
    overflow: scroll;
  }

  #tableDeposito {
    display: block;
    height: 200px;
    overflow: scroll;
  }

  /* table>thead>tr>th {
    font-size: .8em !important;
  }

  table>tbody>tr>td {
    font-size: .8em !important;
  } */
  .swal2-popup.swal2-modern {
    width: 24rem !important;
    max-width: calc(100vw - 2rem) !important;
    border-radius: 14px;
    border: 1px solid #e2e8f0;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    box-shadow: 0 18px 44px rgba(15, 23, 42, 0.22);
    padding: 1.05rem 1rem 0.95rem;
  }

  .swal2-popup.swal2-modern .swal2-title {
    font-size: 1.04rem;
    font-weight: 700;
    color: #0f172a;
    margin-bottom: 0.3rem;
  }

  .swal2-popup.swal2-modern .swal2-html-container,
  .swal2-popup.swal2-modern #swal2-content {
    color: #475569;
    font-size: 0.88rem;
    line-height: 1.4;
    margin-top: 0;
  }

  .swal2-popup.swal2-modern .swal2-actions {
    gap: 0.45rem;
    margin-top: 0.8rem;
  }

  .swal2-popup.swal2-modern .swal2-styled.swal2-confirm,
  .swal2-popup.swal2-modern .swal2-modern-confirm {
    border-radius: 9px !important;
    padding: 0.5rem 0.9rem !important;
    font-size: 0.84rem !important;
    font-weight: 600 !important;
    box-shadow: 0 6px 14px rgba(15, 23, 42, 0.16);
  }

  .swal2-popup.swal2-modern .swal2-styled.swal2-cancel,
  .swal2-popup.swal2-modern .swal2-modern-cancel {
    border-radius: 9px !important;
    padding: 0.5rem 0.9rem !important;
    font-size: 0.84rem !important;
    font-weight: 600 !important;
    background: #e2e8f0 !important;
    color: #0f172a !important;
    box-shadow: none;
  }

  .swal2-popup.swal2-modern .swal2-icon {
    margin: 0.2rem auto 0.65rem;
    transform: scale(0.9);
  }

  .swal2-popup.swal2-modern .swal2-icon.swal2-warning {
    border-color: #f59e0b;
    color: #f59e0b;
  }

  .swal2-popup.swal2-modern .swal2-icon.swal2-success {
    border-color: #16a34a;
    color: #16a34a;
  }

  .swal2-popup.swal2-modern .swal2-icon.swal2-error {
    border-color: #dc2626;
    color: #dc2626;
  }
</style>

@endsection

@push('js')
<!-- include summernote css/js -->
<link href="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote.min.js"></script>

<script>
  (function initModernSwalTheme() {
    if (typeof Swal === 'undefined' || typeof Swal.fire !== 'function' || Swal.__retencionesModernized) {
      return;
    }

    const originalFire = Swal.fire.bind(Swal);

    function normalizeSwalArgs(args) {
      if (args.length === 1 && typeof args[0] === 'object' && args[0] !== null) {
        return Object.assign({}, args[0]);
      }

      return {
        title: args[0] || '',
        text: args[1] || '',
        icon: args[2] || undefined
      };
    }

    function mergePopupClass(customClass) {
      const safeClass = customClass || {};
      const popupClass = safeClass.popup ? String(safeClass.popup) : '';

      return Object.assign({}, safeClass, {
        popup: ('swal2-modern ' + popupClass).trim(),
        confirmButton: ('swal2-modern-confirm ' + (safeClass.confirmButton || '')).trim(),
        cancelButton: ('swal2-modern-cancel ' + (safeClass.cancelButton || '')).trim()
      });
    }

    Swal.fire = function() {
      const config = normalizeSwalArgs(Array.prototype.slice.call(arguments));

      if (config.type && !config.icon) {
        config.icon = config.type;
      }

      config.customClass = mergePopupClass(config.customClass);

      if (typeof config.allowOutsideClick === 'undefined') {
        config.allowOutsideClick = true;
      }

      if (typeof config.allowEscapeKey === 'undefined') {
        config.allowEscapeKey = true;
      }

      if (Number.isFinite(config.timer)) {
        config.timer += 2000;
      }

      return originalFire(config);
    };

    Swal.__retencionesModernized = true;
  })();

  let activeSwalLoadings = 0;

  function renderLoadingSwal(text = 'Procesando, por favor espera...') {
    Swal.fire({
      title: 'Cargando',
      text: text,
      allowOutsideClick: false,
      allowEscapeKey: false,
      showConfirmButton: false,
      timer: 1200,
      timerProgressBar: true,
      didOpen: () => {
        Swal.showLoading();
      },
      willClose: () => {
        // Si la petición sigue activa al terminar el timer, volvemos a mostrar el loader.
        if (activeSwalLoadings > 0) {
          setTimeout(() => {
            if (activeSwalLoadings > 0 && (!Swal.isVisible() || !Swal.isLoading())) {
              renderLoadingSwal(text);
            }
          }, 60);
        }
      }
    });
  }

  function showLoadingSwal(text = 'Procesando, por favor espera...') {
    activeSwalLoadings += 1;

    if (Swal.isVisible() && Swal.isLoading()) {
      return;
    }

    renderLoadingSwal(text);
  }

  function hideLoadingSwal() {
    activeSwalLoadings = Math.max(0, activeSwalLoadings - 1);

    if (activeSwalLoadings === 0 && Swal.isVisible() && Swal.isLoading()) {
      Swal.close();
    }
  }

  $.ajaxSetup({
    beforeSend: function() {
      showLoadingSwal();
    },
    complete: function() {
      setTimeout(function() {
        hideLoadingSwal();
      }, 1000);
    }
  });

  $(document).ready(function() {
    // material-dashboard activa perfectScrollbar en .main-panel al cargar y eso invalida sticky.
    if (typeof $.fn.perfectScrollbar === 'function' && $('.main-panel').hasClass('ps')) {
      $('.main-panel').perfectScrollbar('destroy');
    }
    $('html').removeClass('perfect-scrollbar-on').addClass('perfect-scrollbar-off');

    //loadGrid();

    // Inicializar Select2 para campos select dinámicos
    $('.select2').select2({
      width: '100%',
      placeholder: '-Selecciona-'
    });

    // En algunos casos el dropdown puede quedar abierto; lo cerramos al seleccionar cliente.
    $('#buscaCliente').on('select2:select change', function() {
      $(this).select2('close');
    });

    if ($('#idVentaCargada').val() != '') {
      cargaVenta($('#idVentaCargada').val());
    }

    if ($('#dias_vigencia_csd').val() < 16) {
      Swal.fire({
        title: 'El certificado esta apunto de caducar. Quedan ' + $('#dias_vigencia_csd').val() + ' dias.',
        type: 'warning',
        timer: 7000
      })

    }
    $('.summernote').summernote({
      toolbar: [
        ['style', ['style']],
        ['font', ['bold', 'italic', 'underline', 'clear']],
        ['fontsize', ['fontsize']],
        ['color', ['color']],
        ['para', ['ul', 'ol', 'paragraph']],
        // ['height', ['height']],
        ['table', ['table']],
        // ['insert', ['link', 'picture', 'video', 'hr']],
        // ['view', ['fullscreen', 'codeview', 'help']],
        // ['misc', ['undo', 'redo']]
      ]
    });
    $(document).on('click', '.modo-ganancia', function(event) {
      var $this = $(this); // Cache del elemento para optimización
      var modoActual = $this.data('modo'); // Uso de data-* para atributos personalizados
      var nuevoModo = modoActual == 'cantidad' ? 'porcentaje' : 'cantidad';
      console.log(nuevoModo)
      $this.data('modo', nuevoModo);
      $this.toggleClass('fa-dollar fa-percent');

      if (nuevoModo == 'porcentaje') {

      } else {

      }
      calculaTotales();
      return false; // Evitar el comportamiento por defecto del enlace

    });

    $('.ivasrets').mousedown(function(e) {

      var $self = $(this);
      if ($self.is(':checked')) {
        var uncheck = function() {
          setTimeout(function() {
            $self.removeAttr('checked');
          }, 0);
        };
        var unbind = function() {
          $self.unbind('mouseup', up);
        };
        var up = function() {
          uncheck();
          unbind();
        };
        $self.bind('mouseup', up);
        $self.one('mouseout', unbind);
      }
    });

    $('input[type=radio]').click(function() {

      if (this.previous) {
        this.checked = false;
      }
      this.previous = this.checked;
    });
    var date = new Date();
    $('.datetimepicker').datetimepicker({
      "defaultDate": new Date(),
      format: 'YYYY-MM-DD',
      icons: {
        time: "fa fa-clock-o",
        date: "fa fa-calendar",
        up: "fa fa-chevron-up",
        down: "fa fa-chevron-down",
        previous: 'fa fa-chevron-left',
        next: 'fa fa-chevron-right',
        today: 'fa fa-screenshot',
        clear: 'fa fa-trash',
        close: 'fa fa-remove'
      }
    });

  });
  $("#buscaCliente").on("change", function() {
    getRfc()
  });


  /*$(document).keyup(function(event) {
      if ($(".itemsInput___").is(":focus") && event.key == "Enter") {
        //idcontador = $(this).attr('contador')

        idcontador = $(this).attr('contador')
        alert($(this).val())
        $.ajax({
          url: '{{ url('facturacion/operaciones/busca_producto_codigo') }}',
          type: 'POST',
          dataType: 'json',
          data: {codigo: $(".itemsInput").is(":focus").val()},
        })
        .done(function(resp) {
          console.log(resp);
          if(resp.estatus > 0){
            $('#desc_'+idcontador).val(resp.data.descripcion)
            $('#cant_'+idcontador).val(1)
            $('#precio_'+idcontador).val(resp.data.subtotal)
            $('#subtotal_'+idcontador).val(resp.data.subtotal)
            
          }else{
            Swal.fire({
                title: 'El producto no existe',
                type: 'warning',
                timer: 7000
            })
            return false;
          }
        })
        .fail(function() {
          console.log("error");
        })
 .always(function() {
          console.log("complete");
        });
      }
  });*/
  let clicando = false
  $('#btnFactura,#btnVenta,#btnPreFactura').click(function() {
    console.log($(this).attr('id'))
    console.log('847477575757')
    if (clicando == false) {
      clicando = true
      var idcliente = $('#buscaCliente').val()
      if (idcliente == '0') {
        Swal.fire({
          title: 'Selecciona un cliente',
          type: 'warning',
          timer: 1000
        })
        clicando = false
        return false;
      }
      var $this = $('#modo-descuento'); // Cache del elemento para optimización
      var modoDescuento = $this.data('modo');
      var tipodocumento = $('#tipodocumento').val()
      var serie = $('#serie').val()
      var moneda = $('#moneda').val()
      var tipo_cambio = $('#tipo_cambio').val()
      var usocfdi = $('#usocfdi').val()
      var metodopago = $('#metodopago').val()
      var formapago = $('#formapago').val()
      var descuentoTotal = $('#descuentodescuento').val()

      var ivaret = $('input[name=ivasretenidos]:checked').val()
      var ivaretId = 0
      if (ivaret === undefined) {
        ivaret = 0
        ivaretId = 0
      } else {
        ivaretId = $('input[name=ivasretenidos]:checked').attr('idimpuesto')
      }
      var tieneIsr = $('.isrcheck').is(':checked')
      if (tieneIsr) {
        isr = $('.isrcheck').val()
        isrId = $('.isrcheck').attr('idimpuesto')
      } else {
        isr = 0;
        isrId = 0;
      }



      ish = $('#porcentajeISH').val()
      ishId = $('#porcentajeISH option:selected').attr('idish');


      //var tieneIsh = $('.ishcheck').is(':checked')
      /*if(tieneIsh){
        //alert('tiene')
        ish = $('.ishcheck').val()
        ishId = $('.ishcheck').attr('idimpuesto')
      }else{
        //alert('no tiene')
        ish = 0;
        ishId = 0;
      }*/

      var items = new Array
      contador = 0;
      $('.itemsFact').each(function(index, el) {
        id = $(this).attr('contador')
        if ($('#code_' + id).val() != '') {
          dat = {
            idprod: $('#code_' + id).attr('idprod'),
            codigo: $('#code_' + id).val(),
            nombre: $('#desc_' + id).val(),
            cantidad: $('#cant_' + id).val(),
            precio_unitario: $('#precio_' + id).val(),
            iva: $('#code_' + id).attr('iva'),
            ivar: ivaret,
            isr: isr,
            descuento: $('#descuento_' + id).val(),
            ivaret_id: ivaretId,
            isr_id: isrId,
            factor: $('#code_' + id).attr('factor'),
          }
          items.push(dat)
          contador++;
        }
      });
      if (contador < 1) {
        Swal.fire({
          title: 'Agrega al menos un producto',
          type: 'warning',
          timer: 1000
        })
        clicando = false
        return false;
      }

      if (metodopago == null) {
        Swal.fire({
          title: 'Selecciona un metodo de pago.',
          type: 'warning',
          timer: 1000
        })
        clicando = false
        return false;
      }
      console.log(items)
      console.log(modoDescuento)

      var tipoRelacionCfdi = $('#tipoRelacion').val()
      var relaciones = new Array()
      if (tipoRelacionCfdi != '0') {
        $(".agregadas_relacionadas").each(function() {
          if ($(this).attr('uuid') != '') {
            relaciones.push($(this).attr('uuid'))
          }
        })
      }
      if (tipoRelacionCfdi != '0') {
        if (relaciones.length == 0) {
          Swal.fire({
            title: 'Agrega al menos una factura para relacionar',
            type: 'error',
            timer: 7000
          })
          return false;
        }
      }


      //alert(isr)
      //clicando = false
      //return false;
      var accion = $(this).attr('id')
      if (accion == 'btnPreFactura') {
        tipodocumento = '4'
      }
      var obser = $('#notas').val();
      if (tipodocumento == '2' || tipodocumento == '4') {
        url = '{{ url("facturacion/operaciones/guardar") }}'
      } else {
        url = '{{ url("facturacion/operaciones/timbrar_sin_venta") }}'
      }
      if ($('#concartaporte').val() == '1') {
        console.log('entro')
        var dataCartaPorte = {};
        dataCartaPorte['generales'] = {};
        dataCartaPorte['generales']['IdCCP'] = $('#IdCCP').val();
        console.log('icccc')
        dataCartaPorte['generales']['TranspInternac'] = $('#transInternacional').val();
        console.log(dataCartaPorte)
        var totalKm = 0

        var ubicaciones = new Array
        contaubis = 0
        $('.ubiAdded').each(function(index, el) {
          idUbi = $(this).attr('idubi')
          if ($('#ubi_' + idUbi).val() != 0) {
            dat = {
              TipoUbicacion: ($('#ubi_' + idUbi).val() == 1) ? 'Origen' : 'Destino',
              IDUbicacion: $('#folio_' + idUbi).val(),
              RFCRemitenteDestinatario: $('#rfc_' + idUbi).val(),
              NombreRemitenteDestinatario: $('#nombre_' + idUbi).val(),
              FechaHoraSalidaLlegada: $('#fechasalida_' + idUbi).val(),
              DistanciaRecorrida: $('#km_' + idUbi).val(),
              cp: $('#cp_' + idUbi).val(),
              estado: $('#estadoubi_' + idUbi).val(),
              pais: $('#paisubi_' + idUbi).val()
            }
            ubicaciones.push(dat)
            contaubis++;
            totalKm += parseFloat($('#km_' + idUbi).val())
          }
        });
        if (contaubis == 0) {
          Swal.fire({
            title: 'Agregar ubicaciones a la carta porte.',
            type: 'error',
            timer: 7000
          })
          clicando = false
          return false;
        }
        dataCartaPorte['ubicaciones'] = ubicaciones;
        dataCartaPorte['generales']['TotalDistRec'] = totalKm

        var mercancias = new Array
        contamerca = 0
        $('.mercaAdded').each(function(index, el) {
          idMerca = $(this).attr('idmerca')
          if ($('#codigo_' + idMerca).val() != 0) {
            unisat = $('#unidad_' + idMerca).val().split(" - ")
            dat = {
              BienesTransp: $('#folio_' + idMerca).val(),
              Descripcion: $('#desc_' + idMerca).val(),
              Cantidad: $('#cantidad_' + idMerca).val(),
              ClaveUnidad: unisat[0],
              PesoEnKg: $('#peso_' + idMerca).val(),
              Unidad: unisat[1],
              //Dimensiones: $('#folio_'+idMerca).val(),
              //ValorMercancia: $('#folio_'+idMerca).val(),
              //Moneda: $('#folio_'+idMerca).val(),
            }
            contamerca++;
            mercancias.push(dat)
          }
        });
        if (contamerca == 0) {
          Swal.fire({
            title: 'Agregar mercancías a la carta porte.',
            type: 'error',
            timer: 7000
          })
          clicando = false
          return false;
        }
        dataCartaPorte['mercancias'] = mercancias;

        dataCartaPorte['figuraTransportista'] = {};
        dataCartaPorte['figuraTransportista']['TipoFigura'] = $('#tipoOperador').val();
        dataCartaPorte['figuraTransportista']['RFCFigura'] = $('#rfcOperador').val();
        dataCartaPorte['figuraTransportista']['NumLicencia'] = $('#noLicencia').val();
        dataCartaPorte['figuraTransportista']['NombreFigura'] = $('#nombreOperador').val();
        dataCartaPorte['figuraTransportista']['NumRegIdTribFigura'] = $('#idfiscal').val();

        dataCartaPorte['autotransporte'] = {};
        dataCartaPorte['autotransporte']['permisoSCT'] = $('#autotransportePermiso').val();
        dataCartaPorte['autotransporte']['numeroPermisoSCT'] = $('#autotransporteNumero').val();

        dataCartaPorte['vehiculo'] = {};;
        dataCartaPorte['vehiculo']['ConfigVehicular'] = $('#configVehicular option:selected').attr('clave')
        dataCartaPorte['vehiculo']['PesoBrutoVehicular'] = $('#pesoBruto').val();
        dataCartaPorte['vehiculo']['PlacaVM'] = $('#placaVehicular').val();
        dataCartaPorte['vehiculo']['AnioModeloVM'] = $('#anioVehiculo').val();
        dataCartaPorte['vehiculo']['aseguradora'] = $('#aseguradora').val();
        dataCartaPorte['vehiculo']['poliza'] = $('#poliza').val();

        dataCartaPorte['totales_mercancias'] = {};
        dataCartaPorte['totales_mercancias']['PesoBrutoTotal'] = $('#brutoTotal').val();
        dataCartaPorte['totales_mercancias']['UnidadPeso'] = $('#unidadPeso option:selected').attr('clave')
        dataCartaPorte['totales_mercancias']['NumTotalMercancias'] = $('#totalMercancias').val();
        dataCartaPorte['totales_mercancias']['IDOrigen'] = $('#poloOrigen option:selected').attr('folio')
        dataCartaPorte['totales_mercancias']['IDDestino'] = $('#poloDestino option:selected').attr('folio')

      } else {
        var dataCartaPorte = '';
      }
      var plazo = $('#plazo').val()

      $.ajax({
          url: url,
          type: 'POST',
          dataType: 'json',
          data: {
            items: items,
            idcliente: idcliente,
            tipodocumento: tipodocumento,
            serie: serie,
            moneda: moneda,
            usocfdi: usocfdi,
            metodopago: metodopago,
            formapago: formapago,
            total: $('#totaltotal').val(),
            mododescuento: modoDescuento,
            descuento_total: descuentoTotal,
            relaciones: relaciones,
            tipoRelacionCfdi: tipoRelacionCfdi,
            ivaret: ivaret,
            isr: isr,
            accion: accion,
            obser: obser,
            tipoVentaCargada: $('#tipoVentaCargada').val(),
            idVentaCargada: $('#idVentaCargada').val(),
            tipo_cambio: tipo_cambio,
            dias_timbrado: $('#diasTimbrado').val(),
            tienecartaporte: $('#concartaporte').val(),
            cartaporte: dataCartaPorte,
            plazo: plazo,
            ish: ish,
            ishId: ishId,
          },
        })
        .done(function(resp) {
          console.log("success");
          if (tipodocumento == '1' || tipodocumento == '3') {

            if (resp.success == 1) {
              $('#divProgramar').show()
              $('#divPrefactura').hide()
              $('#divDiasTimbrado').hide()

              data = {
                items: items,
                idcliente: idcliente,
                tipodocumento: tipodocumento,
                serie: serie,
                moneda: moneda,
                usocfdi: usocfdi,
                metodopago: metodopago,
                formapago: formapago,
                total: $('#totaltotal').val(),
                mododescuento: modoDescuento,
                descuento_total: descuentoTotal,
                obser: obser,
                plazo: plazo,
                ish: ish,
                ishId: ishId,
              }
              guardarVenta(data, resp);
              clicando = false
              $('#soloventa').val('')
            } else {
              setTimeout(() => {}, 1000);
              Swal.fire({
                title: resp.error + ' - ' + resp.mensaje,
                type: 'error',
                timer: 7000
              })
              clicando = false
              return false;
            }
          } else {
            if (resp.estatus > 0) {
              $('#idPrefact').val(resp.estatus)
              $('.cardsEstatus').hide()
              if (tipodocumento != '2') {

                $('#btnFactura').hide()
                $('#btnPreFactura').hide()
                $('#divDiasTimbrado').hide()
                if (accion == 'btnPreFactura') {
                  //$('#divPrefactura').show()
                  timbrar(resp.estatus, 1);

                } else {
                  timbrar(resp.estatus, 0);

                }
                $('#soloventa').val('')
                clicando = false
              } else {
                $('#urlPdfFact').val(resp.rutapdf)
                $('#soloventa').val(resp.estatus)
                $('#btnVentaTimbrar').show()
                $('#btnVenta').hide()

                $('#idPrefact').val(resp.estatus)
                modalComprobanteFact2(resp.rutapdf, resp.estatus, 2, resp.seriefolio)
                Swal.fire({
                  title: 'Exito!',
                  text: 'Venta guardado con Exito!',
                  type: 'success',
                  icon: 'success',
                  timer: 7000
                })
              }
              $('#estatusGenerada').show()
              $('.idDocumento').html(resp.seriefolio)
              $('#divArchivos').show()
              $('#divDeposito').show()
              $('#divCancelar').show()
              $('#divNuevodocumento').show()

              clicando = false
            }
          }

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

    }
  })

  $(document).on('keypress', '.itemsInput', function(event) {
    if (event.keyCode === 13) {
      idcontador = $(this).attr('contador')
      eee = $(this)
      $.ajax({
          url: '{{ url("facturacion/operaciones/busca_producto_codigo") }}',
          type: 'POST',
          dataType: 'json',
          data: {
            codigo: $(this).val()
          },
        })
        .done(function(resp) {
          console.log(resp);
          if (resp.estatus > 0) {
            $('#desc_' + idcontador).val(resp.data.descripcion)
            $('#cant_' + idcontador).val(1)
            $('#precio_' + idcontador).val(parseFloat(resp.data.subtotal).toFixed(2))
            $('#subtotal_' + idcontador).val(parseFloat(resp.data.subtotal).toFixed(2))
            $('#code_' + idcontador).attr('idprod', resp.data.id)
            $.each(resp.data.impuestos, function(index, val) {
              $(eee).attr('iva', val.impuesto.tasa)
              $(eee).attr('factor', val.impuesto.factor)
            });
            calculaTotales();
          } else {
            Swal.fire({
              title: 'El producto no existe',
              type: 'warning',
              timer: 1000
            })
            return false;
          }
        })
        .fail(function() {
          console.log("error");
        })
        .always(function() {
          console.log("complete");
        });

    }
  })


  $('#buscadorProducto').on('keypress', function(event) {
    if (event.keyCode === 13) {
      //if($('#buscadorProducto').val()!=''){
      $.ajax({
          url: '{{ url("facturacion/operaciones/busca_producto") }}',
          type: 'POST',
          dataType: 'json',
          data: {
            term: $('#buscadorProducto').val()
          },
        })
        .done(function(resp) {
          console.log(resp);
          $('#tableBuscadorProductosBody').html('')
          if (resp.data.length > 0) {
            var html = '';
            $('#tableBuscadorProductosBody').html('')
            $.each(resp.data, function(index, val) {
              html += '<tr>'
              html += '<td>' + val.codigo + '</td>'
              html += '<td>' + val.descripcion + '</td>'
              html += '<td>' + numberFormat(val.subtotal) + '</td>'
              html += '<td><button class="btn btn-primary btn-sm" onclick="agregaProdBuscador(\'' + val.codigo + '\')">+</button></td>'
              html += '</tr>'
            });
            $('#tableBuscadorProductosBody').html(html)

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

      //}
    }
  })

  function agregaProd() {


    contador = 0
    $('.itemsFact').each(function(index, el) {
      contador++;
    });
    contador = parseFloat(contador) + 1
    html = '<tr class="itemsFact" contador="' + contador + '" id="itemList_' + contador + '">'
    html += '<td>'
    html += '<input type="text" class="itemsInput inputsrounder" style="width: 100%;" id="code_' + contador + '" contador="' + contador + '">'
    html += '</td>'
    html += ' <td>'
    html += '<input type="text" style="width: 100%;" id="desc_' + contador + '" class="inputsrounder">'
    html += '</td>'
    html += '<td>'
    html += '<input type="number" style="width: 100%;" id="cant_' + contador + '" class="inputsrounder" onkeyup="calculaTotales();">'
    html += '</td>'
    html += '<td>'
    html += '<input type="number" style="width: 100%;" id="precio_' + contador + '" class="inputsrounder" onkeyup="calculaTotales();">'
    html += '</td>'
    html += '<td>'
    html += '<input type="text" style="width: 100%;" id="subtotal_' + contador + '" class="inputsrounder" readonly>'
    html += '</td>'
    html += '<td>'
    html += '<input type="number" style="width: 100%;" id="descuento_' + contador + '" class="inputsrounder" onkeyup="calculaTotales();">'
    html += '</td>'
    html += '<td>'
    html += '<button class="btn btn-link btn-xsm mr-1" onclick="removeItem(' + contador + ');"><i class="material-icons">close</i></button>'
    html += '</td>'
    html += '</tr>'

    $('#bodyItems').append(html)
  }

  function buscaProd() {
    $('#modalBuscaProducto').modal('show')
  }

  function getRfc() {
    var idCliente = $('#buscaCliente').val()
    $.ajax({
        url: '{{ url("facturacion/operaciones/get_cliente") }}',
        type: 'POST',
        dataType: 'json',
        data: {
          id: idCliente
        },
      })
      .done(function(resp) {
        console.log(resp);
        if (resp.estatus > 0) {
          $('#rfc').val(resp.data.rfc)
          $('#emailClienteM').val(resp.data.correo)
          $('#usocfdi').val(resp.data.id_usocfdi)
          $('#usocfdi').trigger('change')
          $('#metodopago').val(resp.data.id_metodo_pago)
          $('#metodopago').trigger('change')
          $('#tipo').focus();
          revisaMP();
        } else {
          Swal.fire({
            title: resp.msj,
            type: 'warning',
            timer: 7000
          })
          return false;
        }
      })
      .fail(function() {
        console.log("error");
      })
      .always(function() {
        console.log("complete");
      });

  }

  function numberFormat(num) {
    return new Intl.NumberFormat('en-US', {
      style: 'currency',
      currency: 'USD'
    }).format(num)
  }

  function newCliente() {

    $('#razon_social_c').val('');
    $('#rfc_c').val('');
    $('#regimen').val(0).trigger('change');
    $('#usocfdi_c').val(0).trigger('change');
    $('#correo_c').val('');
    $('#telefono').val('');
    $('#contacto').val('');
    $('#direccion').val();
    $('#estado').val(0).trigger('change');
    $('#municipio').val(0).trigger('change');
    $('#codigo_postal').val('');
    $('#cuenta_bancaria').val('');

    $('#modalNewCliente').modal('show')
  }

  function guardarCliente() {
    var id = ''
    var razon_social = $('#razon_social_c').val();
    if (razon_social == '') {
      Swal.fire({
        title: 'Agrega una rázon social.',
        type: 'warning',
        timer: 2000
      })
      $('#razon_social_c').focus()
      return false;
    }
    if (razon_social == 'Publico en General' || razon_social == 'publico en general') {
      Swal.fire({
        title: 'La rázon social Publico en General es invalida.',
        type: 'warning',
        timer: 2000
      })
      $('#razon_social_c').focus()
      return false;
    }
    var rfc = $('#rfc_c').val();
    if (rfc == '') {
      Swal.fire({
        title: 'El RFC se encuentra vacio.',
        type: 'warning',
        timer: 2000
      })
      $('#rfc_c').focus()
      return false;
    }
    var cif = $('#cif').val()
    if (rfc == 'XEXX010101000' && cif == '') {
      Swal.fire({
        title: 'El CIF se encuentra vacio.',
        type: 'warning',
        timer: 2000
      })
      $('#cif').focus()
      return false;
    }

    var regimen = $('#regimen').val();
    if (regimen == '0' || regimen == '') {
      Swal.fire({
        title: 'Selecciona un regimen fiscal.',
        type: 'warning',
        timer: 2000
      })
      $('#regimen').focus()
      return false;
    }
    var usocfdi = $('#usocfdi_c').val();
    if (usocfdi == '0') {
      Swal.fire({
        title: 'Selecciona un Uso de CFDI.',
        type: 'warning',
        timer: 2000
      })
      $('#usocfdi_c').focus()
      return false;
    }
    var correo = $('#correo_c').val();
    if (correo == '') {
      Swal.fire({
        title: 'El correo se encuentra vacio.',
        type: 'warning',
        timer: 2000
      })
      $('#correo_c').focus()
      return false;
    }
    var metodopago = $('#metodo_pago').val()
    if (metodopago == '') {
      Swal.fire({
        title: 'Agrega metodo de pago.',
        type: 'warning',
        timer: 2000
      })
      $('#metodo_pago').focus()
      return false;
    }
    var telefono = $('#telefono').val();
    var contacto = $('#contacto').val();
    var direccion = $('#direccion').val();
    var estado = $('#estado').val();
    var municipio = $('#municipios').val();
    var codigo_postal = $('#codigo_postal').val();
    if (codigo_postal == '') {
      Swal.fire({
        title: 'El codigo postal se encuentra vacio.',
        type: 'warning',
        timer: 2000
      })
      $('#codigo_postal').focus()
      return false;
    }
    var pais = $('#pais').val()
    var cuenta_bancaria = $('#cuenta_bancaria').val()

    $.ajax({
        url: '{{ url("catalogo/guardar_cliente") }}',
        type: 'POST',
        dataType: 'json',
        data: {
          id: id,
          razon_social: razon_social,
          rfc: rfc,
          regimen: regimen,
          usocfdi: usocfdi,
          correo: correo,
          telefono: telefono,
          contacto: contacto,
          direccion: direccion,
          estado: estado,
          municipio: municipio,
          codigo_postal: codigo_postal,
          pais: pais,
          cuenta_bancaria: cuenta_bancaria,
          metodopago: metodopago,
          cif: cif,
        },
      })
      .done(function(resp) {
        console.log("success");
        if (resp.estatus > 0) {
          $('#modalNewCliente').modal('hide')
          Swal.fire({
            title: 'Guardado Correctamente',
            type: 'success',
            timer: 2000
          })
          html = '<option value="' + resp.estatus + '">' + razon_social + '</option>'
          $('#buscaCliente').append(html)
          $('#buscaCliente').val(resp.estatus).trigger('change')
          getRfc()
        } else {

          Swal.fire({
            title: resp.mensaje,
            type: 'warning',
            timer: 4000
          })
          $('#rfc_c').focus();
        }
      })
      .fail(function() {
        console.log("error");
      })
      .always(function() {
        console.log("complete");
      });


  }

  function newProducto() {
    $('#idproducto').val('');
    $('#descripcion').val('');
    $('#codigo').val('');
    $('#subtotal').val('');
    $('#clavesat').val('');
    $('.impuescheck').prop("checked", false)

    $('#modalNewProducto').modal('show')
  }

  function guardaProd() {

    var codigo = $('#codigo').val()
    var desc = $('#descripcion').val()
    var clavesat = $('#clavesat').val()
    var unidadsat = $('#unidadsat').val()
    var subtotal = $('#subtotal').val()
    var id = $('#idproducto').val()
    var tipoIva = $('#tipoIva').val()

    if (codigo == '') {
      $('#codigo').focus();
      Swal.fire({
        title: 'El Código esta vacio.',
        type: 'warning',
        timer: 2000
      })
      return false;
    }
    if (desc == '') {
      $('#descripcion').focus();
      Swal.fire({
        title: 'La Descripción esta vacia.',
        type: 'warning',
        timer: 2000
      })
      return false;
    }
    if (clavesat == '') {
      $('#clavesat').focus();
      Swal.fire({
        title: 'La clave producto SAT esta vacia.',
        type: 'warning',
        timer: 2000
      })
      return false;
    }
    if (clavesat.length < 8) {
      Swal.fire({
        title: 'La clave producto SAT debe contenter 8 dígitos.',
        type: 'warning',
        timer: 2000
      })
      return false;
    }

    $.ajax({
        url: '{{ url("catalogo/guarda_producto") }}',
        type: 'POST',
        dataType: 'json',
        data: {
          id: id,
          codigo: codigo,
          desc: desc,
          clavesat: clavesat,
          unidadsat: unidadsat,
          subtotal: subtotal,
          tipoIva: tipoIva,
        },
      })
      .done(function(resp) {
        console.log("success");
        if (resp.estatus > 0) {

          html = '<tr>'
          html += '<td>' + codigo + '</td>'
          html += '<td>' + desc + '</td>'
          html += '<td>' + numberFormat(subtotal) + '</td>'
          html += '<td><button class="btn btn-primary btn-sm" onclick="agregaProdBuscador(\'' + codigo + '\')">+</button></td>'
          html += '</tr>'
          $('#tableBuscadorProductosBody').append(html)
          Swal.fire({
            title: 'Producto guardado con Exito',
            type: 'success',
            timer: 2000
          })
          $('#modalNewProducto').modal('hide')
          return false;
        } else {
          Swal.fire({
            title: resp.msj,
            type: 'error',
            timer: 10000
          })
          return false;
        }
      })
      .fail(function() {
        console.log("error");
      })
      .always(function() {
        console.log("complete");
      });


  }

  function calculaTotales(tienedesc = 1) {
    var subtotalGeneral = 0
    var iva = 0;
    var $this = $('#modo-descuento'); // Cache del elemento para optimización
    var modoActual = $this.data('modo');
    var descuentototal = 0;
    var IvaRTasa = 0;
    var IsrTasa = 0;
    var IshTasa = 0;
    var isr = 0;
    var ivaR = 0
    IvaRTasaDisplay = ''
    IsrTasaDisplay = ''
    IshTasaDisplay = ''
    setTimeout(() => {
      $('.impuescheck').each(function(index, el) {

        if ($(this).is(':checked')) {
          console.log('entroooooooooooooooo')
          if ($(this).attr('impuesto') == 'IVAR') {
            IvaRTasa = $(this).val()
            IvaRTasaDisplay = $(this).val()
            console.log('entroooooooooooooooo retenido')
          }
          if ($(this).attr('impuesto') == 'ISR') {
            IsrTasa = $(this).val()
            IsrTasaDisplay = $(this).val()
          }
          /*if($(this).attr('impuesto')=='ISH'){
            IshTasa = $(this).val()
            IshTasaDisplay = $(this).val()
          }*/
        }

      });
      if ($('#porcentajeISH').val() != '0') {
        IshTasa = $('#porcentajeISH').val()
        IshTasaDisplay = $('#porcentajeISH').val()
      }


      IvaRTasa = parseFloat(IvaRTasa / 100);
      IsrTasa = parseFloat(IsrTasa / 100);
      IshTasa = parseFloat(IshTasa / 100);
      console.log('TasaIVARET=' + IvaRTasa)
      $('.itemsFact').each(function(index, el) {
        console.log(modoActual)
        idcontador = $(this).attr('contador')
        //console.log($('#code_'+idcontador).attr('idprod'))
        if ($('#code_' + idcontador).val() != '') {
          var ivaTasa = $('#code_' + idcontador).attr('iva')
          console.log('IVA_____' + ivaTasa)
          if (ivaTasa == 'EXE') {
            ivaTasa = 0
          }
          var cantidad = $('#cant_' + idcontador).val()
          var precio = $('#precio_' + idcontador).val()
          var descuento = $('#descuento_' + idcontador).val()
          if (cantidad == '') {
            cantidad = 0;
          }
          if (precio == '') {
            precio = 0;
          }
          if (descuento == '') {
            descuento = 0;
          }
          subtotal = parseFloat(precio) * parseFloat(cantidad)

          $('#subtotal_' + idcontador).val(parseFloat(subtotal).toFixed(2))
          //console.log(modoActual)
          if (modoActual == 'cantidad') {
            //console.log(subtotal +' '+descuento)
            if (parseFloat(subtotal) < parseFloat(descuento)) {
              descuento = 0;
              $('#descuento_' + idcontador).val('')
              Swal.fire({
                title: 'El descuento no puede ser del 100%.',
                type: 'warning',
                timer: 1000
              })
            }
            //subtotal = parseFloat(subtotal) - parseFloat(descuento)
          } else {
            if (parseFloat(descuento) > 99) {
              descuento = 0;
              $('#descuento_' + idcontador).val('')
              Swal.fire({
                title: 'El descuento no puede ser del 100%.',
                type: 'warning',
                timer: 1000
              })
            }
            descuento = parseFloat(descuento) / 100
            descuento = parseFloat(subtotal) * parseFloat(descuento);
            //subtotal = parseFloat(subtotal) - parseFloat(descuento)
          }


          ivaProd = (parseFloat(subtotal) - parseFloat(descuento)) * (parseFloat(ivaTasa) / 100)
          ivaRProd = (parseFloat(subtotal) - parseFloat(descuento)) * parseFloat(IvaRTasa)
          isrProd = (parseFloat(subtotal) - parseFloat(descuento)) * parseFloat(IsrTasa)

          descuentototal += parseFloat(descuento);
          subtotalGeneral += parseFloat(subtotal);
          isr += parseFloat(isrProd)
          ivaR += parseFloat(ivaRProd)
          iva += parseFloat(ivaProd);
        }
      });


      if (parseFloat(ivaR) > 0) {
        $('#divIvaRet').show()
        $('#IVAretDisplay').html('IVA ' + IvaRTasaDisplay + '%:')

      } else {
        $('#divIvaRet').hide()
      }
      if (parseFloat(isr) > 0) {
        $('#divIsr').show()
        $('#ISRDisplay').html('ISR Ret ' + IsrTasaDisplay + '%:')

      } else {
        $('#divIsr').hide()
      }

      if (parseFloat(IshTasa) > 0) {
        $('#divIsh').show()
        $('#ISHDisplay').html('ISH ' + IshTasaDisplay + '%:')
        ish = (parseFloat(subtotalGeneral) - parseFloat(descuentototal)) * parseFloat(IshTasa)
      } else {
        $('#divIsh').hide()
        ish = 0
      }
      $('#descuentoLabel').html(numberFormat(descuentototal))
      $('#subtotalLabel').html(numberFormat(subtotalGeneral))
      $('#ivaLabel').html(numberFormat(iva))
      $('#IvaRetLabel').html(numberFormat(ivaR))
      $('#isrLabel').html(numberFormat(isr))
      $('#ishLabel').html(numberFormat(ish))


      total = parseFloat(subtotalGeneral) + parseFloat(iva) - parseFloat(descuentototal) - parseFloat(isr) - parseFloat(ivaR) + parseFloat(ish)
      $('#totalLabel').html(numberFormat(total))
      $('#totaltotal').val(total)
      $('#descuentodescuento').val(descuentototal)
    }, 300);
  }

  function agregaProdBuscador(codigo) {

    $.ajax({
        url: '{{ url("facturacion/operaciones/busca_producto_codigo") }}',
        type: 'POST',
        dataType: 'json',
        data: {
          codigo: codigo
        },
      })
      .done(function(resp) {
        console.log(resp);
        if (resp.estatus > 0) {
          contador = 0
          $('.itemsFact').each(function(index, el) {
            contador++;
          })
          if (contador == 1 && $('#code_' + contador).val() == '') {
            $('#code_' + contador).val(codigo);
            $('#desc_' + contador).val(resp.data.descripcion)
            $('#cant_' + contador).val(1)
            $('#precio_' + contador).val(parseFloat(resp.data.subtotal).toFixed(2))
            $('#subtotal_' + contador).val(parseFloat(resp.data.subtotal).toFixed(2))
            $('#code_' + contador).attr('idprod', resp.data.id)

            //if(resp.data.impuestos.length > 0){
            $.each(resp.data.impuestos, function(index, val) {
              $('#code_' + contador).attr('iva', val.impuesto.tasa)
              $('#code_' + contador).attr('factor', val.impuesto.factor)
            });
            /* }else{
               $('#code_'+contador).attr('iva','EXE')
             }*/

          } else {
            contador = parseFloat(contador) + 1
            html = '<tr class="itemsFact" contador="' + contador + '" id="itemList_' + contador + '">'
            html += '<td>'
            html += '<input type="text" class="itemsInput inputsrounder" style="width: 100%;" id="code_' + contador + '" contador="' + contador + '" value="' + codigo + '" idprod="' + resp.data.id + '" idprod="0">'
            html += '</td>'
            html += ' <td>'
            html += '<input type="text" style="width: 100%;" id="desc_' + contador + '" value="' + resp.data.descripcion + '" class="inputsrounder">'
            html += '</td>'
            html += '<td>'
            html += '<input type="number" style="width: 100%;" id="cant_' + contador + '" onkeyup="calculaTotales();" value="1" class="inputsrounder">'
            html += '</td>'
            html += '<td>'
            html += '<input type="number" style="width: 100%;" id="precio_' + contador + '" onkeyup="calculaTotales();" value="' + parseFloat(resp.data.subtotal).toFixed(2) + '" class="inputsrounder">'
            html += '</td>'
            html += '<td>'
            html += '<input type="text" style="width: 100%;" id="subtotal_' + contador + '" value="' + parseFloat(resp.data.subtotal).toFixed(2) + '" class="inputsrounder" readonly>'
            html += '</td>'
            html += '<td>'
            html += '<input type="number" style="width: 100%;" id="descuento_' + contador + '" onkeyup="calculaTotales();" class="inputsrounder">'
            html += '</td>'
            html += '<td>'
            html += '<button class="btn btn-link btn-xsm mr-1" onclick="removeItem(' + contador + ');"><i class="material-icons">close</i></button>'
            html += '</td>'
            html += '</tr>'

            $('#bodyItems').append(html)
            /*$.each(resp.data.impuestos, function(index, val) {
               $('#code_'+contador).attr('iva',val.impuesto.tasa)
            });*/
            //if(resp.data.impuestos.length > 0){
            $.each(resp.data.impuestos, function(index, val) {
              $('#code_' + contador).attr('iva', val.impuesto.tasa)
              $('#code_' + contador).attr('factor', val.impuesto.factor)
            });
            // }else{
            // $('#code_'+contador).attr('iva','EXE')
            //}
          }
          calculaTotales();
          //$('#modalBuscaProducto').modal('hide')
        } else {
          Swal.fire({
            title: 'El producto no existe',
            type: 'warning',
            timer: 1000
          })
          return false;
        }
      })
      .fail(function() {
        console.log("error");
      })
      .always(function() {
        console.log("complete");
      });
  }

  function removeItem(id) {
    $('#itemList_' + id).remove()
    calculaTotales();
  }

  function removeItem0(id) {
    $('#itemList_' + id).remove()
    calculaTotales();
  }

  function timbrar(idventa, prefact = 0) {
    $.ajax({
        url: '{{ url("facturacion/operaciones/timbrar") }}',
        type: 'POST',
        dataType: 'json',
        data: {
          id: idventa
        },
      })
      .done(function(resp) {
        console.log("success");
        if (resp.success == 1) {
          if (prefact == 0) {
            $('#divProgramar').show()
          } else {
            $('#divProgramar').show()
            $('#btnFactura').show()
          }

          $('#divPrefactura').hide()

          guardarFactura(resp, prefact)
        } else {
          Swal.fire({
            title: resp.error + ' - ' + resp.mensaje,
            type: 'error',
            timer: 7000
          })

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

  function nuevaUnidad() {
    $('#modalNuevaUnidad').modal()
  }

  function guardaUnidadSAT() {

    var desc = $('#descUsat').val()
    var unidad = $('#clave_unidadsat').val()
    if (desc == '' || unidad == '') {
      Swal.fire({
        title: 'Existen campos vacios.',
        type: 'warning',
        timer: 2000
      })
      return false;
    }
    $.ajax({
        url: '{{ url("catalogo/guarda_unidad_sat") }}',
        type: 'POST',
        dataType: 'json',
        data: {
          desc: desc,
          unidad: unidad,
        },
      })
      .done(function(resp) {
        console.log(resp);
        if (resp.estatus > 0) {
          Swal.fire({
            title: 'Guardado Correctamente.',
            type: 'success',
            timer: 2000
          })
          option = '<option value="' + resp.estatus + '">' + unidad + ' - ' + desc + '</option>'
          $('#unidadsat').append(option)
          $('#unidadsat').val(resp.estatus)
          $('#unidadsat').trigger('change')
          $('#modalNuevaUnidad').modal('hide')
          return false
        } else {
          Swal.fire({
            title: 'Ya existe una unidad con ese codigo.',
            type: 'warning',
            timer: 2000
          })
          return false;
        }
      })
      .fail(function() {
        console.log("error");
      })
      .always(function() {
        console.log("complete");
      });

  }

  function getSerie() {
    if ($('#tipodocumento').val() == 2) {
      $('#btnFactura').hide()
      $('#btnVenta').show()
      $('#divPrefactura').hide()
      $('#divAcciones').hide()
    } else if ($('#tipodocumento').val() == 4) {
      $('#btnFactura').hide()
      $('#btnVenta').hide()
      $('#divPrefactura').show()
      $('#divAcciones').show()
    } else {
      $('#btnFactura').show()
      $('#btnVenta').hide()
      $('#divPrefactura').hide()
      $('#divAcciones').show()
    }
    $.ajax({
        url: '{{ url("facturacion/operaciones/get_serie_tipo") }}',
        type: 'POST',
        dataType: 'json',
        data: {
          tipo: $('#tipodocumento').val()
        },
      })
      .done(function(resp) {
        console.log("success");
        if (resp.estatus > 0) {
          var html = ''
          $('#serie').html('')
          $.each(resp.data, function(index, val) {
            html += '<option value="' + val.id + '">' + val.serie + '</option>'
          });
          $('#serie').html(html).trigger('change')
        } else {

          $('#serie').html('')
          Swal.fire({
            title: 'Ni existen folios para este tipo de documento.',
            type: 'warning',
            timer: 2000
          })
          return false;
        }
      })
      .fail(function() {
        console.log("error");
      })
      .always(function() {
        console.log("complete");
      });

  }

  function restaura() {
    $('.cardsEstatus').hide()
    $('#estatusNueva').show()
    $('.idDocumento').html('')
    $('#divArchivos').hide()
    $('#divDeposito').hide()
    $('#divCancelar').hide()

    $('#divTimbrarPrefact').hide()
  }

  function tipoCambio() {
    if ($('#moneda').val() != '1') {
      $('#modalTipoCambio').modal('show')
    } else {
      $('#modalTipoCambio').modal('hide')
      $('#tipo_cambio').val('')
    }
  }

  function validaTP() {
    if ($('#tipo_cambio').val() == '') {
      Swal.fire({
        title: 'Agrega tipo de cambio.',
        type: 'warning',
        timer: 2000
      })
      return false;
    } else {
      $('#modalTipoCambio').modal('hide')
    }
  }

  function guardarFactura(respuesta, prefact = 0) {
    console.log(respuesta)
    $('#loadingSave').modal('show')
    $.ajax({
        url: '{{ url("facturacion/operaciones/guardar_factura")}}',
        type: 'POST',
        dataType: 'json',
        data: {
          respuesta: respuesta
        },
      })
      .done(function(resp) {
        console.log("success");
        //$('#emailClienteM').val('');
        if (resp.id > 0) {
          $('#idDocHv').val(resp.id)
          $('#modaldatosFact').modal('hide')
          // $('#loadingSave').modal('hide')
          // Swal.fire({
          //     title: 'Se guardo correctamente!',
          //     type: 'success',
          //     timer: 2000
          // })
          agregaAPagos(respuesta, resp.id);
          showNotification('thumb_up', 'top', 'center', 'success', '¡BIEN!', 'Se ha guardado correctamente.')
          //$('#emailClienteM').val(resp.correo);
          seriefolioString = respuesta.datos['Serie'] + '-' + respuesta.datos['Folio']
          makePdf(respuesta.datos['xmlNameFile'], respuesta.datos['idVenta'], 0, respuesta.datos['ine'], respuesta.datos['comentarios'], prefact, seriefolioString);
        }
      })
      .fail(function() {
        console.log("error");
      })
      .always(function() {
        setTimeout(() => {
          $('#loadingSave').modal('hide')
        }, 2000);
      });

  }
  /*function makePdf(nameXml, idventa, concoche = 0,ine,comentarios,prefactura=0,seriefolio) {

      nameXml = nameXml + '.xml'
      $.ajax({
              url: '../operaciones/xml_pdf',
              type: 'POST',
              dataType: 'json',
              data: {
                  nameXml: nameXml,
                  idventa: idventa,
                  concoche: concoche,
                  ine: ine,
                  comentarios: comentarios,
                  prefactura: prefactura,
              },
          })
          .done(function(resp) {
              console.log(resp);

              if (resp.estatus > 0) {
                  $('#urlPdfFact').val(resp.urlPdf)
                  $('#btnFactView').show()
                  modalComprobanteFact2(resp.urlPdf, idventa,0,seriefolio)
              }
          })
          .fail(function() {
              console.log("error");
          })
   .always(function() {
              console.log("complete");
          });

  }*/
  function modalComprobanteFact2(src, idventa, tipo = 0, seriefolio) {

    $.ajax({
        url: '{{ url("operaciones/get_leyenda_correo") }}',
        type: 'POST',
        dataType: 'json',
        data: {
          idtipodocumento: $('#tipodocumento').val()
        },
      })
      .done(function(resp) {

        $('#idDocComprobante').val(idventa)
        $('#modalFactura').modal('hide')
        $('#modalFactura').modal('hide')
        $('#loadingSave').modal('hide')
        $('#btnPdfView').prop('href', src)
        $('#downloadPdf').prop('href', src)
        setTimeout(() => {}, 1000);
        result = src.replace(".pdf", ".xml");
        $('#btnXmlView').prop('href', result)
        $('#downloadXml').prop('href', result)
        if ($('#tipodocumento').val() == '3') {
          asdocu = 'Nota de Credito'
        } else {
          asdocu = 'Factura'
        }
        if (tipo != 0) {
          asdocu = 'Nota de venta'
        }
        console.log(seriefolio)
        $('#asuntoModal').val('Asunto: ' + asdocu + ' ' + seriefolio + ' - ' + $('#nomEmpresa').val())

        if (tipo == 0) {
          tipoString = 'factura'
        } else {
          tipoString = 'nota de venta'
        }

        if (resp.data != null) {

          araSerfol = seriefolio.split('-')
          leyenda = resp.data.leyenda
          let out = leyenda.replaceAll('[nombrecliente]', $("#buscaCliente option:selected").text());
          out = out.replaceAll('[serie]', araSerfol[0]);
          out = out.replaceAll('[folio]', araSerfol[1]);
          $("#notasfacturaModal").summernote("code", out);
          asunto = resp.data.asunto
          if (asunto != null) {
            let out2 = asunto.replaceAll('[nombrecliente]', $("#buscaCliente option:selected").text());
            out2 = out2.replaceAll('[serie]', araSerfol[0]);
            out2 = out2.replaceAll('[folio]', araSerfol[1]);
            $('#asuntoModal').val(out2)
          }


        } else {
          $("#notasfacturaModal").summernote("code", 'Estimado/a ' + $("#buscaCliente option:selected").text() + ',<br><br>Adjunto te envío la ' + tipoString + ' ' + seriefolio + '.<br><br>Para cualquier consulta, estoy a tu disposición.<br><br>Saludos.<br>' + $('#nomEmpresa').val());
        }

        //$('#notasfacturaModal').val()
        $('#modalComprobante2').modal('show')

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


  }

  function modalComprobanteFact(src, idventa, tipo = 0) {
    //src ='/Applications/MAMP/htdocs/intesystemautolavado/public/pdf/ticket.pdf'
    $('#btnBoucher').show()
    $('#btnNota').hide()
    var sizeWidth = 0;
    var sizeheight = 0;
    ticket = 1
    if (ticket) {
      sizeWidth = 325;
      sizeheight = 450;
    } else {

      sizeWidth = $('#tb1238-u', window.parent.document).width() - 100;
      sizeheight = $('#tb1238-u', window.parent.document).height() - 50;

    }
    $('#idDocComprobante').val(idventa)
    $('#modalFactura').modal('hide')
    $('#modalFactura').modal('hide')
    $('#loadingSave').modal('hide')
    $('#frameComprobanteFact').attr({
      'src': src
    });


    $('#btnPdfView').prop('href', src)

    result = src.replace(".pdf", ".xml");
    $('#btnXmlView').prop('href', result)



    if (tipo == '0') {
      $('#titleModalCompro').html('Factura')
    } else {
      $('#titleModalCompro').html('Nota de Venta')
    }
    $('#modalComprobanteFact').modal({
      backdrop: 'static'
    });
    $('#modalComprobanteFact').modal('show')

  }

  function restaurar() {
    $('#buscaCliente').val(0)
    $('#buscaCliente').trigger('change')
    $('#rfc').val('')
    $('#usocfdi').val(0)
    $('#usocfdi').trigger('change')
    $('#tipodocumento').val(1)
    $('#tipodocumento').trigger('change')
    $('#tipoRelacion').val(0)
    $('#tipoRelacion').trigger('change')
    $('#metodopago').val(1)
    $('#metodopago').trigger('change')
    $('.itemsFact').each(function(index, el) {
      contador = $(this).attr('contador')
      if (parseInt(contador) > 1) {
        $(this).remove()
      }
    });
    $('.inputsrounder').val('')
    $('.cardsEstatus').hide()
    $('#estatusNueva').show()
    $('.idDocumento').html('')
    $('#divArchivos').hide()
    $('#divPrefactura').show()
    $('#divDeposito').hide()
    $('#divCancelar').hide()
    $('#divNuevodocumento').hide()
    $('#divProgramar').hide()
    $('#notas').val('')
    $('.agregadas_relacionadas').remove()
    $('#idPagoRealizado').val('')
    $('#btn_generarPago').show()
    $('#btn_timbrarPago').hide()
    $('#tipoVentaCargada').val('')
    $('#divPrefactura').show()
    $('#btnPreFactura').show()
    $('#divDiasTimbrado').show()
    getSerie();
    calculaTotales();

  }

  function guardarVenta(datajax, respfact) {
    $.ajax({
        url: '{{ url("facturacion/operaciones/guardar") }}',
        type: 'POST',
        dataType: '',
        data: datajax,
      })
      .done(function(resp) {
        console.log('guardar venta')
        console.log(respfact);
        if (resp.estatus) {
          $('.cardsEstatus').hide()

          $('#btnFactura').hide()
          $('#btnPreFactura').hide()

          Swal.fire({
            title: 'Exito!',
            text: 'Venta guardado con Exito!',
            type: 'success',
            icon: 'success',
            timer: 7000
          })
          $('#estatusGenerada').show()
          $('.idDocumento').html(resp.seriefolio)
          $('#divArchivos').show()
          $('#divDeposito').show()
          $('#divCancelar').show()
          $('#divNuevodocumento').show()
          respfact.datos.idVenta = resp.estatus
          guardarFactura(respfact)
        }
      })
      .fail(function() {
        console.log("error");
      })
      .always(function() {
        console.log("complete");
      });

  }

  function relaciones(tipo) {
    if (tipo == '1') {
      $('#titleRelaciones').show()
      $('#titleNotacCredito').hide()
      $('#tipoRelacion').val('0')
    } else {
      $('#titleRelaciones').hide()
      $('#titleNotacCredito').show()
      $('#tipoRelacion').val('01')
    }
    $('#tipoAccion').val(tipo)
    $('#tipoRelacion').trigger('change')
    $('#modalRelaciones').modal('show')
  }

  function verFacturas(cancelacion = 0) {
    var cliente = $('#buscaCliente').val()
    var tipo = $('#tipoAccion').val();
    $.ajax({
        url: '{{ url("facturacion/operaciones/get_facturas_cliente") }}',
        type: 'POST',
        dataType: 'json',
        data: {
          id_cliente: cliente,
          tipo: tipo
        },
      })
      .done(function(resp) {
        console.log(resp);
        var html = ''
        if (cancelacion == 0) {
          tipoinput = 'checkbox'
          nameinput = ''
          $('#btnAgregaFact').show()
          $('#btnAgregaFactCancelacion').hide()
        } else {
          tipoinput = 'radio'
          nameinput = ' name="ceccanecl"'
          $('#btnAgregaFact').hide()
          $('#btnAgregaFactCancelacion').show()
        }
        $('#bodyFacturas').html(html)
        $.each(resp.facturas, function(index, val) {
          html += '<tr class="divide-y divide-gray-200 hover:bg-gray-50 transition-colors">'
          html += '<td class="px-4 py-3 text-sm text-gray-900">' + val.serie + '</td>'
          html += '<td class="px-4 py-3 text-sm text-gray-900">' + val.folio + '</td>'
          html += '<td class="px-4 py-3 text-sm text-gray-700">' + val.fecha_emision + '</td>'
          html += '<td class="px-4 py-3 text-sm font-semibold text-gray-900">' + numberFormat(val.monto) + '</td>'
          html += '<td class="px-4 py-3 text-sm font-semibold text-gray-900">' + numberFormat(val.saldo) + '</td>'
          html += '<td class="px-4 py-3 text-center"><input class="form-check-input rrela cursor-pointer" type="' + tipoinput + '" id="che_' + val.id + '"  value="' + val.id + '" serie="' + val.serie + '" folio="' + val.folio + '" uuid="' + val.uuid + '"' + nameinput + '></td>'
          html += '</tr>'
        });
        $('#bodyFacturas').append(html)
        $('#modalFacturasRelacion').modal()
      })
      .fail(function() {
        console.log("error");
      })
      .always(function() {
        console.log("complete");
      });

  }

  function agregarFact() {
    var html = ''
    $('.rrela').each(function(index, el) {
      if ($(this).is(':checked')) {
        html += '<tr id="facrel_' + $(this).val() + '" uuid="' + $(this).attr('uuid') + '" class="agregadas_relacionadas divide-y divide-gray-200 hover:bg-gray-50 transition-colors">'
        html += '<td class="px-4 py-3 text-sm text-gray-900">' + $(this).attr('serie') + '</td>'
        html += '<td class="px-4 py-3 text-sm text-gray-900">' + $(this).attr('folio') + '</td>'
        html += '<td class="px-4 py-3 text-sm text-gray-600 break-all">' + $(this).attr('uuid') + '</td>'
        html += '<td class="px-4 py-3 text-center"><button class="inline-flex items-center justify-center px-2 py-1 text-sm font-medium text-white bg-red-600 hover:bg-red-700 rounded transition-colors" onclick="removeFact(' + $(this).val() + ')" title="Eliminar"><i class="material-icons text-sm">close</i></button></td>'
        html += '</tr>'
      }

    });
    $('#divBodyRelacionados').html(html)
    $('#modalFacturasRelacion').modal('hide')
  }

  function removeFact(id) {
    $('#facrel_' + id).remove()
  }

  function cargaVenta(id) {

    $.ajax({
        url: '{{ url("facturacion/operaciones/get_venta") }}',
        type: 'POST',
        dataType: 'json',
        data: {
          id: id
        },
      })
      .done(function(resp) {
        console.log(resp);
        $('#buscaCliente').val(resp.data.id_cliente).trigger('change')
        getRfc()
        $('#tipodocumento').val(resp.data.tipo).trigger('change')
        $('#metodopago').val(resp.data.id_metodo_pago).trigger('change')
        $('#formapago').val(resp.data.forma_pago).trigger('change')
        $('#notas').val(resp.data.observaciones);
        contador = 0
        $('#bodyItems').html('')
        $.each(resp.data.items, function(index, val) {
          contador++;
          html = '<tr class="itemsFact" contador="' + contador + '" id="itemList_' + contador + '">'
          html += '<td>'
          html += '<input type="text" class="itemsInput inputsrounder" style="width: 100%;" id="code_' + contador + '" contador="' + contador + '" value="' + val.producto.codigo + '" idprod="' + val.id_producto + '" idprod="0">'
          html += '</td>'
          html += ' <td>'
          html += '<input type="text" style="width: 100%;" id="desc_' + contador + '" value="' + val.descripcion + '" class="inputsrounder">'
          html += '</td>'
          html += '<td>'
          html += '<input type="number" style="width: 100%;" id="cant_' + contador + '" onkeyup="calculaTotales();" value="' + val.cantidad + '" class="inputsrounder">'
          html += '</td>'
          html += '<td>'
          html += '<input type="number" style="width: 100%;" id="precio_' + contador + '" onkeyup="calculaTotales();" value="' + parseFloat(val.precio_unitario).toFixed(2) + '" class="inputsrounder">'
          html += '</td>'
          html += '<td>'
          html += '<input type="text" style="width: 100%;" id="subtotal_' + contador + '" value="' + parseFloat(val.subtotal).toFixed(2) + '" class="inputsrounder" readonly>'
          html += '</td>'
          html += '<td>'
          html += '<input type="number" style="width: 100%;" id="descuento_' + contador + '" onkeyup="calculaTotales();" class="inputsrounder">'
          html += '</td>'
          html += '<td>'
          html += '<button class="btn btn-link btn-xsm mr-1" onclick="removeItem(' + contador + ');"><i class="material-icons">close</i></button>'
          html += '</td>'
          html += '</tr>'
          $('#bodyItems').append(html)
          $.each(val.impuestos, function(index2, val2) {
            if (val2.impuesto_nombre.impuesto == 'IVA') {
              $('#code_' + contador).attr('iva', val2.impuesto_nombre.tasa)
              $('#code_' + contador).attr('factor', val2.impuesto_nombre.factor)
            }
            $('#check_' + val2.id_impuesto).prop('checked', true)
          });
        });
        $('#btn_generarPago').show()
        $('#btn_timbrarPago').hide()
        calculaTotales();
        $('.cardsEstatus').hide()
        if (resp.data.factura.estatus == '1') {
          if (resp.data.factura.saldo == 0) {
            $('#estatusPagada').show()
          } else {
            $('#estatusGenerada').show()
          }
        } else if (resp.data.factura.estatus == '0') {
          $('#estatusCancelada').show()

        } else if (resp.data.factura.estatus == '2') {
          $('#estatusProcesoCancelada').show()
        }
        $('.idDocumento').html(resp.data.factura.serie + '-' + resp.data.factura.folio)
        $('#divArchivos').show()
        $('#divDeposito').show()
        $('#divCancelar').show()
        $('#divNuevodocumento').show()
        $('#divPrefactura').hide()
        $('#btnFactura').hide()
        if (parseFloat(resp.data.factura.saldo) > 0) {
          $('#divDeposito').show()
          $('#labelMontoSD').html(numberFormat(resp.data.factura.monto))
          $('#labelPendienteSD').html(numberFormat(resp.data.factura.saldo))
          pendiente = parseFloat(resp.data.factura.monto) - parseFloat(resp.data.factura.saldo);
          $('#labelPagadoSD').html()
          html = '<tr class="facts_apagar divide-y divide-gray-200 hover:bg-gray-50 transition-colors" idfact="' + resp.data.factura.id + '" id="factPag_' + resp.data.factura.id + '" saldo="' + resp.data.factura.saldo + '">'
          html += '<td class="px-4 py-3 text-center"><button class="inline-flex items-center justify-center px-2 py-1 text-sm font-medium text-white bg-red-600 hover:bg-red-700 rounded transition-colors" title="Eliminar factura" onclick="eliminaFacPago(' + resp.data.factura.id + ');"><i class="material-icons text-sm">close</i></button></td>'
          html += '<td class="px-4 py-3 text-sm text-gray-900">' + resp.data.factura.serie + '</td>'
          html += '<td class="px-4 py-3 text-sm text-gray-900">' + resp.data.factura.folio + '</td>'
          html += '<td class="px-4 py-3 text-sm text-gray-700">' + resp.data.factura.moneda + '</td>'
          html += '<td class="px-4 py-3 text-sm text-gray-600">' + numberFormat(resp.data.factura.tipo_cambio) + '</td>'
          html += '<td class="px-4 py-3 text-sm font-semibold text-gray-900">' + numberFormat(resp.data.factura.saldo) + '</td>'
          html += '<td class="px-4 py-3"><input type="text" class="w-full px-3 py-1  border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" id="pago_' + resp.data.factura.id + '" value="' + resp.data.factura.saldo + '" onkeyup="calculatotalPagado();validaSaldo(' + resp.data.factura.id + ');"></td>'
          html += '</tr>'
          $('#bodyTablePagos').append(html)
          $('#labelPagadoSD').html(numberFormat(resp.data.factura.saldo))
        } else {
          $('#divDeposito').hide()
        }
        $('#idDocumento').html(resp.data.serie + '-' + resp.data.folio)
        $('#btnXmlView').prop('href', resp.xml)
        $('#btnPdfView').prop('href', resp.pdf)
        $('#downloadXml').prop('href', resp.pdf)
        if (resp.data.tipo_documento == 2) {
          $('#divAcciones').hide()
          $('#divDeposito').hide()
          $('#btnFactura').show()

        }
        setTimeout(function() {
          $('#metodopago').val(resp.data.id_metodo_pago)
          $('#metodopago').trigger('change')
          $('#moneda').val(resp.data.id_moneda).trigger('change')
          $('#tipo_cambio').val(resp.data.tipo_cambio)
        }, 2000);

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

  }

  function aplicacionNotas() {
    $('#modalAplicaciones').modal()
  }

  function verNotasCredito() {
    var cliente = $('#buscaCliente').val()

    $.ajax({
        url: '{{ url("facturacion/operaciones/get_notas_cliente") }}',
        type: 'POST',
        dataType: 'json',
        data: {
          id_cliente: cliente
        },
      })
      .done(function(resp) {
        console.log(resp);
        var html = ''
        $('#bodyFacAplicadas').html(html)
        $.each(resp.facturas, function(index, val) {
          html += '<tr class="divide-y divide-gray-200 hover:bg-gray-50 transition-colors">'
          html += '<td class="px-4 py-3 text-sm text-gray-900">' + val.serie + '</td>'
          html += '<td class="px-4 py-3 text-sm text-gray-900">' + val.folio + '</td>'
          html += '<td class="px-4 py-3 text-sm text-gray-700">' + val.fecha_emision + '</td>'
          html += '<td class="px-4 py-3 text-sm text-center text-gray-600">' + val.moneda + '</td>'
          html += '<td class="px-4 py-3 text-sm text-center text-gray-600">' + val.metodo_pago + '</td>'
          html += '<td class="px-4 py-3 text-sm text-center text-gray-600">' + val.forma_pago + '</td>'
          html += '<td class="px-4 py-3 text-sm font-semibold text-gray-900">' + numberFormat(val.monto) + '</td>'
          html += '<td class="px-4 py-3 text-sm font-semibold text-gray-900">' + numberFormat(val.saldo) + '</td>'
          html += '<td class="px-4 py-3 text-center"><input class="rrela_nota cursor-pointer" type="checkbox" id="che_' + val.id + '"  value="' + val.id + '" serie="' + val.serie + '" folio="' + val.folio + '" uuid="' + val.uuid + '" monto="' + val.monto + '" tipocambio="' + val.tipo_cambio + '" moneda="' + val.moneda + '"></td>'
          html += '</tr>'
        });
        $('#bodyFacAplicadas').append(html)
        $('#modalAplicacionNotas').modal()
      })
      .fail(function() {
        console.log("error");
      })
      .always(function() {
        console.log("complete");
      });
  }

  function agregarNota() {
    var html = ''
    $('.rrela_nota').each(function(index, el) {
      if ($(this).is(':checked')) {

        html += '<tr class="facts_apagar" idfact="' + $(this).val() + '" id="factPag_' + $(this).val() + '" saldo="' + $(this).attr('monto') + '">'
        html += '<td><div align="center"><button class="btn btn-link btn-xsm mr-1 text-danger" title="Eliminar factura" onclick="eliminaFacPago(' + $(this).val() + ');"><i class="material-icons">close</i><div class="ripple-container"></div></button></div></td>'
        html += '<td>' + $(this).attr('serie') + '</td>'
        html += '<td>' + $(this).attr('folio') + '</td>'
        html += '<td>' + $(this).attr('moneda') + '</td>'
        if ($(this).attr('moneda') != 'MXN') {
          html += '<td>' + numberFormat($(this).attr('tipocambio')) + '</td>'
        } else {
          html += '<td>' + numberFormat(1) + '</td>'
        }
        html += '<td>' + numberFormat($(this).attr('monto')) + '</td>'
        html += '<td><input type="text" id="pago_' + $(this).val() + '" width="100%" value="' + $(this).attr('monto') + '" onkeyup="calculatotalPagado();validaSaldo(' + $(this).val() + ')"></td>'
        html += '</tr>'

      }

    });

    $('#bodyTablePagos').append(html)
    $('#modalAplicacionNotas').modal('hide')
    calculatotalPagado();
  }

  function aplicarNotaCredito() {

    $(".agregadas_aplicadas").each(function() {
      if ($(this).attr('uuid') != '') {
        relaciones.push($(this).attr('uuid'))
      }
    })

  }

  function cancelarModal() {
    $('#modalCancelar').modal('show')
  }

  function muestraRel() {
    if ($('#motivo_cancelacion').val() == '01') {
      $('#uuidRelaCancelRow').show()
      $('#btnMuestraFacRelaCancel').show()
    } else {
      $('#uuidRelaCancelRow').hide()
      $('#btnMuestraFacRelaCancel').hide()
    }
  }

  function cancelaDocumento() {
    var id = $('#idDocHv').val()
    var idVenta = $('#idVentaCargada').val()
    var motivo = $('#motivo_cancelacion').val()
    var serie = $('#serieRelaCancel').val()
    var folio = $('#folioRelaCancel').val()
    $.ajax({
        url: '{{ url("facturacion/operaciones/cancel_verifica") }}',
        type: 'POST',
        dataType: 'json',
        data: {
          id: id,
          serie: serie,
          folio: folio,
          motivo: motivo
        },
      })
      .done(function(ress) {
        console.log("success");
        if (ress.estatus == '3') {
          Swal.fire({
            title: ress.titulo,
            type: 'error',
            timer: 2000
          })
        } else {
          Swal.fire({
            title: ress.titulo,
            text: ress.msj,
            showCancelButton: true,
            confirmButtonColor: '#3085d6',
            cancelButtonColor: '#d33',
            confirmButtonText: 'Si',
            cancelButtonText: 'No',
          }).then((result) => {
            console.log(result)
            if (result.value) {
              $('#modalVentas').modal('hide')
              $('#modalCancelacionFactura').modal('hide')
              $('#modalCargando').modal('show')
              $.ajax({
                  url: '{{ url("facturacion/operaciones/cancel_factura") }}',
                  type: 'POST',
                  dataType: 'json',
                  data: {
                    id: id,
                    motivo: motivo,
                    serie: serie,
                    folio: folio,
                  },
                })
                .done(function(resp) {
                  $('#modalCargando').modal('hide')
                  console.log(resp)

                  if (resp[0].strStatus2 == '1') {
                    Swal.fire(
                      'Cancelacion Procesada',
                      resp[0].strResult,
                      'success'
                    )
                    loadGrid();
                    if (resp[0].strStatus3 == '1') {
                      src = window.location + "/../../facturacion/acuse/" + id;
                      window.open(src, "_blank");
                      Swal.fire({
                        title: resp[0].strResult,
                        text: '¿Deseas cancelar la venta? la factura ya fue cancelada',
                        type: 'success',
                        showCancelButton: true,
                        confirmButtonColor: '#3085d6',
                        cancelButtonColor: '#d33',
                        confirmButtonText: 'Si',
                        cancelButtonText: 'No',
                      }).then((result2) => {
                        if (result2.value) {
                          $.ajax({
                              url: '../facturacion/cancelar_venta',
                              type: 'POST',
                              dataType: 'json',
                              data: {
                                id: $('#idVentaCargada').val()
                              },
                            })
                            .done(function(respx) {
                              console.log("success");
                              if (respx.re > 0) {
                                Swal.fire(
                                  'Cancelacion correcta',
                                  'Se cancelo la venta correctamente',
                                  'success'
                                )
                              }
                            })
                            .fail(function() {
                              console.log("error");
                            })
                            .always(function() {
                              console.log("complete");
                            });

                        }
                      })

                    }

                    /*$.ajax({
                        url: '../operaciones/cancel_venta',
                        type: 'POST',
                        dataType: 'json',
                        data: {id: id},
                    })
                    .done(function(res) {
                        console.log("success");

                            Swal.fire(
                              'Cancelado!',
                              'Se cancelo correctamente!',
                              'success'
                            )
                            src = window.location+"/../../operaciones/acuse/"+id;
                            window.open(src, "_blank"); 
                    })
                    .fail(function() {
                        console.log("error");
                    })
             .always(function() {
                        console.log("complete");
                    });*/

                  } else {
                    $('#modalCargando').modal('hide')
                    $('#modalVentas').modal('show')
                    Swal.fire(
                      'Error al cancelar',
                      resp[0].strResult,
                      'error'
                    )
                  }

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

            }
          })
        }


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

  }

  function agregaFacturaCancelacion() {
    verFacturas(1)


  }

  function agregarFact2() {
    $('.rrela').each(function(index, el) {
      if ($(this).is(':checked')) {
        $('#serieRelaCancel').val($(this).attr('serie'))
        $('#folioRelaCancel').val($(this).attr('folio'))
      }

    });
    $('#modalFacturasRelacion').modal('hide')
  }

  function enviarFactura() {
    var idfactura = $('#idDocHv').val()
    var venta = $('#soloventa').val();
    var correo = $('#emailClienteM').val()
    var cc = $('#cc').val()
    var asunto = $('#asuntoModal').val()
    var cuerpo = $('#notasfacturaModal').val()
    $.ajax({
        url: '{{ url("facturacion/operaciones/enviar_factura") }}',
        type: 'POST',
        dataType: 'json',
        data: {
          correo: correo,
          cc: cc,
          asunto: asunto,
          cuerpo: cuerpo,
          idfactura: idfactura,
          venta: venta,
        },
      })
      .done(function(resp) {
        console.log(resp);
        if (resp.estatus > 0) {
          Swal.fire({
            title: 'Enviado correctamente.',
            type: 'success',
            timer: 7000
          })
          return false;
        } else {
          Swal.fire({
            title: 'Error al Enviar.',
            type: 'error',
            timer: 7000
          })
          return false;
        }

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

  }

  function enviabutton() {
    $('#modalComprobante2').modal('show')
  }

  function aplicarDeposito() {
    $('#modalAplicaDeposito').modal()
  }

  function guardarPago() {
    var fecha = $('#fecha').val()
    var fp = $('#fpp').val()
    var cliente = $('#buscaCliente').val()
    var moneda = $('#monedaPago').val()
    var tipo_cambio = $('#tipo_cambioPago').val()
    var facturas = new Array
    var error = 0;
    $('.facts_apagar').each(function(index, el) {
      idfact = $(this).attr('idfact')
      saldo = $(this).attr('saldo')
      if ($('#pago_' + idfact).val() != '') {
        if (parseFloat($('#pago_' + idfact).val()) > parseFloat(saldo)) {
          error++;
        }
        dat = {
          id_fact: idfact,
          monto: $('#pago_' + idfact).val(),
        }
        facturas.push(dat)
      }
    });
    if (facturas.length == 0) {
      Swal.fire({
        title: 'Agrega una factura a pagar.',
        type: 'warning',
        timer: 2000
      })
      return false;
    }
    if (parseFloat(error) > 0) {
      Swal.fire({
        title: 'Existen pagos mayores al saldo.',
        type: 'warning',
        timer: 2000
      })
      return false;
    }
    if (moneda != 1 && tipo_cambio == '') {
      Swal.fire({
        title: 'Agrega el tipo de cambio.',
        type: 'warning',
        timer: 2000
      })
      return false;
    }
    $.ajax({
        url: '{{ url("facturacion/operaciones/aplicar_pago") }}',
        type: 'POST',
        dataType: 'json',
        data: {
          fecha: fecha,
          fp: fp,
          facturas: facturas,
          cliente: cliente,
          tipo_cambio: tipo_cambio,
          moneda: moneda,
        },
      })
      .done(function(resp) {
        console.log("success");
        if (resp.estatus > 0) {
          /*if(gcp==1){
            timbrarPago(resp.estatus);
          }else{*/
          $('.cardsEstatus').hide()
          $('#estatusPagada').show()

          $('#btn_generarPago').hide()
          $('#btn_timbrarPago').show()

          $('#idPagoRealizado').val(resp.estatus)

          Swal.fire({
            title: 'Guardado con Exito.',
            type: 'success',
            timer: 2000
          })
          setTimeout(function() {}, 1000);

          return false;
          //}

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

  }

  function revisaMP() {
    var option = $('#metodopago option:selected').attr('clave');
    if (option == '99') {
      $('#formapago').val('PPD')
      $('#plazo').val(2)
    } else {
      $('#formapago').val('PUE')
      $('#plazo').val(1)
    }
    $('#plazo').trigger('change')
    $('#formapago').trigger('change')
  }

  function agregaAPagos(data, idfactura) {
    console.log(data)

    if (data.datos.MetodoPago == 'PPD') {



      html = '<tr class="facts_apagar" idfact="' + idfactura + '" id="factPag_' + idfactura + '" saldo="' + data.datos.Total + '">'
      html += '<td><div align="center"><button class="btn btn-link btn-xsm mr-1 text-danger" title="Eliminar factura" onclick="eliminaFacPago(' + data.datos.idVenta + ');"><i class="material-icons">close</i><div class="ripple-container"></div></button></div></td>'
      html += '<td>' + data.datos.Serie + '</td>'
      html += '<td>' + data.datos.Folio + '</td>'
      html += '<td>' + data.datos.Moneda + '</td>'
      if (data.datos.Moneda != 'MXN') {
        html += '<td>' + numberFormat(data.datos.TipoCambio) + '</td>'
      } else {
        html += '<td>' + numberFormat(1) + '</td>'
      }
      html += '<td>' + numberFormat(data.datos.Total) + '</td>'
      html += '<td><input type="text" id="pago_' + idfactura + '" width="100%" value="' + data.datos.Total + '" onkeyup="calculatotalPagado();validaSaldo(' + idfactura + ');"></td>'
      html += '</tr>'
      $('#btn_generarPago').show()
      $('#btn_timbrarPago').hide()

      $('#labelPagadoSD').html(numberFormat(data.datos.Total))
      $('#bodyTablePagos').append(html)
    }


  }

  function timbrarPago() {
    var idPago = $('#idPagoRealizado').val()
    if (idPago == '') {
      Swal.fire({
        title: 'Erro con Pago',
        type: 'error',
        timer: 10000
      })
      return false;
    }
    $.ajax({
        url: '{{ url("facturacion/operaciones/timbrar_pago") }}',
        type: 'POST',
        dataType: 'json',
        data: {
          id_pago: idPago
        },
      })
      .done(function(res) {
        console.log("success");
        if (res.success == 1) {
          guardarFacturaPago(res)
          $('#modalAplicaDeposito').modal('hide')
          $('.btnSavePago').attr('disable', false)
        } else {
          $('#modalPagos').modal('show')
          Swal.fire({
            title: res.error + ' - ' + res.mensaje,
            type: 'error',
            timer: 10000
          })
          $('.btnSavePago').attr('disable', false)

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

  }

  function guardarFacturaPago(respuesta) {
    console.log(respuesta)
    $.ajax({
        url: '{{url("facturacion/operaciones/guardar_factura_deposito")}}',
        type: 'POST',
        dataType: 'json',
        data: {
          respuesta: respuesta
        },
      })
      .done(function(resp) {
        console.log("success");
        $('#emailClienteM').val('');
        if (resp.id > 0) {
          Swal.fire({
            title: 'Se guardo correctamente!',
            type: 'success',
            timer: 2000
          })
          $('#emailClienteM').val(resp.correo);
          $('#modalPagos').modal('hide')
          makePdf(respuesta.datos['xmlNameFile'], respuesta.datos['idVenta'], 'CP');
        }
      })
      .fail(function() {
        console.log("error");
      })
      .always(function() {
        console.log("complete");
      });

  }

  function makePdf(nameXml, idventa, concoche = 0, ine = 0, comentarios = '', prefactura = 0, seriefolio = '') {

    nameXml = nameXml + '.xml'
    $.ajax({
        url: '{{ url("facturacion/operaciones/xml_pdf") }}',
        type: 'POST',
        dataType: 'json',
        data: {
          nameXml: nameXml,
          idventa: idventa,
          concoche: concoche,
          ine: ine,
          comentarios: comentarios,
          prefactura: prefactura,
        },
      })
      .done(function(resp) {
        console.log(resp);

        if (resp.estatus > 0) {
          $('#urlPdfFact').val(resp.urlPdf)
          $('#btnFactView').show()
          modalComprobanteFact2(resp.urlPdf, idventa, 0, seriefolio)
        }
      })
      .fail(function() {
        console.log("error");
      })
      .always(function() {
        console.log("complete");
      });

  }

  function eliminaFacPago(id) {
    $('#factPag_' + id).remove()
    calculatotalPagado();
  }

  function calculatotalPagado() {
    var total = 0;
    $('.facts_apagar').each(function(index, el) {
      idfact = $(this).attr('idfact')
      if ($('#pago_' + idfact).val() != '') {
        total += parseFloat($('#pago_' + idfact).val())

      }
    });
    $('#labelPagadoSD').html(numberFormat(total))
  }

  function validaSaldo(id) {
    console.log('estoo=' + id)
    var pago = $('#pago_' + id).val()
    var saldo = $('#factPag_' + id).attr('saldo')

    if (pago == '') {
      pago = 0
    }


    if (parseFloat(pago) > parseFloat(saldo)) {

      Swal.fire({
        title: 'No puedes super el saldo de la factura.',
        type: 'warning',
        timer: 2000
      })
    }
    calculatotalPagado();
  }

  function timbrarPrefactura() {
    var idventa = $('#idPrefact').val()
    $.ajax({
        url: '{{ url("facturacion/operaciones/timbrar") }}',
        type: 'POST',
        dataType: 'json',
        data: {
          id: idventa
        },
      })
      .done(function(resp) {
        console.log("success");
        if (resp.success == 1) {
          $('#divTimbrarPrefact').show()
          $('#divPrefactura').hide()
          $('#btnFactura').hide()

          guardarFactura(resp, 0)
        } else {
          Swal.fire({
            title: resp.error + ' - ' + resp.mensaje,
            type: 'error',
            timer: 7000
          })

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

  function getLeyendas() {
    $('#modalLeyendas').modal()
  }

  function agregaLeyenda() {
    var text = $('#leye option:selected').attr('ley');
    $('#notas').val(atob(text))
    $('#modalLeyendas').modal('hide')
  }

  function modalPrgramar() {
    contador = 0;
    $('.itemsFact').each(function(index, el) {
      if (contador == 0) {
        id = $(this).attr('contador')
        concepto = $('#desc_' + id).val()

      }
      contador++;
    });
    $('#concepto_programa').val(concepto)
    if (contador > 1) {
      Swal.fire({
        title: 'La programación de facturas debe tener solo un concepto.',
        type: 'warning',
        timer: 1000
      })
      clicando = false
      return false;
    } else {

      $('#modalProgramar').modal('show')
    }

  }

  function guardarFactProgramada() {
    var id = $('#idDocHv').val()
    var periocidadF = $('#periocidadF').val()
    var periocidad = $('#periocidad').val()
    //var complementoConcepto = $('#complementoConcepto').val()
    var complementoConceptoMes = $('#complementoConceptoMes').val()
    var complementoConceptoAnio = $('#complementoConceptoAnio').val()
    var fechaInicioPrograma = $('#fechaInicioPrograma').val()
    var concepto = $('#concepto_programa').val()


    if (fechaInicioPrograma == '') {
      Swal.fire({
        title: 'Agrega el dia de ejecucion.',
        type: 'error',
        timer: 7000
      })

      return false;
    }
    if (periocidad == '') {
      Swal.fire({
        title: 'Agrega la periocidad de ejecucion.',
        type: 'error',
        timer: 7000
      })

      return false;
    }
    if (concepto == '') {
      Swal.fire({
        title: 'Debes de agregar un concepto.',
        type: 'error',
        timer: 7000
      })

      return false;
    }

    if (periocidadF == 2 && complementoConceptoAnio == 0) {
      Swal.fire({
        title: 'Debes de agregar un año.',
        type: 'error',
        timer: 7000
      })

      return false;
    }
    $.ajax({
        url: '{{ url("facturacion/operaciones/programa_factura") }}',
        type: 'POST',
        dataType: 'json',
        data: {
          id: id,
          periocidadF: periocidadF,
          periocidad: periocidad,
          //complementoConcepto: complementoConcepto,
          fechaInicioPrograma: fechaInicioPrograma,
          complementoConceptoMes: complementoConceptoMes,
          complementoConceptoAnio: complementoConceptoAnio,
          concepto: concepto,
        },
      })
      .done(function(resp) {
        console.log(resp);
        if (resp.estatus > 0) {
          $('#modalProgramar').modal('hide')
          Swal.fire({
            title: 'Guardado Correctamente.',
            type: 'success',
            timer: 3000
          })

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


  }

  function muestraanio() {
    if ($('#periocidadF').val() == 2) {
      $('#anioconcepto').show()
    } else {
      $('#anioconcepto').hide()
    }
  }

  function altaCliente() {
    $('#modalAltaCliente').modal('show')
  }

  function validaRFC() {

    var rfc = $('#rfc_c').val()
    if (rfc == 'XAXX010101000' || rfc == 'XEXX010101000') {
      if (rfc == 'XEXX010101000') {
        $('#rowsExtranjeros').show()
      } else {
        $('#rowsExtranjeros').hide()
      }
      $.ajax({
          url: '{{ url("catalogo/get_empresa_info") }}',
          type: 'POST',
          dataType: 'json',
          data: {
            param1: 'value1'
          },
        })
        .done(function(resp) {
          console.log("success");
          $('#pais').val(resp.data.idpais)
          $('#estado').val(resp.data.idestado)
          getMunicipios()
          setTimeout(() => {
            $('#municipios').val(resp.data.idmunicipio)
            $('#codigo_postal').val(resp.data.cp)
            $('#usocfdi_c').val(23)
            $('#regimen').val(11)


            $('#pais').selectpicker("refresh")
            $('#estado').selectpicker("refresh")
            $('#municipios').selectpicker("refresh")
            $('#usocfdi_c').selectpicker("refresh")
            $('#regimen').selectpicker("refresh")
          }, 2000);


          return 1;

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

    } else {
      $.ajax({
          url: '{{ url("catalogo/valida_rfc_repetido") }}',
          type: 'POST',
          dataType: 'json',
          data: {
            rfc: rfc,
            id_cliente: $('#idcliente').val()
          },
        })
        .done(function(resp) {
          if (resp.estatus > 0) {
            Swal.fire({
              title: 'El RFC se encuentra previamente registrado.',
              type: 'warning',
              timer: 2000
            })
            $('#rfc').val('').focus()
            return false;
          }
        })
        .fail(function() {
          console.log("error");
        })
        .always(function() {
          console.log("complete");
        });

    }
  }

  function getMunicipios(idmuni = 0) {
    var estado = $('#estado').val()
    $.ajax({
        url: '{{ url("catalogo/get_municipios") }}',
        type: 'POST',
        dataType: 'json',
        data: {
          estado: estado
        },
      })
      .done(function(resp) {
        console.log("success");
        html = '';
        $('#municipios').html('')
        if (resp.estatus > 0) {
          $.each(resp.municipios, function(index, val) {
            html += '<option value="' + val.idmunicipio + '">' + val.municipio + '</option>'
          });
          $('#municipios').html(html)
          if (idmuni != 0) {
            $('#municipios').val(idmuni)
          }
        }
        $('#municipios').selectpicker("refresh")


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

  }

  function agregarPEM(tipo) {
    if (tipo == 1) {


      $('#modalPais').modal('show');
    } else if (tipo == 2) {
      $('#id_pais').val($('#pais').val()).selectpicker("refresh")
      $('#modalEstado').modal('show');

    } else {
      $('#id_estado').val($('#estado').val()).selectpicker("refresh")
      $('#modalMunicipio').modal('show');
    }
  }

  function guardarEstamuni(tipo) {
    if (tipo == 1) {
      var pais = $('#descripcionpais').val();
      var clave = $('#clavepais').val();
      if (pais == '' || clave == '') {
        showNotification('error', 'top', 'center', 'danger', '¡ERROR!', 'Debes ingresar toda la información');
        return false;
      }
      $.ajax({
          url: "{{ url('configuracion/pem/save_pais')}}",
          type: 'POST',
          dataType: 'json',
          data: {
            pais: pais,
            clave: clave,
          },

        })
        .done(function(resp) {
          console.log(resp);
          if (resp.result == 1) {
            showNotification('thumb_up', 'top', 'center', 'success', '¡BIEN!', resp.mensaje);
            $('#modalPais').modal('hide');
            $('#idpais').trigger('change')

          }

        })
        .fail(function() {
          console.log("error");
        })
        .always(function() {
          console.log("complete");
        });
    } else if (tipo == 2) {
      var estado = $('#descripcionestado').val();
      var clave = $('#claveestado').val();
      var idpais = $('#id_pais option:selected').val();

      if (estado == '' || clave == '' || idpais == '') {
        showNotification('error', 'top', 'center', 'danger', '¡ERROR!', 'Debes ingresar toda la información');
        return false;
      }
      $.ajax({
          url: "{{ url('configuracion/pem/save_estado')}}",
          type: 'POST',
          dataType: 'json',
          data: {
            estado: estado,
            idpais: idpais,
            clave: clave,
          },

        })
        .done(function(resp) {
          console.log(resp);
          if (resp.result > 0) {
            showNotification('thumb_up', 'top', 'center', 'success', '¡BIEN!', resp.mensaje)
            $('#modalEstado').modal('hide')
            // $('.selectpicker').selectpicker('refresh');
            getEstado(resp.result)
          }

        })
        .fail(function() {
          console.log("error");
        })
        .always(function() {
          console.log("complete");
        });
    } else {
      var municipio = $('#descripcionmunicipio').val();
      var idestado = $('#id_estado option:selected').val();
      if (municipio == '' || idestado == '') {
        showNotification('error', 'top', 'center', 'danger', '¡ERROR!', 'Debes ingresar toda la información');
        return false;
      }
      $.ajax({
          url: "{{ url('configuracion/pem/save_municipio')}}",
          type: 'POST',
          dataType: 'json',
          data: {
            municipio: municipio,
            idestado: idestado,
          },

        })
        .done(function(resp) {
          console.log(resp);
          if (resp.result > 0) {
            showNotification('thumb_up', 'top', 'center', 'success', '¡BIEN!', resp.mensaje)
            $('#modalMunicipio').modal('hide');
            // $('.selectpicker').selectpicker('refresh');
            setTimeout(() => {
              getMunicipios(resp.result)
            }, 1000);

          }

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

  }

  function getEstado(idestado = 0) {


    var idpais = $('#pais').val();

    $.ajax({
        url: "{{ url('configuracion/empresa/get_estado')}}",
        type: 'POST',
        dataType: 'json',
        data: {
          id: idpais,
        },
      })
      .done(function(resp) {
        $('#estado').empty()
        $("#estado").prop("disabled", false);

        $('#id_estado').empty()
        $("#id_estado").prop("disabled", false);

        $.each(resp.data.estados, function(key, value) {
          $('#estado')
            .append('<option value="' + value['idestado'] + '" nombre="' + value['estado'] + '">' + value['estado'] + '</option>');
          $('#id_estado')
            .append('<option value="' + value['idestado'] + '" nombre="' + value['estado'] + '">' + value['estado'] + '</option>');
        });
        if (idestado != 0) {
          $('#estado').val(idestado);
          $('#estado').trigger('change')
          $('#id_estado').val(idestado);
          $('#id_estado').trigger('change')
          getMunicipios();
        }

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

  function nuevoPlazo() {
    $('#modalPlazo').modal('show')
  }

  function guardarPlazo() {
    var desc = $('#descPlazo').val()
    var dias = $('#diasPlazo').val()

    if (desc == '') {
      Swal.fire({
        title: 'Agrega una descripcion.',
        type: 'warning',
        timer: 1000
      })
      return false
    }
    if (dias == '') {
      Swal.fire({
        title: 'Agrega los dias.',
        type: 'warning',
        timer: 1000
      })
      return false
    }
    $.ajax({
        url: '{{ url("facturacion/operaciones/guarda_plazo") }}',
        type: 'POST',
        dataType: 'json',
        data: {
          dias: dias,
          desc: desc
        },
      })
      .done(function(resp) {
        console.log("success");
        if (resp.estatus > 0) {
          $('#descPlazo').val('')
          $('#diasPlazo').val('')
          $('#modalPlazo').modal('hide')

          $('#plazo').append('<option value="' + resp.estatus + '">' + resp.nombre + '</option>')
          $('#plazo').val(resp.estatus).trigger('change')
          Swal.fire({
            title: 'Guardado Correctamente.',
            type: 'success',
            timer: 1000
          })
          return false;
        }
      })
      .fail(function() {
        console.log("error");
      })
      .always(function() {
        console.log("complete");
      });

  }

  function agregaImpuestoRet() {
    var base = $('#base_ret').val()
    var impuesto = $('#tipo_impuesto_ret').val()
    var idimpuesto = $('#tipo_impuesto_ret').find('option:selected').attr('idimpuesto')
    var monto = $('#monto_ret').val()
    var tipo = $('#tipo_pago_ret').val()

    const d = new Date();
    const horaEntero = parseInt(
      d.getHours().toString().padStart(2, "0") +
      d.getMinutes().toString().padStart(2, "0") +
      d.getSeconds().toString().padStart(2, "0")
    );
    html = '<tr class="impuesRets divide-y divide-gray-200 hover:bg-gray-50 transition-colors" id="impues_' + horaEntero + '" base="' + base + '" impuesto="' + impuesto + '" idimpuesto="' + idimpuesto + '" monto="' + monto + '" tipo="' + tipo + '">'
    html += '<td class="px-4 py-3 text-sm text-gray-900">' + numberFormat(base) + '</td>'
    html += '<td class="px-4 py-3 text-sm text-gray-700">' + impuesto + '</td>'
    html += '<td class="px-4 py-3 text-sm font-semibold text-gray-900">' + numberFormat(monto) + '</td>'
    html += '<td class="px-4 py-3 text-sm text-gray-600">' + tipo + '</td>'
    html += '<td class="px-4 py-3 text-center"><button class="inline-flex items-center justify-center px-2 py-1 text-sm font-medium text-white bg-red-600 hover:bg-red-700 rounded transition-colors" onclick="eliminaImpuesto(' + horaEntero + ');" title="Eliminar"><i class="material-icons text-sm">close</i></button></td>'
    html += '</tr>'

    $('#tableBoduImpuesRetecniones').append(html)
  }

  function eliminaImpuesto(id) {
    $('#impues_' + id).remove()
  }

  let clicandoRet = false
  $('#btnRetencion').click(function() {

    if (clicandoRet == false) {
      clicandoRet = true
      var idcliente = $('#buscaCliente').val()
      if (idcliente == '0') {
        Swal.fire({
          title: 'Selecciona un cliente',
          type: 'warning',
          timer: 1000
        })
        clicandoRet = false
        return false;
      }
      if (!validarRetenciones()) {
        clicandoRet = false
        return false;
      }


      var items = new Array
      contador = 0;
      $('.impuesRets').each(function(index, el) {


        dat = {
          base: $(this).attr('base'),
          impuesto: $(this).attr('impuesto'),
          idimpuesto: $(this).attr('idimpuesto'),
          monto: $(this).attr('monto'),
          tipo: $(this).attr('tipo'),
        }
        items.push(dat)
        contador++;

      });
      if (contador == 0) {
        Swal.fire({
          title: 'Agrega un impuestos a la retencion.',
          type: 'warning',
          timer: 1000
        })
        clicandoRet = false
        return false;
      }
      var dataPost = {
        idcliente: idcliente,
        tipodocumento: $('#tipodocumento').val(),
        clave_ret: $('#clave_ret').val(),
        ejercicio_ret: $('#ejercicio_ret').val(),
        mes_inicio_ret: $('#mes_inicio_ret').val(),
        mes_fin_ret: $('#mes_fin_ret').val(),
        total_ret: $('#total_ret').val(),
        gravado_ret: $('#gravado_ret').val(),
        excento_ret: $('#excento_ret').val(),
        retenido_ret: $('#retenido_ret').val(),
        es_beneficiario: $('#es_beneficiario').val(),
        clave_contribuyente: $('#clave_contribuyente').val(),
        conceptos_retenciones: $('#conceptos_retenciones').val(),
        concepto_ret: $('#concepto_ret').val(),
        items: items,
        usocfdi: $('#usocfdi').val(),
        pais: $('#pais_retencion').val(),
        serie: $('#serie').val(),
      };
      console.log(items)
      $.ajax({
          url: '{{ url("retenciones/operaciones/timbra_retencion") }}',
          type: 'POST',
          dataType: 'json',
          data: dataPost,
        })
        .done(function(resp) {
          console.log(resp);
          if (resp.success == 1) {

            guardarRetencion(resp)
            /*Swal.fire({
              title: 'Factura timbrada exitosamente',
              type: 'success',
              timer: 1000
            })*/
            clicandoRet = false
          } else {
            Swal.fire({
              title: resp.error + ' - ' + resp.mensaje,
              type: 'error',
              timer: 1000
            })
            clicandoRet = false
          }
          setTimeout(() => {}, 1000);
        })
        .fail(function() {
          console.log("error");
          Swal.fire({
            title: 'Error al timbrar la retencion',
            type: 'error',
            timer: 1000
          })
          clicandoRet = false
        })
        .always(function() {
          console.log("complete");
        });

    }
  });

  function validarRetenciones() {

    // Mapeo de campos y mensajes personalizados
    const campos = [{
        id: 'tipodocumento',
        msg: 'Selecciona el tipo de documento.'
      },
      {
        id: 'clave_ret',
        msg: 'La clave de retención es obligatoria.'
      },
      {
        id: 'ejercicio_ret',
        msg: 'Debes seleccionar el ejercicio de retención.'
      },
      {
        id: 'mes_inicio_ret',
        msg: 'Selecciona el mes de inicio.'
      },
      {
        id: 'mes_fin_ret',
        msg: 'Selecciona el mes de fin.'
      },
      {
        id: 'total_ret',
        msg: 'El total de retención no puede estar vacío.'
      },
      {
        id: 'gravado_ret',
        msg: 'El monto gravado es obligatorio.'
      },
      {
        id: 'excento_ret',
        msg: 'El monto exento es obligatorio.'
      },
      {
        id: 'retenido_ret',
        msg: 'El monto retenido es obligatorio.'
      },
      {
        id: 'es_beneficiario',
        msg: 'Selecciona si es beneficiario.'
      },
      {
        id: 'clave_contribuyente',
        msg: 'Selecciona la clave del contribuyente.'
      },
      {
        id: 'conceptos_retenciones',
        msg: 'Debes agregar el concepto de retención.'
      },
      {
        id: 'concepto_ret',
        msg: 'Debes agregar el concepto de retención general.'
      },
    ];

    // Validación
    for (let campo of campos) {
      let valor = $('#' + campo.id).val();

      if (valor === "" || valor === null || valor === undefined) {
        Swal.fire({
          icon: 'error',
          title: 'Falta un dato',
          text: campo.msg
        });
        return false; // Detiene el flujo
      }
    }

    return true;
  }

  function guardarRetencion(retencion) {
    $.ajax({
        url: '{{ url("retenciones/operaciones/guardar_retencion") }}',
        type: 'POST',
        dataType: 'json',
        data: retencion,
      })
      .done(function(resp) {
        console.log("success");
        if (resp.estatus > 0) {
          makePdfRetencion(resp, retencion)
          setTimeout(() => {}, 1000);
          clicandoRet = false
        } else {
          Swal.fire({
            title: 'Error al guardar la retencion',
            type: 'error',
            timer: 1000
          })
          clicandoRet = false
        }
      })
      .fail(function() {
        console.log("error");
      })
      .always(function() {
        console.log("complete");
      });
  }

  function makePdfRetencion(retencion, retencionData) {
    console.log(retencion)
    console.log(retencion)
    $.ajax({
        url: '{{ url("retenciones/operaciones/make_pdf_retencion") }}',
        type: 'POST',
        dataType: 'json',
        data: {
          id: retencion.estatus,
          retencionData: retencionData
        },
      })
      .done(function(resp) {
        console.log("success");
        setTimeout(() => {}, 1000);
        if (resp.estatus > 0) {
          $('#urlPdfFact').val(resp.urlPdf)
          $('#btnFactView').show()
          modalComprobanteFact2(resp.urlPdf, resp.estatus, 2, '')
        }
      })
      .fail(function() {
        console.log("error");
      })
      .always(function() {
        console.log("complete");
      });
  }

  function validaNacionalExtranjero() {
    if ($('#nacional_extranjero').val() == 2) {
      $('#rfc_c').val('XEXX010101000');
      $('#regimen').val(11).trigger('change')
      $('#usocfdi_c').val(23).trigger('change')
    } else {
      $('#rfc_c').val('');
    }
    validaRFC()
  }

  function calculaTotalesRet() {
    let total = $('#total_ret').val()

    $('#totalLabel').html(numberFormat(total))

  }
</script>
@endpush