// ─── Finanzas · Factura recibida (alta standalone + edición de las de un pago) ──
// FacturaRecibidaFinScreen: crea un PAGO nuevo con su primera factura recibida
// del proveedor (extracción IA incluida). FacturaRecibidaScreen: agrega/edita
// las facturas recibidas (1:N) de un PAGO YA EXISTENTE. Movidas de screens-
// finanzas-nuevo.jsx y screens-finanzas-docs.jsx respectivamente (P8) —
// "tomar tal cual" (mapa-comprension.md §Reutilización), sin fusionar entre sí
// (misma razón que pago.jsx: una CREA el pago, la otra edita facturas de uno
// que ya existe). Renombres: _pagoProveedor/_persistPago/_pagoFacturas
// colapsaron en resolverProveedorPago/persistirPago/facturasDelPago
// (screens/finanzas/compartido.jsx, compartidos con pago.jsx); _finHoy/
// _finAddDays murieron — MicosTodayISO()/MicosAddDays() directo (dominio/
// formato.js). Expone a window: FacturaRecibidaFinScreen,
// FacturaRecibidaScreen. Consume window.PROVEEDORES/COMPRAS/PAGOS,
// MicosStore, useDocEdit/buildDocActions/FileUploadCard (ui/doc-kit-edit.jsx),
// DocumentShell/DocCard/PartyBlock/Totals/ObservacionesCard/buildEmisorFields
// (ui/doc-kit-shell.jsx), DocMetaStrip (ui/doc-kit-meta.jsx), ItemsTable
// (ui/doc-kit-items.jsx), resolverProveedorPago/persistirPago/
// facturasDelPago/buildProveedorFields (screens/finanzas/compartido.jsx),
// MicosItemsMath, formatComprobanteCodigo (dominio/secuencias.js),
// window.PartySelectorModal, window.MicosAIExtract.facturaRecibida.
//
// EXCEPCIÓN AL TECHO DURO DE 400 LÍNEAS (regla de la compuerta, P7 §3 — mismo
// criterio que doc-kit-edit.jsx/screens/docs/remito.jsx/factura.jsx/recibo.jsx):
// dos pantallas de un mismo tema ("Factura recibida", alta standalone + edición
// sobre un pago existente) que NO se fusionan entre sí (a diferencia de factura/
// recibo, acá no hay una única entidad con 2 fuentes — una CREA el pago, la otra
// edita facturas de uno que ya existe), pero sí comparten dueño de archivo por
// ser exactamente el mismo dominio y consumir los mismos helpers de
// compartido.jsx. Partirlas en 2 archivos de ~220 líneas cada uno no bajaría el
// acoplamiento real, solo el conteo de líneas.

// ───────────────────────────────────────────────
// ALTA: crea un PAGO nuevo con su factura recibida.
// ───────────────────────────────────────────────
function FacturaRecibidaFinScreen({ isCreate = true, onBack, onSaved, backLabel }) {
  const blank = React.useMemo(() => makeBlankPagoRecord(), []);
  const original = blank;
  const co = COMPANY_CONFIG;
  const M = MicosItemsMath;

  const { editing, draft, setDraft, discardEdit, saveEdit, patch } = useDocEdit(() => ({
    proveedor: null,
    tipoFactura: 'A', puntoVenta: 1, numero: '',
    fechaEmision: MicosTodayISO(), fechaVencPago: MicosAddDays(MicosTodayISO(), 30),
    condicionVenta: 'Cuenta corriente',
    cae: '', caeFechaVenc: '', observaciones: '', importeLetras: '',
    items: [],
  }), {
    startEditing: true,
    onCancel: () => onBack && onBack(),
    onSave: (d) => {
      const items = (d.items || []).map((it) => ({ ...it }));
      const total = Math.round(M.summary(items).total * 100) / 100;
      const prov = d.proveedor;
      const docObj = {
        tipoFactura: d.tipoFactura, puntoVenta: Number(d.puntoVenta) || 1, numero: d.numero,
        fechaEmision: d.fechaEmision, fechaVencPago: d.fechaVencPago, condicionVenta: d.condicionVenta,
        cae: d.cae || '', caeFechaVenc: d.caeFechaVenc || '', observaciones: d.observaciones || '',
        importeLetras: d.importeLetras || '', items, archivos: [],
      };
      const codigo = docObj.numero ? formatComprobanteCodigo(docObj.tipoFactura, docObj.puntoVenta, docObj.numero) : 'FAC-RECIBIDA';
      const pago = {
        ...original,
        proveedor: prov ? (prov.razonSocial || prov.nombre || '') : '',
        proveedorId: prov ? prov.id : null,
        fecha: docObj.fechaEmision, total, estado: 'PENDIENTE',
        facturasRecibidasDocs: [docObj],
        facturaRecibida: { codigo, fecha: docObj.fechaEmision },
        __nuevo: true,
      };
      MicosStore.create('pagos', pago);
      onSaved && onSaved(original.id);
    },
  });

  const [picker, setPicker] = React.useState(false);
  const f = draft || {};
  const prov = f.proveedor;
  const patchItem = (idx, field, value) => setDraft((d) => {
    const items = d.items.map((it, i) => {
      if (i !== idx) return it;
      const next = { ...it, [field]: value };
      const c = Number(next.cantidad) || 0, u = Number(next.unitario) || 0, b = Number(next.bonifPct) || 0;
      next.total = c * u * (1 - b / 100);
      return next;
    });
    return { ...d, items };
  });
  const addItem = () => setDraft((d) => ({ ...d, items: [...d.items, M.blank()] }));
  const removeItem = (idx) => setDraft((d) => ({ ...d, items: d.items.filter((_, i) => i !== idx) }));

  const tot = (() => { const s = M.summary(f.items || []); return { neto: s.totalBase, bonif: s.bonifTotal, ivaLines: s.ivaLines, total: s.total }; })();
  const condVentaOptions = ['Contado', 'Cuenta corriente', 'Cheque', 'Transferencia'];
  const fullNumber = f.numero ? formatComprobanteCodigo(f.tipoFactura, f.puntoVenta, f.numero) : null;
  const bigId = fullNumber ? `FAC-${fullNumber}` : 'Factura recibida';

  const actions = (
    <React.Fragment>
      <button onClick={discardEdit} className="btn btn-outline"><IconX size={14} /><span className="hidden sm:inline">Descartar</span></button>
      <button onClick={saveEdit} className="btn btn-primary"><IconCheck size={14} /><span className="hidden sm:inline">Guardar</span></button>
    </React.Fragment>
  );

  const subtitle = (
    <React.Fragment>
      <span className="font-bold" style={{ color: 'var(--foreground)' }}>{(prov && (prov.razonSocial || prov.nombre)) || '— elegí proveedor —'}</span>
      <span className="mx-1.5 opacity-50">·</span>
      <span className="font-mono font-bold" style={{ color: 'var(--accent)' }}>{original.publicId}</span>
    </React.Fragment>
  );

  return (
    <DocumentShell
      onBack={onBack}
      backLabel={backLabel || 'Volver a Finanzas'}
      eyebrow="Factura recibida"
      bigId={bigId}
      subtitle={subtitle}
      editing={true}
      isCreate={true}
      actions={actions}
    >
      <FileUploadCard
        eyebrow="Factura del proveedor · documento recibido"
        title="Subí la factura que te envió el proveedor"
        description="Cargá el PDF o foto de la factura recibida. Guardamos el comprobante tal como llega — no lo emitimos nosotros. Autocompletar con IA: por ahora solo funciona con PDF con texto (sin fotos ni PDF escaneado — el modelo no tiene visión)."
        files={[]}
        editing={true}
        extractable
        realUpload
        extractor={window.MicosAIExtract && window.MicosAIExtract.facturaRecibida}
        onExtracted={(data) => setDraft((d) => {
          const next = { ...d };
          ['tipoFactura', 'puntoVenta', 'numero', 'fechaEmision', 'fechaVencPago', 'condicionVenta', 'cae', 'caeFechaVenc', 'observaciones'].forEach((k) => {
            if (data[k] != null && String(data[k]).trim() !== '') next[k] = data[k];
          });
          if (Array.isArray(data.items) && data.items.length) {
            next.items = data.items.map((it) => ({ sku: it.sku || '', descripcion: it.descripcion || '', cantidad: Number(it.cantidad) || 0, unitario: Number(it.unitario) || 0, bonifPct: Number(it.bonifPct) || 0, ivaPct: it.ivaPct == null ? 21 : Number(it.ivaPct), total: Number(it.total) || 0 }));
          }
          return next;
        })}
      />

      <DocMetaStrip editing={true} items={[
        { label: 'Tipo', value: f.tipoFactura, mono: true, accent: true, editable: true, inputType: 'select', options: ['A', 'B', 'C'], onChange: (v) => patch('tipoFactura', v) },
        { label: 'Punto venta', value: String(f.puntoVenta), mono: true, editable: true, inputType: 'number', onChange: (v) => patch('puntoVenta', Number(v) || 0) },
        { label: 'Número', value: f.numero, mono: true, accent: true, editable: true, onChange: (v) => patch('numero', v) },
        { label: 'Emisión', value: f.fechaEmision, mono: true, editable: true, inputType: 'date', onChange: (v) => patch('fechaEmision', v) },
        { label: 'Vto. pago', value: f.fechaVencPago, mono: true, editable: true, inputType: 'date', onChange: (v) => patch('fechaVencPago', v) },
        { label: 'Cond. venta', value: f.condicionVenta, editable: true, inputType: 'select', options: condVentaOptions, onChange: (v) => patch('condicionVenta', v) },
      ]} />

      <DocCard editing={true}>
        <p className="text-[11px] font-bold uppercase tracking-[0.2em] mb-6" style={{ color: 'var(--accent)' }}>Información AFIP del proveedor</p>
        <div className="grid grid-cols-2 sm:grid-cols-3 gap-x-8 gap-y-6">
          <div className="space-y-2 min-w-0">
            <p className="text-[10.5px] font-bold uppercase tracking-[0.14em]" style={{ color: 'var(--muted-foreground)' }}>CAE</p>
            <input value={f.cae} onChange={(e) => patch('cae', e.target.value)} placeholder="N° CAE" className="edit-input w-full font-mono text-[17px] font-extrabold tabular-nums" style={{ color: 'var(--foreground)' }} />
          </div>
          <div className="space-y-2 min-w-0">
            <p className="text-[10.5px] font-bold uppercase tracking-[0.14em]" style={{ color: 'var(--muted-foreground)' }}>Vto. CAE</p>
            <input type="date" value={f.caeFechaVenc} onChange={(e) => patch('caeFechaVenc', e.target.value)} placeholder="Vto. CAE" className="edit-input w-full font-mono text-[17px] font-extrabold tabular-nums" style={{ color: 'var(--foreground)' }} />
          </div>
        </div>
      </DocCard>

      <DocCard className="relative">
        <div className="grid grid-cols-1 lg:grid-cols-2 gap-6">
          <PartyBlock eyebrow="Emisor" name={(prov && (prov.razonSocial || prov.nombre)) || '— elegí uno —'} sub={(prov && prov.condicionIva) || 'Responsable Inscripto'} fields={buildProveedorFields(prov)} />
          <PartyBlock eyebrow="Cliente" name={co.nombre} sub={co.situacionIva} fields={buildEmisorFields(co)} />
        </div>
        <button onClick={() => setPicker(true)} title="Elegir proveedor" className="party-edit-btn absolute" style={{ top: 16, right: 16 }} type="button">
          <IconPencil size={13} />
        </button>
      </DocCard>

      <DocCard editing={true}>
        <ItemsTable items={f.items || []} showBonif showIva editing={true} onItemChange={patchItem} onItemRemove={removeItem} onAdd={addItem} />
        <Totals subtotal={tot.neto} bonificaciones={tot.bonif} ivaLines={tot.ivaLines} total={tot.total} importeLetras={f.importeLetras} />
      </DocCard>

      <ObservacionesCard editing={true} value={f.observaciones} onChange={(v) => patch('observaciones', v)} />

      {picker && window.PartySelectorModal && (
        <window.PartySelectorModal type="proveedor" open={true} onClose={() => setPicker(false)}
          onPick={(obj) => { if (obj) setDraft((d) => ({ ...d, proveedor: obj })); setPicker(false); }} />
      )}
    </DocumentShell>
  );
}

// ───────────────────────────────────────────────
// EDICIÓN: las facturas recibidas (1:N) de un PAGO existente.
// ───────────────────────────────────────────────
function FacturaRecibidaScreen({ pago, onBack, backLabel, facturaIndex, onDelete }) {
  const co = COMPANY_CONFIG;
  const prov = resolverProveedorPago(pago);

  const buildFromLight = (light) => {
    if (!light) return null;
    const digits = String(light.codigo || '').replace(/\D/g, '');
    let numero = '', pv = 1;
    if (digits.length >= 8) { numero = digits.slice(-8); pv = parseInt(digits.slice(0, -8) || '1', 10) || 1; }
    const fe = light.fecha || MicosTodayISO();
    return {
      tipoFactura: 'A', puntoVenta: pv, numero,
      fechaEmision: fe, fechaVencPago: MicosAddDays(fe, 30),
      condicionVenta: 'Cuenta corriente',
      cae: '', caeFechaVenc: '', observaciones: '', importeLetras: '',
      items: [], archivos: [],
    };
  };
  const emptyDoc = () => {
    const hoy = MicosTodayISO();
    return {
      tipoFactura: 'A', puntoVenta: 1, numero: '',
      fechaEmision: hoy, fechaVencPago: MicosAddDays(hoy, 30),
      condicionVenta: 'Cuenta corriente',
      cae: '', caeFechaVenc: '', observaciones: '', importeLetras: '',
      items: [], archivos: [],
    };
  };

  const _facturas = facturasDelPago(pago);
  const _idx = facturaIndex == null ? 0 : facturaIndex;
  const _existing = _facturas[_idx];
  const original = React.useMemo(
    () => _existing || (_idx === 0 ? buildFromLight(pago.facturaRecibida) : null) || emptyDoc(),
    [_existing]
  );
  const isCreate = !_existing;
  const [toast, setToast] = React.useState(null);

  const { editing, draft, setDraft, enterEdit, discardEdit, saveEdit, patch } = useDocEdit(() => ({
    tipoFactura: original.tipoFactura,
    puntoVenta: original.puntoVenta,
    numero: original.numero,
    fechaEmision: original.fechaEmision,
    fechaVencPago: original.fechaVencPago,
    condicionVenta: original.condicionVenta,
    cae: original.cae || '',
    caeFechaVenc: original.caeFechaVenc || '',
    observaciones: original.observaciones || '',
    importeLetras: original.importeLetras || '',
    items: (original.items || []).map((it) => ({ ...it })),
  }), {
    startEditing: isCreate,
    onCancel: () => { if (isCreate) onBack(); },
    onSave: (d) => {
      const items = (d.items || []).map((it) => ({ ...it }));
      const docObj = {
        tipoFactura: d.tipoFactura, puntoVenta: Number(d.puntoVenta) || 1, numero: d.numero,
        fechaEmision: d.fechaEmision, fechaVencPago: d.fechaVencPago,
        condicionVenta: d.condicionVenta, cae: d.cae || '', caeFechaVenc: d.caeFechaVenc || '',
        observaciones: d.observaciones || '', importeLetras: d.importeLetras || '',
        items, archivos: original.archivos || [],
      };
      const codigo = docObj.numero
        ? formatComprobanteCodigo(docObj.tipoFactura, docObj.puntoVenta, docObj.numero)
        : 'FAC-RECIBIDA';
      pago.facturasRecibidasDocs = (function () {
        const arr = facturasDelPago(pago).slice();
        if (_idx != null && _idx < arr.length) arr[_idx] = docObj; else arr.push(docObj);
        return arr;
      })();
      if (pago.facturaRecibidaDoc) delete pago.facturaRecibidaDoc;
      const _arr = pago.facturasRecibidasDocs;
      const _first = _arr[0];
      const _firstCodigo = (_first && _first.numero)
        ? formatComprobanteCodigo(_first.tipoFactura, _first.puntoVenta, _first.numero)
        : codigo;
      pago.facturaRecibida = {
        codigo: _arr.length > 1 ? `${_arr.length} facturas` : _firstCodigo,
        fecha: (_first && _first.fechaEmision) || docObj.fechaEmision,
      };
      persistirPago(pago);
      setToast(`Factura recibida ${codigo} ${isCreate ? 'cargada' : 'guardada'}`);
      setTimeout(() => setToast(null), 3600);
    },
  });

  const f = editing && draft ? draft : original;
  const patchItem = (idx, field, value) => setDraft((d) => {
    const items = d.items.map((it, i) => {
      if (i !== idx) return it;
      const next = { ...it, [field]: value };
      const c = Number(next.cantidad) || 0, u = Number(next.unitario) || 0, b = Number(next.bonifPct) || 0;
      next.total = c * u * (1 - b / 100);
      return next;
    });
    return { ...d, items };
  });
  const addItem = () => setDraft((d) => ({ ...d, items: [...d.items, MicosItemsMath.blank()] }));
  const removeItem = (idx) => setDraft((d) => ({ ...d, items: d.items.filter((_, i) => i !== idx) }));

  // ── Autocompletado IA desde el archivo subido (en sesión) ──
  const [flash, setFlash] = React.useState({ keys: new Set(), token: 0 });
  const pendingExtract = React.useRef(null);
  function mergeExtract(data) {
    const keys = new Set();
    setDraft((d) => {
      const next = { ...d };
      ['tipoFactura', 'puntoVenta', 'numero', 'fechaEmision', 'fechaVencPago', 'condicionVenta', 'cae', 'caeFechaVenc', 'observaciones'].forEach((k) => {
        if (data[k] != null && String(data[k]).trim() !== '') { next[k] = data[k]; keys.add(k); }
      });
      if (Array.isArray(data.items) && data.items.length) {
        next.items = data.items.map((it) => ({ sku: it.sku || '', descripcion: it.descripcion || '', cantidad: Number(it.cantidad) || 0, unitario: Number(it.unitario) || 0, bonifPct: Number(it.bonifPct) || 0, ivaPct: it.ivaPct == null ? 21 : Number(it.ivaPct), total: Number(it.total) || 0 }));
        keys.add('items');
      }
      return next;
    });
    setFlash({ keys, token: Date.now() });
  }
  function applyExtracted(data) {
    if (editing) mergeExtract(data);
    else { pendingExtract.current = data; enterEdit(); }
  }
  React.useEffect(() => {
    if (editing && draft && pendingExtract.current) {
      const d = pendingExtract.current; pendingExtract.current = null;
      mergeExtract(d);
    }
  }, [editing, draft]);

  const s = MicosItemsMath.summary(f.items);
  const tot = { neto: s.totalBase, bonif: s.bonifTotal, ivaLines: s.ivaLines, total: s.total };
  const fullNumber = f.numero ? formatComprobanteCodigo(f.tipoFactura, f.puntoVenta, f.numero) : null;
  const bigId = fullNumber ? `FAC-${fullNumber}` : 'Factura recibida';

  // Sin botón Imprimir: guardamos la factura que llega, no la emitimos.
  const actions = editing ? (
    <React.Fragment>
      <button onClick={discardEdit} className="btn btn-outline"><IconX size={14} /><span className="hidden sm:inline">Descartar</span></button>
      <button onClick={saveEdit} className="btn btn-primary"><IconCheck size={14} /><span className="hidden sm:inline">Guardar</span></button>
    </React.Fragment>
  ) : (
    <button onClick={enterEdit} className="btn btn-primary"><IconPencil size={14} /><span className="hidden sm:inline">Editar</span></button>
  );

  const condVentaOptions = ['Contado', 'Cuenta corriente', 'Cheque', 'Transferencia'];
  const subtitle = (
    <React.Fragment>
      <span className="font-bold" style={{ color: 'var(--foreground)' }}>{prov.razonSocial}</span>
      {' · '}
      <span className="font-mono font-bold" style={{ color: 'var(--accent)' }}>{pago.publicId}</span>
    </React.Fragment>
  );

  return (
    <DocumentShell
      onBack={onBack}
      backLabel={backLabel || 'Volver al pago'}
      eyebrow="Factura recibida"
      bigId={bigId}
      subtitle={subtitle}
      editing={editing}
      isCreate={isCreate}
      toast={toast}
      actions={actions}
    >
      {/* Subir la factura recibida + autocompletar con IA */}
      <FileUploadCard
        eyebrow="Factura del proveedor · documento recibido"
        title="Subí la factura que te envió el proveedor"
        description="Cargá el PDF o foto de la factura recibida. Guardamos el comprobante tal como llega — no lo emitimos nosotros. Autocompletar con IA: por ahora solo funciona con PDF con texto (sin fotos ni PDF escaneado — el modelo no tiene visión)."
        files={(original.archivos || []).slice(0, 1)}
        editing={editing}
        extractable
        realUpload
        extractor={window.MicosAIExtract && window.MicosAIExtract.facturaRecibida}
        onExtracted={applyExtracted}
      />

      <DocMetaStrip editing={editing} items={[
        { label: 'Tipo', value: editing ? draft.tipoFactura : original.tipoFactura, mono: true, accent: true, editable: editing, inputType: 'select', options: ['A', 'B', 'C'], onChange: (v) => patch('tipoFactura', v), flash: editing && flash.keys.has('tipoFactura'), flashToken: flash.token },
        { label: 'Punto venta', value: editing ? String(draft.puntoVenta) : String(original.puntoVenta).padStart(4, '0'), mono: true, editable: editing, inputType: 'number', onChange: (v) => patch('puntoVenta', Number(v) || 0), flash: editing && flash.keys.has('puntoVenta'), flashToken: flash.token },
        { label: 'Número', value: editing ? draft.numero : (original.numero || '—'), mono: true, accent: true, editable: editing, onChange: (v) => patch('numero', v), flash: editing && flash.keys.has('numero'), flashToken: flash.token },
        { label: 'Emisión', value: editing ? draft.fechaEmision : formatDate(original.fechaEmision), mono: true, editable: editing, inputType: 'date', onChange: (v) => patch('fechaEmision', v), flash: editing && flash.keys.has('fechaEmision'), flashToken: flash.token },
        { label: 'Vto. pago', value: editing ? draft.fechaVencPago : formatDate(original.fechaVencPago), mono: true, editable: editing, inputType: 'date', onChange: (v) => patch('fechaVencPago', v), flash: editing && flash.keys.has('fechaVencPago'), flashToken: flash.token },
        { label: 'Cond. venta', value: editing ? draft.condicionVenta : original.condicionVenta, editable: editing, inputType: 'select', options: condVentaOptions, onChange: (v) => patch('condicionVenta', v), flash: editing && flash.keys.has('condicionVenta'), flashToken: flash.token },
      ]} />

      {/* Datos AFIP de la factura del proveedor (los transcribimos / IA) */}
      <DocCard editing={editing}>
        <p className="text-[11px] font-bold uppercase tracking-[0.2em] mb-6" style={{ color: 'var(--accent)' }}>
          Información AFIP del proveedor
        </p>
        <div className="grid grid-cols-2 sm:grid-cols-3 gap-x-8 gap-y-6">
          <div className={`space-y-2 min-w-0${editing && flash.keys.has('cae') ? ' autofill-flash' : ''}`} key={`cae-${flash.keys.has('cae') ? flash.token : 'x'}`}>
            <p className="text-[10.5px] font-bold uppercase tracking-[0.14em]" style={{ color: 'var(--muted-foreground)' }}>CAE</p>
            {editing ? (
              <input value={draft.cae} onChange={(e) => patch('cae', e.target.value)} placeholder="N° CAE" className="edit-input w-full font-mono text-[17px] font-extrabold tabular-nums" style={{ color: 'var(--foreground)' }} />
            ) : (
              <p className="text-[17px] font-mono font-extrabold leading-none tracking-tight tabular-nums" style={{ color: original.cae ? 'var(--foreground)' : 'color-mix(in oklab, var(--muted-foreground) 60%, transparent)' }}>
                {original.cae || '—'}
              </p>
            )}
          </div>
          <div className={`space-y-2 min-w-0${editing && flash.keys.has('caeFechaVenc') ? ' autofill-flash' : ''}`} key={`caev-${flash.keys.has('caeFechaVenc') ? flash.token : 'x'}`}>
            <p className="text-[10.5px] font-bold uppercase tracking-[0.14em]" style={{ color: 'var(--muted-foreground)' }}>Vto. CAE</p>
            {editing ? (
              <input type="date" value={draft.caeFechaVenc} onChange={(e) => patch('caeFechaVenc', e.target.value)} className="edit-input w-full font-mono text-[17px] font-extrabold tabular-nums" style={{ color: 'var(--foreground)' }} />
            ) : (
              <p className="text-[17px] font-mono font-extrabold leading-none tracking-tight tabular-nums" style={{ color: original.caeFechaVenc ? 'var(--foreground)' : 'color-mix(in oklab, var(--muted-foreground) 60%, transparent)' }}>
                {original.caeFechaVenc ? formatDate(original.caeFechaVenc) : '—'}
              </p>
            )}
          </div>
        </div>
      </DocCard>

      {/* Emisor = Proveedor · Cliente = Micos (nosotros) */}
      <DocCard>
        <div className="grid grid-cols-1 lg:grid-cols-2 gap-6">
          <PartyBlock
            eyebrow="Emisor"
            name={prov.razonSocial}
            sub={prov.condicionIva || 'Responsable Inscripto'}
            fields={buildProveedorFields(prov)}
          />
          <PartyBlock
            eyebrow="Cliente"
            name={co.nombre}
            sub={co.situacionIva}
            fields={buildEmisorFields(co)}
          />
        </div>
      </DocCard>

      <DocCard editing={editing}>
        <ItemsTable
          items={f.items}
          showBonif
          showIva
          editing={editing}
          onItemChange={patchItem}
          onItemRemove={removeItem}
          onAdd={addItem}
          flash={flash.keys.has('items') ? flash.token : 0}
        />
        <Totals
          subtotal={tot.neto}
          bonificaciones={tot.bonif}
          ivaLines={tot.ivaLines}
          total={tot.total}
          importeLetras={editing ? draft.importeLetras : original.importeLetras}
        />
      </DocCard>

      <ObservacionesCard editing={editing} value={editing ? draft.observaciones : original.observaciones} onChange={(v) => patch('observaciones', v)} />
    </DocumentShell>
  );
}

Object.assign(window, { FacturaRecibidaFinScreen, FacturaRecibidaScreen });