| Epic | Status | Wat is gedaan |

|---------------------|---------------|---------------------|
  | E0: Foundation      | ✅ Afgerond    | Types + DB migratie |
  | E1: Leefgebieden    | ✅ Afgerond    | 3 componenten       |
  | E2: AI Generatie    | ⏳ Nog te doen | -                   |
  | E3: Behandelplan UI | ⏳ Nog te doen | -                   |

  Gemaakte bestanden:
  - lib/types/leefgebieden.ts - 7 domeinen met kleuren/emoji's
  - lib/types/behandelplan.ts - SMART doelen, interventies, Zod schemas
  - components/behandelplan/leefgebieden-form.tsx - Intake formulier
  - components/behandelplan/leefgebieden-scores.tsx - Score weergave
  - components/behandelplan/leefgebieden-badge.tsx - Domain badges
  - components/behandelplan/index.ts - Exports

components/behandelplan/leefgebieden-badge.tsx

@@ -0,0 +1,77 @@
+'use client';
+
+import { Badge } from '@/components/ui/badge';
+import { cn } from '@/lib/utils';
+import { type LifeDomain, LIFE_DOMAIN_META } from '@/lib/types/leefgebieden';
+
+interface LeefgebiedenBadgeProps {
+  domain: LifeDomain;
+  showEmoji?: boolean;
+  size?: 'sm' | 'md' | 'lg';
+  className?: string;
+}
+
+/**
+ * Colored badge for a life domain
+ * Uses the domain's specific color from the meta definition
+ */
+export function LeefgebiedenBadge({
+  domain,
+  showEmoji = true,
+  size = 'md',
+  className,
+}: LeefgebiedenBadgeProps) {
+  const meta = LIFE_DOMAIN_META[domain];
+
+  const sizeClasses = {
+    sm: 'text-xs px-1.5 py-0.5',
+    md: 'text-sm px-2 py-0.5',
+    lg: 'text-base px-3 py-1',
+  };
+
+  return (
+    <Badge
+      className={cn(
+        'font-medium border-0 text-white',
+        sizeClasses[size],
+        className
+      )}
+      style={{ backgroundColor: meta.color }}
+    >
+      {showEmoji && <span className="mr-1">{meta.emoji}</span>}
+      {meta.shortLabel}
+    </Badge>
+  );
+}
+
+interface LeefgebiedenBadgeGroupProps {
+  domains: LifeDomain[];
+  showEmoji?: boolean;
+  size?: 'sm' | 'md' | 'lg';
+  className?: string;
+}
+
+/**
+ * Group of life domain badges
+ */
+export function LeefgebiedenBadgeGroup({
+  domains,
+  showEmoji = true,
+  size = 'sm',
+  className,
+}: LeefgebiedenBadgeGroupProps) {
+  if (domains.length === 0) return null;
+
+  return (
+    <div className={cn('flex flex-wrap gap-1', className)}>
+      {domains.map((domain) => (
+        <LeefgebiedenBadge
+          key={domain}
+          domain={domain}
+          showEmoji={showEmoji}
+          size={size}
+        />
+      ))}
+    </div>
+  );
+}