/* ============================================================
   AfricaMart Admin — Verification / KYC queue
   ============================================================ */
function VerificationModule({ verification, setVerification, toast, confirm }) {
  const { Card, CardHeader, Badge, Btn, SectionHeader, TabBar } = window.ModernTilesDesignSystem_50dd07;
  const [filter, setFilter] = aUseState("Pending");

  const decide = (id, decision) => {
    setVerification(id, decision);
    toast(decision === "approved" ? "Verification approved" : "Verification rejected", decision !== "approved");
  };

  let rows = verification;
  if (filter === "Pending") rows = verification.filter(v => v.status === "pending" || v.status === "review");
  else if (filter === "Approved") rows = verification.filter(v => v.status === "approved");

  const pendingCount = verification.filter(v => v.status === "pending" || v.status === "review").length;

  return React.createElement("div", null,
    React.createElement(SectionHeader, { title: "Verification queue", subtitle: pendingCount + " awaiting decision · KYC & compliance review" }),
    React.createElement(TabBar, { tabs: ["Pending", "Approved", "All"], active: filter, onChange: setFilter }),
    React.createElement("div", { style: { display: "flex", flexDirection: "column", gap: 12 } },
      rows.map(v => React.createElement(Card, { key: v.id },
        React.createElement("div", { style: { padding: "16px 18px", display: "flex", gap: 16, alignItems: "flex-start" } },
          React.createElement("div", { style: { width: 42, height: 42, borderRadius: 10, background: v.kind === "supplier" ? "#F1F7FA" : "#FEF5EF", display: "flex", alignItems: "center", justifyContent: "center", flexShrink: 0 } },
            React.createElement(AdmIcon, { name: v.kind === "supplier" ? "building" : "users", size: 19, color: v.kind === "supplier" ? "#2A4E62" : "#C5622C" })),
          React.createElement("div", { style: { flex: 1, minWidth: 0 } },
            React.createElement("div", { style: { display: "flex", alignItems: "center", gap: 8, flexWrap: "wrap" } },
              React.createElement("span", { style: { fontFamily: "'Outfit',sans-serif", fontSize: 15, fontWeight: 600, color: "#1A1614" } }, v.entity),
              React.createElement(Badge, { status: v.kind === "supplier" ? "info" : "neutral", label: v.kind }),
              React.createElement(Badge, { status: STATUS_BADGE[v.status], label: v.status }),
              React.createElement("span", { style: { fontSize: 11.5, color: "#A09288", display: "inline-flex", alignItems: "center", gap: 4 } }, React.createElement(AdmFlag, { code: v.country, size: 12 }), window.AM.countryByCode[v.country].name)),
            React.createElement("div", { style: { fontSize: 11.5, color: "#857870", marginTop: 5 } }, "Ref " + v.id + " · submitted " + v.submitted),
            // Docs
            React.createElement("div", { style: { display: "flex", gap: 7, flexWrap: "wrap", marginTop: 11 } },
              v.docs.map((d, i) => React.createElement("span", { key: i, style: { display: "inline-flex", alignItems: "center", gap: 5, fontSize: 11.5, color: "#1A6B45", background: "#EDFAF3", padding: "4px 9px", borderRadius: 6, fontWeight: 500 } },
                React.createElement(AdmIcon, { name: "file-text", size: 12 }), d)),
              v.missing.map((d, i) => React.createElement("span", { key: "m" + i, style: { display: "inline-flex", alignItems: "center", gap: 5, fontSize: 11.5, color: "#B91C1C", background: "#FEF2F2", padding: "4px 9px", borderRadius: 6, fontWeight: 500 } },
                React.createElement(AdmIcon, { name: "x", size: 12 }), d + " (missing)")))),
          (v.status === "pending" || v.status === "review") && React.createElement("div", { style: { display: "flex", gap: 8, flexShrink: 0 } },
            React.createElement(Btn, { variant: "muted", size: "sm", onClick: () => confirm({ danger: true, title: "Reject " + v.entity + "?", body: "The applicant will be notified and asked to resubmit. Add a reason in the next step.", confirmLabel: "Reject", icon: "user-x", onConfirm: () => decide(v.id, "rejected") }) }, "Reject"),
            React.createElement(Btn, { variant: "success", size: "sm", onClick: () => decide(v.id, "approved"), disabled: v.missing.length > 0 }, React.createElement(AdmIcon, { name: "check", size: 14 }), "Approve")))))));
}

Object.assign(window, { VerificationModule });
