feat: Altersbestätigung (16+) im Buchungsformular

- Neue Pflicht-Checkbox: Mindestalter 16 Jahre
- Direkt unter der AGB-Checkbox platziert
- Validierung beim Absenden des Formulars
- Wird nach erfolgreicher Buchung zurückgesetzt

src/client/components/booking-form.tsx

@@ -11,6 +11,7 @@ export function BookingForm() {
   const [selectedTime, setSelectedTime] = useState("");
   const [notes, setNotes] = useState("");
   const [agbAccepted, setAgbAccepted] = useState(false);
+  const [ageConfirmed, setAgeConfirmed] = useState(false);
   const [inspirationPhoto, setInspirationPhoto] = useState<string>("");
   const [photoPreview, setPhotoPreview] = useState<string>("");
   const [errorMessage, setErrorMessage] = useState<string>("");
@@ -189,6 +190,10 @@ export function BookingForm() {
       setErrorMessage("Bitte bestätige die Kenntnisnahme der Allgemeinen Geschäftsbedingungen.");
       return;
     }
+    if (!ageConfirmed) {
+      setErrorMessage("Bitte bestätige, dass du mindestens 16 Jahre alt bist.");
+      return;
+    }
 
     // Email validation now handled in backend before booking creation
     const appointmentTime = selectedTime;
@@ -223,6 +228,7 @@ export function BookingForm() {
           setSelectedTime("");
           setNotes("");
           setAgbAccepted(false);
+          setAgeConfirmed(false);
           setInspirationPhoto("");
           setPhotoPreview("");
           setErrorMessage("");
@@ -425,7 +431,7 @@ export function BookingForm() {
         </div>
 
         {/* AGB Acceptance */}
-        <div className="bg-gray-50 border border-gray-200 rounded-lg p-4">
+        <div className="bg-gray-50 border border-gray-200 rounded-lg p-4 space-y-4">
           <div className="flex items-start space-x-3">
             <input
               type="checkbox"
@@ -451,6 +457,22 @@ export function BookingForm() {
               </p>
             </div>
           </div>
+          
+          <div className="flex items-start space-x-3">
+            <input
+              type="checkbox"
+              id="age-confirmation"
+              checked={ageConfirmed}
+              onChange={(e) => setAgeConfirmed(e.target.checked)}
+              className="mt-1 h-4 w-4 text-pink-600 focus:ring-pink-500 border-gray-300 rounded"
+              required
+            />
+            <div className="flex-1">
+              <label htmlFor="age-confirmation" className="text-sm font-medium text-gray-700 cursor-pointer">
+                Ich bestätige, dass ich mindestens 16 Jahre alt bin *
+              </label>
+            </div>
+          </div>
         </div>
 
         {/* Error Message */}