@datatechsolutions/ui 2.11.64 → 2.11.66

package/dist/{chunk-ZIBUWOWT.js → chunk-T23YGO4X.js}

@@ -16415,50 +16415,58 @@ var DashboardDemo = ({
     }
   );
 };
+var DEFAULT_THEME = {
+  runButtonGradient: "from-indigo-600 to-violet-600",
+  runButtonShadow: "shadow-indigo-500/20",
+  stepActiveBg: "bg-indigo-500",
+  activeRing: "ring-indigo-500/60",
+  activeEdgeStroke: "#818cf8",
+  completeEdgeStroke: "#10b981",
+  badge: "bg-indigo-500/15 text-indigo-700 dark:text-indigo-300"
+};
 var NODE_TYPE_META = {
-  start: { icon: HeroIcons.PlayIcon, color: "text-emerald-300", bg: "bg-emerald-500/15", glow: "rgba(16,185,129,0.45)" },
-  end: { icon: HeroIcons.CheckCircleIcon, color: "text-emerald-300", bg: "bg-emerald-500/15", glow: "rgba(16,185,129,0.45)" },
-  datasource: { icon: HeroIcons.CircleStackIcon, color: "text-sky-300", bg: "bg-sky-500/15", glow: "rgba(14,165,233,0.45)" },
-  entity: { icon: HeroIcons.RectangleStackIcon, color: "text-sky-300", bg: "bg-sky-500/15", glow: "rgba(14,165,233,0.45)" },
-  http_request: { icon: HeroIcons.CloudIcon, color: "text-cyan-300", bg: "bg-cyan-500/15", glow: "rgba(34,211,238,0.45)" },
-  knowledge_base: { icon: HeroIcons.ServerStackIcon, color: "text-cyan-300", bg: "bg-cyan-500/15", glow: "rgba(34,211,238,0.45)" },
-  agent: { icon: HeroIcons.CpuChipIcon, color: "text-purple-300", bg: "bg-purple-500/15", glow: "rgba(168,85,247,0.5)" },
-  agent_tool: { icon: HeroIcons.BeakerIcon, color: "text-violet-300", bg: "bg-violet-500/15", glow: "rgba(139,92,246,0.5)" },
-  tool: { icon: HeroIcons.BeakerIcon, color: "text-violet-300", bg: "bg-violet-500/15", glow: "rgba(139,92,246,0.5)" },
-  code: { icon: HeroIcons.CodeBracketIcon, color: "text-amber-300", bg: "bg-amber-500/15", glow: "rgba(245,158,11,0.45)" },
-  template_transform: { icon: HeroIcons.DocumentTextIcon, color: "text-amber-300", bg: "bg-amber-500/15", glow: "rgba(245,158,11,0.45)" },
-  if_else: { icon: HeroIcons.BoltIcon, color: "text-orange-300", bg: "bg-orange-500/15", glow: "rgba(251,146,60,0.5)" },
-  question_classifier: { icon: HeroIcons.BoltIcon, color: "text-orange-300", bg: "bg-orange-500/15", glow: "rgba(251,146,60,0.5)" },
-  parameter_extractor: { icon: HeroIcons.AdjustmentsHorizontalIcon, color: "text-orange-300", bg: "bg-orange-500/15", glow: "rgba(251,146,60,0.5)" },
-  variable_aggregator: { icon: HeroIcons.AdjustmentsHorizontalIcon, color: "text-yellow-300", bg: "bg-yellow-500/15", glow: "rgba(234,179,8,0.45)" },
-  variable_assigner: { icon: HeroIcons.AdjustmentsHorizontalIcon, color: "text-yellow-300", bg: "bg-yellow-500/15", glow: "rgba(234,179,8,0.45)" },
-  iteration: { icon: HeroIcons.ArrowPathIcon, color: "text-fuchsia-300", bg: "bg-fuchsia-500/15", glow: "rgba(232,121,249,0.5)" },
-  iteration_start: { icon: HeroIcons.ArrowPathIcon, color: "text-fuchsia-300", bg: "bg-fuchsia-500/15", glow: "rgba(232,121,249,0.5)" },
-  list_operator: { icon: HeroIcons.AdjustmentsHorizontalIcon, color: "text-fuchsia-300", bg: "bg-fuchsia-500/15", glow: "rgba(232,121,249,0.5)" },
-  answer: { icon: HeroIcons.ChartBarIcon, color: "text-emerald-300", bg: "bg-emerald-500/15", glow: "rgba(16,185,129,0.45)" },
-  dashboard_output: { icon: HeroIcons.ChartBarIcon, color: "text-emerald-300", bg: "bg-emerald-500/15", glow: "rgba(16,185,129,0.45)" },
-  rule: { icon: HeroIcons.BoltIcon, color: "text-rose-300", bg: "bg-rose-500/15", glow: "rgba(244,63,94,0.5)" },
-  document_extractor: { icon: HeroIcons.DocumentTextIcon, color: "text-amber-300", bg: "bg-amber-500/15", glow: "rgba(245,158,11,0.45)" },
-  model_provider: { icon: HeroIcons.CpuChipIcon, color: "text-violet-300", bg: "bg-violet-500/15", glow: "rgba(139,92,246,0.5)" },
-  note: { icon: HeroIcons.DocumentTextIcon, color: "text-slate-300", bg: "bg-slate-500/15", glow: "rgba(100,116,139,0.4)" },
-  group: { icon: HeroIcons.RectangleStackIcon, color: "text-slate-300", bg: "bg-slate-500/15", glow: "rgba(100,116,139,0.4)" }
+  start: { icon: HeroIcons.PlayIcon, color: "text-emerald-300", bg: "bg-emerald-500/15", glow: "rgba(16,185,129,0.45)", tag: "start" },
+  end: { icon: HeroIcons.CheckCircleIcon, color: "text-emerald-300", bg: "bg-emerald-500/15", glow: "rgba(16,185,129,0.45)", tag: "end" },
+  datasource: { icon: HeroIcons.CircleStackIcon, color: "text-sky-300", bg: "bg-sky-500/15", glow: "rgba(14,165,233,0.45)", tag: "datasource" },
+  entity: { icon: HeroIcons.RectangleStackIcon, color: "text-sky-300", bg: "bg-sky-500/15", glow: "rgba(14,165,233,0.45)", tag: "entity" },
+  http_request: { icon: HeroIcons.CloudIcon, color: "text-cyan-300", bg: "bg-cyan-500/15", glow: "rgba(34,211,238,0.45)", tag: "http" },
+  knowledge_base: { icon: HeroIcons.ServerStackIcon, color: "text-cyan-300", bg: "bg-cyan-500/15", glow: "rgba(34,211,238,0.45)", tag: "kb" },
+  agent: { icon: HeroIcons.CpuChipIcon, color: "text-purple-300", bg: "bg-purple-500/15", glow: "rgba(168,85,247,0.5)", tag: "agent" },
+  agent_tool: { icon: HeroIcons.BeakerIcon, color: "text-violet-300", bg: "bg-violet-500/15", glow: "rgba(139,92,246,0.5)", tag: "agent.tool" },
+  tool: { icon: HeroIcons.BeakerIcon, color: "text-violet-300", bg: "bg-violet-500/15", glow: "rgba(139,92,246,0.5)", tag: "tool" },
+  code: { icon: HeroIcons.CodeBracketIcon, color: "text-amber-300", bg: "bg-amber-500/15", glow: "rgba(245,158,11,0.45)", tag: "code" },
+  template_transform: { icon: HeroIcons.DocumentTextIcon, color: "text-amber-300", bg: "bg-amber-500/15", glow: "rgba(245,158,11,0.45)", tag: "template" },
+  if_else: { icon: HeroIcons.BoltIcon, color: "text-orange-300", bg: "bg-orange-500/15", glow: "rgba(251,146,60,0.5)", tag: "branch" },
+  question_classifier: { icon: HeroIcons.BoltIcon, color: "text-orange-300", bg: "bg-orange-500/15", glow: "rgba(251,146,60,0.5)", tag: "classifier" },
+  parameter_extractor: { icon: HeroIcons.AdjustmentsHorizontalIcon, color: "text-orange-300", bg: "bg-orange-500/15", glow: "rgba(251,146,60,0.5)", tag: "extractor" },
+  variable_aggregator: { icon: HeroIcons.AdjustmentsHorizontalIcon, color: "text-yellow-300", bg: "bg-yellow-500/15", glow: "rgba(234,179,8,0.45)", tag: "aggregate" },
+  variable_assigner: { icon: HeroIcons.AdjustmentsHorizontalIcon, color: "text-yellow-300", bg: "bg-yellow-500/15", glow: "rgba(234,179,8,0.45)", tag: "assign" },
+  iteration: { icon: HeroIcons.ArrowPathIcon, color: "text-fuchsia-300", bg: "bg-fuchsia-500/15", glow: "rgba(232,121,249,0.5)", tag: "iterate" },
+  iteration_start: { icon: HeroIcons.ArrowPathIcon, color: "text-fuchsia-300", bg: "bg-fuchsia-500/15", glow: "rgba(232,121,249,0.5)", tag: "iterate.start" },
+  list_operator: { icon: HeroIcons.AdjustmentsHorizontalIcon, color: "text-fuchsia-300", bg: "bg-fuchsia-500/15", glow: "rgba(232,121,249,0.5)", tag: "list" },
+  answer: { icon: HeroIcons.ChartBarIcon, color: "text-emerald-300", bg: "bg-emerald-500/15", glow: "rgba(16,185,129,0.45)", tag: "answer" },
+  dashboard_output: { icon: HeroIcons.ChartBarIcon, color: "text-emerald-300", bg: "bg-emerald-500/15", glow: "rgba(16,185,129,0.45)", tag: "dashboard" },
+  rule: { icon: HeroIcons.BoltIcon, color: "text-rose-300", bg: "bg-rose-500/15", glow: "rgba(244,63,94,0.5)", tag: "rule" },
+  document_extractor: { icon: HeroIcons.DocumentTextIcon, color: "text-amber-300", bg: "bg-amber-500/15", glow: "rgba(245,158,11,0.45)", tag: "extract" },
+  model_provider: { icon: HeroIcons.CpuChipIcon, color: "text-violet-300", bg: "bg-violet-500/15", glow: "rgba(139,92,246,0.5)", tag: "model" },
+  note: { icon: HeroIcons.DocumentTextIcon, color: "text-slate-300", bg: "bg-slate-500/15", glow: "rgba(100,116,139,0.4)", tag: "note" },
+  group: { icon: HeroIcons.RectangleStackIcon, color: "text-slate-300", bg: "bg-slate-500/15", glow: "rgba(100,116,139,0.4)", tag: "group" }
 };
-var FALLBACK_META = { icon: HeroIcons.BoltIcon, color: "text-gray-300", bg: "bg-gray-500/15", glow: "rgba(100,116,139,0.4)" };
+var FALLBACK_META = { icon: HeroIcons.BoltIcon, color: "text-gray-300", bg: "bg-gray-500/15", glow: "rgba(100,116,139,0.4)", tag: "node" };
 function getNodeMeta(type) {
   return NODE_TYPE_META[type] ?? FALLBACK_META;
 }
-var NODE_W = 180;
-var NODE_H = 80;
-var PADDING = 24;
 function DepartmentWorkflowDemo({
   workflow,
   stepDurationMs = 1100,
   autoPlay = false,
   className,
   hideHeader = false,
-  onComplete
+  onComplete,
+  theme
 }) {
-  const { graph, steps, title, description, accentBadge = "bg-indigo-500/15 text-indigo-300", completionSummary } = workflow;
+  const t = { ...DEFAULT_THEME, ...theme };
+  const { graph, steps, title, description, accentBadge, completionSummary } = workflow;
   const [stepIndex, setStepIndex] = React12.useState(-1);
   const intervalRef = React12.useRef(null);
   const completedRef = React12.useRef(false);
@@ -16466,6 +16474,20 @@ function DepartmentWorkflowDemo({
   const isIdle = stepIndex === -1;
   const isRunning = stepIndex >= 0 && stepIndex < total - 1;
   const isComplete = stepIndex === total - 1 && total > 0;
+  const columns = React12.useMemo(() => {
+    const stepByNode = /* @__PURE__ */ new Map();
+    steps.forEach((s, idx) => {
+      for (const id of s.nodes) {
+        if (!stepByNode.has(id)) stepByNode.set(id, idx);
+      }
+    });
+    const cols = steps.map(() => []);
+    for (const node2 of graph.nodes) {
+      const idx = stepByNode.get(node2.id);
+      if (idx !== void 0) cols[idx].push(node2);
+    }
+    return cols.map((col, i) => ({ stepIndex: i, nodes: col, label: steps[i]?.label ?? "" })).filter((c) => c.nodes.length > 0);
+  }, [graph.nodes, steps]);
   const activeNodeIds = React12.useMemo(() => {
     if (stepIndex < 0) return /* @__PURE__ */ new Set();
     return new Set(steps[stepIndex]?.nodes ?? []);
@@ -16515,42 +16537,32 @@ function DepartmentWorkflowDemo({
       if (intervalRef.current) clearInterval(intervalRef.current);
     };
   }, [autoPlay, handleRun]);
-  const bounds = React12.useMemo(() => {
-    if (graph.nodes.length === 0) return { width: 800, height: 400 };
-    let maxX = 0;
-    let maxY = 0;
-    for (const node2 of graph.nodes) {
-      if (node2.position.x > maxX) maxX = node2.position.x;
-      if (node2.position.y > maxY) maxY = node2.position.y;
-    }
-    return { width: maxX + NODE_W + PADDING * 2, height: maxY + NODE_H + PADDING * 2 };
-  }, [graph.nodes]);
   const currentStepLabel = stepIndex >= 0 ? steps[stepIndex]?.label : "Ready to run";
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `liquid-surface rounded-2xl overflow-hidden ${className ?? ""}`, children: [
     !hideHeader && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border-b border-white/5 px-5 py-4 flex items-start gap-4", children: [
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 min-w-0", children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("span", { className: `inline-flex items-center gap-1.5 rounded-full px-2.5 py-0.5 text-[10px] font-semibold uppercase tracking-wider ${accentBadge}`, children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("span", { className: `inline-flex items-center gap-1.5 rounded-full px-2.5 py-0.5 text-[10px] font-semibold uppercase tracking-wider ${accentBadge ?? t.badge}`, children: [
           /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.BoltIcon, { className: "h-3 w-3" }),
           "Astrlabe workflow"
         ] }),
-        /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mt-2 text-lg font-bold text-white", children: title }),
-        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-0.5 text-xs text-gray-400", children: description })
+        /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mt-2 text-lg font-bold text-gray-900 dark:text-white", children: title }),
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-0.5 text-xs text-gray-500 dark:text-gray-400", children: description })
       ] }),
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 shrink-0", children: [
         stepIndex >= 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-0.5", children: steps.map((_, index) => /* @__PURE__ */ jsxRuntime.jsx(
           "div",
           {
-            className: `h-1 w-3 rounded-full transition-all duration-500 ${index < stepIndex || isComplete ? "bg-emerald-500" : index === stepIndex ? "bg-indigo-500 animate-pulse" : "bg-white/10"}`
+            className: `h-1 w-3 rounded-full transition-all duration-500 ${index < stepIndex || isComplete ? "bg-emerald-500" : index === stepIndex ? `${t.stepActiveBg} animate-pulse` : "bg-white/10"}`
           },
           index
         )) }),
-        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "max-w-[180px] truncate text-[10px] text-gray-400", children: currentStepLabel }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "max-w-[180px] truncate text-[10px] text-gray-500 dark:text-gray-400", children: currentStepLabel }),
         isIdle ? /* @__PURE__ */ jsxRuntime.jsxs(
           "button",
           {
             type: "button",
             onClick: handleRun,
-            className: "flex items-center gap-1 rounded-lg bg-gradient-to-r from-indigo-600 to-violet-600 px-3 py-1 text-[11px] font-semibold text-white shadow-lg shadow-indigo-500/20 hover:shadow-indigo-500/30 hover:scale-105 active:scale-95 transition-all",
+            className: `flex items-center gap-1 rounded-lg bg-gradient-to-r ${t.runButtonGradient} px-3 py-1 text-[11px] font-semibold text-white shadow-lg ${t.runButtonShadow} hover:scale-105 active:scale-95 transition-all`,
             children: [
               /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.PlayIcon, { className: "h-3 w-3" }),
               " Run"
@@ -16572,7 +16584,7 @@ function DepartmentWorkflowDemo({
           {
             type: "button",
             onClick: handleRun,
-            className: "flex items-center gap-1 rounded-lg border border-white/10 px-3 py-1 text-[11px] font-medium text-gray-300 hover:bg-white/5",
+            className: "flex items-center gap-1 rounded-lg border border-white/10 px-3 py-1 text-[11px] font-medium text-gray-700 dark:text-gray-300 hover:bg-white/5",
             children: [
               /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.ArrowPathIcon, { className: "h-3 w-3" }),
               " Replay"
@@ -16581,80 +16593,74 @@ function DepartmentWorkflowDemo({
         )
       ] })
     ] }),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative overflow-auto p-6", style: { minHeight: bounds.height + PADDING * 2 }, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "overflow-x-auto px-4 py-5", children: [
       /* @__PURE__ */ jsxRuntime.jsx("style", { children: `
-          @keyframes astGlow { 0%, 100% { box-shadow: 0 0 12px var(--glow); } 50% { box-shadow: 0 0 28px var(--glow); } }
-          @keyframes astEdge { to { stroke-dashoffset: -16; } }
+          @keyframes deptGlow { 0%, 100% { box-shadow: 0 0 12px var(--glow); } 50% { box-shadow: 0 0 28px var(--glow); } }
+          @keyframes deptEdge { to { stroke-dashoffset: -16; } }
         ` }),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", style: { width: bounds.width, height: bounds.height }, children: [
-        /* @__PURE__ */ jsxRuntime.jsx("svg", { className: "absolute inset-0 pointer-events-none", width: bounds.width, height: bounds.height, children: graph.edges.map((edge2) => {
-          const source = graph.nodes.find((n) => n.id === edge2.source);
-          const target = graph.nodes.find((n) => n.id === edge2.target);
-          if (!source || !target) return null;
-          const x1 = source.position.x + NODE_W;
-          const y1 = source.position.y + NODE_H / 2;
-          const x2 = target.position.x;
-          const y2 = target.position.y + NODE_H / 2;
-          const midX = (x1 + x2) / 2;
-          const isActive = activeNodeIds.has(edge2.source) || completedNodeIds.has(edge2.source) && (activeNodeIds.has(edge2.target) || completedNodeIds.has(edge2.target));
-          const isComplete2 = completedNodeIds.has(edge2.source) && completedNodeIds.has(edge2.target);
-          const stroke = isComplete2 ? "#10b981" : isActive ? "#818cf8" : "#334155";
-          return /* @__PURE__ */ jsxRuntime.jsxs("g", { children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-stretch gap-0 min-w-full", children: columns.map((col, colIdx) => {
+        const isStepActive = stepIndex === col.stepIndex;
+        const isStepDone = stepIndex > col.stepIndex;
+        const showsConnector = colIdx > 0;
+        return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex shrink-0 items-stretch", children: [
+          showsConnector && /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "36", height: "100", className: "self-center shrink-0", viewBox: "0 0 36 100", children: [
             /* @__PURE__ */ jsxRuntime.jsx(
-              "path",
+              "line",
               {
-                d: `M ${x1} ${y1} C ${midX} ${y1}, ${midX} ${y2}, ${x2} ${y2}`,
-                fill: "none",
-                stroke,
-                strokeWidth: 2,
+                x1: "0",
+                y1: "50",
+                x2: "36",
+                y2: "50",
+                stroke: isStepDone ? t.completeEdgeStroke : isStepActive ? t.activeEdgeStroke : "#334155",
+                strokeWidth: "2",
                 strokeDasharray: "6 4",
-                style: { animation: isActive && !isComplete2 ? "astEdge 0.8s linear infinite" : "none" }
+                style: { animation: isStepActive ? "deptEdge 0.8s linear infinite" : "none" }
               }
             ),
-            /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: x2, cy: y2, r: "3", fill: stroke })
-          ] }, edge2.id);
-        }) }),
-        graph.nodes.map((node2) => {
-          const status = getStatus(node2);
-          const meta = getNodeMeta(node2.type);
-          const statusBorder = status === "running" ? "ring-2 ring-indigo-500/60 scale-[1.04]" : status === "complete" ? "ring-1 ring-emerald-500/40" : "opacity-60";
-          return /* @__PURE__ */ jsxRuntime.jsx(
-            "div",
-            {
-              className: `absolute liquid-surface rounded-2xl px-3 py-2.5 transition-all duration-500 ${statusBorder}`,
-              style: {
-                left: node2.position.x,
-                top: node2.position.y,
-                width: NODE_W,
-                height: NODE_H,
-                ...status === "running" ? { "--glow": meta.glow, animation: "astGlow 1.4s ease-in-out infinite" } : {}
-              },
-              children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start gap-2.5", children: [
-                /* @__PURE__ */ jsxRuntime.jsx("div", { className: `flex h-8 w-8 shrink-0 items-center justify-center rounded-lg ${meta.bg}`, children: /* @__PURE__ */ jsxRuntime.jsx(meta.icon, { className: `h-4 w-4 ${meta.color}` }) }),
-                /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0 flex-1", children: [
-                  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "truncate text-[12px] font-semibold text-white", children: node2.data.label }),
-                  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1 text-[9px] text-gray-500 font-mono", children: [
-                    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", children: node2.type }),
-                    status === "running" && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center gap-0.5 text-indigo-300", children: [
-                      /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.ArrowRightIcon, { className: "h-2.5 w-2.5 animate-pulse" }),
-                      "running"
-                    ] }),
-                    status === "complete" && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center gap-0.5 text-emerald-400", children: [
-                      /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.CheckCircleIcon, { className: "h-2.5 w-2.5" }),
-                      "done"
+            /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "34", cy: "50", r: "3", fill: isStepDone ? t.completeEdgeStroke : isStepActive ? t.activeEdgeStroke : "#334155" })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-[160px] flex-col gap-2 shrink-0", children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-[8px] font-bold uppercase tracking-wider text-gray-400 dark:text-gray-500 text-center", children: [
+              "Step ",
+              col.stepIndex + 1
+            ] }),
+            col.nodes.map((node2) => {
+              const status = getStatus(node2);
+              const meta = getNodeMeta(node2.type);
+              const statusClass = status === "running" ? `scale-[1.04] ring-2 ${t.activeRing}` : status === "complete" ? "ring-1 ring-emerald-500/40" : "opacity-50";
+              return /* @__PURE__ */ jsxRuntime.jsx(
+                "div",
+                {
+                  className: `liquid-surface rounded-xl p-2.5 transition-all duration-500 ${statusClass}`,
+                  style: status === "running" ? { "--glow": meta.glow, animation: "deptGlow 1.4s ease-in-out infinite" } : void 0,
+                  children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
+                    /* @__PURE__ */ jsxRuntime.jsx("div", { className: `flex h-8 w-8 shrink-0 items-center justify-center rounded-lg ${meta.bg}`, children: /* @__PURE__ */ jsxRuntime.jsx(meta.icon, { className: `h-4 w-4 ${meta.color}` }) }),
+                    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0 flex-1", children: [
+                      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "truncate text-[11px] font-semibold text-gray-900 dark:text-white", children: node2.data.label }),
+                      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1 text-[8px] text-gray-500 dark:text-gray-500", children: [
+                        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate font-mono", children: meta.tag }),
+                        status === "running" && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: `flex items-center gap-0.5 ${t.stepActiveBg.replace("bg-", "text-")}`, children: [
+                          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "h-1 w-1 rounded-full bg-current animate-pulse" }),
+                          "ativo"
+                        ] }),
+                        status === "complete" && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center gap-0.5 text-emerald-500", children: [
+                          /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.CheckCircleIcon, { className: "h-2.5 w-2.5" }),
+                          "ok"
+                        ] })
+                      ] })
                     ] })
                   ] })
-                ] })
-              ] })
-            },
-            node2.id
-          );
-        })
-      ] })
+                },
+                node2.id
+              );
+            })
+          ] })
+        ] }, col.stepIndex);
+      }) })
     ] }),
     isComplete && completionSummary && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border-t border-white/5 bg-emerald-500/[0.06] px-5 py-3 flex items-center gap-2", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.CheckCircleIcon, { className: "h-4 w-4 shrink-0 text-emerald-400" }),
-      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[11px] font-semibold text-emerald-300", children: completionSummary })
+      /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.CheckCircleIcon, { className: "h-4 w-4 shrink-0 text-emerald-500" }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[11px] font-semibold text-emerald-700 dark:text-emerald-300", children: completionSummary })
     ] })
   ] });
 }
@@ -16899,6 +16905,160 @@ var customerAnalyticsWorkflow = {
     step("Publishing analytics dashboard\u2026", "dashboard")
   ]
 };
+var payrollWorkflow = {
+  title: "Folha de pagamento \u2014 fechamento eSocial",
+  description: "Ponto \u2192 c\xE1lculos paralelos (FGTS / INSS / IRRF) \u2192 encargos \u2192 S-1200 \u2192 dashboard.",
+  accentBadge: "bg-cyan-500/15 text-cyan-300",
+  completionSummary: "142 holerites processados \xB7 R$ 890k bruto \xB7 eSocial S-1200 transmitido",
+  graph: buildGraph(
+    [
+      node("start", "start", "Fechamento mensal", 0, 120),
+      node("attendance", "datasource", "Buscar ponto", 220, 120),
+      node("fgts", "code", "Calcular FGTS", 460, 10),
+      node("inss", "code", "Calcular INSS", 460, 120),
+      node("irrf", "code", "Calcular IRRF", 460, 230),
+      node("aggregate", "variable_aggregator", "Agregar folha", 700, 120),
+      node("esocial", "template_transform", "Gerar S-1200", 940, 120),
+      node("transmit", "http_request", "Transmitir eSocial", 1180, 120),
+      node("report", "dashboard_output", "Dashboard folha", 1420, 120)
+    ],
+    [
+      edge("start", "attendance"),
+      edge("attendance", "fgts"),
+      edge("attendance", "inss"),
+      edge("attendance", "irrf"),
+      edge("fgts", "aggregate"),
+      edge("inss", "aggregate"),
+      edge("irrf", "aggregate"),
+      edge("aggregate", "esocial"),
+      edge("esocial", "transmit"),
+      edge("transmit", "report")
+    ]
+  ),
+  steps: [
+    step("Iniciando fechamento mensal\u2026", "start"),
+    step("Buscando registros de ponto\u2026", "attendance"),
+    step("Calculando FGTS, INSS e IRRF em paralelo\u2026", "fgts", "inss", "irrf"),
+    step("Agregando folha consolidada\u2026", "aggregate"),
+    step("Gerando evento S-1200\u2026", "esocial"),
+    step("Transmitindo ao eSocial\u2026", "transmit"),
+    step("Publicando dashboard da folha\u2026", "report")
+  ]
+};
+var supportWorkflow = {
+  title: "Atendimento \u2014 ticket com SLA",
+  description: "Ticket \u2192 paralelo (hist\xF3rico do cliente, status do pedido, base de conhecimento) \u2192 classificar \u2192 rascunhar \u2192 revisar \u2192 responder.",
+  accentBadge: "bg-teal-500/15 text-teal-300",
+  completionSummary: "Ticket respondido em 2min \xB7 CSAT esperado 4.8/5 \xB7 SLA cumprido",
+  graph: buildGraph(
+    [
+      node("start", "start", "Ticket #847", 0, 120),
+      node("history", "datasource", "Hist\xF3rico cliente", 220, 10),
+      node("order", "datasource", "Status pedido", 220, 120),
+      node("kb", "knowledge_base", "Base de conhecimento", 220, 230),
+      node("classify", "question_classifier", "Classificar inten\xE7\xE3o", 460, 120),
+      node("gate", "if_else", "Urgente?", 700, 120),
+      node("draft", "agent", "Rascunhar resposta", 940, 120),
+      node("review", "agent", "Revisor humano", 1180, 120),
+      node("send", "http_request", "Enviar resposta", 1420, 120)
+    ],
+    [
+      edge("start", "history"),
+      edge("start", "order"),
+      edge("start", "kb"),
+      edge("history", "classify"),
+      edge("order", "classify"),
+      edge("kb", "classify"),
+      edge("classify", "gate"),
+      edge("gate", "draft"),
+      edge("draft", "review"),
+      edge("review", "send")
+    ]
+  ),
+  steps: [
+    step("Ticket recebido\u2026", "start"),
+    step("Buscando contexto em paralelo\u2026", "history", "order", "kb"),
+    step("Classificando inten\xE7\xE3o e prioridade\u2026", "classify"),
+    step("Avaliando SLA\u2026", "gate"),
+    step("Rascunhando resposta personalizada\u2026", "draft"),
+    step("Revis\xE3o humana (opcional)\u2026", "review"),
+    step("Enviando resposta ao cliente\u2026", "send")
+  ]
+};
+var manufacturingWorkflow = {
+  title: "Produ\xE7\xE3o \u2014 planejamento MRP",
+  description: "Demanda \u2192 BOM \u2192 verificar estoque \u2192 alocar centros de trabalho \u2192 QC \u2192 liberar OPs.",
+  accentBadge: "bg-violet-500/15 text-violet-300",
+  completionSummary: "34 OPs liberadas \xB7 OEE 87% \xB7 3 desvios de QC tratados automaticamente",
+  graph: buildGraph(
+    [
+      node("start", "start", "Trigger MRP semanal", 0, 120),
+      node("demand", "datasource", "Buscar demanda", 220, 120),
+      node("bom", "entity", "Explodir BOM", 460, 120),
+      node("stock", "code", "Checar estoque", 700, 10),
+      node("schedule", "agent", "Alocar centros", 700, 230),
+      node("release", "iteration", "Liberar OPs", 940, 120),
+      node("qc", "agent", "Checkpoint QC", 1180, 120),
+      node("report", "dashboard_output", "Painel produ\xE7\xE3o", 1420, 120)
+    ],
+    [
+      edge("start", "demand"),
+      edge("demand", "bom"),
+      edge("bom", "stock"),
+      edge("bom", "schedule"),
+      edge("stock", "release"),
+      edge("schedule", "release"),
+      edge("release", "qc"),
+      edge("qc", "report")
+    ]
+  ),
+  steps: [
+    step("Disparo semanal do MRP\u2026", "start"),
+    step("Puxando demanda prevista\u2026", "demand"),
+    step("Explodindo lista de materiais\u2026", "bom"),
+    step("Checando estoque e alocando capacidade em paralelo\u2026", "stock", "schedule"),
+    step("Liberando 34 ordens de produ\xE7\xE3o\u2026", "release"),
+    step("Rodando checkpoints de qualidade\u2026", "qc"),
+    step("Publicando painel da produ\xE7\xE3o\u2026", "report")
+  ]
+};
+var logisticsWorkflow = {
+  title: "Log\xEDstica \u2014 roteiriza\xE7\xE3o inteligente",
+  description: "Pedidos \u2192 paralelo (tr\xE2nsito, frota, janelas) \u2192 otimizador \u2192 despacho \u2192 tracking.",
+  accentBadge: "bg-sky-500/15 text-sky-300",
+  completionSummary: "28 entregas roteirizadas \xB7 -12% km \xB7 94% on-time esperado",
+  graph: buildGraph(
+    [
+      node("start", "start", "28 pedidos SP", 0, 120),
+      node("traffic", "http_request", "Tr\xE2nsito tempo real", 220, 10),
+      node("fleet", "datasource", "Frota dispon\xEDvel", 220, 120),
+      node("windows", "datasource", "Janelas de entrega", 220, 230),
+      node("optimize", "agent", "Otimizador de rotas", 460, 120),
+      node("dispatch", "iteration", "Despachar ve\xEDculos", 700, 120),
+      node("notify", "http_request", "Notificar clientes", 940, 120),
+      node("track", "dashboard_output", "Painel de tracking", 1180, 120)
+    ],
+    [
+      edge("start", "traffic"),
+      edge("start", "fleet"),
+      edge("start", "windows"),
+      edge("traffic", "optimize"),
+      edge("fleet", "optimize"),
+      edge("windows", "optimize"),
+      edge("optimize", "dispatch"),
+      edge("dispatch", "notify"),
+      edge("notify", "track")
+    ]
+  ),
+  steps: [
+    step("28 pedidos entraram na fila\u2026", "start"),
+    step("Consultando tr\xE2nsito, frota e janelas em paralelo\u2026", "traffic", "fleet", "windows"),
+    step("Otimizador montando rotas\u2026", "optimize"),
+    step("Despachando ve\xEDculos\u2026", "dispatch"),
+    step("Notificando clientes via WhatsApp\u2026", "notify"),
+    step("Publicando painel de tracking\u2026", "track")
+  ]
+};
 var lgpdWorkflow = {
   title: "LGPD compliance \u2014 privacy sweep",
   description: "Scan audit logs \u2192 detect PII access violations \u2192 remediate \u2192 notify DPO \u2192 report.",
@@ -16934,6 +17094,32 @@ var lgpdWorkflow = {
     step("Filing compliance report\u2026", "report")
   ]
 };
+var DEFAULT_ASSISTANT_THEME = {
+  brandGradient: "from-blue-500 to-purple-600",
+  inputAvatar: "from-blue-500 to-purple-600",
+  inputBorder: "border-indigo-300/40 dark:border-indigo-400/30",
+  inputCursor: "bg-indigo-500",
+  stageActiveBadge: "bg-indigo-500/15 text-indigo-600 dark:text-indigo-300",
+  progressActiveBar: "bg-indigo-500",
+  workflow: {}
+};
+var koriAssistantTheme = {
+  brandGradient: "from-amber-500 to-orange-600",
+  inputAvatar: "from-amber-500 to-orange-600",
+  inputBorder: "border-amber-300/50 dark:border-amber-400/40",
+  inputCursor: "bg-amber-500",
+  stageActiveBadge: "bg-amber-500/15 text-amber-700 dark:text-amber-300",
+  progressActiveBar: "bg-amber-500",
+  workflow: {
+    runButtonGradient: "from-amber-500 to-orange-600",
+    runButtonShadow: "shadow-amber-500/25",
+    stepActiveBg: "bg-amber-500",
+    activeRing: "ring-amber-500/60",
+    activeEdgeStroke: "#f59e0b",
+    completeEdgeStroke: "#10b981",
+    badge: "bg-amber-500/15 text-amber-700 dark:text-amber-300"
+  }
+};
 function DepartmentAssistantDemo({
   flows,
   initialIndex = 0,
@@ -16941,8 +17127,11 @@ function DepartmentAssistantDemo({
   dashboardHoldMs = 1e4,
   typingSpeedMs = 32,
   workflowStepMs = 1050,
+  theme,
+  brandName = "Kori AI Assistant",
   className
 }) {
+  const t = { ...DEFAULT_ASSISTANT_THEME, ...theme, workflow: { ...DEFAULT_ASSISTANT_THEME.workflow, ...theme?.workflow } };
   const [flowIndex, setFlowIndex] = React12.useState(initialIndex);
   const [stage, setStage] = React12.useState("input");
   const [typed, setTyped] = React12.useState("");
@@ -16958,25 +17147,25 @@ function DepartmentAssistantDemo({
         setTyped(flow.prompt.slice(0, i));
       } else {
         clearInterval(interval);
-        const t = setTimeout(() => setStage("workflow"), 700);
-        return () => clearTimeout(t);
+        const timer = setTimeout(() => setStage("workflow"), 700);
+        return () => clearTimeout(timer);
       }
       return void 0;
     }, typingSpeedMs);
     return () => clearInterval(interval);
   }, [stage, flow.prompt, typingSpeedMs]);
   const handleWorkflowComplete = React12.useCallback(() => {
-    const t = setTimeout(() => setStage("dashboard"), 1200);
-    rotateTimerRef.current = t;
+    const timer = setTimeout(() => setStage("dashboard"), 1200);
+    rotateTimerRef.current = timer;
   }, []);
   React12.useEffect(() => {
     if (stage !== "dashboard") return void 0;
     if (!autoRotate) return void 0;
-    const t = setTimeout(() => {
+    const timer = setTimeout(() => {
       setFlowIndex((prev) => (prev + 1) % flows.length);
       setStage("input");
     }, dashboardHoldMs);
-    return () => clearTimeout(t);
+    return () => clearTimeout(timer);
   }, [stage, autoRotate, dashboardHoldMs, flows.length]);
   const handleDepartmentSelect = React12.useCallback((next) => {
     if (rotateTimerRef.current) clearTimeout(rotateTimerRef.current);
@@ -16987,8 +17176,8 @@ function DepartmentAssistantDemo({
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `liquid-surface rounded-3xl overflow-hidden ${className ?? ""}`, children: [
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border-b border-white/5 px-4 py-3 flex flex-wrap items-center gap-2", children: [
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 pr-3", children: [
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex h-7 w-7 items-center justify-center rounded-lg bg-gradient-to-br from-blue-500 to-purple-600", children: /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.CpuChipIcon, { className: "h-4 w-4 text-white" }) }),
-        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-bold text-gray-900 dark:text-white", children: "Kori AI Assistant" })
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: `flex h-7 w-7 items-center justify-center rounded-lg bg-gradient-to-br ${t.brandGradient}`, children: /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.CpuChipIcon, { className: "h-4 w-4 text-white" }) }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-bold text-gray-900 dark:text-white", children: brandName })
       ] }),
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1" }),
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-wrap items-center gap-1.5", children: flows.map((entry, index) => {
@@ -16998,7 +17187,7 @@ function DepartmentAssistantDemo({
           {
             type: "button",
             onClick: () => handleDepartmentSelect(index),
-            className: `group inline-flex items-center gap-1.5 rounded-full px-3 py-1.5 text-[11px] font-semibold transition-all ${isActive ? `bg-gradient-to-r ${entry.accent} text-white shadow-lg shadow-indigo-500/20 scale-105` : "text-gray-600 dark:text-gray-400 hover:bg-white/5 hover:text-gray-900 dark:hover:text-white"}`,
+            className: `group inline-flex items-center gap-1.5 rounded-full px-3 py-1.5 text-[11px] font-semibold transition-all ${isActive ? `bg-gradient-to-r ${entry.accent} text-white shadow-lg scale-105` : "text-gray-600 dark:text-gray-400 hover:bg-white/5 hover:text-gray-900 dark:hover:text-white"}`,
             children: [
               /* @__PURE__ */ jsxRuntime.jsx(entry.icon, { className: "h-3.5 w-3.5" }),
               entry.name
@@ -17009,11 +17198,11 @@ function DepartmentAssistantDemo({
       }) })
     ] }),
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border-b border-white/5 px-6 py-3 flex items-center gap-3 text-[11px]", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(StageChip, { label: "Ask", stageIndex, mine: 0 }),
+      /* @__PURE__ */ jsxRuntime.jsx(StageChip, { label: "Ask", stageIndex, mine: 0, activeBadge: t.stageActiveBadge }),
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-px flex-1 bg-gradient-to-r from-white/10 to-white/5" }),
-      /* @__PURE__ */ jsxRuntime.jsx(StageChip, { label: "Orchestrate", stageIndex, mine: 1 }),
+      /* @__PURE__ */ jsxRuntime.jsx(StageChip, { label: "Orchestrate", stageIndex, mine: 1, activeBadge: t.stageActiveBadge }),
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-px flex-1 bg-gradient-to-r from-white/5 to-white/10" }),
-      /* @__PURE__ */ jsxRuntime.jsx(StageChip, { label: "Deliver", stageIndex, mine: 2 })
+      /* @__PURE__ */ jsxRuntime.jsx(StageChip, { label: "Deliver", stageIndex, mine: 2, activeBadge: t.stageActiveBadge })
     ] }),
     /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative", style: { minHeight: 600 }, children: /* @__PURE__ */ jsxRuntime.jsxs(framerMotion.AnimatePresence, { mode: "wait", children: [
       stage === "input" && /* @__PURE__ */ jsxRuntime.jsx(
@@ -17024,7 +17213,17 @@ function DepartmentAssistantDemo({
           exit: { opacity: 0, y: -12 },
           transition: { duration: 0.45 },
           className: "flex items-center justify-center p-10",
-          children: /* @__PURE__ */ jsxRuntime.jsx(InputStage3, { prompt: typed, department: flow.name, agents: flow.agents })
+          children: /* @__PURE__ */ jsxRuntime.jsx(
+            InputStage3,
+            {
+              prompt: typed,
+              department: flow.name,
+              agents: flow.agents,
+              avatarGradient: t.inputAvatar,
+              borderClass: t.inputBorder,
+              cursorClass: t.inputCursor
+            }
+          )
         },
         `input-${flow.id}`
       ),
@@ -17043,7 +17242,8 @@ function DepartmentAssistantDemo({
               autoPlay: true,
               hideHeader: true,
               stepDurationMs: workflowStepMs,
-              onComplete: handleWorkflowComplete
+              onComplete: handleWorkflowComplete,
+              theme: t.workflow
             },
             `wf-${flow.id}`
           )
@@ -17065,7 +17265,7 @@ function DepartmentAssistantDemo({
     ] }) }),
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between border-t border-white/5 px-5 py-3", children: [
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 text-[11px] text-gray-500 dark:text-gray-400", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.BoltIcon, { className: "h-3.5 w-3.5 text-indigo-500" }),
+        /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.BoltIcon, { className: `h-3.5 w-3.5 ${t.progressActiveBar.replace("bg-", "text-")}` }),
         /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "font-medium", children: [
           stage === "input" && "Usu\xE1rio envia um pedido ao assistente\u2026",
           stage === "workflow" && "Astrlabe orquestrando agentes e datasources\u2026",
@@ -17075,20 +17275,20 @@ function DepartmentAssistantDemo({
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-1", children: flows.map((entry, index) => /* @__PURE__ */ jsxRuntime.jsx(
         "span",
         {
-          className: `h-1 rounded-full transition-all duration-500 ${index === flowIndex ? "w-8 bg-indigo-500" : "w-1.5 bg-gray-300 dark:bg-white/10"}`
+          className: `h-1 rounded-full transition-all duration-500 ${index === flowIndex ? `w-8 ${t.progressActiveBar}` : "w-1.5 bg-gray-300 dark:bg-white/10"}`
         },
         entry.id
       )) })
     ] })
   ] });
 }
-function StageChip({ label, stageIndex, mine }) {
+function StageChip({ label, stageIndex, mine, activeBadge }) {
   const isActive = stageIndex === mine;
   const isDone = stageIndex > mine;
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
-      className: `inline-flex items-center gap-1.5 rounded-full px-2.5 py-0.5 font-semibold transition-colors ${isActive ? "bg-indigo-500/15 text-indigo-600 dark:text-indigo-300" : isDone ? "bg-emerald-500/10 text-emerald-600 dark:text-emerald-300" : "bg-white/5 text-gray-500 dark:text-gray-500"}`,
+      className: `inline-flex items-center gap-1.5 rounded-full px-2.5 py-0.5 font-semibold transition-colors ${isActive ? activeBadge : isDone ? "bg-emerald-500/10 text-emerald-600 dark:text-emerald-300" : "bg-white/5 text-gray-500 dark:text-gray-500"}`,
       children: [
         isDone ? /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.CheckCircleIcon, { className: "h-3.5 w-3.5" }) : isActive ? /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.BoltIcon, { className: "h-3.5 w-3.5 animate-pulse" }) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "h-1.5 w-1.5 rounded-full bg-current" }),
         label
@@ -17096,10 +17296,17 @@ function StageChip({ label, stageIndex, mine }) {
     }
   );
 }
-function InputStage3({ prompt, department, agents }) {
+function InputStage3({
+  prompt,
+  department,
+  agents,
+  avatarGradient,
+  borderClass,
+  cursorClass
+}) {
   return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full max-w-2xl", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rounded-2xl border border-white/10 bg-white/70 dark:bg-zinc-900/70 p-8 shadow-2xl backdrop-blur-sm", children: [
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-6 flex items-center gap-3", children: [
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-12 w-12 rounded-xl bg-gradient-to-br from-blue-500 to-purple-600 flex items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.SparklesIcon, { className: "h-6 w-6 text-white" }) }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: `h-12 w-12 rounded-xl bg-gradient-to-br ${avatarGradient} flex items-center justify-center`, children: /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.SparklesIcon, { className: "h-6 w-6 text-white" }) }),
       /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
         /* @__PURE__ */ jsxRuntime.jsxs("h3", { className: "text-base font-bold text-gray-900 dark:text-white", children: [
           "Assistente \u2014 ",
@@ -17108,17 +17315,17 @@ function InputStage3({ prompt, department, agents }) {
         /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-gray-500 dark:text-gray-400", children: "Digite um pedido e veja os agentes atuarem." })
       ] })
     ] }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rounded-xl border-2 border-indigo-300/40 bg-indigo-50/50 dark:border-indigo-400/30 dark:bg-indigo-500/5 p-4 min-h-[120px]", children: /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-base font-medium text-gray-900 dark:text-white", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: `rounded-xl border-2 ${borderClass} bg-white/40 dark:bg-white/[0.02] p-4 min-h-[120px]`, children: /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-base font-medium text-gray-900 dark:text-white", children: [
       prompt,
-      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-1 inline-block w-0.5 h-5 bg-indigo-500 animate-pulse" })
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: `ml-1 inline-block w-0.5 h-5 ${cursorClass} animate-pulse` })
     ] }) }),
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-4 flex items-center gap-2 text-xs text-gray-500 dark:text-gray-400", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.BoltIcon, { className: "h-3.5 w-3.5 text-indigo-500" }),
+      /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.BoltIcon, { className: `h-3.5 w-3.5 ${cursorClass.replace("bg-", "text-")}` }),
       "Agentes prontos:",
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-wrap gap-1.5", children: agents.map((agent) => /* @__PURE__ */ jsxRuntime.jsx(
         "span",
         {
-          className: "inline-flex items-center rounded-full border border-indigo-200 bg-indigo-50 px-2 py-0.5 text-[10px] font-semibold text-indigo-700 dark:border-indigo-500/30 dark:bg-indigo-500/10 dark:text-indigo-300",
+          className: "inline-flex items-center rounded-full border border-white/10 bg-white/60 dark:bg-white/[0.04] px-2 py-0.5 text-[10px] font-semibold text-gray-700 dark:text-gray-200",
           children: agent
         },
         agent
@@ -25091,14 +25298,18 @@ exports.isValidThailandProvince = isValidThailandProvince;
 exports.isValidTurkeyProvince = isValidTurkeyProvince;
 exports.isValidUKNation = isValidUKNation;
 exports.isValidUsState = isValidUsState;
+exports.koriAssistantTheme = koriAssistantTheme;
 exports.koriDepartmentFlows = koriDepartmentFlows;
 exports.lgpdWorkflow = lgpdWorkflow;
 exports.listItem = listItem;
 exports.listItemReduced = listItemReduced;
+exports.logisticsWorkflow = logisticsWorkflow;
+exports.manufacturingWorkflow = manufacturingWorkflow;
 exports.marketingWorkflow = marketingWorkflow;
 exports.notificationBanner = notificationBanner;
 exports.notificationBannerReduced = notificationBannerReduced;
 exports.pageControlDot = pageControlDot;
+exports.payrollWorkflow = payrollWorkflow;
 exports.prefersReducedMotion = prefersReducedMotion;
 exports.registerCountry = registerCountry;
 exports.registerSubdivisionTheme = registerSubdivisionTheme;
@@ -25116,6 +25327,7 @@ exports.slideUp = slideUp;
 exports.springPresets = springPresets;
 exports.springPresetsReduced = springPresetsReduced;
 exports.staggerContainer = staggerContainer;
+exports.supportWorkflow = supportWorkflow;
 exports.swipeActionThreshold = swipeActionThreshold;
 exports.swipeConstraints = swipeConstraints;
 exports.useGeoMapState = useGeoMapState;
@@ -25125,5 +25337,5 @@ exports.usePullToRefresh = usePullToRefresh;
 exports.validateDashboardSpec = validateDashboardSpec;
 exports.xScale = xScale;
 exports.yScale = yScale;
-//# sourceMappingURL=chunk-ZIBUWOWT.js.map
-//# sourceMappingURL=chunk-ZIBUWOWT.js.map
+//# sourceMappingURL=chunk-T23YGO4X.js.map
+//# sourceMappingURL=chunk-T23YGO4X.js.map