import { Icon } from "@iconify/react/dist/iconify.js";
import { useMutation, useQuery } from "@tanstack/react-query";
import { useCallback, useEffect, useMemo, useState } from "react";
import { useNavigate } from "react-router-dom";
import { toast } from "sonner";
import styled, { ThemeProvider } from "styled-components";
import { UserAuth } from "../../context/AuthContent";
import { useEmpresaStore } from "../../store/EmpresaStore";
import { useThemeStore } from "../../store/ThemeStore";

// API imports
import {
  getDepositoPrincipal,
  getDepositos,
} from "../../api/depositos.service";
import {
  getEmpresaMonedas,
  getUltimaCotizacion,
} from "../../api/monedas.service";
import { getDirecciones } from "../../api/clientes.service";
import {
  createNotaCredito,
  getSaldosDisponiblesFactura,
} from "../../api/notasCredito.service";
import { getNumeracionesBySucursal } from "../../api/numeraciones.service";
import { getReferenciales } from "../../api/referenciales.service";
import { getSucursales } from "../../api/sucursales.service";
import {
  calcularImpuestoIvaPorItem,
  calcularSubtotales,
} from "../../utils/invoiceCalculations";

// Components
import KudePreviewModal from "../organismos/KudePreviewModal";
import { DocumentoPreviewModal } from "../organismos/DocumentoPreviewModal";
import { ActionButtonsNC } from "../organismos/NotasCredito/ActionButtonsNC";
import { AplicacionNcAviso } from "../organismos/NotasCredito/AplicacionNcAviso";
import { BuscadorFacturasNC } from "../organismos/NotasCredito/BuscadorFacturasNC";
import { InformacionAdicionalNC } from "../organismos/NotasCredito/InformacionAdicionalNC";
import { ItemsTableNC } from "../organismos/NotasCredito/ItemsTableNC";
import { NotaCreditoHeader } from "../organismos/NotasCredito/NotaCreditoHeader";
import { ProductSearchNC } from "../organismos/NotasCredito/ProductSearchNC";
import { TotalsPanelNC } from "../organismos/NotasCredito/TotalsPanelNC";
import { fmtMoneda } from "../_standards/enums/monedas";
import { hoyISO } from "../../utils/fecha";

export function NuevaNotaCreditoTemplate() {
  const navigate = useNavigate();
  const { user } = UserAuth();
  const { dataempresa } = useEmpresaStore();
  const { themeStyle } = useThemeStore();

  // Estado de nota de crédito
  const [sucursalActiva, setSucursalActiva] = useState(null);
  const [puntoExpedicionActivo, setPuntoExpedicionActivo] = useState(null);
  const [numeracionActiva, setNumeracionActiva] = useState(null);
  const [fecha, setFecha] = useState(() => hoyISO());
  const [monedaActiva, setMonedaActiva] = useState(null);
  const [motivoEmisionActivo, setMotivoEmisionActivo] = useState(null);
  const [tipoDocumento, setTipoDocumento] = useState("electronico");
  const [depositoActivo, setDepositoActivo] = useState(null);
  const [informacionAdicional, setInformacionAdicional] = useState("");
  const [recModoAplicacion, setRecModoAplicacion] = useState(null);

  // Estado de items y cliente
  const [items, setItems] = useState([]);
  const [cliente, setCliente] = useState(null);
  const [facturaAsociada, setFacturaAsociada] = useState(null);
  const [saldosFactura, setSaldosFactura] = useState(null);
  const [clienteDirecciones, setClienteDirecciones] = useState([]);
  const [clienteDireccionId, setClienteDireccionId] = useState(null);
  const [direccionFactura, setDireccionFactura] = useState("");

  // Estado de cotización
  const [cotizacionActiva, setCotizacionActiva] = useState(null);
  const [cotizacionRequerida, setCotizacionRequerida] = useState(false);

  // Estado para diálogos
  const [buscadorFacturasOpen, setBuscadorFacturasOpen] = useState(false);
  const [confirmOpen, setConfirmOpen] = useState(false);
  const [isSaving, setIsSaving] = useState(false);

  // Estado para búsqueda de productos (modo impreso)
  const [showProductSearch, setShowProductSearch] = useState(false);

  // Estado para preview KUDE (PDF)
  const [kudePreview, setKudePreview] = useState({
    open: false,
    notaId: null,
  });

  // Estado para documento impreso asociado
  const [documentoImpreso, setDocumentoImpreso] = useState({
    itipdocaso: "2", // 1 = Factura (solo lectura)
    itipodocaso: "1", // Por defecto 1 para NC
    dntimdi: "",
    dfecemidi: "",
    destdocaso: "",
    dpexpdocaso: "",
    dnumdocaso: "",
  });

  // Queries para cargar datos
  const { data: sucursalesData } = useQuery({
    queryKey: ["sucursales"],
    queryFn: () => getSucursales(),
  });

  const { data: monedasData } = useQuery({
    queryKey: ["empresaMonedas"],
    queryFn: getEmpresaMonedas,
  });

  const { data: referencialesData } = useQuery({
    queryKey: ["referenciales"],
    queryFn: getReferenciales,
  });

  // Cargar numeraciones cuando cambia la sucursal (filtrar por tipo documento 5 = Nota de Crédito)
  const { data: numeracionesData, error: numeracionesError } = useQuery({
    queryKey: ["numeraciones-nc", sucursalActiva?.id],
    queryFn: async () => {
      const result = await getNumeracionesBySucursal(sucursalActiva?.id, 5); // Tipo 5 = Nota de Crédito
      if (!result || result.length === 0) {
        throw new Error(
          "No hay numeraciones configuradas para Notas de Crédito (tipo 5) en esta sucursal",
        );
      }
      return result;
    },
    enabled: !!sucursalActiva?.id,
  });

  // Cargar depósitos de la sucursal activa
  const { data: depositosData } = useQuery({
    queryKey: ["depositos", sucursalActiva?.id],
    queryFn: () => getDepositos(sucursalActiva?.id),
    enabled: !!sucursalActiva?.id,
  });

  // Cargar depósito principal de la sucursal
  const { data: depositoPrincipal } = useQuery({
    queryKey: ["deposito-principal", sucursalActiva?.id],
    queryFn: () => getDepositoPrincipal(sucursalActiva?.id),
    enabled: !!sucursalActiva?.id,
  });

  // Cargar direcciones cuando cambia el cliente
  useEffect(() => {
    if (!cliente?.id) {
      setClienteDirecciones([]);
      setClienteDireccionId(null);
      setDireccionFactura("");
      return;
    }
    getDirecciones(cliente.id).then((dirs) => {
      setClienteDirecciones(dirs || []);
      const principal = (dirs || []).find((d) => d.es_principal) || dirs?.[0];
      if (principal) {
        setClienteDireccionId(principal.id);
        if (principal.direccion) setDireccionFactura(principal.direccion);
      } else {
        setClienteDireccionId(null);
      }
    }).catch(() => {});
  }, [cliente?.id]);

  // Mutation para crear nota de crédito
  const createMutation = useMutation({
    mutationFn: createNotaCredito,
    onSuccess: (data) => {
      toast.success("Nota de crédito creada exitosamente");
      // Abrir preview del KUDE generado
      const nc = data?.data ?? data;
      const ncId = nc?.id;
      if (ncId) {
        const numero = [nc.dest, nc.dpunexp, nc.dnumdoc].filter(Boolean).join("-");
        setKudePreview({ open: true, notaId: ncId, numero });
      }
      // Limpiar formulario
      handleClearAll();
    },
    onError: (error) => {
      console.error("Error al crear nota de crédito:", error);
      const mensaje =
        error?.response?.data?.message ||
        error?.message ||
        "Error al crear nota de crédito";
      const status = error?.response?.status;
      // Errores de validación de negocio (400): mensaje largo y accionable —
      // mantener visible hasta que el usuario lo cierre.
      const esValidacion = status === 400 || status === 409;
      toast.error(mensaje, {
        duration: esValidacion ? Infinity : 8000,
        closeButton: true,
      });
    },
  });

  // Extraer datos de las queries
  const sucursales = sucursalesData?.data || sucursalesData || [];
  const monedas = monedasData?.data || monedasData || [];
  const motivosEmision =
    referencialesData?.motivo_emision_nota_credito_y_debito || [];
  const depositos = Array.isArray(depositosData) ? depositosData : [];

  // Extraer puntos de expedición de las numeraciones
  const puntosExpedicion = useMemo(() => {
    if (!numeracionesData) return [];
    const puntosMap = new Map();
    (numeracionesData || []).forEach((n) => {
      if (n.punto_expedicion && !puntosMap.has(n.punto_expedicion.id)) {
        puntosMap.set(n.punto_expedicion.id, n.punto_expedicion);
      }
    });
    return Array.from(puntosMap.values());
  }, [numeracionesData]);

  // Calcular numeración siguiente
  const numeracionSiguiente = useMemo(() => {
    if (!numeracionActiva) return "";
    const pe = numeracionActiva.punto_expedicion;
    const establecimiento =
      pe?.empresas_sucursales?.punto_establecimiento || pe?.codigo || "001";
    const punto =
      pe?.punto_expedicion || numeracionActiva.codigo_punto || "001";
    const numero = String(numeracionActiva.numero_actual).padStart(7, "0");
    return `${establecimiento}-${punto}-${numero}`;
  }, [numeracionActiva]);

  // Inicializar valores por defecto
  useEffect(() => {
    // Sucursal por defecto
    if (sucursales.length > 0 && !sucursalActiva) {
      const defaultSuc =
        sucursales.find((s) => s.id === user?.sucursal_id) || sucursales[0];
      setSucursalActiva(defaultSuc);
    }
  }, [sucursales, user?.sucursal_id, sucursalActiva]);

  useEffect(() => {
    // Moneda principal por defecto
    if (monedas.length > 0 && !monedaActiva) {
      const defaultMon =
        monedas.find((m) => m.es_principal && m.activo) || monedas[0];
      setMonedaActiva(defaultMon);
    }
  }, [monedas, monedaActiva]);

  useEffect(() => {
    // Motivo de emisión por defecto
    if (motivosEmision.length > 0 && !motivoEmisionActivo) {
      setMotivoEmisionActivo(motivosEmision[0]);
    }
  }, [motivosEmision, motivoEmisionActivo]);

  // Establecer depósito principal por defecto cuando cambia la sucursal
  useEffect(() => {
    if (depositoPrincipal) {
      setDepositoActivo(depositoPrincipal);
    } else if (depositos.length > 0 && !depositoActivo) {
      setDepositoActivo(depositos[0]);
    }
  }, [depositoPrincipal, depositos, depositoActivo]);

  useEffect(() => {
    // Punto de expedición por defecto cuando cambia la sucursal
    if (puntosExpedicion.length > 0) {
      setPuntoExpedicionActivo(puntosExpedicion[0]);
    } else {
      setPuntoExpedicionActivo(null);
    }
  }, [puntosExpedicion]);

  useEffect(() => {
    // Numeración por defecto cuando cambia el punto de expedición
    // Filtrar por tipo de documento "Nota de crédito electrónica" (codigo 5)
    if (numeracionesData && puntoExpedicionActivo) {
      const numPE = numeracionesData.find(
        (n) =>
          n.punto_expedicion_id === puntoExpedicionActivo.id &&
          n.tipo_documento?.codigo === 5,
      );
      setNumeracionActiva(numPE || null);
    }
  }, [numeracionesData, puntoExpedicionActivo]);

  // Mostrar alerta si no hay numeraciones de tipo 5
  useEffect(() => {
    if (numeracionesError) {
      toast.error(numeracionesError.message);
    }
  }, [numeracionesError]);

  // Verificar cotización cuando cambia la moneda
  useEffect(() => {
    const verificarCotizacion = async () => {
      if (!monedaActiva || monedaActiva?.moneda?.codigo === "PYG") {
        setCotizacionActiva(null);
        setCotizacionRequerida(false);
        return;
      }

      const monedaId = monedaActiva.moneda_id;
      try {
        const ultimaCotizacion = await getUltimaCotizacion(monedaId);
        if (!ultimaCotizacion) {
          toast.error(
            `No hay cotizaciones cargadas para ${monedaActiva.moneda?.descripcion || monedaActiva.moneda?.codigo}`,
          );
          setCotizacionActiva(null);
          setCotizacionRequerida(true);
          return;
        }
        setCotizacionActiva(ultimaCotizacion);
        setCotizacionRequerida(false);
      } catch (error) {
        toast.error(
          `No hay cotizaciones cargadas para ${monedaActiva.moneda?.descripcion || monedaActiva.moneda?.codigo}`,
        );
        setCotizacionActiva(null);
        setCotizacionRequerida(true);
      }
    };

    verificarCotizacion();
  }, [monedaActiva]);

  // Handlers para cambios
  const handleSucursalChange = useCallback((suc) => {
    setSucursalActiva(suc);
    setPuntoExpedicionActivo(null);
    setNumeracionActiva(null);
  }, []);

  const handlePuntoExpedicionChange = useCallback(
    (pe) => {
      setPuntoExpedicionActivo(pe);
      if (numeracionesData && pe) {
        const numPE = numeracionesData.find(
          (n) =>
            n.punto_expedicion_id === pe.id && n.tipo_documento?.codigo === 5,
        );
        setNumeracionActiva(numPE || null);
      }
    },
    [numeracionesData],
  );

  const handleSelectFactura = useCallback(
    (factura) => {
      try {
        setFacturaAsociada(factura);
        setCliente(factura.clientes || factura.cliente);

        // Cargar saldos disponibles globales para validación
        if (factura?.id) {
          getSaldosDisponiblesFactura(factura.id)
            .then((saldos) => setSaldosFactura(saldos?.data || saldos))
            .catch(() => setSaldosFactura(null));
        }

        // Preseleccionar moneda de la factura
        const monedaFactura = monedas.find(
          (m) => m.moneda_id === factura.moneda_id,
        );
        if (monedaFactura) {
          setMonedaActiva(monedaFactura);
        }

        // Cargar items de la factura con la misma estructura que el modo impreso
        const itemsFactura = (factura.factura_det || []).map((item, index) => {
          const cantidad = parseFloat(item.dcantproser) || 0;
          const precio_unitario = parseFloat(item.duniproser) || 0;
          const porcentaje_iva = parseInt(item.dtasiva) || 10;
          const proporcion_iva = parseInt(item.dpropiva) || 100;
          const codigo_afectacion_iva = parseInt(item.iafeciva) || 1;

          // Calcular totales
          const total_bruto_operacion_item = item.dtotbruopeitem;
          const total_operacion_item = item.dtotopeitem;

          // Usar la función del POS Admin para calcular impuestos
          const itemParaCalculo = {
            total_operacion_item,
            porcentaje_iva,
            proporcion_iva,
            codigo_afectacion_iva,
          };
          const { base_gravada, liquidacion_iva, base_gravada_exenta } =
            calcularImpuestoIvaPorItem(itemParaCalculo);
          return {
            id: `item-${index}`,
            producto_id: item.producto_id,
            cod_producto: item.productos?.codigo || item.cod_producto || "",
            desc_producto: item.ddesproser || "",
            codigo_referencial: item.productos?.codigo || "",
            cod_unidad_medida: (() => {
              const rep = item.productos?.unidades_de_medida?.representacion;
              const cod = item.productos?.unidades_de_medida?.codigo;
              if (typeof item.cod_unidad_medida === "string" && item.cod_unidad_medida.length <= 5 && item.cod_unidad_medida.length > 0) {
                return item.cod_unidad_medida;
              }
              if (typeof rep === "string" && rep.length <= 5 && rep.length > 0) {
                return rep;
              }
              if (cod != null) return String(cod);
              return "UNI";
            })(),
            desc_unidad_medida:
              item.unidad_medida ||
              item.productos?.unidades_de_medida?.representacion ||
              "UNI",
            cantidad,
            precio_unitario,
            total_bruto_operacion_item,
            total_operacion_item,
            total_operacion_item_gs:
              total_operacion_item * (cotizacionActiva?.cotizacion_venta || 1),
            descuento_particular_precio_unitario_item: 0,
            descuento_global_item: 0,
            porcentaje_descuento_item: 0,
            porcentaje_descuento_global: 0,
            porcentaje_iva,
            proporcion_iva,
            base_gravada,
            liquidacion_iva,
            base_gravada_exenta,
            codigo_afectacion_iva,
            descripcion_afectacion_iva: item.descripcion_afectacion_iva || "",
            // Campos para validación de cantidad máxima en electrónico
            cantidad_original: cantidad,
            es_adicional: false,
          };
        });

        setItems(itemsFactura);
        toast.success(
          `Factura ${factura.dest}-${factura.dpunexp}-${factura.dnumdoc} cargada con ${itemsFactura.length} items`,
        );
      } catch (error) {
        console.error("Error al cargar factura:", error);
        toast.error("Error al cargar los datos de la factura");
      }
    },
    [monedas, cotizacionActiva],
  );

  const handleAddProduct = useCallback(
    (producto) => {
      const cantidad = parseFloat(producto.cantidad) || 1;
      const precio_unitario = parseFloat(producto.precio_venta) || 0;
      const porcentaje_iva = parseInt(producto.porcentaje_iva) || 10;
      const proporcion_iva = parseInt(producto.proporcion_iva) || 100;
      const codigo_afectacion_iva = parseInt(producto.afectacion_iva) || 1;

      // Calcular totales según la lógica del POS Admin
      const total_bruto_operacion_item = cantidad * precio_unitario;
      const total_operacion_item = total_bruto_operacion_item; // Sin descuentos en NC

      // Usar la función del POS Admin para calcular impuestos
      const itemParaCalculo = {
        total_operacion_item,
        porcentaje_iva,
        proporcion_iva,
        codigo_afectacion_iva,
      };
      const { base_gravada, liquidacion_iva, base_gravada_exenta } =
        calcularImpuestoIvaPorItem(itemParaCalculo);

      const codUnidad =
        producto.unidades_de_medida?.representacion != null &&
        String(producto.unidades_de_medida.representacion).length <= 5
          ? String(producto.unidades_de_medida.representacion)
          : producto.unidades_de_medida?.codigo != null
            ? String(producto.unidades_de_medida.codigo)
            : "UNI";

      const nuevoItem = {
        id: `item-${Date.now()}`,
        producto_id: producto.id,
        cod_producto: producto.codigo || "",
        desc_producto: producto.descripcion || "",
        codigo_referencial: producto.codigo || "",
        cod_unidad_medida: codUnidad,
        desc_unidad_medida:
          producto.unidades_de_medida?.descripcion || "Unidad",
        cantidad,
        precio_unitario,
        total_bruto_operacion_item,
        total_operacion_item,
        total_operacion_item_gs:
          total_operacion_item * (cotizacionActiva?.cotizacion_venta || 1),
        descuento_particular_precio_unitario_item: 0,
        descuento_global_item: 0,
        porcentaje_descuento_item: 0,
        porcentaje_descuento_global: 0,
        porcentaje_iva,
        proporcion_iva,
        base_gravada,
        liquidacion_iva,
        base_gravada_exenta,
        codigo_afectacion_iva,
        descripcion_afectacion_iva: producto.descripcion_afectacion_iva || "",
        es_adicional: !!facturaAsociada,
      };

      setItems((prevItems) => [...prevItems, nuevoItem]);
      toast.success(`Producto "${nuevoItem.desc_producto}" agregado`);
    },
    [cotizacionActiva, facturaAsociada],
  );

  const handleUpdateItem = useCallback((index, field, value) => {
    setItems((prevItems) => {
      const newItems = [...prevItems];
      const updated = { ...newItems[index], [field]: value };
      if (field === "cantidad" || field === "precio_unitario") {
        const cantidad = Number(updated.cantidad) || 0;
        const precioUnit = Number(updated.precio_unitario) || 0;
        const totalBruto = +(cantidad * precioUnit).toFixed(8);
        const ivaCalc = calcularImpuestoIvaPorItem({
          total_operacion_item: totalBruto,
          porcentaje_iva: updated.porcentaje_iva || 10,
          proporcion_iva: updated.proporcion_iva || 100,
          codigo_afectacion_iva: updated.codigo_afectacion_iva || 1,
        });
        updated.total_bruto_operacion_item = totalBruto;
        updated.total_operacion_item = totalBruto;
        updated.total_operacion_item_gs =
          totalBruto * (cotizacionActiva?.cotizacion_venta || 1);
        updated.base_gravada = ivaCalc.base_gravada || 0;
        updated.liquidacion_iva = ivaCalc.liquidacion_iva || 0;
        updated.base_gravada_exenta = ivaCalc.base_gravada_exenta || 0;
      }
      newItems[index] = updated;
      return newItems;
    });
  }, [cotizacionActiva]);

  const handleRemoveItem = useCallback((index) => {
    setItems((prevItems) => prevItems.filter((_, i) => i !== index));
  }, []);

  const handleClearAll = useCallback(() => {
    setItems([]);
    setCliente(null);
    setFacturaAsociada(null);
    setSaldosFactura(null);
    setInformacionAdicional("");
    setBuscadorFacturasOpen(false);
    setShowProductSearch(false);
    setClienteDirecciones([]);
    setClienteDireccionId(null);
    setDireccionFactura("");
  }, []);

  // Calcular totales usando la función del POS Admin
  const totales = useMemo(() => {
    return calcularSubtotales(items);
  }, [items]);

  // Saldo disponible NC global cuando hay factura asociada
  const saldoDisponibleNC = useMemo(() => {
    if (!facturaAsociada || !saldosFactura) return null;
    return Number(saldosFactura.monto_disponible ?? 0);
  }, [facturaAsociada, saldosFactura]);

  const excedeSaldoNC = useMemo(() => {
    if (saldoDisponibleNC === null) return false;
    return (totales.total_neto_operacion || 0) > saldoDisponibleNC + 0.01;
  }, [saldoDisponibleNC, totales.total_neto_operacion]);

  // Validaciones
  const canSave = useMemo(() => {
    return !!(
      items.length > 0 &&
      cliente &&
      numeracionActiva &&
      monedaActiva &&
      motivoEmisionActivo &&
      !cotizacionRequerida &&
      !excedeSaldoNC
    );
  }, [
    items.length,
    cliente,
    numeracionActiva,
    monedaActiva,
    motivoEmisionActivo,
    cotizacionRequerida,
    excedeSaldoNC,
  ]);

  const handleSave = useCallback(() => {
    if (!canSave) {
      toast.error("Complete todos los campos requeridos");
      return;
    }
    setConfirmOpen(true);
  }, [canSave]);

  const doSave = useCallback(async () => {
    setConfirmOpen(false);
    setIsSaving(true);

    try {
      // Construir cabecera según estructura del backend
      const cabecera = {
        cliente_id: cliente.id,
        tipo_impuesto_id:
          referencialesData?.tipo_impuesto?.find((t) => t.codigo === 1)?.id ||
          null,
        moneda_id: monedaActiva?.moneda_id || null,
        motivo_emision_id: motivoEmisionActivo.id,
        tipo_operacion_id:
          referencialesData?.tipo_operacion?.find((t) => t.codigo === 1)?.id ||
          null,
        factura_cab_id: facturaAsociada?.id || null,
        // Nuevos campos requeridos
        numeracion_id: numeracionActiva?.id || null,
        deposito_id: depositoActivo?.id || null,
        tipo_documento: tipoDocumento, // 'electronico' o 'impreso'
        dinfoemi: informacionAdicional || null,
        dinfofisc: null,
        ddirrec: direccionFactura?.trim() || null,
        cliente_direccion_id: clienteDireccionId || null,
        dfeemide: new Date().toISOString().replace("T", " ").substring(0, 19),
        dcondticam: monedaActiva?.moneda?.codigo !== "PYG" ? "1" : null,
        dticam: cotizacionActiva?.cotizacion_venta || 0,
        dinfadic: informacionAdicional || null,
        rec_modo_aplicacion: facturaAsociada?.id ? (recModoAplicacion || null) : null,
        // Documentos asociados según tipo
        documentos_asociados:
          tipoDocumento === "electronico"
            ? {
                // Electrónico: solo CDC de la factura
                dntimdi: null,
                dnumcons: null,
                itipcons: null,
                dcdcderef: facturaAsociada?.cdc || null,
                dfecemidi: null,
                dnumrescf: null,
                destdocaso: null,
                dnumcomret: null,
                dnumdocaso: null,
                itipdocaso: "1",
                dnumcontrol: null,
                dpexpdocaso: null,
                itipodocaso: null,
              }
            : {
                // Impreso: datos de la factura preimpresa ingresados manualmente
                dntimdi: documentoImpreso?.dntimdi || null,
                dnumcons: null,
                itipcons: null,
                dcdcderef: null,
                dfecemidi: documentoImpreso?.dfecemidi || null,
                dnumrescf: null,
                destdocaso: documentoImpreso?.destdocaso || null,
                dnumcomret: null,
                dnumdocaso: documentoImpreso?.dnumdocaso || null,
                itipdocaso: documentoImpreso?.itipdocaso || "1",
                dnumcontrol: null,
                dpexpdocaso: documentoImpreso?.dpexpdocaso || null,
                itipodocaso: documentoImpreso?.itipodocaso || "1",
              },
      };
      // Construir items según estructura del backend
      const itemsPayload = items.map((item, index) => {
        const cantidad = Number(item.cantidad) || 0;
        const precioUnit = Number(item.precio_unitario) || 0;
        const totalBruto = +(cantidad * precioUnit).toFixed(8);
        const ivaCalc = calcularImpuestoIvaPorItem({
          total_operacion_item: totalBruto,
          porcentaje_iva: item.porcentaje_iva || 10,
          proporcion_iva: item.proporcion_iva || 100,
          codigo_afectacion_iva: item.codigo_afectacion_iva || 1,
        });
        const umRaw =
          item.cod_unidad_medida || item.desc_unidad_medida || "UNI";
        const umStr = String(umRaw).slice(0, 5) || "UNI";
        return ({
        producto_id: item.producto_id,
        unidad_medida: umStr,
        descripcion: item.desc_producto || item.descripcion || "",
        cantidad,
        precio_unitario: precioUnit,
        total_bruto: totalBruto,
        total_operacion: totalBruto,
        total_gs: item.total_operacion_item_gs || 0,
        afectacion_iva: item.codigo_afectacion_iva || 1,
        porcentaje_iva: item.porcentaje_iva || 10,
        proporcion_iva: item.proporcion_iva || 100,
        base_gravada: ivaCalc.base_gravada || 0,
        liquidacion_iva: ivaCalc.liquidacion_iva || 0,
        descuento: 0,
        porcentaje_descuento: 0,
        base_gravada_exenta: ivaCalc.base_gravada_exenta || 0,
        info_adicional_item: null,
        pais_origen: null,
        tipo_cambio_item: 0,
        item: index + 1,
        });
      });

      // Construir subtotal según estructura del backend
      const subtotal = {
        subtotal_exento: totales.subtotal_operacion_exenta || 0,
        subtotal_exonerado: totales.subtotal_operacion_exonerada || 0,
        subtotal_5: totales.subtotal_operacion_iva5 || 0,
        subtotal_10: totales.subtotal_operacion_iva10 || 0,
        total_operacion: totales.total_neto_operacion || 0,
        total_descuento: totales.total_descuento_operacion || 0,
        total_descuento_global_item: totales.total_descuento_global_item || 0,
        total_anticipo_item: 0,
        total_anticipo_global: 0,
        porcentaje_descuento_total: totales.porcentaje_descuento_global || 0,
        total_anticipo: 0,
        total_redondeo: 0,
        total_comision: 0,
        total_general_operacion: totales.total_neto_operacion || 0,
        liquidacion_iva_5: totales.total_liquidacion_iva5 || 0,
        liquidacion_iva_10: totales.total_liquidacion_iva10 || 0,
        liquidacion_redondeo_5: 0,
        liquidacion_redondeo_10: 0,
        liquidacion_iva_comision: 0,
        total_iva: totales.total_liquidacion_iva || 0,
        total_base_gravada_5: totales.total_base_gravada_iva5 || 0,
        total_base_gravada_10: totales.total_base_gravada_iva10 || 0,
        total_base_gravada: totales.total_base_gravada_iva || 0,
        total_gs:
          monedaActiva?.moneda?.codigo !== "PYG"
            ? totales.total_neto_operacion *
              (cotizacionActiva?.cotizacion_venta || 1)
            : 0,
      };

      const payload = {
        cabecera,
        items: itemsPayload,
        subtotal,
      };

      await createMutation.mutateAsync(payload);
    } catch (error) {
      console.error("Error al guardar:", error);
    } finally {
      setIsSaving(false);
    }
  }, [
    canSave,
    cliente,
    numeracionActiva,
    numeracionSiguiente,
    depositoActivo,
    motivoEmisionActivo,
    facturaAsociada,
    informacionAdicional,
    monedaActiva,
    cotizacionActiva,
    referencialesData,
    tipoDocumento,
    items,
    totales,
    createMutation,
    documentoImpreso,
    clienteDireccionId,
    direccionFactura,
    recModoAplicacion,
  ]);

  const handlePrint = useCallback(() => {
    toast.info("Función de impresión no implementada");
  }, []);

  return (
    <ThemeProvider theme={themeStyle}>
      <Container>

        {/* Header */}
        <Header>
          <div className="title">
            <Icon icon="mdi:file-minus" />
            <h1>Nueva Nota de Crédito</h1>
          </div>
          <div className="info">
            <span>
              <Icon icon="mdi:account" />
              {user?.nombre || "Usuario"}
            </span>
            <span>
              <Icon icon="mdi:domain" />
              {dataempresa?.razon_social || "Empresa"}
            </span>
          </div>
        </Header>

        <Content>
          <MainSection>
            {/* Header de la NC */}
            <NotaCreditoHeader
              sucursales={sucursales}
              sucursalActiva={sucursalActiva}
              onSucursalChange={handleSucursalChange}
              puntosExpedicion={puntosExpedicion}
              puntoExpedicionActivo={puntoExpedicionActivo}
              onPuntoExpedicionChange={handlePuntoExpedicionChange}
              numeracionSiguiente={numeracionSiguiente}
              fecha={fecha}
              onFechaChange={setFecha}
              monedas={monedas}
              monedaActiva={monedaActiva}
              onMonedaChange={setMonedaActiva}
              motivosEmision={motivosEmision}
              motivoEmisionActivo={motivoEmisionActivo}
              onMotivoEmisionChange={setMotivoEmisionActivo}
              recModoAplicacion={recModoAplicacion}
              onRecModoAplicacionChange={setRecModoAplicacion}
              facturaAsociadaPresente={!!facturaAsociada?.id}
              tipoDocumento={tipoDocumento}
              onTipoDocumentoChange={setTipoDocumento}
              depositos={depositos}
              depositoActivo={depositoActivo}
              onDepositoChange={setDepositoActivo}
              cliente={cliente}
              onClienteChange={setCliente}
              clienteDirecciones={clienteDirecciones}
              clienteDireccionId={clienteDireccionId}
              direccionFactura={direccionFactura}
              onDireccionChange={setDireccionFactura}
              onClienteDireccionChange={(dir) => {
                setClienteDireccionId(dir.id);
                setDireccionFactura(dir.direccion || "");
              }}
              documentoImpreso={documentoImpreso}
              onDocumentoImpresoChange={setDocumentoImpreso}
              tiposDocumentoImpreso={
                referencialesData?.tipo_documento_impreso || []
              }
            />

            {/* Botón buscar factura entre datos del cliente e items */}
            {tipoDocumento === "electronico" && (
              <SearchFacturaSection>
                <SearchFacturaButton
                  onClick={() => setBuscadorFacturasOpen(true)}
                  disabled={!cliente || numeracionesError}
                >
                  <Icon icon="mdi:magnify" />
                  {facturaAsociada
                    ? "Cambiar Factura Asociada"
                    : "Buscar Factura a Asociar"}
                </SearchFacturaButton>
                {facturaAsociada && (
                  <FacturaInfo>
                    <Icon icon="mdi:check-circle" />
                    Factura: {facturaAsociada.dest}-{facturaAsociada.dpunexp}-
                    {facturaAsociada.dnumdoc}
                  </FacturaInfo>
                )}
                {/* Qué va a pasar con la factura al emitir, con el monto real de
                    la NC: es la diferencia entre ESTRICTO y FLEXIBLE que antes
                    solo se descubría mirando la cuenta corriente. */}
                <AplicacionNcAviso
                  tieneFactura={!!facturaAsociada?.id}
                  modoElegido={recModoAplicacion}
                  modoDefaultEmpresa={saldosFactura?.nc_modo_default}
                  montoNc={totales.total_neto_operacion || 0}
                  saldoFactura={saldosFactura?.saldo_pendiente_cobro}
                  numeroFactura={
                    facturaAsociada
                      ? `${facturaAsociada.dest}-${facturaAsociada.dpunexp}-${facturaAsociada.dnumdoc}`
                      : undefined
                  }
                  moneda={monedaActiva?.moneda?.codigo}
                />
              </SearchFacturaSection>
            )}

            {/* Búsqueda de productos:
                - Modo impreso: siempre
                - Modo electrónico: solo si hay factura asociada (productos adicionales) */}
            {(tipoDocumento === "impreso" ||
              (tipoDocumento === "electronico" && facturaAsociada)) && (
              <ProductSearchNC
                onProductSelect={handleAddProduct}
                referenciales={referencialesData}
                cliente={cliente}
                disabled={!monedaActiva || numeracionesError}
                depositoActivo={depositoActivo}
                monedaActiva={monedaActiva}
              />
            )}

            {/* Tabla de items */}
            <ItemsTableNC
              items={items}
              onUpdateItem={handleUpdateItem}
              onRemoveItem={handleRemoveItem}
              monedaActiva={monedaActiva}
              tipoDocumento={tipoDocumento}
              facturaOriginal={facturaAsociada}
            />
          </MainSection>

          <SidePanel>
            {/* Panel de totales */}
            <TotalsPanelNC
              totales={totales}
              monedaActiva={monedaActiva}
              tipoDocumento={tipoDocumento}
              facturaOriginal={facturaAsociada}
              saldoDisponibleNC={saldoDisponibleNC}
              excedeSaldoNC={excedeSaldoNC}
            />

            {/* Información adicional debajo de subtotales */}
            <InformacionAdicionalNC
              informacionAdicional={informacionAdicional}
              onInformacionAdicionalChange={setInformacionAdicional}
            />

            {/* Botones de acción */}
            <ActionButtonsNC
              onSave={handleSave}
              onClear={handleClearAll}
              onPrint={handlePrint}
              isSaving={isSaving}
              canSave={canSave && !numeracionesError}
              canPrint={false}
            />
          </SidePanel>
        </Content>

        {/* Modal de preview KUDE */}
        <KudePreviewModal
          open={kudePreview.open}
          onClose={() => setKudePreview({ open: false, notaId: null })}
          documentoId={kudePreview.notaId}
          numeroDocumento={kudePreview.numero}
          tipoDocumento={5}
        />

        {/* Diálogo buscador de facturas */}
        <BuscadorFacturasNC
          open={buscadorFacturasOpen}
          onClose={() => setBuscadorFacturasOpen(false)}
          onSelectFactura={handleSelectFactura}
          cliente={cliente}
          tipoDocumento={tipoDocumento}
        />

        {/* Diálogo de confirmación antes de registrar */}
        <DocumentoPreviewModal
          open={confirmOpen}
          onClose={() => !isSaving && setConfirmOpen(false)}
          onConfirm={doSave}
          loading={isSaving}
          titulo="Confirmar emisión de Nota de Crédito"
          confirmLabel="Confirmar y registrar"
          moneda={monedaActiva?.moneda?.codigo || "PYG"}
          alerta={
            facturaAsociada
              ? "Si la factura ya tiene cobros registrados, la NC se emite igual (el recibo no es documento fiscal). Verificá con el cliente cómo se compensará el crédito."
              : undefined
          }
          campos={[
            { label: "Numeración", value: numeracionSiguiente || "—" },
            { label: "Cliente", value: cliente?.razon_social || cliente?.nombre || "—" },
            cliente?.ruc && { label: "RUC / Doc.", value: `${cliente.ruc}${cliente.dv != null ? `-${cliente.dv}` : ""}` },
            { label: "Tipo documento", value: tipoDocumento === "electronico" ? "Electrónico" : "Impreso" },
            { label: "Moneda", value: monedaActiva?.moneda?.descripcion || monedaActiva?.moneda?.codigo || "PYG" },
            motivoEmisionActivo && { label: "Motivo emisión", value: motivoEmisionActivo?.descripcion },
            depositoActivo && { label: "Depósito", value: depositoActivo?.descripcion || depositoActivo?.nombre },
            direccionFactura && { label: "Dirección", value: direccionFactura },
            facturaAsociada && {
              label: "Factura asociada",
              value: `${facturaAsociada.dest}-${facturaAsociada.dpunexp}-${facturaAsociada.dnumdoc}`,
            },
            saldoDisponibleNC !== null && {
              label: "Saldo en factura",
              value: fmtMoneda(saldoDisponibleNC, monedaActiva?.moneda?.codigo || "PYG"),
            },
          ]}
          items={items.map((it) => ({
            descripcion: it.desc_producto || it.descripcion || "",
            cantidad: it.cantidad,
            precio: it.precio_unitario,
            descuento: (Number(it.descuento_particular_precio_unitario_item) || 0) * (Number(it.cantidad) || 1),
            iva: it.porcentaje_iva != null ? it.porcentaje_iva : null,
            total: it.total_operacion_item || 0,
          }))}
          totales={[
            (totales.subtotal_operacion_exenta || 0) > 0 && { label: "Exentas", value: totales.subtotal_operacion_exenta },
            (totales.total_base_gravada_iva || 0) > 0 && { label: "Base gravada", value: totales.total_base_gravada_iva },
            (totales.total_liquidacion_iva10 || 0) > 0 && { label: "IVA 10%", value: totales.total_liquidacion_iva10 },
            (totales.total_liquidacion_iva5 || 0) > 0 && { label: "IVA 5%", value: totales.total_liquidacion_iva5 },
            (totales.total_liquidacion_iva || 0) > 0 && { label: "Total IVA", value: totales.total_liquidacion_iva },
            { label: "TOTAL NC", value: totales.total_neto_operacion || 0, fuerte: true, color: "primary.main" },
            saldoDisponibleNC !== null && {
              label: "Saldo tras NC",
              value: saldoDisponibleNC - (totales.total_neto_operacion || 0),
              color: saldoDisponibleNC - (totales.total_neto_operacion || 0) < -0.01 ? "error.main" : "success.main",
            },
          ]}
          notas={informacionAdicional}
        />
      </Container>
    </ThemeProvider>
  );
}

// Styled Components
const Container = styled.div`
  min-height: 100vh;
  background: ${({ theme }) => theme.bg};
  color: ${({ theme }) => theme.text};
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 20px;
`;

const Header = styled.header`
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 20px;
  background: ${({ theme }) => theme.bg2};
  border-radius: 12px;
  border: 1px solid ${({ theme }) => theme.color2};

  .title {
    display: flex;
    align-items: center;
    gap: 12px;

    h1 {
      margin: 0;
      font-size: 1.4rem;
      font-weight: 600;
    }

    svg {
      color: ${({ theme }) => theme.primary};
    }
  }

  .info {
    display: flex;
    gap: 20px;

    span {
      display: flex;
      align-items: center;
      gap: 6px;
      font-size: 0.9rem;
      color: ${({ theme }) => theme.textSecondary};
    }
  }

  @media (max-width: 768px) {
    flex-direction: column;
    gap: 12px;

    .info {
      width: 100%;
      justify-content: space-between;
    }
  }
`;

const Content = styled.div`
  display: flex;
  gap: 20px;
  flex: 1;

  @media (max-width: 1024px) {
    flex-direction: column;
  }
`;

const MainSection = styled.main`
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 16px;
  min-width: 0;
`;

const SidePanel = styled.aside`
  width: 380px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  flex-shrink: 0;

  @media (max-width: 1024px) {
    width: 100%;
  }
`;

const SearchFacturaSection = styled.div`
  background: ${({ theme }) => theme.bg2};
  border-radius: 12px;
  border: 1px solid ${({ theme }) => theme.color2};
  padding: 16px 20px;
  display: flex;
  flex-direction: column;
  gap: 12px;
`;

const SearchFacturaButton = styled.button`
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 14px 20px;
  background: ${({ theme }) => theme.primary};
  color: white;
  border: none;
  border-radius: 8px;
  font-size: 0.9rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;

  &:hover:not(:disabled) {
    background: ${({ theme }) => theme.primaryDark || theme.primary};
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  }

  &:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
    background: ${({ theme }) => theme.bg4};
    color: ${({ theme }) => theme.textSecondary};
  }

  svg {
    font-size: 1.1rem;
  }
`;

const FacturaInfo = styled.div`
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  background: ${({ theme }) => theme.primary}15;
  border: 1px solid ${({ theme }) => theme.primary}30;
  border-radius: 6px;
  font-size: 0.85rem;
  color: ${({ theme }) => theme.primary};
  font-weight: 500;

  svg {
    color: ${({ theme }) => theme.primary};
  }
`;