// Eine der drei Auswahlkacheln im Ideen-Verfasser (Wer baut das? / Wie startest du?).
//
// Herausgeschnitten aus views/IdeenView.tsx (1031 Zeilen) beim v3-Umbau P5, Befund B-06.
// Der Inhalt ist UNVERAENDERT — nur die Datei ist neu. So bleibt der Diff pruefbar.

import { Hammer } from "lucide-react"
import { cn } from "@/lib/utils"

export function Wahl({ k, aktiv, onWahl }: {
  k: { id: string; icon: typeof Hammer; titel: string; text: string }
  aktiv: boolean
  onWahl: () => void
}) {
  return (
    <button
      onClick={onWahl}
      className={cn("rounded-xl border p-3 text-left transition-all cursor-pointer",
        aktiv ? "border-primary/60 bg-primary/5" : "border-border/50 hover:border-border")}>
      <div className="flex items-center gap-2">
        <k.icon className={cn("h-4 w-4 shrink-0", aktiv ? "text-primary" : "text-muted-foreground")} />
        <span className="text-xs font-semibold text-foreground">{k.titel}</span>
      </div>
      <p className="mt-1 text-[11px] leading-relaxed text-muted-foreground">{k.text}</p>
    </button>
  )
}