feat: add CMS inquiries and group bookings

app/(frontend)/angebote/[slug]/page.tsx

@@ -6,6 +6,7 @@ import { ImagePlaceholder } from "@/components/ImagePlaceholder";
 import { RichText } from "@/components/RichText";
 import { CTA } from "@/components/CTA";
 import { BookingWidget } from "@/components/booking/BookingWidget";
+import { GroupRegistrationForm } from "@/components/GroupRegistrationForm";
 import { getOfferBySlug } from "@/lib/payload/content";
 import { moodForOffer } from "@/lib/angebote";
 import { mediaAlt, mediaUrl } from "@/lib/payload/media";
@@ -23,6 +24,7 @@ import { siteConfig } from "@/lib/site";
 export const dynamic = "force-dynamic";
 
 type Args = { params: Promise<{ slug: string }> };
+const WEEKDAY_LABELS: Record<string, string> = { monday: "Montag", tuesday: "Dienstag", wednesday: "Mittwoch", thursday: "Donnerstag", friday: "Freitag", saturday: "Samstag", sunday: "Sonntag" };
 
 async function resolveOfferOrRedirect(slug: string) {
   const offer = await getOfferBySlug(slug);
@@ -123,7 +125,23 @@ export default async function OfferDetailPage({ params }: Args) {
         </div>
       </Section>
 
-      {offer.bookable ? (
+      {offer.bookingMode === "group" ? (
+        <Section tone="cream">
+          <div className="mx-auto max-w-2xl">
+            <h2 className="mb-3 text-center font-serif text-3xl font-medium text-anouma-plum">Für die Gruppe anmelden</h2>
+            {offer.groupInfo && <p className="mx-auto mb-6 max-w-xl text-center text-base leading-relaxed text-anouma-plum">{offer.groupInfo}</p>}
+            {offer.groupSchedule && (
+              <div className="mb-8 rounded-2xl bg-white p-5 text-sm text-anouma-plum">
+                <p className="font-medium">Fester Termin</p>
+                <p className="mt-1">{offer.groupSchedule.recurrence === "monthly" ? "Monatlich" : "Wöchentlich"}{offer.groupSchedule.weekday ? ` · ${WEEKDAY_LABELS[offer.groupSchedule.weekday] ?? offer.groupSchedule.weekday}` : ""}{offer.groupSchedule.startTime ? ` · ${offer.groupSchedule.startTime}` : ""}{offer.groupSchedule.endTime ? `–${offer.groupSchedule.endTime}` : ""}</p>
+              </div>
+            )}
+            {offer.groupCapacity && <p className="mb-2 text-sm text-anouma-plum/75">Plätze: {offer.groupCapacity}</p>}
+            {offer.registrationDeadline && <p className="mb-6 text-sm text-anouma-plum/75">Anmeldung möglich bis {new Date(offer.registrationDeadline).toLocaleDateString("de-DE")}</p>}
+            <GroupRegistrationForm offerSlug={offer.slug!} />
+          </div>
+        </Section>
+      ) : offer.bookable ? (
         <Section tone="cream">
           <div className="mx-auto max-w-3xl">
             <h2 className="mb-6 text-center font-serif text-3xl font-medium text-anouma-plum">Termin auswählen</h2>