/* global React, Icon, Button, Badge, Drawer, Field, brl, fmtDate, nfeApi */

// ─── NF-e de REMESSA para industrialização (Fase B do ciclo fiscal) ──────────
// Emite a nota que ACOMPANHA os insumos até a fábrica, a partir da OP.
// Regras que este arquivo carrega:
//   · UM caminho de emissão só: nfeApi.emitir (o mesmo da venda). Nada de
//     cálculo fiscal próprio — o provedor calcula.
//   · Remessa NÃO é venda: sem contas a receber, sem baixa comercial. O
//     estoque a OP já baixa no "enviar" — a nota documenta o que já acontece.
//   · Modo simulado BLOQUEIA (decisão da rodada): nota falsa viajando junto
//     de material real é pior que nota nenhuma.
//   · Homologação gritante na tela; produção pede confirmação séria.
//   · Validação COMPLETA antes de emitir — lista tudo que falta de uma vez,
//     com onde resolver. Nunca erro criptografado do provedor.

const soDigitosRem = (s) => String(s || '').replace(/[^0-9]/g, '');

// custo fiscal do insumo: snapshot do envio (custo_unitario) > custo atual
function custoInsumoRemessa(ins, prod) {
  const snap = Number(ins.custo_unitario != null ? ins.custo_unitario : ins.custoUnitario);
  if (snap > 0) return snap;
  return Number(prod && prod.custo) || 0;
}

function RemessaOPDrawer({ ordem, insumos, fabrica, prodById, onClose, onEmitida }) {
  const [emissoras, setEmissoras] = React.useState([]);
  const [empresaId, setEmpresaId] = React.useState('');
  const [cfgRem, setCfgRem] = React.useState(null);     // padrões de Configurações › Fiscal
  const [modoNfe, setModoNfe] = React.useState(null);   // { configured, mode } do checkConfig
  const [natureza, setNatureza] = React.useState('');
  const [cfop, setCfop] = React.useState('');
  const [cfopTocado, setCfopTocado] = React.useState(false);
  const [ieFabrica, setIeFabrica] = React.useState('');
  const [modFrete, setModFrete] = React.useState('0');
  const [emitindo, setEmitindo] = React.useState(false);
  const [fase, setFase] = React.useState('prep');       // prep | pronto | ok
  const [erro, setErro] = React.useState('');
  const [notaOk, setNotaOk] = React.useState(null);

  React.useEffect(() => {
    let vivo = true;
    (async () => {
      try {
        const [emps, cfg, modo] = await Promise.all([
          window.tmSupabase.from('empresas_emissoras').select('*').eq('ativo', true).order('nome_fantasia'),
          window.tmDb.configRemessa(),
          window.nfeApi ? window.nfeApi.checkConfig().catch(() => null) : Promise.resolve(null),
        ]);
        if (!vivo) return;
        setEmissoras(emps.data || []);
        if ((emps.data || []).length) setEmpresaId(emps.data[0].id);
        setCfgRem(cfg);
        setNatureza(cfg.natureza);
        setModoNfe(modo);
        setFase('pronto');
      } catch (e) { if (vivo) { setErro(String((e && e.message) || e)); setFase('pronto'); } }
    })();
    return () => { vivo = false; };
  }, []);   // eslint-disable-line

  const emissora = emissoras.find((e) => e.id === empresaId) || null;
  const ufEmissora = String((emissora && emissora.endereco && emissora.endereco.uf) || '').toUpperCase().slice(0, 2);
  const ufFabrica = String((fabrica && fabrica.geral_uf) || '').toUpperCase().slice(0, 2);
  const interestadual = !!(ufEmissora && ufFabrica && ufEmissora !== ufFabrica);
  const cfopSugerido = cfgRem ? (interestadual ? cfgRem.cfopInter : cfgRem.cfopIntra) : '';
  const cfopFinal = cfopTocado ? cfop : cfopSugerido;

  const simulado = modoNfe && modoNfe.configured === false;
  const producao = (emissora && emissora.ambiente) === 'producao';

  // linhas da nota: quantidade ENVIADA quando o envio já aconteceu; senão a prevista
  const linhas = (insumos || []).map((ins) => {
    const prod = prodById[ins.insumoId] || null;
    const qty = Number(ins.quantidadeEnviada != null ? ins.quantidadeEnviada : ins.quantidade_enviada) ||
                Number(ins.quantidade) || 0;
    const custo = custoInsumoRemessa(ins, prod);
    return { ins, prod, qty, custo, total: Math.round(qty * custo * 100) / 100 };
  }).filter((l) => l.qty > 0);
  const valorTotal = Math.round(linhas.reduce((a, l) => a + l.total, 0) * 100) / 100;

  // ── validação completa, tudo de uma vez, com onde resolver ──
  const faltas = [];
  if (!linhas.length) faltas.push('A OP não tem insumo com quantidade — confira os insumos da OP.');
  const semProduto = linhas.filter((l) => !l.prod);
  if (semProduto.length) faltas.push(`${semProduto.length} insumo(s) sem produto vinculado no cadastro.`);
  const semNcm = linhas.filter((l) => l.prod && !String(l.prod.ncm || '').trim());
  if (semNcm.length) faltas.push(`Estes ${semNcm.length} insumo(s) precisam de NCM (Produtos › Lista): ` +
    semNcm.map((l) => l.prod.sku).join(', '));
  const semCusto = linhas.filter((l) => l.prod && l.custo <= 0);
  if (semCusto.length) faltas.push(`Estes ${semCusto.length} insumo(s) estão com custo zero — a nota precisa de valor (Produtos › Lista): ` +
    semCusto.map((l) => l.prod.sku).join(', '));
  if (fabrica) {
    if (soDigitosRem(fabrica.cnpj).length !== 14) faltas.push('CNPJ da fábrica ausente ou inválido (Estoque › Fornecedores).');
    const endFalta = [];
    if (!fabrica.geral_endereco) endFalta.push('endereço');
    if (!fabrica.geral_numero) endFalta.push('número');
    if (!fabrica.geral_bairro) endFalta.push('bairro');
    if (!fabrica.geral_cidade) endFalta.push('cidade');
    if (ufFabrica.length !== 2) endFalta.push('UF');
    if (soDigitosRem(fabrica.geral_cep).length !== 8) endFalta.push('CEP');
    if (endFalta.length) faltas.push('Endereço da fábrica incompleto — falta ' + endFalta.join(', ') + ' (Estoque › Fornecedores).');
  } else {
    faltas.push('A OP está sem fábrica vinculada.');
  }
  if (emissora) {
    if (soDigitosRem(emissora.cnpj).length !== 14) faltas.push('CNPJ da empresa emissora inválido (NF › Empresas Emissoras).');
    if (ufEmissora.length !== 2) faltas.push('UF do endereço da empresa emissora ausente (NF › Empresas Emissoras).');
    if (!simulado && !emissora.nfeio_company_id) faltas.push('Empresa emissora sem vínculo NFe.io (nfeio_company_id) — NF › Empresas Emissoras.');
  } else if (fase === 'pronto') {
    faltas.push('Nenhuma empresa emissora ativa (NF › Empresas Emissoras).');
  }
  if (!String(cfopFinal || '').match(/^[567][0-9]{3}$/)) faltas.push('CFOP inválido — use 4 dígitos (ex.: 5901 ou 6901).');
  if (!String(natureza || '').trim()) faltas.push('Natureza da operação vazia.');

  const podeEmitir = fase === 'pronto' && !simulado && !faltas.length && !emitindo;

  const emitir = async () => {
    if (!podeEmitir) return;
    const resumo =
      `Emitir NF-e de remessa em ${producao ? 'PRODUÇÃO (VALOR FISCAL REAL)' : 'HOMOLOGAÇÃO (teste — sem valor fiscal)'}?\n\n` +
      `OP ${ordem.numero} → ${fabrica.nome}\n` +
      `CFOP ${cfopFinal} (${interestadual ? `${ufEmissora} → ${ufFabrica}, interestadual` : `${ufEmissora} → ${ufFabrica}, mesma UF`})\n` +
      `${linhas.length} insumo(s) · total R$ ${brl(valorTotal)}\n\n` +
      (producao ? 'Esta nota VALE na SEFAZ. Confirme que o contador aprovou o CFOP/natureza.' : 'Nota de teste: a SEFAZ troca o destinatário pelo aviso "SEM VALOR FISCAL".');
    if (!confirm(resumo)) return;
    setEmitindo(true); setErro('');
    try {
      // numera pela emissora — mesma mecânica da emissão de venda
      const novoNumero = (Number(emissora.ultimo_numero_nfe) || 0) + 1;
      await window.tmSupabase.from('empresas_emissoras')
        .update({ ultimo_numero_nfe: novoNumero, updated_at: new Date().toISOString() })
        .eq('id', emissora.id);

      const nfData = {
        empresaId: emissora.id,
        empresa: emissora,
        natureza: natureza.trim(),
        cfop: cfopFinal,                       // o proxy usa no lugar do CFOP de venda
        finalidade: 'NF-e normal',
        indicadorPresenca: 'Não se aplica',
        tipoSaida: 'saida',
        formaPagamento: 'Sem pagamento',       // remessa não cobra ninguém
        tipoPessoa: 'Jurídica',                // contrato do proxy: a string EXATA decide LegalEntity
        destNome: fabrica.nome,
        destDoc: fabrica.cnpj,
        indIEDest: soDigitosRem(ieFabrica) ? '1' : '9',
        destIe: soDigitosRem(ieFabrica) || null,
        destEndereco: {
          logradouro: fabrica.geral_endereco, numero: fabrica.geral_numero,
          bairro: fabrica.geral_bairro, cidade: fabrica.geral_cidade,
          uf: ufFabrica, cep: soDigitosRem(fabrica.geral_cep),
        },
        valorProdutos: valorTotal, valorFrete: 0, valorDesconto: 0, valorOutras: 0,
        valorTotal, icmsBase: 0, icmsValor: 0,
        modalidadeFrete: modFrete,
        transportador: {}, volumes: null, parcelas: null,
        infoComplementar: `Remessa para industrializacao - Ordem de Producao ${ordem.numero}.`,
        items: linhas.map((l) => ({
          produtoId: l.prod.id, sku: l.prod.sku, desc: l.prod.nome || l.prod.name || l.prod.sku,
          ncm: l.prod.ncm, un: 'UN', qty: l.qty, valorUnitario: l.custo, valorTotal: l.total,
        })),
      };

      const nfeResult = await window.nfeApi.emitir(emissora.nfeio_company_id || emissora.id, nfData);
      const isRejected = nfeResult && nfeResult.error;
      const isIssued = nfeResult && (nfeResult.status === 'Issued' || nfeResult.status === 'Autorizada');
      const nfStatus = isRejected ? 'Rejeitada' : isIssued ? 'Autorizada' : 'Processando';

      const { data: nfIns, error: nfErr } = await window.tmSupabase.from('notas_fiscais').insert({
        empresa_emissora_id: emissora.id,
        ordem_producao_id: ordem.id,           // o vínculo da Fase B — SEM pedido_id
        numero: novoNumero,
        serie: emissora.serie_nfe || 1,
        natureza_operacao: natureza.trim(),
        tipo_operacao: 'saida',
        dest_nome: fabrica.nome,
        dest_doc: fabrica.cnpj,
        ind_ie_dest: nfData.indIEDest,
        dest_ie: nfData.destIe,
        dest_endereco: nfData.destEndereco,
        valor_produtos: valorTotal, valor_frete: 0, valor_desconto: 0, valor_outras: 0,
        valor_total: valorTotal, icms_base: 0, icms_valor: 0,
        modalidade_frete: modFrete, transportador: {}, volumes: [],
        forma_pagamento: 'Sem pagamento', parcelas: null,
        info_complementar: nfData.infoComplementar,
        status: nfStatus,
        data_emissao: new Date().toISOString(),
        data_autorizacao: isIssued ? new Date().toISOString() : null,
        nfeio_id: (nfeResult && nfeResult.id) || null,
        chave_acesso: (nfeResult && nfeResult.authorization && nfeResult.authorization.accessKey) || null,
        protocolo: (nfeResult && nfeResult.authorization && nfeResult.authorization.protocol) || null,
        xml_url: (nfeResult && nfeResult.xml && nfeResult.xml.uri) || null,
        danfe_url: (nfeResult && nfeResult.pdf && nfeResult.pdf.uri) || null,
        motivo_rejeicao: isRejected ? String(nfeResult.message || 'Erro desconhecido') : null,
      }).select().single();
      if (nfErr) throw nfErr;

      // itens da nota (insert de ARRAY — nunca leva id, regra do CLAUDE.md)
      await window.tmSupabase.from('notas_fiscais_itens').insert(linhas.map((l, i) => ({
        nota_fiscal_id: nfIns.id, produto_id: l.prod.id, numero_item: i + 1,
        sku: l.prod.sku, descricao: l.prod.nome || l.prod.name || l.prod.sku,
        ncm: l.prod.ncm, cfop: String(cfopFinal), unidade: 'UN',
        quantidade: l.qty, valor_unitario: l.custo, valor_total: l.total, desconto: 0,
      })));

      await window.tmSupabase.from('nf_logs').insert({
        nota_fiscal_id: nfIns.id,
        tipo: isRejected ? 'error' : 'info',
        mensagem: isRejected
          ? `Remessa OP ${ordem.numero}: NF-e nº ${novoNumero} REJEITADA: ${nfeResult.message || '?'}`
          : `Remessa OP ${ordem.numero}: NF-e nº ${novoNumero} emitida em ${producao ? 'PRODUÇÃO' : 'homologação'}`,
        detalhes: { ordem: ordem.numero, cfop: cfopFinal, total: valorTotal },
      });

      if (isRejected) { setErro('A SEFAZ rejeitou: ' + (nfeResult.message || 'erro desconhecido') + ' — a nota ficou registrada como Rejeitada no histórico.'); }
      else { setNotaOk({ id: nfIns.id, numero: novoNumero, status: nfStatus, danfe: nfIns.danfe_url, chave: nfIns.chave_acesso }); setFase('ok'); if (onEmitida) onEmitida(); }
    } catch (e) { setErro(String((e && e.message) || e)); }
    setEmitindo(false);
  };

  const rotuloBotao = emitindo ? 'Emitindo…'
    : producao ? 'Emitir NF-e de remessa em PRODUÇÃO'
    : 'Emitir em HOMOLOGAÇÃO (teste — sem valor fiscal)';

  return (
    <Drawer open={true} width={880} title={`Nota de remessa · ${ordem.numero}`}
      subtitle="NF-e que acompanha os insumos até a fábrica — não é venda: sem cobrança, sem mexer no estoque"
      onClose={onClose}
      footer={fase === 'ok'
        ? (<><span style={{ flex: 1 }} /><Button variant="primary" size="sm" onClick={onClose}>Concluir</Button></>)
        : (<><span style={{ flex: 1 }} />
            <Button variant="secondary" size="sm" onClick={onClose}>Cancelar</Button>
            <Button variant={producao ? 'primary' : 'secondary'} size="sm" icon="send" onClick={emitir} disabled={!podeEmitir}>{rotuloBotao}</Button></>)}>

      {fase === 'prep' && <div className="muted" style={{ fontSize: 13 }}>Carregando…</div>}

      {fase !== 'prep' && (<>
        {/* ambiente na cara — nunca descoberto depois */}
        {simulado ? (
          <div style={{ display: 'flex', gap: 10, alignItems: 'center', padding: '12px 14px', borderRadius: 8, marginBottom: 14,
                        background: 'color-mix(in srgb, var(--tm-danger) 12%, transparent)', border: '1px solid var(--tm-danger)' }}>
            <Icon name="alert-octagon" size={18} style={{ color: 'var(--tm-danger)' }} />
            <div style={{ fontSize: 12.5 }}>
              <b>Emissão real desativada (modo simulado).</b> A NFEIO_API_KEY não está configurada — emitir agora criaria uma
              nota FALSA parecendo válida, e remessa acompanha material de verdade. Configure a chave e volte.
            </div>
          </div>
        ) : (
          <div style={{ display: 'flex', gap: 10, alignItems: 'center', padding: '12px 14px', borderRadius: 8, marginBottom: 14,
                        background: producao ? 'color-mix(in srgb, var(--tm-danger) 10%, transparent)' : 'color-mix(in srgb, var(--tm-warning) 12%, transparent)',
                        border: `1px solid ${producao ? 'var(--tm-danger)' : 'var(--tm-warning)'}` }}>
            <Icon name={producao ? 'alert-triangle' : 'flask-conical'} size={18} style={{ color: producao ? 'var(--tm-danger)' : 'var(--tm-warning)' }} />
            <div style={{ fontSize: 12.5 }}>
              {producao
                ? <><b>PRODUÇÃO:</b> esta nota vale na SEFAZ. Confirme com o contador a natureza e o CFOP antes da primeira emissão real.</>
                : <><b>HOMOLOGAÇÃO:</b> nota de teste, sem valor fiscal — a SEFAZ troca o nome do destinatário pelo aviso legal. Ambiente muda em NF › Empresas Emissoras.</>}
            </div>
          </div>
        )}

        <div className="field-grid-4">
          <div style={{ gridColumn: 'span 2' }}>
            <Field label="Empresa emissora">
              <select className="input" value={empresaId} onChange={(e) => setEmpresaId(e.target.value)}>
                {emissoras.map((e2) => <option key={e2.id} value={e2.id}>{e2.nome_fantasia || e2.razao_social} · {e2.ambiente === 'producao' ? 'PRODUÇÃO' : 'homologação'}</option>)}
              </select>
            </Field>
          </div>
          <div style={{ gridColumn: 'span 2' }}>
            <Field label="Destinatário (a fábrica)">
              <input className="input" disabled value={(fabrica && fabrica.nome) || ''} />
            </Field>
          </div>
        </div>
        <div className="field-grid-4" style={{ marginTop: 8 }}>
          <div style={{ gridColumn: 'span 2' }}>
            <Field label="Natureza da operação" hint="padrão de Configurações › Fiscal — edite só este caso se precisar">
              <input className="input" value={natureza} onChange={(e) => setNatureza(e.target.value)} />
            </Field>
          </div>
          <Field label="CFOP" hint={ufEmissora && ufFabrica ? `${ufEmissora} → ${ufFabrica} · ${interestadual ? 'interestadual' : 'mesma UF'}` : 'UF da emissora/fábrica define'}>
            <input className="input num" value={cfopFinal} onChange={(e) => { setCfop(e.target.value); setCfopTocado(true); }} />
          </Field>
          <Field label="Frete por conta">
            <select className="input" value={modFrete} onChange={(e) => setModFrete(e.target.value)}>
              <option value="0">Emitente (CIF)</option><option value="1">Destinatário (FOB)</option>
              <option value="2">Terceiros</option><option value="9">Sem frete</option>
            </select>
          </Field>
        </div>
        <div className="field-grid-4" style={{ marginTop: 8 }}>
          <Field label="IE da fábrica" hint="opcional — sem IE, vai como não contribuinte; confirme com o contador">
            <input className="input" value={ieFabrica} onChange={(e) => setIeFabrica(e.target.value)} placeholder="Inscrição Estadual" />
          </Field>
        </div>

        <div style={{ fontSize: 10.5, fontWeight: 600, textTransform: 'uppercase', letterSpacing: '.08em', color: 'var(--tm-fg-4)', margin: '16px 0 6px' }}>
          Insumos da remessa · valor = custo (fiscal)
        </div>
        <table className="tbl" style={{ fontSize: 12.5 }}>
          <thead><tr>
            <th style={{ width: 110 }}>SKU</th><th>Insumo</th><th style={{ width: 90 }}>NCM</th>
            <th style={{ width: 64 }} className="num right">Qtd</th>
            <th style={{ width: 96, whiteSpace: 'nowrap' }} className="num right">Custo un.</th>
            <th style={{ width: 96, whiteSpace: 'nowrap' }} className="num right">Total</th>
          </tr></thead>
          <tbody>
            {linhas.map((l, i) => (
              <tr key={i}>
                <td><span className="ref-mono">{l.prod ? l.prod.sku : '—'}</span></td>
                <td>{l.prod ? (l.prod.nome || l.prod.name) : <span style={{ color: 'var(--tm-danger)' }}>sem produto</span>}</td>
                <td>{l.prod && String(l.prod.ncm || '').trim() ? l.prod.ncm : <span style={{ color: 'var(--tm-danger)' }}>falta</span>}</td>
                <td className="num right">{l.qty}</td>
                <td className="num right" style={{ whiteSpace: 'nowrap' }}>{l.custo > 0 ? `R$ ${brl(l.custo)}` : <span style={{ color: 'var(--tm-danger)' }}>zero</span>}</td>
                <td className="num right" style={{ whiteSpace: 'nowrap' }}>R$ {brl(l.total)}</td>
              </tr>
            ))}
          </tbody>
        </table>
        <div style={{ textAlign: 'right', fontSize: 13, marginTop: 8 }}>Total da nota: <b>R$ {brl(valorTotal)}</b></div>

        {faltas.length > 0 && fase !== 'ok' && (
          <div style={{ marginTop: 14, padding: '12px 14px', borderRadius: 8,
                        background: 'color-mix(in srgb, var(--tm-warning) 10%, transparent)', border: '1px solid var(--tm-warning)' }}>
            <div style={{ fontSize: 12.5, fontWeight: 600, marginBottom: 6 }}>Antes de emitir, resolva:</div>
            <ul style={{ margin: 0, paddingLeft: 18, fontSize: 12.5, lineHeight: 1.7 }}>
              {faltas.map((f, i) => <li key={i}>{f}</li>)}
            </ul>
          </div>
        )}

        {fase === 'ok' && notaOk && (
          <div style={{ display: 'flex', gap: 10, alignItems: 'center', padding: '12px 14px', borderRadius: 8, marginTop: 14,
                        background: 'rgba(91,177,122,0.10)', border: '1px solid var(--tm-success)' }}>
            <Icon name="check-circle" size={18} style={{ color: 'var(--tm-success)' }} />
            <div style={{ fontSize: 13 }}>
              NF-e de remessa <b>nº {notaOk.numero}</b> · {notaOk.status} {producao ? '' : '· homologação (sem valor fiscal)'} —
              vinculada à OP e visível no histórico de NF.
              {notaOk.danfe && <> <a href={notaOk.danfe} target="_blank" rel="noreferrer" style={{ color: 'var(--tm-brand-champagne)' }}>Abrir DANFE</a></>}
            </div>
          </div>
        )}
        {erro && <div style={{ fontSize: 12.5, color: 'var(--tm-danger)', marginTop: 12 }}>{erro}</div>}
      </>)}
    </Drawer>
  );
}

// ─── Configurações › Fiscal — bloco "Nota de remessa" ────────────────────────
function FiscalConfigContent() {
  const [cfg, setCfg] = React.useState(null);
  const [salvando, setSalvando] = React.useState(false);
  const [salvo, setSalvo] = React.useState(false);
  const [erro, setErro] = React.useState('');

  React.useEffect(() => {
    window.tmDb.configRemessa().then(setCfg).catch((e) => setErro(String(e && e.message || e)));
  }, []);

  const salvar = async () => {
    setSalvando(true); setErro('');
    const r = await window.tmDb.salvarConfigRemessa(cfg);
    setSalvando(false);
    if (r && r.error) { setErro(r.error.message || String(r.error)); return; }
    setSalvo(true); setTimeout(() => setSalvo(false), 2000);
  };

  return (
    <div>
      <h2 style={{ fontSize: 18, fontFamily: 'var(--tm-font-display)', marginBottom: 4 }}>Fiscal (NF-e)</h2>
      <p className="muted" style={{ fontSize: 13, marginBottom: 24 }}>Padrões fiscais usados na emissão. Por enquanto: a nota de remessa para industrialização.</p>

      <div style={{ background: 'var(--tm-bg-2)', borderRadius: 10, padding: '20px 24px', border: '1px solid var(--tm-line-1)', maxWidth: 640 }}>
        <div style={{ display: 'flex', alignItems: 'center', gap: 10, marginBottom: 6 }}>
          <Icon name="factory" size={16} style={{ color: 'var(--tm-brand-champagne)' }} />
          <div style={{ fontSize: 13, fontWeight: 600 }}>Nota de remessa (industrialização)</div>
        </div>
        <div style={{ display: 'flex', gap: 8, alignItems: 'flex-start', fontSize: 12, color: 'var(--tm-warning)', margin: '10px 0 16px', lineHeight: 1.5 }}>
          <Icon name="alert-triangle" size={14} style={{ marginTop: 1, flexShrink: 0 }} />
          <span><b>Confirme com seu contador antes da primeira emissão em produção.</b> Os padrões abaixo (5901/6901, "Remessa para industrialização") são os mais comuns, mas variam por operação.</span>
        </div>
        {!cfg ? <div className="muted" style={{ fontSize: 12 }}>Carregando…</div> : (<>
          <div className="field-grid-2" style={{ gap: 12 }}>
            <div style={{ gridColumn: 'span 2' }}>
              <Field label="Natureza da operação">
                <input className="input" value={cfg.natureza || ''} onChange={(e) => setCfg({ ...cfg, natureza: e.target.value })} />
              </Field>
            </div>
            <Field label="CFOP · mesma UF" hint="emissora e fábrica no mesmo estado">
              <input className="input num" value={cfg.cfopIntra || ''} onChange={(e) => setCfg({ ...cfg, cfopIntra: e.target.value })} />
            </Field>
            <Field label="CFOP · outra UF" hint="estados diferentes">
              <input className="input num" value={cfg.cfopInter || ''} onChange={(e) => setCfg({ ...cfg, cfopInter: e.target.value })} />
            </Field>
          </div>
          <div style={{ marginTop: 16, display: 'flex', gap: 10, alignItems: 'center' }}>
            <Button variant="primary" size="sm" icon="check" onClick={salvar} disabled={salvando}>{salvando ? 'Salvando…' : 'Salvar padrões'}</Button>
            {salvo && <span style={{ fontSize: 12, color: 'var(--tm-success)' }}>Salvo — vale já na próxima emissão.</span>}
          </div>
        </>)}
        {erro && <div style={{ fontSize: 12, color: 'var(--tm-danger)', marginTop: 10 }}>{erro}</div>}
      </div>
    </div>
  );
}

Object.assign(window, { RemessaOPDrawer, FiscalConfigContent, custoInsumoRemessa });