// ---------------------------------------------------------------------------
// BulkBar
//
// Per-lane floating action bar. Each Inbox lane has its own BulkBar —
// the bar shows when the lane has a selection and exposes the actions
// appropriate to that lane:
//
//   * rejected       → Re-submit (move back to SUBMITTED)
//   * payer_rejected  → Acknowledge (drop from working surface; SP14)
//   * candidates     → Dismiss (suppress a remit/claim pair)
//   * unmatched      → (no destructive action; just export)
//   * done_today     → (read-only; just export)
//
// Every lane gets the Export CSV action so the operator can ship
// anything actionable to a file for off-system follow-up (appeals,
// re-keying, posting to the billing system of record, etc).
// ---------------------------------------------------------------------------

type LaneKey =
  | "rejected"
  | "payer_rejected"
  | "candidates"
  | "unmatched"
  | "done_today";

export function BulkBar({
  lane,
  count,
  onResubmit,
  onAcknowledge,
  onDismiss,
  onExport,
}: {
  lane: LaneKey;
  count: number;
  onResubmit: () => void;
  onAcknowledge: () => void;
  onDismiss: () => void;
  onExport: () => void;
}) {
  if (count === 0) return null;
  return (
    <div
      className="fixed bottom-6 left-1/2 px-3 py-2.5 mono flex items-center gap-2 z-20 rounded-md"
      style={{
        transform: "translateX(-50%)",
        background: "var(--tt-bg-elev)",
        border: "1px solid var(--tt-amber)",
        color: "var(--tt-ink)",
        fontSize: 11,
        boxShadow:
          "0 0 0 1px hsl(36 88% 56% / 0.15), 0 12px 40px -8px hsl(0 0% 0% / 0.6), inset 0 1px 0 0 hsl(0 0% 100% / 0.04)",
      }}
    >
      <span
        className="tabular-nums flex items-center gap-1.5 px-2 py-0.5 rounded-sm"
        style={{
          color: "var(--tt-bg)",
          background: "var(--tt-amber)",
          fontWeight: 700,
          fontSize: 11,
          letterSpacing: "0.04em",
        }}
      >
        {count}
      </span>
      <span style={{ color: "var(--tt-amber)", letterSpacing: "0.12em", textTransform: "uppercase" }}>
        selected
      </span>

      <span className="mx-1 h-4 w-px" style={{ background: "var(--tt-muted)" }} aria-hidden />

      {lane === "rejected" && (
        <button
          onClick={onResubmit}
          className="px-2.5 py-1 rounded-sm uppercase tracking-[0.12em] transition-colors hover:bg-[color:var(--tt-amber)]/10 focus-visible:outline-none focus-visible:bg-[color:var(--tt-amber)]/10"
          style={{ color: "var(--tt-ink)", fontWeight: 600 }}
        >
          Re-submit ({count})
        </button>
      )}
      {lane === "payer_rejected" && (
        <button
          onClick={onAcknowledge}
          data-testid="payer-rejected-acknowledge"
          className="px-2.5 py-1 rounded-sm uppercase tracking-[0.12em] transition-colors hover:bg-[color:var(--tt-amber)]/10 focus-visible:outline-none focus-visible:bg-[color:var(--tt-amber)]/10"
          style={{ color: "var(--tt-ink)", fontWeight: 600 }}
        >
          Acknowledge ({count})
        </button>
      )}
      {lane === "candidates" && (
        <button
          onClick={onDismiss}
          className="px-2.5 py-1 rounded-sm uppercase tracking-[0.12em] transition-colors hover:bg-[color:var(--tt-amber)]/10 focus-visible:outline-none focus-visible:bg-[color:var(--tt-amber)]/10"
          style={{ color: "var(--tt-ink)", fontWeight: 600 }}
        >
          Dismiss ({count})
        </button>
      )}
      <button
        onClick={onExport}
        className="px-2.5 py-1 rounded-sm uppercase tracking-[0.12em] transition-colors hover:bg-[color:var(--tt-amber)]/10 focus-visible:outline-none focus-visible:bg-[color:var(--tt-amber)]/10"
        style={{ color: "var(--tt-ink)", fontWeight: 600 }}
      >
        Export CSV ({count})
      </button>
    </div>
  );
}