import { WandSparkles } from 'lucide-react'

export default function FlowAssistPage() {
  return (
    <div className="p-6">
      <div className="mb-6">
        <h1 className="font-heading text-2xl font-bold tracking-tight text-foreground">
          <span className="inline-flex items-center gap-2">
            <WandSparkles size={24} style={{ color: '#f472b6' }} />
            Flow Assist
          </span>
        </h1>
        <p className="mt-1 text-sm text-muted-foreground">
          Build flows from natural language — describe what you need and Flow Assist will generate the decision tree or procedural steps.
        </p>
      </div>

      <div className="card-flat p-8 text-center">
        <WandSparkles size={40} className="mx-auto mb-4 text-muted-foreground" />
        <h2 className="font-heading text-lg font-semibold text-foreground mb-2">
          Coming Soon
        </h2>
        <p className="text-sm text-muted-foreground max-w-md mx-auto">
          Flow Assist will be available here as a dedicated conversational flow builder.
          In the meantime, use the AI panel in the Flow Editor to generate flows.
        </p>
      </div>
    </div>
  )
}