Separación vista/lógica del wizard de creación de plan

src/components/planes/wizard/WizardControls.tsx

@@ -0,0 +1,47 @@
+import { Button } from '@/components/ui/button'
+
+export function WizardControls({
+  errorMessage,
+  onPrev,
+  onNext,
+  onCreate,
+  disablePrev,
+  disableNext,
+  disableCreate,
+  isLastStep,
+}: {
+  errorMessage?: string | null
+  onPrev: () => void
+  onNext: () => void
+  onCreate: () => void
+  disablePrev: boolean
+  disableNext: boolean
+  disableCreate: boolean
+  isLastStep: boolean
+}) {
+  return (
+    <div className="flex items-center justify-between">
+      <div className="flex-1">
+        {errorMessage && (
+          <span className="text-destructive text-sm font-medium">
+            {errorMessage}
+          </span>
+        )}
+      </div>
+      <div className="flex gap-4">
+        <Button variant="secondary" onClick={onPrev} disabled={disablePrev}>
+          Anterior
+        </Button>
+        {isLastStep ? (
+          <Button onClick={onCreate} disabled={disableCreate}>
+            Crear plan
+          </Button>
+        ) : (
+          <Button onClick={onNext} disabled={disableNext}>
+            Siguiente
+          </Button>
+        )}
+      </div>
+    </div>
+  )
+}