function LicitacoesScreen({ go }) {
  const { PageHeader, Button, KpiCard, Input, FilterChip, SegmentedControl, Card, CardHeader, Table, Badge, StatusDot, EmptyState, Drawer, DataField, LinkRow, Select, Toast } = window.VRticeDesignSystem_d763eb;
  const D = window.VXData, ST = D.status, SK = Object.keys(ST);
  const [list, setList] = React.useState(D.editais);
  const [q, setQ] = React.useState(''), [st, setSt] = React.useState(''), [view, setView] = React.useState('table');
  const [drawer, setDrawer] = React.useState(null), [confirm, setConfirm] = React.useState(false), [toast, setToast] = React.useState(''), [err, setErr] = React.useState('');
  const flash = t => { setToast(t); clearTimeout(window.__vxT); window.__vxT = setTimeout(() => setToast(''), 2400); };
  const f = list.filter(r => (!st || r.status === st) && (!q || Object.values(r).join(' ').toLowerCase().includes(q.toLowerCase())));
  const cur = drawer && drawer.mode === 'view' ? list.find(x => x.id === drawer.id) : null;
  const draft = drawer && drawer.mode === 'form' ? drawer.draft : null;
  const setD = (k, v) => setDrawer(d => ({ ...d, draft: { ...d.draft, [k]: v } }));
  const FORM = [['edital', 'Edital', 'Ex.: PE 061/2026'], ['orgao', 'Órgão', 'Nome do órgão contratante'], ['cidade', 'Cidade', 'Cidade - UF'], ['valor', 'Valor estimado', 'R$ 0'], ['prazo', 'Prazo', 'dd/mm/aaaa'], ['responsavel', 'Responsável', 'Nome']];
  const save = () => {
    if (!String(draft.edital || '').trim()) return setErr('Preencha o campo edital.');
    if (draft.id) { setList(l => l.map(x => x.id === draft.id ? draft : x)); setDrawer({ mode: 'view', id: draft.id }); flash('Alterações salvas'); }
    else { const id = Date.now(); setList(l => [{ ...draft, id }, ...l]); setDrawer({ mode: 'view', id }); flash('Cadastro criado'); }
  };
  return (
    <BlockGrid.Auto id="licitacoes">
      <PageHeader eyebrow="Licitações" title="Gestão de Editais e Licitações" description="Captação, análise por IA e acompanhamento de pregões públicos." actions={<>
        <SegmentedControl value={view} onChange={setView} options={[{ value: 'table', label: 'Tabela', icon: 'ph-rows' }, { value: 'kanban', label: 'Kanban', icon: 'ph-kanban' }]} />
        <Button variant="secondary" icon="ph-scan" onClick={() => go('hub')}>Processar edital</Button>
        <Button onClick={() => { setErr(''); setDrawer({ mode: 'form', draft: { status: SK[0] } }); }}>+ Nova Licitação</Button>
      </>} />
      <DemoNotice />
      <div style={{ display: 'grid', gridTemplateColumns: 'repeat(auto-fit, minmax(200px, 1fr))', gap: 16, marginTop: -4 }}>
        <KpiCard compact label="Licitações ativas" value="12" caption="+2 este mês" />
        <KpiCard compact label="Valor total em disputa" value="R$ 24,9 mi" valueColor="var(--text-accent)" caption="Soma dos editais ativos" />
        <KpiCard compact label="Taxa de sucesso" value="68,5%" caption="Base nos últimos 12 meses" />
        <KpiCard compact label="Em análise técnica" value="4" caption="Aguardando parecer" />
      </div>
      <div style={{ display: 'flex', flexWrap: 'wrap', gap: 12, alignItems: 'center', marginTop: -4 }}>
        <Input placeholder="Buscar por edital, órgão ou cidade" value={q} onChange={e => setQ(e.target.value)} style={{ flex: '1 1 240px' }} />
        <div style={{ display: 'flex', flexWrap: 'wrap', gap: 8 }}>
          <FilterChip label="Todos" count={list.length} selected={!st} onClick={() => setSt('')} />
          {SK.map(k => <FilterChip key={k} label={k} tone={ST[k]} count={list.filter(x => x.status === k).length} selected={st === k} onClick={() => setSt(st === k ? '' : k)} />)}
        </div>
        <SoonBtn variant="secondary" size="sm" icon="ph-download-simple" style={{ padding: '9px 14px', borderRadius: 10 }}>Exportar</SoonBtn>
      </div>
      {view === 'table' ? (
        <Card variant="flat" padding={0} gap={0} style={{ overflow: 'hidden', marginTop: -4 }}>
          <div style={{ padding: '22px 24px' }}><CardHeader size="sm" title="Editais e Pregões" subtitle="Lista completa de licitações cadastradas no sistema" action={<span style={{ fontSize: 13, color: 'var(--text-muted)' }}>{f.length} de {list.length} editais</span>} /></div>
          <VxTable id="licitacoes" minWidth={1060} onRowClick={r => { setConfirm(false); setDrawer({ mode: 'view', id: r.id }); }} columns={[
            { key: 'edital', label: 'Edital', width: 'minmax(110px,0.8fr)', strong: true },
            { key: 'orgao', label: 'Órgão', width: 'minmax(200px,1.6fr)', muted: true },
            { key: 'cidade', label: 'Cidade', width: 'minmax(140px,1fr)', render: r => <span style={{ color: 'var(--text-secondary)' }}>{r.cidade}</span> },
            { key: 'valor', label: 'Valor', width: 'minmax(120px,0.9fr)', mono: true },
            { key: 'status', label: 'Status', width: '140px', render: r => <Badge tone={ST[r.status]}>{r.status}</Badge> },
            { key: 'prazo', label: 'Prazo', width: '100px', mono: true },
            { key: 'responsavel', label: 'Responsável', width: 'minmax(120px,0.9fr)', accent: true },
          ]} rows={f} />
        </Card>
      ) : (
        <div style={{ display: 'grid', gridAutoFlow: 'column', gridAutoColumns: 'minmax(250px, 1fr)', gap: 16, overflowX: 'auto', paddingBottom: 8, marginTop: -4 }}>
          {SK.map(k => { const cards = f.filter(r => r.status === k); return (
            <div key={k} onDragOver={e => e.preventDefault()} onDrop={e => { const id = Number(e.dataTransfer.getData('text/plain')); setList(l => l.map(x => x.id === id ? { ...x, status: k } : x)); flash('Movido para ' + k); }} style={{ background: 'var(--surface-sunken)', border: '1px solid var(--overlay-06)', borderRadius: 16, padding: 14, display: 'flex', flexDirection: 'column', gap: 10, minHeight: 360 }}>
              <StatusDot tone={ST[k]} label={k} count={cards.length} style={{ padding: '4px 4px 6px' }} />
              {cards.map(c => (
                <button key={c.id} draggable onDragStart={e => e.dataTransfer.setData('text/plain', String(c.id))} onClick={() => setDrawer({ mode: 'view', id: c.id })} className="vx-hovercard" style={{ cursor: 'grab', textAlign: 'left', fontFamily: 'inherit', color: 'var(--text-primary)', background: 'var(--surface-flat)', border: '1px solid var(--overlay-08)', borderRadius: 12, padding: 14, display: 'flex', flexDirection: 'column', gap: 6 }}>
                  <span style={{ fontSize: 14, fontWeight: 600 }}>{c.edital}</span>
                  <span style={{ fontSize: 13, color: 'var(--text-muted)' }}>{c.orgao}</span>
                  <span style={{ display: 'flex', justifyContent: 'space-between', gap: 8, marginTop: 6 }}><span style={{ fontFamily: 'var(--font-mono)', fontSize: 13, color: 'var(--text-accent)' }}>{c.valor}</span><span style={{ fontFamily: 'var(--font-mono)', fontSize: 12, color: 'var(--text-subtle)' }}>{c.prazo}</span></span>
                  <span style={{ fontSize: 12, color: 'var(--text-secondary)' }}>{c.responsavel}</span>
                </button>
              ))}
              {!cards.length && <EmptyState variant="dropzone">Arraste itens para cá</EmptyState>}
            </div>); })}
        </div>
      )}
      {cur && <Drawer kicker="Licitação" title={cur.edital} subtitle={cur.orgao} onClose={() => setDrawer(null)} footer={<>
        <Button style={{ flex: 1 }} onClick={() => setDrawer({ mode: 'form', draft: { ...cur } })}>Editar</Button>
        <Button variant="danger" onClick={() => { if (!confirm) return setConfirm(true); setList(l => l.filter(x => x.id !== cur.id)); setDrawer(null); flash('Registro excluído'); }}>{confirm ? 'Confirmar exclusão' : 'Excluir'}</Button>
      </>}>
        <div style={{ display: 'flex', flexDirection: 'column', gap: 8 }}>
          <span style={{ fontSize: 11, letterSpacing: '0.14em', color: 'var(--text-subtle)' }}>STATUS</span>
          <div style={{ display: 'flex', flexWrap: 'wrap', gap: 6 }}>{SK.map(k => { const on = cur.status === k; return <button key={k} className="vx-tone-pill" aria-pressed={on} onClick={() => setList(l => l.map(x => x.id === cur.id ? { ...x, status: k } : x))} style={on ? { background: ({ neutral: 'var(--status-neutral-text)', warning: 'var(--status-warning)', proposal: 'var(--status-proposal)', success: 'var(--status-success)', info: 'var(--status-info)' })[ST[k]] } : undefined}>{k}</button>; })}</div>
        </div>
        <div style={{ display: 'grid', gridTemplateColumns: '1fr 1fr', gap: '18px 16px' }}>
          <DataField label="Órgão">{cur.orgao}</DataField><DataField label="Cidade">{cur.cidade}</DataField><DataField label="Valor" mono>{cur.valor}</DataField><DataField label="Prazo" mono>{cur.prazo}</DataField><DataField label="Responsável">{cur.responsavel}</DataField>
        </div>
        <div style={{ display: 'flex', flexDirection: 'column', gap: 8 }}>
          <span style={{ fontSize: 11, letterSpacing: '0.14em', color: 'var(--text-subtle)' }}>ATALHOS</span>
          <LinkRow onClick={() => go('hub')}>Processar edital no Intelligence Hub</LinkRow>
          <LinkRow onClick={() => go('score')}>Avaliar Go/No-Go</LinkRow>
          <LinkRow onClick={() => go('propostas')}>Gerar proposta</LinkRow>
        </div>
      </Drawer>}
      {draft && <Drawer kicker={draft.id ? 'Editar cadastro' : 'Novo cadastro'} onClose={() => setDrawer(null)} footer={<><Button style={{ flex: 1 }} onClick={save}>Salvar</Button><Button variant="ghost" onClick={() => setDrawer(null)}>Cancelar</Button></>}>
        <span style={{ fontSize: 22, fontWeight: 600, letterSpacing: '-0.01em', marginTop: -8 }}>{draft.id ? draft.edital : 'Cadastrar licitação'}</span>
        {FORM.map(([k, l, ph]) => <Input key={k} label={l} placeholder={ph} value={draft[k] || ''} onChange={e => { setErr(''); setD(k, e.target.value); }} error={k === 'edital' ? err : undefined} />)}
        <Select label="Status" options={SK} value={draft.status} onChange={e => setD('status', e.target.value)} />
      </Drawer>}
      {toast && <Toast>{toast}</Toast>}
    </BlockGrid.Auto>
  );
}
window.LicitacoesScreen = LicitacoesScreen;