/* global React, ReactDOM, Icon, Button, Field */

// ─── Etiqueta de volume (impressão térmica 10×15) ────────────────────────────
// Uma etiqueta por volume (1/11, 2/11 …), gerada do pedido de venda. É a etiqueta
// INTERNA, de transportadora — não substitui a do Melhor Envio (correios), que
// continua existindo e é outra coisa.
//
// ⚠️ IMPRESSÃO: reusa `.doc-print-overlay` (portalada pro body), então herda de
// graça o `body > *:not(.doc-print-overlay){display:none}` do bloco de print
// global. Mas NÃO usa `.doc-sheet-inner` nem `.doc-sheet-accent`: essas têm
// `!important` calibrado pra A4 (padding 12mm, width 100vw) e vazariam na
// etiqueta. A etiqueta tem estrutura própria (`.etq-*`) e página NOMEADA, então
// o `@page` A4 dos outros três documentos fica intacto.

// ── Separadores aceitos em "Cidade · UF" ─────────────────────────────────────
// O campo é rotulado "Cidade · UF" no formulário do pedido, mas nada obriga o
// separador. Aceita ·, / e vírgula.
// DOIS CONSUMIDORES: esta etiqueta E o Melhor Envio (EtiquetaCompraModal em
// Pedidos.jsx) — lá o split('/') deixava a UF vazia, o que cotava frete errado e
// fazia os Correios recusarem a etiqueta. Se mudar aqui, os dois mudam junto.
// Regex SEM acento literal: · = "·" (acento em regex quebra o Babel).
const SEP_CIDADE_UF = /\s*[\u00b7\/,]\s*|\s+-\s+/;

function partirCidadeUf(txt) {
  const partes = String(txt || '').split(SEP_CIDADE_UF).map(x => x.trim()).filter(Boolean);
  return { cidade: partes[0] || '', uf: (partes[1] || '').toUpperCase().slice(0, 2) };
}

// ── A regra que não pode errar ───────────────────────────────────────────────
// Com `enderecoDiferente`, a mercadoria vai pro endereço de ENTREGA — não pro
// cadastro do cliente. Errar aqui manda a carga pro lugar errado.
function resolverEnderecoEtiqueta(pedido, cadastro) {
  const t = (pedido && pedido.transp) || {};
  const usaEntrega = !!t.enderecoDiferente && !!(t.entregaCep || t.entregaEnd || t.entregaCidade);
  if (usaEntrega) {
    const { cidade, uf } = partirCidadeUf(t.entregaCidade);
    return {
      origem: 'entrega',
      endereco: t.entregaEnd || '', bairro: '',
      cidade, uf, cep: t.entregaCep || '',
      recebedor: t.entregaRecebedor || '',
    };
  }
  const c = cadastro || {};
  const endereco = [c.geral_endereco, c.geral_numero].filter(Boolean).join(', ')
    + (c.geral_complemento ? ` — ${c.geral_complemento}` : '');
  return {
    origem: 'cadastro',
    endereco: endereco.trim(), bairro: c.geral_bairro || '',
    cidade: c.geral_cidade || '', uf: (c.geral_uf || '').toUpperCase().slice(0, 2),
    cep: c.geral_cep || '', recebedor: '',
  };
}

// Campos sem os quais a etiqueta é papel perdido.
function faltandoNoEndereco(end) {
  const falta = [];
  if (!end.endereco) falta.push('endereço');
  if (!end.cidade)   falta.push('cidade');
  if (!end.uf)       falta.push('estado (UF)');
  if (!end.cep)      falta.push('CEP');
  return falta;
}

async function buscarCadastroCliente(nome) {
  if (!window.tmSupabase || !nome) return null;
  try {
    const r = await Promise.all([
      window.tmSupabase.from('clientes').select('*').eq('nome', nome).maybeSingle(),
      window.tmSupabase.from('saloes').select('*').eq('nome', nome).maybeSingle(),
      window.tmSupabase.from('distribuidores').select('*').eq('nome', nome).maybeSingle(),
    ]);
    return (r[0] && r[0].data) || (r[1] && r[1].data) || (r[2] && r[2].data) || null;
  } catch (e) { return null; }
}

// Empresa DO PEDIDO — ela tem 4 CNPJs, então nada de fixar a TopMix.
// Ordem: emissora da NF do pedido → empresa ativa do topo → primeira cadastrada.
async function empresaDoPedido(pedido) {
  const id = pedido && (pedido.empresa_emissora_id || pedido.empresaEmissoraId);
  if (id && window.tmSupabase) {
    try {
      const { data } = await window.tmSupabase.from('empresas_emissoras').select('*').eq('id', id).maybeSingle();
      if (data) return data;
    } catch (e) { /* cai no fallback */ }
  }
  return window.tmEmpresa || (window.tmEmpresas || [])[0] || {};
}

// ── Símbolos de manuseio (SVG inline: tem que imprimir sempre) ───────────────
// Desenhados como FORMA CHEIA (fill), não como traço fino: a térmica não tem a
// resolução que a tela sugere e linha fina simplesmente some no papel. Todos no
// mesmo viewBox 48x48 e com a mesma altura óptica, pra os três pesarem igual.
// Padrão ISO 780.
const PRETO = '#000';

// Duas setas verticais + LINHA DE BASE embaixo (a base é o que define o símbolo).
function SimboloLadoCima() {
  const seta = (cx) => `M${cx},5 L${cx + 8.5},18 L${cx + 3.5},18 L${cx + 3.5},33 L${cx - 3.5},33 L${cx - 3.5},18 L${cx - 8.5},18 Z`;
  return (
    <svg viewBox="0 0 48 48" width="100%" height="100%" aria-hidden="true" focusable="false">
      <path d={seta(15)} fill={PRETO} />
      <path d={seta(33)} fill={PRETO} />
      <rect x="5" y="38" width="38" height="4.5" fill={PRETO} />
    </svg>
  );
}

// Taça: cálice que AFINA até a haste (bojo em U), haste e base larga.
// A silhueta é contínua — copo, haste e base se tocam, senão vira "borrão com
// barrinha embaixo" e ninguém lê taça.
function SimboloFragil() {
  return (
    <svg viewBox="0 0 48 48" width="100%" height="100%" aria-hidden="true" focusable="false">
      {/* cálice: boca reta em cima, laterais fechando num ponto na haste */}
      <path d="M15,5 H33 C33,17.5 29,26.5 24,26.5 C19,26.5 15,17.5 15,5 Z" fill={PRETO} />
      {/* haste (encosta no bojo) + base */}
      <rect x="22.3" y="25.5" width="3.4" height="13.4" fill={PRETO} />
      <rect x="15" y="38.9" width="18" height="3.6" fill={PRETO} />
      {/* trinca: vazada em branco DENTRO do bojo — é o que diz "quebrado" */}
      <path d="M20.5,5 L17.8,11 L21.2,13.5 L18.8,19.5" fill="none" stroke="#fff"
            strokeWidth="2.4" strokeLinejoin="round" strokeLinecap="round" />
    </svg>
  );
}

// Guarda-chuva CHEIO + gotas de chuva (sem gota não é "mantenha seco").
// As gotas ficam ESPALHADAS — antes estavam grudadas no canto direito, cobrindo
// o cabo e uma delas vazava pra fora do viewBox.
function SimboloMantenhaSeco() {
  const gota = (x, y) => `M${x},${y} c2.2,2.6 3.3,4.2 3.3,5.5 a3.3,3.3 0 0 1 -6.6,0 c0,-1.3 1.1,-2.9 3.3,-5.5 Z`;
  return (
    <svg viewBox="0 0 48 48" width="100%" height="100%" aria-hidden="true" focusable="false">
      {/* cúpula */}
      <path d="M6,25 A18,18 0 0 1 42,25 Z" fill={PRETO} />
      {/* haste + cabo em J (fica embaixo, à esquerda — livre das gotas) */}
      <path d="M24,25 V35 A5.5,5.5 0 0 1 13,35" fill="none" stroke={PRETO}
            strokeWidth="4" strokeLinecap="round" />
      {/* pino do topo */}
      <rect x="22.5" y="5" width="3" height="5" fill={PRETO} />
      {/* gotas: uma de cada lado + uma caindo à direita (o gancho ocupa a esquerda) */}
      <path d={gota(7.5, 28.5)} fill={PRETO} />
      <path d={gota(40, 28.5)} fill={PRETO} />
      <path d={gota(33.5, 33.5)} fill={PRETO} />
    </svg>
  );
}
const SIMBOLOS = [
  { C: SimboloLadoCima,     legenda: 'ESTE LADO PARA CIMA' },
  { C: SimboloFragil,       legenda: 'CUIDADO FRÁGIL' },
  { C: SimboloMantenhaSeco, legenda: 'MANTENHA SECO' },
];

// ── Uma etiqueta ─────────────────────────────────────────────────────────────
function Etiqueta({ empresa, cliente, dataSaida, responsavel, end, n, total, rotuloDest = 'CLIENTE', conteudo }) {
  const nomeEmpresa = empresa.nome_fantasia || empresa.razao_social || empresa.nome || '';
  const [logoFalhou, setLogoFalhou] = React.useState(false);
  React.useEffect(() => { setLogoFalhou(false); }, [empresa.logo_url]);
  const linhas = [
    ['ENDEREÇO', end.endereco],
    ['BAIRRO',   end.bairro],
    ['CIDADE',   end.cidade],
    ['ESTADO',   end.uf],
    ['CEP',      end.cep],
  ].filter(l => l[1]);

  return (
    <div className="etq-folha">
      <div className="etq-borda">

        <div className="etq-topo">
          <div className="etq-logo">
            {/* Se a URL falhar, o <img> fica 0x0 e sobra um buraco branco na etiqueta.
                O onError troca pelo nome — etiqueta sem identificação é volume anônimo
                no meio de uma carga. */}
            {(empresa.logo_url && !logoFalhou)
              ? <img src={empresa.logo_url} alt={nomeEmpresa} onError={() => setLogoFalhou(true)} />
              : <div className="etq-logo-txt">{nomeEmpresa}</div>}
          </div>
          <div className="etq-topo-campos">
            <div className="etq-campo">
              <span className="etq-campo-rot">{rotuloDest}:</span>
              <span className="etq-campo-val">{cliente || '—'}</span>
            </div>
            <div className="etq-campo">
              <span className="etq-campo-rot">DATA DE SAÍDA:</span>
              <span className="etq-campo-val">{dataSaida || '—'}</span>
            </div>
            <div className="etq-campo">
              <span className="etq-campo-rot">RESPONSÁVEL:</span>
              <span className="etq-campo-val">{responsavel || '—'}</span>
            </div>
          </div>
        </div>

        <div className="etq-miolo">
          <div className="etq-dest-rot">DESTINATÁRIO:</div>
          <table className="etq-dest-tbl"><tbody>
            {linhas.map(([rot, val]) => (
              <tr key={rot}><th>{rot}:</th><td>{val}</td></tr>
            ))}
          </tbody></table>
          {end.recebedor && <div className="etq-ac">A/C: {end.recebedor}</div>}
          {conteudo && <div className="etq-ac">CONTEÚDO: {conteudo}</div>}
        </div>

        <div className="etq-rodape">
          <div className="etq-rodape-bloco etq-volume">
            <div className="etq-volume-rot">VOLUME</div>
            <div className="etq-volume-num">{n}/{total}</div>
          </div>
          <div className="etq-rodape-bloco etq-simbolos">
            {SIMBOLOS.map(({ C, legenda }) => (
              <div className="etq-simbolo" key={legenda}>
                <div className="etq-simbolo-svg"><C /></div>
                <div className="etq-simbolo-leg">{legenda}</div>
              </div>
            ))}
          </div>
          <div className="etq-rodape-bloco etq-empresa">{nomeEmpresa}</div>
        </div>

      </div>
    </div>
  );
}

// ── Tela: configura, confere o endereço e imprime ───────────────────────────
// dd/mm/aaaa -> ISO (a coluna expedicao_data e date)
function isoDeBr(br) {
  const m = String(br || '').match(/^(\d{2})\/(\d{2})\/(\d{4})$/);
  return m ? `${m[3]}-${m[2]}-${m[1]}` : null;
}

// Nomes ja cadastrados (usuarios + vendedores) viram sugestao no campo. Se as
// tabelas nao responderem, texto livre resolve — nada de cadastro novo pra isto.
async function nomesParaResponsavel() {
  if (!window.tmSupabase) return [];
  const nomes = new Set();
  try {
    const r = await Promise.all([
      window.tmSupabase.from('usuarios').select('nome'),
      window.tmSupabase.from('vendedores').select('nome'),
    ]);
    r.forEach(x => (x && x.data || []).forEach(u => { if (u && u.nome) nomes.add(u.nome); }));
  } catch (e) { /* segue com texto livre */ }
  return [...nomes].sort();
}

// `destino` (opcional) muda o alvo SEM segundo componente — Fase 2, remessa pra
// fábrica a partir da OP: { rotulo: 'FÁBRICA', nome, cadastro (geral_*), empresa }.
// Sem destino, comportamento original (cliente do pedido de venda).
function EtiquetaVolumeModal({ pedido, onClose, destino }) {
  const hojeBr = () => { const d = new Date();
    return `${String(d.getDate()).padStart(2,'0')}/${String(d.getMonth()+1).padStart(2,'0')}/${d.getFullYear()}`; };

  const qtdPedido = Math.max(0, parseInt((pedido.transp && pedido.transp.qtd) || 0, 10) || 0);
  const [total, setTotal]   = React.useState(qtdPedido > 0 ? qtdPedido : 1);
  const [de, setDe]         = React.useState(1);
  const [ate, setAte]       = React.useState(qtdPedido > 0 ? qtdPedido : 1);
  // Data e responsavel: se o pedido JA foi expedido, traz o gravado; senao o
  // padrao (hoje / usuario logado). Quem opera o app nem sempre e quem embala.
  const usuarioLogado = () => {
    const p = window.tmUserProfile || {};
    return p.nome || p.name || (window.tmUser && window.tmUser.email) || '';
  };
  const [dataSaida, setData] = React.useState(pedido.expedicaoData || hojeBr());
  const [responsavel, setResponsavel] = React.useState(pedido.expedicaoResponsavel || usuarioLogado());
  // Conteúdo por VOLUME (linha 1 = volume 1; linha vazia = etiqueta sem o campo).
  // É o que a fábrica confere na chegada sem abrir tudo.
  const [conteudos, setConteudos] = React.useState('');
  const [totalItens, setTotalItens] = React.useState(destino && destino.totalItens > 0 ? destino.totalItens : null);
  const [salvando, setSalvando] = React.useState(false);
  const [empresa, setEmpresa] = React.useState(null);
  const [cadastro, setCadastro] = React.useState(undefined);   // undefined = carregando
  const [carregando, setCarregando] = React.useState(true);
  const [sugestoes, setSugestoes] = React.useState([]);

  React.useEffect(() => { (async () => {
    setCarregando(true);
    const [emp, cad, nomes] = await Promise.all([
      destino && destino.empresa ? Promise.resolve(destino.empresa) : empresaDoPedido(pedido),
      destino ? Promise.resolve(destino.cadastro || null) : buscarCadastroCliente(pedido.cli || pedido.cliente_nome),
      nomesParaResponsavel(),
    ]);
    setEmpresa(emp || {}); setCadastro(cad); setSugestoes(nomes); setCarregando(false);
    // total de itens pro "Distribuir automaticamente": na OP vem pronto
    // (destino.totalItens); na venda, soma das quantidades do pedido.
    if (!destino && pedido.id && window.tmDb && window.tmDb.loadPedidoItens) {
      try {
        const its = await window.tmDb.loadPedidoItens(pedido.id);
        const soma = (its || []).reduce((a, it) => a + (parseFloat(it.qty != null ? it.qty : it.quantidade) || 0), 0);
        if (soma > 0) setTotalItens(Math.round(soma));
      } catch (e) { /* sem soma, o botão fica oculto */ }
    }
  })(); }, [pedido && pedido.id]);   // eslint-disable-line

  const end = React.useMemo(() => resolverEnderecoEtiqueta(pedido, cadastro), [pedido, cadastro]);
  const falta = faltandoNoEndereco(end);

  const nTotal = Math.max(1, parseInt(total, 10) || 1);
  const ini = Math.min(Math.max(1, parseInt(de, 10) || 1), nTotal);
  const fim = Math.min(Math.max(ini, parseInt(ate, 10) || nTotal), nTotal);
  const numeros = []; for (let i = ini; i <= fim; i++) numeros.push(i);

  // Grava quem embalou e quando saiu ANTES de abrir a impressao. É o unico
  // momento do fluxo real em que a pessoa que separou esta ali — sem isto o dado
  // se perde e o pedido fica sem rastro de quem preparou.
  const imprimir = async () => {
    setSalvando(true);
    try {
      // Expedição gravada onde a origem mora: venda → pedidos; remessa da OP →
      // ordens_producao (mesmos nomes de coluna). Campo que sai na etiqueta e
      // não fica registrado é a categoria que a gente vem matando.
      const patch = {
        expedicao_responsavel: (responsavel || '').trim() || null,
        expedicao_data: isoDeBr(dataSaida),
      };
      if (window.tmSupabase) {
        if (destino && destino.opId) {
          await window.tmSupabase.from('ordens_producao').update(patch).eq('id', destino.opId);
        } else if (!destino && pedido.id) {
          await window.tmSupabase.from('pedidos').update(patch).eq('id', pedido.id);
        }
      }
    } catch (e) { console.warn('expedicao nao gravada:', e); }
    setSalvando(false);
    window.print();
  };
  const nomeDest = destino ? destino.nome : (pedido.cli || pedido.cliente_nome);
  const ondeCompleta = destino ? 'no cadastro da fábrica (Estoque › Fornecedores)' : null;

  // Conteúdo: uma linha por volume; o Distribuir reparte o total em faixas
  // contíguas (420 em 3 → "1-140", "141-280", "281-420"). Ela edita depois.
  const linhasConteudo = conteudos.split('\n');
  const conteudoDoVolume = (n) => (linhasConteudo[n - 1] || '').trim() || null;
  const distribuir = () => {
    const T = totalItens, N = nTotal;
    if (!(T > 0) || !(N > 0)) return;
    const base = Math.floor(T / N), resto = T % N;
    const out = []; let ini2 = 1;
    for (let i = 0; i < N; i++) {
      const tam = base + (i < resto ? 1 : 0);
      const fim2 = ini2 + tam - 1;
      out.push(tam <= 0 ? '' : tam === 1 ? String(ini2) : `${ini2}-${fim2}`);
      ini2 = fim2 + 1;
    }
    setConteudos(out.join('\n'));
  };

  return ReactDOM.createPortal(
    <div className="doc-print-overlay etq-root" style={{
      position: 'fixed', inset: 0, zIndex: 99990, background: 'rgba(0,0,0,0.72)',
      display: 'flex', flexDirection: 'column', alignItems: 'center', overflowY: 'auto',
    }} onClick={(e) => { if (e.target === e.currentTarget) onClose(); }}>

      <div className="doc-no-print" style={{
        position: 'sticky', top: 0, zIndex: 99991, width: '100%', maxWidth: 900,
        background: 'var(--tm-bg-1)', borderBottom: '1px solid var(--tm-line-1)', padding: '12px 20px',
      }}>
        <div style={{ display: 'flex', gap: 10, alignItems: 'center', marginBottom: 10 }}>
          <Icon name="tag" size={16} style={{ color: 'var(--tm-brand-champagne)' }} />
          <span style={{ flex: 1, fontSize: 13.5, fontWeight: 600, color: 'var(--tm-fg-1)' }}>
            Etiquetas de volume — {destino ? 'remessa ' : 'pedido '}{pedido.num || pedido.numero}
          </span>
          <Button variant="primary" icon="printer" size="sm" onClick={imprimir} disabled={!!falta.length || carregando || salvando}>
            {salvando ? 'Gravando…' : `Imprimir ${numeros.length} etiqueta${numeros.length > 1 ? 's' : ''}`}
          </Button>
          <Button variant="secondary" size="sm" onClick={onClose}>Fechar</Button>
        </div>

        <div className="field-grid-4">
          <Field label="Nº de volumes" hint={qtdPedido > 0 ? 'do pedido' : 'o pedido não informou — confirme'}>
            <input className="input" type="number" min="1" step="1" value={total}
              onChange={e => { const v = e.target.value; setTotal(v); setDe(1); setAte(v); }} style={{ textAlign: 'right' }} />
          </Field>
          <Field label="Imprimir do volume"><input className="input" type="number" min="1" step="1" value={de}
            onChange={e => setDe(e.target.value)} style={{ textAlign: 'right' }} /></Field>
          <Field label="até o volume"><input className="input" type="number" min="1" step="1" value={ate}
            onChange={e => setAte(e.target.value)} style={{ textAlign: 'right' }} /></Field>
          <Field label="Data de saída"><input className="input" value={dataSaida}
            onChange={e => setData(e.target.value)} placeholder="dd/mm/aaaa" /></Field>
        </div>
        <div className="field-grid-4">
          <Field label="Responsável" hint={destino ? 'Quem separou e despachou — fica gravado na OP' : 'Quem separou e despachou — fica gravado no pedido'}>
            <input className="input" value={responsavel} list="etq-responsaveis"
              onChange={e => setResponsavel(e.target.value)} placeholder="Nome de quem embalou" />
            {sugestoes.length > 0 && (
              <datalist id="etq-responsaveis">
                {sugestoes.map(nome => <option key={nome} value={nome} />)}
              </datalist>
            )}
          </Field>
          <div style={{ gridColumn: 'span 3' }}>
            <Field label="Conteúdo por volume (opcional)"
              hint={'uma linha por volume — linha 1 sai na etiqueta 1; linha vazia = etiqueta sem o campo' + (totalItens > 0 ? ` · total: ${totalItens} itens` : '')}>
              <div style={{ display: 'flex', gap: 8, alignItems: 'flex-start' }}>
                <textarea className="input" rows={2} value={conteudos} onChange={e => setConteudos(e.target.value)}
                  placeholder={'frascos 1-140\nfrascos 141-280'} style={{ resize: 'vertical', flex: 1, fontFamily: 'var(--tm-font-mono)', fontSize: 12 }} />
                {totalItens > 0 && (
                  <Button variant="secondary" size="sm" icon="wand-2" onClick={distribuir}
                    title={`Reparte ${totalItens} itens em ${nTotal} volume${nTotal > 1 ? 's' : ''} em faixas contíguas`}>
                    Distribuir
                  </Button>
                )}
              </div>
            </Field>
          </div>
        </div>

        {!carregando && (
          <div style={{ marginTop: 8, fontSize: 12, display: 'flex', gap: 8, alignItems: 'flex-start',
                        color: end.origem === 'entrega' ? 'var(--tm-info)' : 'var(--tm-fg-3)' }}>
            <Icon name={destino ? 'factory' : end.origem === 'entrega' ? 'truck' : 'user'} size={14} style={{ flexShrink: 0, marginTop: 2 }} />
            <span>{destino
              ? <>Destinatário: <b>{nomeDest || '—'}</b> — endereço do cadastro da fábrica.</>
              : end.origem === 'entrega'
              ? <>Usando o <b>endereço de entrega</b> do pedido (diferente do cadastro do cliente).</>
              : <>Usando o <b>endereço de cadastro</b> do cliente — o pedido não tem endereço de entrega próprio.</>}</span>
          </div>
        )}

        {!carregando && falta.length > 0 && (
          <div style={{ marginTop: 8, padding: '9px 12px', borderRadius: 8, fontSize: 12.5, lineHeight: 1.6,
                        background: 'rgba(217,101,94,0.12)', border: '1px solid var(--tm-danger)', color: 'var(--tm-fg-1)' }}>
            <b>Não dá pra imprimir:</b> falta {falta.join(', ')} {destino ? ondeCompleta + '.'
              : end.origem === 'entrega' ? 'no endereço de entrega do pedido.' : 'no cadastro do cliente.'} Etiqueta sem endereço é papel perdido —
            complete {destino ? ondeCompleta : end.origem === 'entrega' ? 'no formulário do pedido (aba Transportador)' : 'no cadastro do cliente'} e volte.
          </div>
        )}
      </div>

      <div className="etq-palco">
        {carregando
          ? <div className="doc-no-print" style={{ color: '#fff', padding: 40 }}>Carregando…</div>
          : numeros.map(n => (
              <Etiqueta key={n} empresa={empresa || {}} cliente={nomeDest}
                rotuloDest={destino ? destino.rotulo || 'FÁBRICA' : 'CLIENTE'}
                conteudo={conteudoDoVolume(n)}
                dataSaida={dataSaida} responsavel={responsavel} end={end} n={n} total={nTotal} />
            ))}
      </div>
    </div>,
    document.body
  );
}

Object.assign(window, {
  EtiquetaVolumeModal, resolverEnderecoEtiqueta, faltandoNoEndereco, partirCidadeUf, empresaDoPedido, isoDeBr,
});