export function SegmentedGroup({ options, value, onChange }) {
return (
<div className="inline-flex rounded-lg border border-slate-200 bg-slate-100 p-1">
{options.map((opt) => (
<button
key={opt}
onClick={() => onChange(opt)}
className={`rounded-md px-4 py-1.5 text-sm font-medium transition
${value === opt ? "bg-white shadow text-slate-900" : "text-slate-500 hover:text-slate-700"}`}
>
{opt}
</button>
))}
</div>
);
}