// module-acquisitions.jsx — Aquisições fechadas (v2)
window.NA = window.NA || {};
window.NA.M = window.NA.M || {};
const _acq = window.NA;
const _AD = () => _acq.AcquisitionDocs;
const { useState: useStateA, useMemo: useMemoA, useEffect: useEffectA, useCallback: useCallbackA, useRef: useRefA } = React;

const ACQ_STATUS_OPTIONS = [
  "in_process", "in_settlement", "overdue", "in_stock", "settled", "sold",
];

const ACQ_FILTER_TABS = [
  { key: "all", statuses: null },
  { key: "in_process", statuses: ["in_process"] },
  { key: "in_settlement", statuses: ["in_settlement"] },
  { key: "overdue", statuses: ["overdue"] },
  { key: "in_stock", statuses: ["in_stock"] },
  { key: "settled", statuses: ["settled"] },
  { key: "sold", statuses: ["sold"] },
  { key: "archive", statuses: ["settled", "sold"] },
];

const ACQ_FILTER_LABELS = {
  pt: {
    all: "Todos", in_process: "Em processo", in_settlement: "Em quitação", overdue: "Atrasados",
    in_stock: "Estoque", settled: "Quitados", sold: "Vendidos", archive: "Arquivo",
  },
  en: {
    all: "All", in_process: "In process", in_settlement: "Settling", overdue: "Overdue",
    in_stock: "Stock", settled: "Settled", sold: "Sold", archive: "Archive",
  },
};

function parsePtDate(str) {
  if (!str || str === "—") return null;
  if (String(str).includes("-")) {
    const d = new Date(str);
    return isNaN(d.getTime()) ? null : d;
  }
  const p = String(str).split("/");
  if (p.length !== 3) return null;
  const d = new Date(`${p[2]}-${p[1]}-${p[0]}`);
  return isNaN(d.getTime()) ? null : d;
}

function inDateRange(v, from, to) {
  if (!from && !to) return true;
  const d = parsePtDate(v.acquiredOn);
  if (!d) return !from && !to;
  if (from && d < new Date(from + "T00:00:00")) return false;
  if (to && d > new Date(to + "T23:59:59")) return false;
  return true;
}

function matchAcqSearch(v, q) {
  if (!q) return true;
  const hay = [v.plate, v.brand, v.model, v.owner, v.bank, v.chassis, v.renavam, v.sellerCpf, v.sellerName, v.sellerPhone]
    .filter(Boolean).join(" ").toLowerCase();
  return hay.includes(q.trim().toLowerCase());
}

function matchesFilterTab(v, tabKey) {
  if (tabKey === "archive") return !!_acq.AcquisitionFinance?.isPermanentArchive?.(v, 2);
  const tab = ACQ_FILTER_TABS.find(t => t.key === tabKey) || ACQ_FILTER_TABS[0];
  if (!tab.statuses) return true;
  return tab.statuses.includes(v.status);
}

function computeAcqKpis(veh, periodDays) {
  const active = veh.filter(v => !["sold", "settled"].includes(v.status));
  const cutoff = new Date();
  cutoff.setDate(cutoff.getDate() - (periodDays || 30));
  const soldRecent = veh.filter(v => {
    if (v.status !== "sold") return false;
    const d = parsePtDate(v.soldAt || v.acquiredOn);
    return d && d >= cutoff;
  });
  return {
    active: active.length,
    settling: veh.filter(v => v.status === "in_settlement").length,
    overdue: veh.filter(v => v.status === "overdue").length,
    stock: veh.filter(v => v.status === "in_stock").length,
    settled: veh.filter(v => v.status === "settled").length,
    soldPeriod: soldRecent.length,
  };
}

function acqTableColumns(t, lang) {
  return [
    { key: "plate", label: t("common_plate"), render: v => <span className="mono fw-600">{v.plate}</span> },
    { key: "vehicle", label: lang === "pt" ? "Veículo" : "Vehicle", render: v => (
      <div><div className="fw-500">{v.brand}</div><div className="text-faint fs-11">{v.model}</div></div>
    )},
    { key: "owner", label: lang === "pt" ? "Cliente / vendedor" : "Client / seller", render: v => v.sellerName || v.owner },
    { key: "bank", label: t("common_bank"), render: v => v.bank },
    { key: "client", label: lang === "pt" ? "Valor cliente" : "Client value", render: (v, l) => <_acq.Money value={v.clientValue} lang={l} className="mono" /> },
    { key: "settlement", label: lang === "pt" ? "Quitação" : "Settlement", render: (v, l) => <_acq.Money value={v.settlementValue} lang={l} className="mono" /> },
    { key: "roi", label: "ROI", render: v => <span className="mono">{Number(v.roi || 0).toFixed(1)}%</span> },
    { key: "status", label: t("common_status"), render: (v, l) => <_acq.StatusTag status={v.status} lang={l} /> },
    { key: "acquired", label: lang === "pt" ? "Aquisição" : "Acquired", render: v => <span className="mono fs-12">{v.acquiredOn}</span> },
  ];
}

function AcquisitionCard({ v, lang, docs, maintItems, onOpen }) {
  const compliance = _AD()?.computeDocCompliance(v.vehType || "car", docs || []);
  const AM = _acq.AcquisitionMaintenance;
  const maintProg = AM?.computeMaintenanceProgress?.(maintItems || [], AM?.vehicleMaintenanceFlags?.(v));
  const cardProps = onOpen ? {
    onClick: onOpen, style: { cursor: "pointer" }, role: "button", tabIndex: 0,
    onKeyDown: (e) => { if (e.key === "Enter" || e.key === " ") { e.preventDefault(); onOpen(); } },
  } : {};
  return (
    <_acq.Card {...cardProps}>
      <div style={{ padding: 8 }}><_acq.VehicleThumb vehicle={v} /></div>
      <div style={{ padding: "8px 12px", borderBottom: "1px solid var(--color-border-secondary)" }}>
        <div className="row gap-4 mb-4">
          <span className="chip fw-600">{v.plate}</span>
          {v.analysisId && <span className="chip fs-10">{lang === "pt" ? "Da análise" : "From analysis"}</span>}
        </div>
        <div className="fs-13 fw-600" style={{ lineHeight: 1.3, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }}>
          {v.brand} {(v.model || "").split(" ").slice(0, 4).join(" ")}
        </div>
        <div className="text-faint fs-11">{(v.sellerName || v.owner || "").slice(0, 36)}</div>
        <div style={{ marginTop: 8 }}><_acq.StatusTag status={v.status} lang={lang} /></div>
      </div>
      <div style={{ padding: 12, fontSize: 12, color: "var(--fg2)", display: "flex", flexDirection: "column", gap: 3 }}>
        <div className="row jcsb"><span>Banco</span><span style={{ color: "var(--fg1)" }}>{v.bank}</span></div>
        <div className="row jcsb"><span>{lang === "pt" ? "Cliente" : "Client"}</span><_acq.Money value={v.clientValue} lang={lang} className="fs-12" /></div>
        <div className="row jcsb"><span>{lang === "pt" ? "Quitação" : "Settlement"}</span><_acq.Money value={v.settlementValue} lang={lang} className="fs-12" /></div>
        <div className="row jcsb"><span>{lang === "pt" ? "Parcelas" : "Installments"}</span>
          <span className="mono">{v.parcels?.paid || 0}/{v.parcels?.total || 0}{(v.parcels?.overdue || 0) > 0 ? ` +${v.parcels.overdue}` : ""}</span>
        </div>
        {v.roi > 0 && <div className="row jcsb"><span>ROI</span><span className="mono text-success">{Number(v.roi).toFixed(1)}%</span></div>}
        {maintProg && maintProg.total > 0 && (
          <div style={{ marginTop: 8, paddingTop: 8, borderTop: "1px dashed var(--color-border-secondary)" }}>
            <div className="row jcsb fs-11 mb-4">
              <span className="text-faint">{lang === "pt" ? "Manutenção" : "Maintenance"}</span>
              <span className="mono">{maintProg.done}/{maintProg.total}</span>
            </div>
            {_acq.MaintenanceChecklist && (
              <_acq.MaintenanceChecklist acquisitionId={v.id} items={maintItems || []} lang={lang} compact />
            )}
          </div>
        )}
        {compliance && compliance.total > 0 && (
          <div style={{ marginTop: 8, paddingTop: 8, borderTop: "1px dashed var(--color-border-secondary)" }}>
            <div className="row jcsb fs-11 mb-4">
              <span className="text-faint">{lang === "pt" ? "Documentos" : "Documents"}</span>
              <span className="mono">{compliance.signed}/{compliance.total}</span>
            </div>
            {_acq.AcquisitionDocChecklist && (
              <_acq.AcquisitionDocChecklist acquisitionId={v.id} vehType={v.vehType || "car"} docs={docs || []} lang={lang} compact />
            )}
          </div>
        )}
      </div>
    </_acq.Card>
  );
}

function AcquisitionDrawer({ open, vehicle, onClose, lang, setT, t, onUpdated, initialTab }) {
  const panelRef = useRefA(null);
  const [tab, setTab] = useStateA("summary");
  const [docs, setDocs] = useStateA([]);
  const [events, setEvents] = useStateA([]);
  const [costs, setCosts] = useStateA([]);
  const [loading, setLoading] = useStateA(false);
  const [newCost, setNewCost] = useStateA({ type: "mecanica", amount: "", description: "" });
  const [paySaving, setPaySaving] = useStateA(false);
  const [statusSaving, setStatusSaving] = useStateA(false);
  const [gateHint, setGateHint] = useStateA("");
  const [showSale, setShowSale] = useStateA(false);
  const [salePrice, setSalePrice] = useStateA("");
  const [saleSaving, setSaleSaving] = useStateA(false);

  const tr = t || (k => _acq.t(k, lang));
  const AF = _acq.AcquisitionFinance;
  const finance = useMemoA(() => AF?.computeRealFinance(vehicle, costs) || null, [vehicle, costs, AF]);
  const currentUser = _acq.currentUser || {};
  const roleKey = currentUser.key || "admin";
  const canEditDocs = ["admin", "lawyer"].includes(roleKey);
  const canCloseSale = ["admin", "manager"].includes(roleKey);
  const canEditFinancials = ["admin", "manager"].includes(roleKey);
  const isPermanent = !!AF?.isPermanentArchive?.(vehicle, 2);
  const go = (module, extra) => { if (setT) setT({ module, ...extra }); onClose && onClose(); };

  const reload = useCallbackA(async () => {
    if (!vehicle?.id) return;
    if (!_acq.db?.isConfigured()) { setDocs([]); setEvents([]); setCosts([]); return; }
    setLoading(true);
    try {
      await _acq.db.ensureAcquisitionDocumentPlaceholders(vehicle.id, vehicle.vehType || "car");
      const [d, e, c] = await Promise.all([
        _acq.db.listAcquisitionDocuments(vehicle.id),
        _acq.db.listAcquisitionEvents(vehicle.id),
        _acq.db.listAcquisitionCosts(vehicle.id),
      ]);
      setDocs(d);
      setEvents(e);
      setCosts(c);
    } catch (err) {
      console.warn(err);
    } finally {
      setLoading(false);
    }
  }, [vehicle?.id, vehicle?.vehType]);

  useEffectA(() => {
    if (open && vehicle) {
      setTab(initialTab || "summary");
      setGateHint("");
      reload();
    }
  }, [open, vehicle?.id, reload, initialTab]);

  if (!open || !vehicle) return null;

  const extrasEntries = Object.entries(vehicle.extras || {}).filter(([, n]) => Number(n) > 0);
  const extrasSum = extrasEntries.reduce((s, [, n]) => s + Number(n), 0);

  const registerPayment = async () => {
    if (isPermanent || !canEditFinancials) return;
    const paid = Number(vehicle.parcels?.paid || 0);
    const total = Number(vehicle.parcels?.total || 0);
    if (total > 0 && paid >= total) return;
    setPaySaving(true);
    try {
      if (_acq.db?.isConfigured() && AF?.registerInstallmentPayment) {
        await AF.registerInstallmentPayment(vehicle.id, lang);
      } else {
        const amount = AF?.installmentAmount(vehicle) || 0;
        await _acq.Cashbook.addEntry({
          type: "out",
          category: lang === "pt" ? "Quitação bancária" : "Bank settlement",
          description: `${lang === "pt" ? "Parcela" : "Installment"} ${paid + 1}/${total || "—"} — ${vehicle.plate}`,
          amount,
          acquisitionId: vehicle.id,
          origin: "auto",
          sourceRef: `installment:${vehicle.id}:${paid + 1}`,
        });
        const next = {
          ...vehicle,
          parcels: { ...vehicle.parcels, paid: paid + 1, overdue: Math.max(0, (vehicle.parcels?.overdue || 0) - 1) },
          nextInstallmentDue: AF?.advanceDueDate(vehicle, 1) || null,
        };
        if (total > 0 && next.parcels.paid >= total) next.status = "settled";
        else if (next.parcels.overdue === 0 && next.status === "overdue") next.status = "in_settlement";
        const idx = (_acq.vehicles || []).findIndex(v => v.id === vehicle.id);
        if (idx >= 0) {
          const arr = [..._acq.vehicles];
          arr[idx] = next;
          window.NA.vehicles = arr;
        }
        window.dispatchEvent(new Event("na:acquisitions-changed"));
      }
      onUpdated && onUpdated();
    } catch (err) {
      alert(err.message);
    } finally {
      setPaySaving(false);
    }
  };

  const registerSale = async () => {
    if (isPermanent || !canCloseSale) return;
    const price = Number(salePrice || 0);
    if (price <= 0) return;
    setSaleSaving(true);
    try {
      if (_acq.db?.isConfigured() && AF?.registerSale) {
        await AF.registerSale(vehicle.id, price, vehicle.createdBy, lang);
      } else {
        await _acq.Cashbook.addEntry({
          type: "in",
          category: lang === "pt" ? "Venda de veículo" : "Vehicle sale",
          description: `${lang === "pt" ? "Venda" : "Sale"} — ${vehicle.plate}`,
          amount: price,
          acquisitionId: vehicle.id,
          origin: "auto",
          sourceRef: `sale:${vehicle.id}`,
        });
        const next = { ...vehicle, status: "sold", salePrice: price, soldAt: new Date().toLocaleDateString("pt-BR") };
        const idx = (_acq.vehicles || []).findIndex(v => v.id === vehicle.id);
        if (idx >= 0) {
          const arr = [..._acq.vehicles];
          arr[idx] = next;
          window.NA.vehicles = arr;
        }
        window.dispatchEvent(new Event("na:acquisitions-changed"));
      }
      setShowSale(false);
      setSalePrice("");
      onUpdated && onUpdated();
    } catch (err) {
      alert(err.message);
    } finally {
      setSaleSaving(false);
    }
  };

  const changeStatus = async (newStatus) => {
    if (isPermanent || !canEditFinancials) return;
    if (!newStatus || newStatus === vehicle.status) return;
    setStatusSaving(true);
    setGateHint("");
    try {
      const pre = _AD()?.checkStatusGate(newStatus, vehicle.vehType || "car", docs, lang);
      if (pre && !pre.ok) {
        setGateHint(pre.message);
        throw new Error(pre.message);
      }
      if (_acq.db?.isConfigured()) {
        await _acq.db.updateAcquisitionStatus(vehicle.id, newStatus, { lang });
      } else {
        const idx = (_acq.vehicles || []).findIndex(v => v.id === vehicle.id);
        if (idx >= 0) {
          const next = [..._acq.vehicles];
          next[idx] = { ...next[idx], status: newStatus };
          window.NA.vehicles = next;
        }
      }
      window.dispatchEvent(new Event("na:acquisitions-changed"));
      onUpdated && onUpdated();
    } catch (err) {
      if (!gateHint) alert(err.message);
    } finally {
      setStatusSaving(false);
    }
  };

  const addCost = async () => {
    if (isPermanent || !canEditFinancials || !_acq.db?.isConfigured() || !newCost.amount) return;
    try {
      await _acq.db.upsertAcquisitionCost({
        acquisitionId: vehicle.id,
        costType: newCost.type,
        amount: Number(newCost.amount),
        description: newCost.description,
        incurredAt: new Date().toISOString().slice(0, 10),
        lang,
      });
      setNewCost({ type: "mecanica", amount: "", description: "" });
      await reload();
      window.dispatchEvent(new Event("na:acquisitions-changed"));
    } catch (err) {
      alert(err.message);
    }
  };

  const drawerTabs = [
    { key: "summary", label: lang === "pt" ? "Resumo" : "Summary", icon: "layout-list" },
    { key: "docs", label: lang === "pt" ? "Documentos" : "Documents", icon: "file-text" },
    { key: "settlement", label: lang === "pt" ? "Quitação" : "Settlement", icon: "credit-card" },
    { key: "costs", label: lang === "pt" ? "Custos" : "Costs", icon: "receipt" },
    { key: "history", label: lang === "pt" ? "Histórico" : "History", icon: "history" },
    { key: "shortcuts", label: lang === "pt" ? "Atalhos" : "Shortcuts", icon: "external-link" },
  ];

  return (
    <div className="na-drawer-mask" onClick={onClose} role="presentation">
      <aside ref={panelRef} className="na-drawer-panel" style={{ maxWidth: 520, width: "min(520px, 96vw)" }}
        onClick={e => e.stopPropagation()} role="dialog" aria-modal="true" aria-label={vehicle.plate}>
        <div className="na-drawer-head">
          <div>
            <div className="row gap-8 mb-8">
              <span className="chip mono fw-600">{vehicle.plate}</span>
              <_acq.StatusTag status={vehicle.status} lang={lang} />
            </div>
            <div className="fw-600 fs-16">{vehicle.brand} {vehicle.model}</div>
            <div className="text-faint fs-12">{vehicle.year} · {vehicle.sellerName || vehicle.owner}</div>
          </div>
          <button type="button" className="icon-btn" onClick={onClose} aria-label="Close"><_acq.Icon name="x" size={16} /></button>
        </div>

        <div style={{ padding: "0 16px", borderBottom: "1px solid var(--color-border-secondary)" }}>
          <_acq.Tabs tabs={drawerTabs} active={tab} onChange={setTab} />
        </div>

        <div className="na-drawer-body" style={{ maxHeight: "calc(100vh - 220px)", overflowY: "auto" }}>
          {isPermanent && (
            <div className="alert info mb-12">
              <div className="body fs-12">
                {lang === "pt"
                  ? "Arquivo permanente: veículo quitado/vendido há mais de 2 anos. Esta visualização é somente leitura."
                  : "Permanent archive: vehicle settled/sold over 2 years ago. This view is read-only."}
              </div>
            </div>
          )}
          {!isPermanent && roleKey !== "admin" && (
            <div className="hint mb-12">
              {lang === "pt"
                ? `Permissões ativas: ${roleKey === "lawyer" ? "advogado edita documentos" : roleKey === "manager" ? "gerente fecha vendas/financeiro" : roleKey === "ops" ? "operação edita manutenção" : "somente leitura neste contexto"}.`
                : `Active permissions: ${roleKey}.`}
            </div>
          )}
          {tab === "summary" && (
            <div className="col gap-12">
              <div className="kv">
                <span className="k">{tr("common_bank")}</span><span className="v">{vehicle.bank}</span>
                <span className="k">{lang === "pt" ? "Valor cliente" : "Client value"}</span><span className="v"><_acq.Money value={vehicle.clientValue} lang={lang} /></span>
                <span className="k">{lang === "pt" ? "Quitação" : "Settlement"}</span><span className="v"><_acq.Money value={vehicle.settlementValue} lang={lang} /></span>
                <span className="k">{lang === "pt" ? "Investimento" : "Investment"}</span><span className="v"><_acq.Money value={vehicle.investimento || 0} lang={lang} /></span>
                <span className="k">{lang === "pt" ? "Lucro est." : "Est. profit"}</span><span className="v"><_acq.Money value={vehicle.lucro || 0} lang={lang} className="text-success" /></span>
                <span className="k">ROI</span><span className="v mono">{Number(vehicle.roi || 0).toFixed(1)}%</span>
              {finance && (
                <>
                  <span className="k">{lang === "pt" ? "Investimento real" : "Real investment"}</span>
                  <span className="v"><_acq.Money value={finance.realInvest} lang={lang} /></span>
                  <span className="k">{lang === "pt" ? "ROI real" : "Real ROI"}</span>
                  <span className="v mono" style={{ color: finance.realRoi >= (vehicle.roi || 0) ? "var(--color-success)" : "var(--color-error)" }}>
                    {finance.realRoi.toFixed(1)}%
                    <span className="text-faint fs-11"> ({finance.roiDelta >= 0 ? "+" : ""}{finance.roiDelta.toFixed(1)}pp)</span>
                  </span>
                </>
              )}
                <span className="k">FIPE</span><span className="v"><_acq.Money value={vehicle.fipeMax || vehicle.fipeMin || 0} lang={lang} /></span>
                <span className="k">{lang === "pt" ? "Margem" : "Margin"}</span><span className="v mono">{Number(vehicle.margin ?? 50)}%</span>
                <span className="k">{lang === "pt" ? "Aquisição" : "Acquired"}</span><span className="v">{vehicle.acquiredOn}</span>
                {vehicle.sellerCpf && <><span className="k">CPF</span><span className="v mono">{vehicle.sellerCpf}</span></>}
                {vehicle.sellerPhone && <><span className="k">{lang === "pt" ? "Telefone" : "Phone"}</span><span className="v mono">{vehicle.sellerPhone}</span></>}
                {vehicle.analysisId && <><span className="k">{lang === "pt" ? "Análise origem" : "Source analysis"}</span><span className="v mono fs-11">{String(vehicle.analysisId).slice(0, 8)}…</span></>}
              </div>
              {(() => {
                const items = _acq.maintenanceItemsByAcq?.[vehicle.id] || [];
                const AM = _acq.AcquisitionMaintenance;
                const prog = AM?.computeMaintenanceProgress?.(items, AM?.vehicleMaintenanceFlags?.(vehicle));
                if (!prog || prog.total === 0) return null;
                return (
                  <div>
                    <div className="fs-11 fw-600 text-faint mb-8">{lang === "pt" ? "MANUTENÇÃO" : "MAINTENANCE"}</div>
                    <div className="row jcsb fs-12 mb-8">
                      <span>{prog.done}/{prog.total} {lang === "pt" ? "concluídos" : "done"}</span>
                      <span className="mono">{prog.pct}%</span>
                    </div>
                    <_acq.Progress value={prog.pct} style={{ marginBottom: 8 }} />
                    <_acq.Button kind="ghost" size="sm" icon="wrench" onClick={() => go("maintenance", { acquisitionId: vehicle.id })}>
                      {lang === "pt" ? "Abrir checklist" : "Open checklist"}
                    </_acq.Button>
                  </div>
                );
              })()}
              <div>
                <div className="fs-11 fw-600 text-faint mb-8">{lang === "pt" ? "ALTERAR STATUS" : "CHANGE STATUS"}</div>
                <_acq.Select value={vehicle.status} disabled={statusSaving || isPermanent || !canEditFinancials}
                  onChange={changeStatus}
                  options={ACQ_STATUS_OPTIONS.map(s => ({ value: s, label: tr("status_" + s) }))} />
                {gateHint && <div className="alert warning mt-8"><div className="body fs-12">{gateHint}</div></div>}
                <div className="hint mt-8">{lang === "pt"
                  ? "Avanço bloqueado se documentos obrigatórios não estiverem assinados (ex.: estoque exige procuração + contrato de compra)."
                  : "Advance blocked until required documents are signed (e.g. stock requires POA + purchase contract)."}</div>
              </div>
            </div>
          )}

          {tab === "docs" && (
            <div className="col gap-12">
              {loading ? <div className="hint">{lang === "pt" ? "Carregando…" : "Loading…"}</div> : (
                <_acq.AcquisitionDocChecklist
                  acquisitionId={vehicle.id}
                  vehType={vehicle.vehType || "car"}
                  docs={docs}
                  lang={lang}
                  mode="operational"
                  onUpload={(docType, file) => _acq.db.uploadAcquisitionDocument(vehicle.id, docType, file)}
                  onStatusChange={(docId, status) => _acq.db.updateAcquisitionDocumentStatus(docId, status)}
                  onRefresh={() => { reload(); window.dispatchEvent(new Event("na:acquisitions-changed")); }}
                  canUpload={canEditDocs && !isPermanent}
                  canChangeStatus={canEditDocs && !isPermanent}
                />
              )}
            </div>
          )}

          {tab === "settlement" && (
            <div className="col gap-12">
              <div className="kv">
                <span className="k">{lang === "pt" ? "Parcelas pagas" : "Paid installments"}</span>
                <span className="v mono">{vehicle.parcels?.paid || 0} / {vehicle.parcels?.total || 0}</span>
                <span className="k">{lang === "pt" ? "Em atraso" : "Overdue"}</span>
                <span className="v mono text-error">{vehicle.parcels?.overdue || 0}</span>
                <span className="k">{lang === "pt" ? "Valor parcela" : "Installment value"}</span>
                <span className="v"><_acq.Money value={AF?.installmentAmount(vehicle) || vehicle.installmentValue || 0} lang={lang} /></span>
                <span className="k">{lang === "pt" ? "Próx. vencimento" : "Next due"}</span>
                <span className="v mono">{AF?.fmtPtDate(AF?.getNextInstallmentDue(vehicle)) || "—"}</span>
                <span className="k">{lang === "pt" ? "Saldo quitação" : "Settlement balance"}</span>
                <span className="v"><_acq.Money value={vehicle.settlementValue || 0} lang={lang} /></span>
              </div>
              {(vehicle.parcels?.total || 0) > (vehicle.parcels?.paid || 0) && canEditFinancials && !isPermanent && (
                <_acq.Button kind="primary" icon="check" disabled={paySaving} onClick={registerPayment}>
                  {paySaving ? "…" : (lang === "pt" ? "Registrar pagamento de parcela (+ Caixa)" : "Register payment (+ cashbook)")}
                </_acq.Button>
              )}
              {(vehicle.parcels?.total || 0) > (vehicle.parcels?.paid || 0) && (!canEditFinancials || isPermanent) && (
                <div className="hint">{lang === "pt" ? "Pagamento bloqueado por permissão ou arquivo permanente." : "Payment blocked by permissions or permanent archive."}</div>
              )}
              {vehicle.status !== "sold" && canCloseSale && !isPermanent && (
                <_acq.Button kind="success" icon="shopping-cart" onClick={() => { setSalePrice(String(vehicle.fipeMax ? Math.round(vehicle.fipeMax * 0.5) : vehicle.clientValue || "")); setShowSale(true); }}>
                  {lang === "pt" ? "Registrar venda" : "Register sale"}
                </_acq.Button>
              )}
            </div>
          )}

          {tab === "costs" && (
            <div className="col gap-12">
              {extrasEntries.length > 0 && (
                <div>
                  <div className="fs-11 fw-600 text-faint mb-8">{lang === "pt" ? "EXTRAS DA ANÁLISE" : "ANALYSIS EXTRAS"}</div>
                  {extrasEntries.map(([k, n]) => (
                    <div key={k} className="row jcsb fs-13 mb-4"><span>{k}</span><_acq.Money value={n} lang={lang} className="mono" /></div>
                  ))}
                  <div className="row jcsb fw-600 mt-8 pt-8" style={{ borderTop: "1px dashed var(--color-border)" }}>
                    <span>Total extras</span><_acq.Money value={extrasSum} lang={lang} />
                  </div>
                </div>
              )}
              {costs.map(c => (
                <div key={c.id} className="row jcsb fs-13">
                  <span>{c.cost_type}{c.description ? ` — ${c.description}` : ""}</span>
                  <_acq.Money value={c.amount} lang={lang} className="mono" />
                </div>
              ))}
              {_acq.db?.isConfigured() && canEditFinancials && !isPermanent && (
                <div className="col gap-8" style={{ marginTop: 8 }}>
                  <_acq.Select value={newCost.type} onChange={v => setNewCost(c => ({ ...c, type: v }))}
                    options={[
                      { value: "mecanica", label: lang === "pt" ? "Mecânica" : "Mechanic" },
                      { value: "ipva", label: "IPVA" },
                      { value: "cartorio", label: lang === "pt" ? "Cartório" : "Notary" },
                      { value: "comissao", label: lang === "pt" ? "Comissão" : "Commission" },
                      { value: "outros", label: lang === "pt" ? "Outros" : "Other" },
                    ]} />
                  <_acq.Input mono type="number" placeholder={lang === "pt" ? "Valor" : "Amount"} value={newCost.amount}
                    onChange={v => setNewCost(c => ({ ...c, amount: v }))} />
                  <_acq.Input placeholder={lang === "pt" ? "Descrição (opcional)" : "Description (optional)"} value={newCost.description}
                    onChange={v => setNewCost(c => ({ ...c, description: v }))} />
                  <_acq.Button kind="default" icon="plus" onClick={addCost}>{lang === "pt" ? "Adicionar custo" : "Add cost"}</_acq.Button>
                </div>
              )}
            </div>
          )}

          {tab === "history" && (
            <div className="col gap-8">
              {events.length === 0 && <div className="hint">{lang === "pt" ? "Nenhum evento registrado." : "No events recorded."}</div>}
              {events.map(ev => (
                <div key={ev.id} style={{ padding: "8px 0", borderBottom: "1px solid var(--color-border-secondary)" }}>
                  <div className="fs-12 fw-600">{ev.event_type === "status_change"
                    ? (lang === "pt" ? "Mudança de status" : "Status change")
                    : ev.event_type === "document_status"
                      ? (lang === "pt" ? "Documento atualizado" : "Document updated")
                      : ev.event_type}</div>
                  {ev.from_status && ev.to_status && (
                    <div className="fs-12 text-muted">{ev.from_status} → {ev.to_status}</div>
                  )}
                  {ev.event_type === "document_status" && ev.payload && (
                    <div className="fs-12 text-muted">
                      {_AD()?.getDocTypeLabel(ev.payload.doc_type, lang)}: {ev.payload.from_status} → {ev.payload.to_status}
                    </div>
                  )}
                  {ev.event_type === "maintenance_item" && ev.payload && (
                    <div className="fs-12 text-muted">
                      {ev.payload.label || (lang === "pt" ? "Item manutenção" : "Maintenance item")}
                      {ev.payload.to_done != null ? `: ${ev.payload.from_done ? "feito" : "pendente"} → ${ev.payload.to_done ? "feito" : "pendente"}` : ""}
                    </div>
                  )}
                  <div className="text-faint fs-11">{new Date(ev.created_at).toLocaleString(lang === "pt" ? "pt-BR" : "en-US")}</div>
                </div>
              ))}
            </div>
          )}

          {tab === "shortcuts" && (
            <div className="col gap-8">
              <_acq.Button kind="default" icon="scale" onClick={() => go("lawyer")}>{tr("nav_lawyer")}</_acq.Button>
              <_acq.Button kind="default" icon="wrench" onClick={() => go("maintenance")}>{tr("nav_maintenance")}</_acq.Button>
              <_acq.Button kind="default" icon="credit-card" onClick={() => go("financing")}>{tr("nav_financing")}</_acq.Button>
              <_acq.Button kind="default" icon="file-text" onClick={() => go("contracts", { acquisitionId: vehicle.id, contractsTab: "legal" })}>{tr("nav_contracts")}</_acq.Button>
              {vehicle.analysisId && setT && (
                <_acq.Button kind="ghost" icon="calculator" onClick={() => { setT({ module: "analysis", analysisId: vehicle.analysisId }); onClose(); }}>
                  {lang === "pt" ? "Abrir análise origem" : "Open source analysis"}
                </_acq.Button>
              )}
            </div>
          )}
        </div>
      </aside>
      <_acq.Modal open={showSale} onClose={() => setShowSale(false)} title={lang === "pt" ? "Registrar venda" : "Register sale"}
        footer={<>
          <_acq.Button kind="ghost" onClick={() => setShowSale(false)}>{tr("common_cancel")}</_acq.Button>
          <_acq.Button kind="primary" disabled={saleSaving} onClick={registerSale}>{saleSaving ? "…" : tr("common_save")}</_acq.Button>
        </>}>
        <div className="hint mb-12">{lang === "pt" ? "Gera receita automática no Caixa e muda status para Vendido." : "Creates cashbook revenue and sets status to Sold."}</div>
        <_acq.Field label={lang === "pt" ? "Valor da venda" : "Sale value"} required>
          <_acq.Input mono type="number" value={salePrice} onChange={setSalePrice} />
        </_acq.Field>
      </_acq.Modal>
    </div>
  );
}

function ModuleAcquisitions({ t, lang, setT, user, tweaks }) {
  const [q, setQ] = useStateA("");
  const [filter, setFilter] = useStateA("all");
  const [view, setView] = useStateA("cards");
  const [bankFilter, setBankFilter] = useStateA("all");
  const [ownerFilter, setOwnerFilter] = useStateA("all");
  const [dateFrom, setDateFrom] = useStateA("");
  const [dateTo, setDateTo] = useStateA("");
  const [showNew, setShowNew] = useStateA(false);
  const [drawerV, setDrawerV] = useStateA(null);
  const [saving, setSaving] = useStateA(false);
  const [importMsg, setImportMsg] = useStateA("");
  const [importing, setImporting] = useStateA(false);
  const [docsByAcq, setDocsByAcq] = useStateA({});
  const [dueOnly, setDueOnly] = useStateA(false);
  const [lookupLoading, setLookupLoading] = useStateA(false);
  const [lookupMsg, setLookupMsg] = useStateA("");
  const [form, setForm] = useStateA({ plate: "", brand: "", model: "", year: "", chassis: "", color: "", fipe: "", price: "", bank: "", vehType: "car" });

  const veh = _acq.vehicles || [];
  const labels = ACQ_FILTER_LABELS[lang] || ACQ_FILTER_LABELS.pt;
  const canImportMock = _acq.db?.isConfigured() && _acq.db.needsVehicleImport?.();
  const mockCount = (_acq.vehiclesMock || []).length;
  const mentees = _acq.mentees || [];

  const kpis = useMemoA(() => computeAcqKpis(veh, 30), [veh]);

  const banks = useMemoA(() => {
    const set = new Set(veh.map(v => v.bank).filter(Boolean));
    return [{ value: "all", label: lang === "pt" ? "Todos os bancos" : "All banks" },
      ...[...set].sort().map(b => ({ value: b, label: b }))];
  }, [veh, lang]);

  const tabCounts = useMemoA(() => {
    const counts = {};
    ACQ_FILTER_TABS.forEach(tab => {
      counts[tab.key] = veh.filter(v => matchesFilterTab(v, tab.key)).length;
    });
    return counts;
  }, [veh]);

  const due7dIds = useMemoA(() => {
    const ids = new Set((_acq.AcquisitionFinance?.getSettlementsDueWithinDays(veh, 7) || []).map(v => v.id));
    return ids;
  }, [veh]);

  const archiveRows = useMemoA(() => veh.filter(v => _acq.AcquisitionFinance?.isPermanentArchive?.(v, 2)), [veh]);
  const dueSoonRows = useMemoA(() => _acq.AcquisitionFinance?.getSettlementsDueWithinDays(veh, 7) || [], [veh]);
  const oldPendingDocs = useMemoA(() => _acq.AcquisitionFinance?.getOldPendingDocuments?.(veh, docsByAcq, 7) || [], [veh, docsByAcq]);

  const filtered = useMemoA(() => veh.filter(v => {
    if (dueOnly && !due7dIds.has(v.id)) return false;
    if (!matchesFilterTab(v, filter)) return false;
    if (!matchAcqSearch(v, q)) return false;
    if (bankFilter !== "all" && v.bank !== bankFilter) return false;
    if (ownerFilter !== "all" && (v.createdBy || "") !== ownerFilter && (v.soldBy || "") !== ownerFilter) return false;
    if (!inDateRange(v, dateFrom, dateTo)) return false;
    return true;
  }), [veh, filter, q, bankFilter, ownerFilter, dateFrom, dateTo, dueOnly, due7dIds]);

  useEffectA(() => {
    if (!drawerV) return;
    const fresh = veh.find(v => v.id === drawerV.id);
    if (fresh) setDrawerV(fresh);
  }, [veh, drawerV?.id]);

  const reloadAllDocs = useCallbackA(async () => {
    if (!_acq.db?.isConfigured()) { setDocsByAcq({}); return; }
    try {
      const rows = await _acq.db.listAllAcquisitionDocuments();
      const map = {};
      rows.forEach(d => {
        if (!map[d.acquisition_id]) map[d.acquisition_id] = [];
        map[d.acquisition_id].push(d);
      });
      setDocsByAcq(map);
    } catch (e) {
      console.warn(e);
    }
  }, []);

  useEffectA(() => { reloadAllDocs(); }, [veh, reloadAllDocs]);

  useEffectA(() => {
    const onRefresh = () => reloadAllDocs();
    window.addEventListener("na:acquisitions-changed", onRefresh);
    return () => window.removeEventListener("na:acquisitions-changed", onRefresh);
  }, [reloadAllDocs]);

  useEffectA(() => {
    const id = tweaks?.acquisitionId;
    if (!id || !veh.length) return;
    const v = veh.find(x => x.id === id);
    if (v) {
      setDrawerV(v);
      setT && setT({ acquisitionId: null });
    }
  }, [tweaks?.acquisitionId, veh]);

  useEffectA(() => {
    if (tweaks?.acqTab && drawerV) {
      setT && setT({ acqTab: null });
    }
  }, [tweaks?.acqTab, drawerV?.id]);

  useEffectA(() => {
    if (tweaks?.acqFilter === "overdue") {
      setFilter("overdue");
      setT && setT({ acqFilter: null });
    }
    if (tweaks?.acqFilter === "due_7d") {
      setDueOnly(true);
      setT && setT({ acqFilter: null });
    }
  }, [tweaks?.acqFilter]);

  const exportCsv = (rows = filtered, name = "aquisicoes-northauto.csv") => {
    const header = ["placa", "marca", "modelo", "cliente", "banco", "status", "valor_cliente", "quitacao", "roi", "aquisicao"];
    const lines = rows.map(v => [
      v.plate, v.brand, v.model, v.sellerName || v.owner, v.bank, v.status,
      v.clientValue, v.settlementValue, v.roi, v.acquiredOn,
    ].map(x => `"${String(x ?? "").replace(/"/g, '""')}"`).join(","));
    const blob = new Blob([[header.join(","), ...lines].join("\n")], { type: "text/csv;charset=utf-8" });
    const a = document.createElement("a");
    a.href = URL.createObjectURL(blob);
    a.download = name;
    a.click();
  };

  const exportArchivePdf = () => {
    const rows = archiveRows;
    const esc = (x) => String(x ?? "").replace(/[&<>"']/g, c => ({ "&": "&amp;", "<": "&lt;", ">": "&gt;", '"': "&quot;", "'": "&#39;" }[c]));
    const html = `<!doctype html><html><head><title>Arquivo de aquisições</title>
      <style>body{font-family:Arial,sans-serif;padding:24px;color:#111}h1{font-size:20px}table{width:100%;border-collapse:collapse;font-size:12px}th,td{border-bottom:1px solid #ddd;padding:8px;text-align:left}.mono{font-family:monospace}</style>
      </head><body><h1>Arquivo permanente de aquisições quitadas/vendidas</h1>
      <p>Gerado em ${new Date().toLocaleString("pt-BR")} · ${rows.length} registro(s)</p>
      <table><thead><tr><th>Placa</th><th>Veículo</th><th>Cliente</th><th>Banco</th><th>Status</th><th>Aquisição</th></tr></thead><tbody>
      ${rows.map(v => `<tr><td class="mono">${esc(v.plate)}</td><td>${esc(v.brand)} ${esc(v.model)}</td><td>${esc(v.sellerName || v.owner)}</td><td>${esc(v.bank)}</td><td>${esc(v.status)}</td><td>${esc(v.acquiredOn)}</td></tr>`).join("")}
      </tbody></table></body></html>`;
    const w = window.open("", "_blank");
    if (!w) return alert(lang === "pt" ? "Permita pop-ups para gerar o PDF." : "Allow pop-ups to generate PDF.");
    w.document.write(html);
    w.document.close();
    w.focus();
    w.print();
  };

  const lookupNewPlate = async () => {
    const normalized = (form.plate || "").replace(/[^a-zA-Z0-9]/g, "").toUpperCase();
    if (normalized.length < 7) {
      setLookupMsg(lang === "pt" ? "Informe uma placa válida (7 caracteres)." : "Enter a valid plate.");
      return;
    }
    if (!_acq.lookupPlate) {
      setLookupMsg(lang === "pt" ? "Consulta de placa indisponível." : "Plate lookup unavailable.");
      return;
    }
    setLookupLoading(true);
    setLookupMsg("");
    try {
      const data = await _acq.lookupPlate(normalized);
      const vt = String(data.vehicleType || "").toLowerCase();
      setForm(f => ({
        ...f,
        plate: data.plate || normalized,
        brand: data.brand || f.brand,
        model: data.model || f.model,
        year: String(data.year || data.yearModel || f.year || ""),
        chassis: data.chassi || data.chassis || f.chassis,
        color: data.color || f.color,
        fipe: data.fipe ? String(data.fipe) : f.fipe,
        vehType: vt.includes("moto") ? "moto" : vt.includes("jet") ? "jet" : "car",
      }));
      setLookupMsg(lang === "pt" ? "Dados preenchidos pela consulta de placa." : "Vehicle data filled from plate lookup.");
    } catch (err) {
      setLookupMsg(err.message || (lang === "pt" ? "Falha na consulta." : "Lookup failed."));
    } finally {
      setLookupLoading(false);
    }
  };

  const saveNewAcquisition = async () => {
    if (!form.plate.trim() && !form.brand.trim()) return;
    setSaving(true);
    try {
      const vehicle = {
        plate: form.plate.trim() || "SEM-PLACA",
        brand: form.brand.trim(),
        model: form.model.trim(),
        year: form.year.trim(),
        chassis: form.chassis.trim(),
        color: form.color.trim(),
        purchasePrice: Number(form.price) || 0,
        clientValue: Number(form.price) || 0,
        fipeMin: Number(form.fipe) || 0,
        fipeMax: Number(form.fipe) || 0,
        bank: form.bank.trim() || "—",
        owner: form.brand.trim(),
        status: "in_process",
        parcels: { total: 0, paid: 0, overdue: 0 },
        acquiredOn: new Date().toLocaleDateString("pt-BR"),
        trackerStatus: "inactive",
        maintenance: [],
        createdBy: user?.key || "manual",
        vehType: form.vehType || "car",
      };
      if (_acq.db?.isConfigured()) {
        const saved = await _acq.db.saveAcquisition(vehicle);
        if (saved?.id) {
          await _acq.db.ensureAcquisitionDocumentPlaceholders(saved.id, vehicle.vehType || "car");
          await _acq.db.ensureMaintenancePlaceholders(saved.id, vehicle.vehType || "car", vehicle.extras);
        }
        window.dispatchEvent(new Event("na:acquisitions-changed"));
      } else {
        vehicle.id = "v" + Date.now();
        window.NA.vehicles = [vehicle, ...veh];
      }
      setShowNew(false);
      setForm({ plate: "", brand: "", model: "", year: "", chassis: "", color: "", fipe: "", price: "", bank: "", vehType: "car" });
      setLookupMsg("");
    } catch (err) {
      alert(err.message || String(err));
    } finally {
      setSaving(false);
    }
  };

  const importLocalVehicles = async () => {
    if (!confirm(lang === "pt"
      ? `Importar ${mockCount} veículos do mock para o Supabase? Esta ação é única.`
      : `Import ${mockCount} mock vehicles to Supabase? One-time action.`)) return;
    setImporting(true);
    setImportMsg("");
    try {
      const res = await _acq.db.importLocalVehicles();
      setImportMsg(res.skipped && res.imported === 0
        ? (lang === "pt" ? "Importação já realizada ou tabela não vazia." : "Import already done or table not empty.")
        : (lang === "pt" ? `${res.imported} veículo(s) importado(s).` : `${res.imported} vehicle(s) imported.`));
      window.dispatchEvent(new Event("na:acquisitions-changed"));
    } catch (err) {
      alert(err.message || String(err));
    } finally {
      setImporting(false);
    }
  };

  return (
    <div data-screen-label="Acquisitions">
      <_acq.PageHead icon="archive" title={lang === "pt" ? "Aquisições fechadas" : "Closed acquisitions"}
        subtitle={lang === "pt" ? "Arquivo permanente — veículos adquiridos com contrato e procuração assinados" : "Permanent record — purchased vehicles with signed contract and proxy"}
        right={<div className="row gap-8">
          {canImportMock && mockCount > 0 && (
            <_acq.Button kind="ghost" icon="upload" disabled={importing} onClick={importLocalVehicles}>
              {lang === "pt" ? `Importar mock (${mockCount})` : `Import mock (${mockCount})`}
            </_acq.Button>
          )}
          <_acq.Button kind="default" icon="download" onClick={() => exportCsv(filtered, "aquisicoes-northauto.csv")}>{lang === "pt" ? "Exportar CSV" : "Export CSV"}</_acq.Button>
          <_acq.Button kind="default" icon="file-spreadsheet" onClick={() => exportCsv(archiveRows, "arquivo-aquisicoes-quitadas.csv")}>{lang === "pt" ? "Arquivo CSV" : "Archive CSV"}</_acq.Button>
          <_acq.Button kind="default" icon="file-text" onClick={exportArchivePdf}>{lang === "pt" ? "Arquivo PDF" : "Archive PDF"}</_acq.Button>
          <_acq.Button kind="primary" icon="plus" onClick={() => setShowNew(true)}>{lang === "pt" ? "Nova aquisição" : "New acquisition"}</_acq.Button>
        </div>} />

      {importMsg && <div className="alert success" style={{ marginBottom: 12 }}><div className="body">{importMsg}</div></div>}
      {dueOnly && (
        <div className="alert warning mb-12 row jcsb" style={{ alignItems: "center" }}>
          <div className="body fs-13">{lang === "pt" ? "Filtro: quitações vencendo nos próximos 7 dias" : "Filter: settlements due within 7 days"}</div>
          <_acq.Button kind="ghost" size="sm" onClick={() => setDueOnly(false)}>{lang === "pt" ? "Limpar" : "Clear"}</_acq.Button>
        </div>
      )}
      {(dueSoonRows.length > 0 || oldPendingDocs.length > 0) && (
        <div className="alert warning mb-12">
          <div className="body fs-13">
            {dueSoonRows.length > 0 && (
              <span>{dueSoonRows.length} {lang === "pt" ? "parcela(s) vencendo nos próximos 7 dias" : "installment(s) due within 7 days"}</span>
            )}
            {dueSoonRows.length > 0 && oldPendingDocs.length > 0 && <span> · </span>}
            {oldPendingDocs.length > 0 && (
              <span>{oldPendingDocs.length} {lang === "pt" ? "documento(s) pendente(s) há mais de 7 dias" : "document(s) pending for more than 7 days"}</span>
            )}
          </div>
        </div>
      )}

      <div className="stat-strip" style={{ gridTemplateColumns: "repeat(6, 1fr)", marginBottom: 16 }}>
        <_acq.Stat label={lang === "pt" ? "Total ativos" : "Active total"} value={kpis.active} icon="car" accent="primary" />
        <_acq.Stat label={lang === "pt" ? "Em quitação" : "Settling"} value={kpis.settling} icon="credit-card" accent="warning" />
        <_acq.Stat label={lang === "pt" ? "Quitação atraso" : "Overdue"} value={kpis.overdue} icon="alert-triangle" accent={kpis.overdue ? "error" : ""} />
        <_acq.Stat label={lang === "pt" ? "Estoque pronto" : "Ready stock"} value={kpis.stock} icon="package" accent="success" />
        <_acq.Stat label={lang === "pt" ? "Quitados" : "Settled"} value={kpis.settled} icon="archive" />
        <_acq.Stat label={lang === "pt" ? "Vendidos (30d)" : "Sold (30d)"} value={kpis.soldPeriod} icon="shopping-cart" />
      </div>

      <_acq.Card>
        <_acq.CardBody>
          <div className="row gap-8 mb-12" style={{ flexWrap: "wrap", alignItems: "flex-end" }}>
            <_acq.SearchBox value={q} onChange={setQ} style={{ flex: "1 1 240px" }}
              placeholder={lang === "pt" ? "Placa, cliente, CPF, chassi, banco, modelo…" : "Plate, client, CPF, chassis, bank, model…"} />
            <_acq.Select value={bankFilter} onChange={setBankFilter} style={{ width: 160 }} options={banks} />
            <_acq.Select value={ownerFilter} onChange={setOwnerFilter} style={{ width: 160 }}
              options={[{ value: "all", label: lang === "pt" ? "Responsável" : "Owner" }, ...mentees.map(m => ({ value: m.key, label: m.name }))]} />
            <_acq.Field label={lang === "pt" ? "De" : "From"}><_acq.Input type="date" value={dateFrom} onChange={setDateFrom} /></_acq.Field>
            <_acq.Field label={lang === "pt" ? "Até" : "To"}><_acq.Input type="date" value={dateTo} onChange={setDateTo} /></_acq.Field>
            <_acq.Segmented value={view} onChange={setView} options={[
              { value: "cards", label: lang === "pt" ? "Cards" : "Cards" },
              { value: "list", label: lang === "pt" ? "Lista" : "List" },
            ]} />
          </div>

          <div className="row gap-4 mb-12" style={{ flexWrap: "wrap" }}>
            {ACQ_FILTER_TABS.map(tab => (
              <button key={tab.key} type="button" className={"btn sm " + (filter === tab.key ? "primary" : "default")}
                onClick={() => setFilter(tab.key)}>
                {labels[tab.key]} ({tabCounts[tab.key] || 0})
              </button>
            ))}
          </div>

          <div className="text-muted fs-12">
            {filtered.length} {lang === "pt" ? "registro(s)" : "record(s)"}
            {_acq.db?.isConfigured() && (
              <span className="hint"> · {lang === "pt" ? "Sincronizado com Supabase" : "Synced with Supabase"}</span>
            )}
          </div>
        </_acq.CardBody>
      </_acq.Card>

      {view === "cards" ? (
        <div className="cards-grid mt-16" style={{ gridTemplateColumns: "repeat(auto-fill, minmax(220px, 1fr))" }}>
          {filtered.map(v => <AcquisitionCard key={v.id} v={v} lang={lang} docs={docsByAcq[v.id] || []}
            maintItems={(_acq.maintenanceItemsByAcq || {})[v.id] || []} onOpen={() => setDrawerV(v)} />)}
          {filtered.length === 0 && <div className="hint" style={{ gridColumn: "1 / -1", padding: 24 }}>{lang === "pt" ? "Nenhuma aquisição encontrada." : "No acquisitions found."}</div>}
        </div>
      ) : (
        <_acq.Card className="mt-16">
          <_acq.CardBody>
            <_acq.VehicleTable
              vehicles={filtered}
              columns={acqTableColumns(t, lang)}
              lang={lang}
              t={t}
              onRowClick={setDrawerV}
              selectedId={drawerV?.id}
              empty={<_acq.Empty icon="inbox" title={lang === "pt" ? "Nenhuma aquisição" : "No acquisitions"} />}
            />
          </_acq.CardBody>
        </_acq.Card>
      )}

      <_acq.Modal open={showNew} onClose={() => setShowNew(false)} title={lang === "pt" ? "Nova aquisição manual" : "New manual acquisition"}
        footer={<>
          <_acq.Button kind="ghost" onClick={() => setShowNew(false)}>{t("common_cancel")}</_acq.Button>
          <_acq.Button kind="primary" disabled={saving} onClick={saveNewAcquisition}>{saving ? "…" : t("common_save")}</_acq.Button>
        </>}>
        <div className="hint mb-12">{lang === "pt" ? "Para veículos vindos de oportunidade, use Fechar aquisição na Análise ou CRM." : "For opportunity vehicles, use Close acquisition in Analysis or CRM."}</div>
        <div className="col gap-12">
          <_acq.Field label={t("common_plate")} required>
            <div className="row gap-8">
              <_acq.Input mono value={form.plate} onChange={v => setForm(f => ({ ...f, plate: v }))} />
              <_acq.Button kind="default" icon="search" disabled={lookupLoading} onClick={lookupNewPlate}>
                {lookupLoading ? "…" : (lang === "pt" ? "Consultar" : "Lookup")}
              </_acq.Button>
            </div>
            {lookupMsg && <div className="hint mt-6">{lookupMsg}</div>}
          </_acq.Field>
          <_acq.Field label={t("common_brand")} required><_acq.Input value={form.brand} onChange={v => setForm(f => ({ ...f, brand: v }))} /></_acq.Field>
          <_acq.Field label={t("common_model")} required><_acq.Input value={form.model} onChange={v => setForm(f => ({ ...f, model: v }))} /></_acq.Field>
          <div className="row gap-8">
            <_acq.Field label={lang === "pt" ? "Ano" : "Year"}><_acq.Input mono value={form.year} onChange={v => setForm(f => ({ ...f, year: v }))} /></_acq.Field>
            <_acq.Field label={lang === "pt" ? "Cor" : "Color"}><_acq.Input value={form.color} onChange={v => setForm(f => ({ ...f, color: v }))} /></_acq.Field>
          </div>
          <_acq.Field label="Chassi"><_acq.Input mono value={form.chassis} onChange={v => setForm(f => ({ ...f, chassis: v }))} /></_acq.Field>
          <_acq.Field label={lang === "pt" ? "Tipo" : "Type"}>
            <_acq.Select value={form.vehType} onChange={v => setForm(f => ({ ...f, vehType: v }))}
              options={[
                { value: "car", label: lang === "pt" ? "Carro" : "Car" },
                { value: "moto", label: lang === "pt" ? "Moto" : "Motorcycle" },
                { value: "jet", label: "Jet-Ski" },
              ]} />
          </_acq.Field>
          <_acq.Field label={t("common_bank")}><_acq.Input value={form.bank} onChange={v => setForm(f => ({ ...f, bank: v }))} /></_acq.Field>
          <_acq.Field label="FIPE"><_acq.Input mono type="number" value={form.fipe} onChange={v => setForm(f => ({ ...f, fipe: v }))} /></_acq.Field>
          <_acq.Field label={lang === "pt" ? "Preço de compra" : "Purchase price"} required><_acq.Input mono type="number" value={form.price} onChange={v => setForm(f => ({ ...f, price: v }))} /></_acq.Field>
        </div>
      </_acq.Modal>

      <AcquisitionDrawer open={!!drawerV} vehicle={drawerV} onClose={() => setDrawerV(null)}
        initialTab={tweaks?.acqTab || undefined}
        lang={lang} setT={setT} t={t} onUpdated={() => {
          const fresh = (_acq.vehicles || []).find(v => v.id === drawerV?.id);
          if (fresh) setDrawerV(fresh);
        }} />
    </div>
  );
}

window.NA.AcquisitionDrawer = AcquisitionDrawer;
window.NA.M.acquisitions = ModuleAcquisitions;