feat: Equipment-System, Buchungsbearbeitung, Kundenadresse, LexOffice-Fix

- Vintage Modell hinzugefuegt
- Equipment Multi-Select (Neue Buchung + Bearbeitung)
- Kundenadresse in Formularen
- Bearbeiten-Seite fuer Buchungen
- Abbau-Zeiten in Formularen und Uebersicht
- Vertrag PDF nur bei Privatkunden
- LexOffice Kontakt-Erstellung Fix (BUSINESS)
- Zurueck-Pfeil auf Touren-Seite

app/api/admin/sync-all-bookings/route.ts

@@ -0,0 +1,87 @@
+import { NextRequest, NextResponse } from 'next/server';
+import { getServerSession } from 'next-auth';
+import { authOptions } from '@/lib/auth';
+import { prisma } from '@/lib/prisma';
+import { nextcloudCalendar } from '@/lib/nextcloud-calendar';
+
+export async function POST(request: NextRequest) {
+  try {
+    const session = await getServerSession(authOptions);
+
+    if (!session || session.user.role !== 'ADMIN') {
+      return NextResponse.json({ error: 'Unauthorized' }, { status: 401 });
+    }
+
+    console.log('🔄 Synchronisiere bestehende Buchungen mit Nextcloud...\n');
+
+    // Hole alle bestätigten Buchungen
+    const bookings = await prisma.booking.findMany({
+      where: {
+        status: {
+          in: ['RESERVED', 'CONFIRMED'],
+        },
+      },
+      include: {
+        location: true,
+        photobox: true,
+      },
+      orderBy: {
+        eventDate: 'asc',
+      },
+    });
+
+    console.log(`📊 Gefunden: ${bookings.length} Buchungen`);
+
+    if (bookings.length === 0) {
+      return NextResponse.json({
+        success: true,
+        message: 'Keine Buchungen zum Synchronisieren gefunden.',
+        synced: 0,
+        failed: 0,
+        total: 0,
+      });
+    }
+
+    let synced = 0;
+    let failed = 0;
+    const errors: any[] = [];
+
+    for (const booking of bookings) {
+      try {
+        console.log(`📅 Synchronisiere: ${booking.bookingNumber} - ${booking.customerName}`);
+        
+        await nextcloudCalendar.syncBookingToCalendar(booking);
+        synced++;
+        console.log(`   ✅ Erfolgreich!`);
+      } catch (error: any) {
+        failed++;
+        console.error(`   ❌ Fehler: ${error.message}`);
+        errors.push({
+          bookingNumber: booking.bookingNumber,
+          customerName: booking.customerName,
+          error: error.message,
+        });
+      }
+    }
+
+    console.log('─'.repeat(50));
+    console.log(`✅ Erfolgreich synchronisiert: ${synced}`);
+    console.log(`❌ Fehlgeschlagen: ${failed}`);
+    console.log(`📊 Gesamt: ${bookings.length}`);
+
+    return NextResponse.json({
+      success: true,
+      synced,
+      failed,
+      total: bookings.length,
+      errors: errors.length > 0 ? errors : undefined,
+    });
+
+  } catch (error: any) {
+    console.error('❌ Fehler beim Synchronisieren:', error);
+    return NextResponse.json(
+      { error: error.message || 'Failed to sync bookings' },
+      { status: 500 }
+    );
+  }
+}

app/api/admin/sync-emails/route.ts

@@ -0,0 +1,108 @@
+import { NextRequest, NextResponse } from 'next/server';
+import { getServerSession } from 'next-auth';
+import { authOptions } from '@/lib/auth';
+import { emailSyncService } from '@/lib/email-sync';
+import { prisma } from '@/lib/prisma';
+
+export async function POST(request: NextRequest) {
+  try {
+    const session = await getServerSession(authOptions);
+
+    if (!session || session.user.role !== 'ADMIN') {
+      return NextResponse.json({ error: 'Unauthorized' }, { status: 401 });
+    }
+
+    const { locationId } = await request.json();
+
+    if (locationId) {
+      // Sync specific location
+      console.log(`🔄 Starte E-Mail-Sync für Location: ${locationId}`);
+      const result = await emailSyncService.syncLocationEmails(locationId);
+      
+      return NextResponse.json({
+        success: result.success,
+        location: locationId,
+        newEmails: result.newEmails,
+        newBookings: result.newBookings,
+        errors: result.errors,
+      });
+    } else {
+      // Sync all locations
+      console.log('🔄 Starte E-Mail-Sync für alle Locations...');
+      
+      const locations = await prisma.location.findMany({
+        where: { emailSyncEnabled: true },
+        select: { id: true, name: true },
+      });
+
+      const results = [];
+      
+      for (const location of locations) {
+        console.log(`📍 Sync: ${location.name}`);
+        const result = await emailSyncService.syncLocationEmails(location.id);
+        results.push({
+          locationId: location.id,
+          locationName: location.name,
+          ...result,
+        });
+      }
+
+      const totalNewEmails = results.reduce((sum, r) => sum + r.newEmails, 0);
+      const totalNewBookings = results.reduce((sum, r) => sum + r.newBookings, 0);
+
+      return NextResponse.json({
+        success: true,
+        totalLocations: locations.length,
+        totalNewEmails,
+        totalNewBookings,
+        results,
+      });
+    }
+  } catch (error: any) {
+    console.error('❌ E-Mail-Sync Fehler:', error);
+    return NextResponse.json(
+      { error: error.message || 'E-Mail-Sync fehlgeschlagen' },
+      { status: 500 }
+    );
+  }
+}
+
+export async function GET(request: NextRequest) {
+  try {
+    const session = await getServerSession(authOptions);
+
+    if (!session || session.user.role !== 'ADMIN') {
+      return NextResponse.json({ error: 'Unauthorized' }, { status: 401 });
+    }
+
+    // Get sync status for all locations
+    const locations = await prisma.location.findMany({
+      select: {
+        id: true,
+        name: true,
+        slug: true,
+        emailSyncEnabled: true,
+        lastEmailSync: true,
+        imapHost: true,
+        imapUser: true,
+      },
+    });
+
+    const status = locations.map(loc => ({
+      id: loc.id,
+      name: loc.name,
+      slug: loc.slug,
+      syncEnabled: loc.emailSyncEnabled,
+      configured: !!(loc.imapHost && loc.imapUser),
+      lastSync: loc.lastEmailSync,
+    }));
+
+    return NextResponse.json({ locations: status });
+  } catch (error: any) {
+    console.error('❌ Fehler beim Abrufen des Sync-Status:', error);
+    return NextResponse.json(
+      { error: error.message || 'Fehler beim Abrufen des Status' },
+      { status: 500 }
+    );
+  }
+}

app/api/admin/test-automation/route.ts

@@ -0,0 +1,96 @@
+import { NextRequest, NextResponse } from 'next/server';
+import { getServerSession } from 'next-auth';
+import { authOptions } from '@/lib/auth';
+import { bookingAutomationService } from '@/lib/booking-automation';
+import { prisma } from '@/lib/prisma';
+
+export async function POST(request: NextRequest) {
+  try {
+    const session = await getServerSession(authOptions);
+
+    if (!session || session.user.role !== 'ADMIN') {
+      return NextResponse.json({ error: 'Unauthorized' }, { status: 401 });
+    }
+
+    const { bookingId } = await request.json();
+
+    if (!bookingId) {
+      return NextResponse.json({ error: 'bookingId required' }, { status: 400 });
+    }
+
+    console.log(`🤖 Starte automatische Aktionen für Buchung: ${bookingId}`);
+
+    const result = await bookingAutomationService.runPostBookingActions(bookingId);
+
+    return NextResponse.json({
+      success: true,
+      emailSent: result.emailSent,
+      calendarSynced: result.calendarSynced,
+      lexofficeCreated: result.lexofficeCreated,
+      contractGenerated: result.contractGenerated,
+      errors: result.errors,
+    });
+
+  } catch (error: any) {
+    console.error('❌ Automation Fehler:', error);
+    return NextResponse.json(
+      { error: error.message || 'Automation fehlgeschlagen' },
+      { status: 500 }
+    );
+  }
+}
+
+// GET: Hole neueste Buchung und teste Automation
+export async function GET(request: NextRequest) {
+  try {
+    const session = await getServerSession(authOptions);
+
+    if (!session || session.user.role !== 'ADMIN') {
+      return NextResponse.json({ error: 'Unauthorized' }, { status: 401 });
+    }
+
+    // Hole neueste Buchung
+    const latestBooking = await prisma.booking.findFirst({
+      orderBy: { createdAt: 'desc' },
+      select: {
+        id: true,
+        bookingNumber: true,
+        customerName: true,
+        customerEmail: true,
+        eventDate: true,
+        calendarSynced: true,
+      },
+    });
+
+    if (!latestBooking) {
+      return NextResponse.json({ error: 'Keine Buchung gefunden' }, { status: 404 });
+    }
+
+    console.log(`🤖 Teste Automation für: ${latestBooking.bookingNumber}`);
+
+    const result = await bookingAutomationService.runPostBookingActions(latestBooking.id);
+
+    return NextResponse.json({
+      success: true,
+      booking: {
+        id: latestBooking.id,
+        bookingNumber: latestBooking.bookingNumber,
+        customerName: latestBooking.customerName,
+        customerEmail: latestBooking.customerEmail,
+        eventDate: latestBooking.eventDate,
+      },
+      emailSent: result.emailSent,
+      calendarSynced: result.calendarSynced,
+      lexofficeCreated: result.lexofficeCreated,
+      contractGenerated: result.contractGenerated,
+      errors: result.errors,
+    });
+
+  } catch (error: any) {
+    console.error('❌ Test Automation Fehler:', error);
+    return NextResponse.json(
+      { error: error.message || 'Test fehlgeschlagen' },
+      { status: 500 }
+    );
+  }
+}

app/api/bookings/[id]/confirm/route.ts

@@ -0,0 +1,175 @@
+import { NextRequest, NextResponse } from 'next/server';
+import { getServerSession } from 'next-auth';
+import { authOptions } from '@/lib/auth';
+import { prisma } from '@/lib/prisma';
+import { lexofficeService } from '@/lib/lexoffice';
+import { nextcloudCalendar } from '@/lib/nextcloud-calendar';
+
+export async function POST(
+  request: NextRequest,
+  { params }: { params: { id: string } }
+) {
+  try {
+    const session = await getServerSession(authOptions);
+
+    if (!session || session.user.role !== 'ADMIN') {
+      return NextResponse.json({ error: 'Unauthorized' }, { status: 401 });
+    }
+
+    const bookingId = params.id;
+
+    const booking = await prisma.booking.findUnique({
+      where: { id: bookingId },
+      include: {
+        location: true,
+        photobox: true,
+        bookingEquipment: {
+          include: {
+            equipment: true,
+          },
+        },
+      },
+    });
+
+    if (!booking) {
+      return NextResponse.json(
+        { error: 'Buchung nicht gefunden' },
+        { status: 404 }
+      );
+    }
+
+    if (booking.status === 'CONFIRMED') {
+      return NextResponse.json(
+        { error: 'Buchung ist bereits bestätigt' },
+        { status: 400 }
+      );
+    }
+
+    if (!booking.contractSigned) {
+      return NextResponse.json(
+        { error: 'Vertrag muss zuerst unterschrieben werden' },
+        { status: 400 }
+      );
+    }
+
+    console.log(`🔄 Bestätige Buchung ${booking.bookingNumber}...`);
+
+    let lexofficeConfirmationId = null;
+
+    if (booking.lexofficeContactId) {
+      try {
+        console.log('   💼 Erstelle LexOffice Auftragsbestätigung...');
+        
+        lexofficeConfirmationId = await lexofficeService.createConfirmationFromBooking(
+          booking,
+          booking.lexofficeContactId
+        );
+        
+        console.log(`   ✅ Auftragsbestätigung erstellt: ${lexofficeConfirmationId}`);
+      } catch (error: any) {
+        console.error('   ❌ LexOffice Fehler:', error.message);
+      }
+    }
+
+    const updatedBooking = await prisma.booking.update({
+      where: { id: bookingId },
+      data: {
+        status: 'CONFIRMED',
+        lexofficeConfirmationId,
+        confirmationSentAt: new Date(),
+      },
+    });
+
+    try {
+      console.log('   📅 Update Nextcloud Kalender...');
+      await nextcloudCalendar.syncBookingToCalendar(updatedBooking);
+      console.log('   ✅ Kalender aktualisiert');
+    } catch (error: any) {
+      console.error('   ❌ Kalender-Update Fehler:', error.message);
+    }
+
+    await prisma.notification.create({
+      data: {
+        type: 'BOOKING_CONFIRMED',
+        title: 'Buchung bestätigt',
+        message: `Buchung ${booking.bookingNumber} für ${booking.customerName} wurde von Admin bestätigt.`,
+        metadata: {
+          bookingId: booking.id,
+          bookingNumber: booking.bookingNumber,
+          lexofficeConfirmationId,
+        },
+      },
+    });
+
+    console.log(`✅ Buchung bestätigt: ${booking.bookingNumber}`);
+
+    return NextResponse.json({
+      success: true,
+      booking: {
+        id: updatedBooking.id,
+        bookingNumber: updatedBooking.bookingNumber,
+        status: updatedBooking.status,
+        confirmationSentAt: updatedBooking.confirmationSentAt,
+        lexofficeConfirmationId: updatedBooking.lexofficeConfirmationId,
+      },
+    });
+
+  } catch (error: any) {
+    console.error('❌ Bestätigungs-Fehler:', error);
+    return NextResponse.json(
+      { error: error.message || 'Bestätigung fehlgeschlagen' },
+      { status: 500 }
+    );
+  }
+}
+
+export async function GET(
+  request: NextRequest,
+  { params }: { params: { id: string } }
+) {
+  try {
+    const session = await getServerSession(authOptions);
+
+    if (!session || session.user.role !== 'ADMIN') {
+      return NextResponse.json({ error: 'Unauthorized' }, { status: 401 });
+    }
+
+    const bookingId = params.id;
+
+    const booking = await prisma.booking.findUnique({
+      where: { id: bookingId },
+      select: {
+        id: true,
+        bookingNumber: true,
+        status: true,
+        contractSigned: true,
+        contractSignedAt: true,
+        confirmationSentAt: true,
+        lexofficeContactId: true,
+        lexofficeOfferId: true,
+        lexofficeConfirmationId: true,
+      },
+    });
+
+    if (!booking) {
+      return NextResponse.json(
+        { error: 'Buchung nicht gefunden' },
+        { status: 404 }
+      );
+    }
+
+    const canConfirm = booking.status !== 'CONFIRMED' && booking.contractSigned;
+
+    return NextResponse.json({ 
+      booking,
+      canConfirm,
+    });
+
+  } catch (error: any) {
+    console.error('❌ Buchungs-Status Fehler:', error);
+    return NextResponse.json(
+      { error: error.message || 'Fehler beim Abrufen des Status' },
+      { status: 500 }
+    );
+  }
+}

app/api/bookings/[id]/confirmation-pdf/route.ts

@@ -0,0 +1,54 @@
+import { NextRequest, NextResponse } from 'next/server';
+import { getServerSession } from 'next-auth';
+import { authOptions } from '@/lib/auth';
+import { prisma } from '@/lib/prisma';
+import { lexofficeService } from '@/lib/lexoffice';
+
+export async function GET(
+  request: NextRequest,
+  { params }: { params: { id: string } }
+) {
+  try {
+    const session = await getServerSession(authOptions);
+
+    if (!session || session.user.role !== 'ADMIN') {
+      return NextResponse.json({ error: 'Unauthorized' }, { status: 401 });
+    }
+
+    const bookingId = params.id;
+
+    const booking = await prisma.booking.findUnique({
+      where: { id: bookingId },
+      select: {
+        id: true,
+        bookingNumber: true,
+        lexofficeConfirmationId: true,
+      },
+    });
+
+    if (!booking) {
+      return NextResponse.json({ error: 'Buchung nicht gefunden' }, { status: 404 });
+    }
+
+    if (!booking.lexofficeConfirmationId) {
+      return NextResponse.json({ error: 'Keine Auftragsbestätigung vorhanden' }, { status: 404 });
+    }
+
+    const pdfBuffer = await lexofficeService.getInvoicePDF(booking.lexofficeConfirmationId);
+
+    return new NextResponse(pdfBuffer, {
+      status: 200,
+      headers: {
+        'Content-Type': 'application/pdf',
+        'Content-Disposition': `attachment; filename="Auftragsbestaetigung_${booking.bookingNumber}.pdf"`,
+      },
+    });
+
+  } catch (error: any) {
+    console.error('❌ PDF-Download Fehler:', error);
+    return NextResponse.json(
+      { error: error.message || 'PDF-Download fehlgeschlagen' },
+      { status: 500 }
+    );
+  }
+}

app/api/bookings/[id]/contract-pdf/route.ts

@@ -0,0 +1,73 @@
+import { NextRequest, NextResponse } from 'next/server';
+import { getServerSession } from 'next-auth';
+import { authOptions } from '@/lib/auth';
+import { prisma } from '@/lib/prisma';
+import { generateContractFromTemplate } from '@/lib/pdf-template-service';
+
+export async function GET(
+  request: NextRequest,
+  { params }: { params: { id: string } }
+) {
+  try {
+    const session = await getServerSession(authOptions);
+
+    if (!session || session.user.role !== 'ADMIN') {
+      return NextResponse.json({ error: 'Unauthorized' }, { status: 401 });
+    }
+
+    const bookingId = params.id;
+
+    const booking = await prisma.booking.findUnique({
+      where: { id: bookingId },
+      include: {
+        location: true,
+        photobox: true,
+      },
+    });
+
+    if (!booking) {
+      return NextResponse.json({ error: 'Buchung nicht gefunden' }, { status: 404 });
+    }
+
+    let priceConfig = null;
+    if (booking.photobox?.model && booking.locationId) {
+      priceConfig = await prisma.priceConfig.findUnique({
+        where: {
+          locationId_model: {
+            locationId: booking.locationId,
+            model: booking.photobox.model,
+          },
+        },
+      });
+    }
+
+    const bookingWithPriceConfig = {
+      ...booking,
+      priceConfig,
+    };
+
+    const signatureData = booking.contractSignedOnline ? booking.contractSignatureData : undefined;
+
+    const pdfBuffer = await generateContractFromTemplate(
+      bookingWithPriceConfig,
+      booking.location,
+      booking.photobox,
+      signatureData
+    );
+
+    return new NextResponse(pdfBuffer, {
+      status: 200,
+      headers: {
+        'Content-Type': 'application/pdf',
+        'Content-Disposition': `attachment; filename="Mietvertrag_${booking.bookingNumber}.pdf"`,
+      },
+    });
+
+  } catch (error: any) {
+    console.error('❌ Contract-PDF-Download Fehler:', error);
+    return NextResponse.json(
+      { error: error.message || 'PDF-Download fehlgeschlagen' },
+      { status: 500 }
+    );
+  }
+}

app/api/bookings/[id]/debug/route.ts

@@ -0,0 +1,111 @@
+import { NextRequest, NextResponse } from 'next/server';
+import { getServerSession } from 'next-auth';
+import { authOptions } from '@/lib/auth';
+import { prisma } from '@/lib/prisma';
+
+export async function GET(
+  request: NextRequest,
+  { params }: { params: { id: string } }
+) {
+  try {
+    const session = await getServerSession(authOptions);
+
+    if (!session || session.user.role !== 'ADMIN') {
+      return NextResponse.json({ error: 'Unauthorized' }, { status: 401 });
+    }
+
+    const bookingId = params.id;
+
+    const booking = await prisma.booking.findUnique({
+      where: { id: bookingId },
+      include: {
+        location: true,
+        photobox: true,
+        bookingEquipment: {
+          include: {
+            equipment: true,
+          },
+        },
+      },
+    });
+
+    if (!booking) {
+      return NextResponse.json({ error: 'Buchung nicht gefunden' }, { status: 404 });
+    }
+
+    let priceConfig = null;
+    if (booking.photobox?.model && booking.locationId) {
+      priceConfig = await prisma.priceConfig.findUnique({
+        where: {
+          locationId_model: {
+            locationId: booking.locationId,
+            model: booking.photobox.model,
+          },
+        },
+      });
+    }
+
+    const lineItems: any[] = [];
+    const withPrintFlat = booking.withPrintFlat !== false;
+
+    // Photobox LineItem
+    const photoboxArticleId = withPrintFlat 
+      ? (priceConfig?.lexofficeArticleIdWithFlat || priceConfig?.lexofficeArticleId)
+      : priceConfig?.lexofficeArticleId;
+
+    const boxName = booking.photobox?.model || 'Fotobox';
+    const flatSuffix = withPrintFlat ? ' mit Druckflatrate' : ' (nur digital)';
+
+    const photoboxItem: any = {
+      type: (photoboxArticleId && photoboxArticleId.trim()) ? 'material' : 'custom',
+      quantity: 1,
+      unitName: 'Stück',
+      name: `${boxName}${flatSuffix}`,
+    };
+
+    if (photoboxArticleId && photoboxArticleId.trim()) {
+      photoboxItem.id = photoboxArticleId;
+    } else {
+      photoboxItem.description = `Event am ${new Date(booking.eventDate).toLocaleDateString('de-DE')} in ${booking.eventCity}`;
+      photoboxItem.unitPrice = {
+        currency: 'EUR',
+        netAmount: priceConfig?.basePrice || 1,
+        taxRatePercentage: 19,
+      };
+    }
+
+    lineItems.push(photoboxItem);
+
+    return NextResponse.json({
+      booking: {
+        id: booking.id,
+        bookingNumber: booking.bookingNumber,
+        locationId: booking.locationId,
+        photoboxModel: booking.photobox?.model,
+        withPrintFlat: booking.withPrintFlat,
+        distance: booking.distance,
+      },
+      priceConfig: priceConfig ? {
+        id: priceConfig.id,
+        basePrice: priceConfig.basePrice,
+        kmFlatRate: priceConfig.kmFlatRate,
+        kmFlatRateUpTo: priceConfig.kmFlatRateUpTo,
+        pricePerKm: priceConfig.pricePerKm,
+        kmMultiplier: priceConfig.kmMultiplier,
+        lexofficeArticleId: priceConfig.lexofficeArticleId,
+        lexofficeArticleIdWithFlat: priceConfig.lexofficeArticleIdWithFlat,
+        lexofficeKmFlatArticleId: priceConfig.lexofficeKmFlatArticleId,
+        lexofficeKmExtraArticleId: priceConfig.lexofficeKmExtraArticleId,
+      } : null,
+      lineItems,
+      photoboxArticleId,
+    });
+
+  } catch (error: any) {
+    console.error('❌ Debug Fehler:', error);
+    return NextResponse.json(
+      { error: error.message, stack: error.stack },
+      { status: 500 }
+    );
+  }
+}

app/api/bookings/[id]/quotation-pdf/route.ts

@@ -0,0 +1,54 @@
+import { NextRequest, NextResponse } from 'next/server';
+import { getServerSession } from 'next-auth';
+import { authOptions } from '@/lib/auth';
+import { prisma } from '@/lib/prisma';
+import { lexofficeService } from '@/lib/lexoffice';
+
+export async function GET(
+  request: NextRequest,
+  { params }: { params: { id: string } }
+) {
+  try {
+    const session = await getServerSession(authOptions);
+
+    if (!session || session.user.role !== 'ADMIN') {
+      return NextResponse.json({ error: 'Unauthorized' }, { status: 401 });
+    }
+
+    const bookingId = params.id;
+
+    const booking = await prisma.booking.findUnique({
+      where: { id: bookingId },
+      select: {
+        id: true,
+        bookingNumber: true,
+        lexofficeOfferId: true,
+      },
+    });
+
+    if (!booking) {
+      return NextResponse.json({ error: 'Buchung nicht gefunden' }, { status: 404 });
+    }
+
+    if (!booking.lexofficeOfferId) {
+      return NextResponse.json({ error: 'Kein LexOffice Angebot vorhanden' }, { status: 404 });
+    }
+
+    const pdfBuffer = await lexofficeService.getQuotationPDF(booking.lexofficeOfferId);
+
+    return new NextResponse(pdfBuffer, {
+      status: 200,
+      headers: {
+        'Content-Type': 'application/pdf',
+        'Content-Disposition': `attachment; filename="Angebot_${booking.bookingNumber}.pdf"`,
+      },
+    });
+
+  } catch (error: any) {
+    console.error('❌ PDF-Download Fehler:', error);
+    return NextResponse.json(
+      { error: error.message || 'PDF-Download fehlgeschlagen' },
+      { status: 500 }
+    );
+  }
+}

app/api/bookings/[id]/route.ts

@@ -4,6 +4,39 @@ import { authOptions } from '@/lib/auth';
 import { prisma } from '@/lib/prisma';
 import { nextcloudCalendar } from '@/lib/nextcloud-calendar';
 
+export async function GET(
+  request: NextRequest,
+  { params }: { params: { id: string } }
+) {
+  try {
+    const session = await getServerSession(authOptions);
+
+    if (!session || session.user.role !== 'ADMIN') {
+      return NextResponse.json({ error: 'Unauthorized' }, { status: 401 });
+    }
+
+    const booking = await prisma.booking.findUnique({
+      where: { id: params.id },
+      include: {
+        location: true,
+        photobox: true,
+        bookingEquipment: {
+          include: { equipment: true },
+        },
+      },
+    });
+
+    if (!booking) {
+      return NextResponse.json({ error: 'Booking not found' }, { status: 404 });
+    }
+
+    return NextResponse.json({ booking });
+  } catch (error) {
+    console.error('Booking GET error:', error);
+    return NextResponse.json({ error: 'Internal server error' }, { status: 500 });
+  }
+}
+
 export async function PUT(
   request: NextRequest,
   { params }: { params: { id: string } }
@@ -65,23 +98,68 @@ export async function PATCH(
 
     const body = await request.json();
     const { id } = params;
-    const { status } = body;
 
-    if (!status) {
-      return NextResponse.json({ error: 'Status is required' }, { status: 400 });
+    const updateData: any = {};
+
+    if (body.status) updateData.status = body.status;
+    if (body.customerName !== undefined) updateData.customerName = body.customerName;
+    if (body.customerEmail !== undefined) updateData.customerEmail = body.customerEmail;
+    if (body.customerPhone !== undefined) updateData.customerPhone = body.customerPhone;
+    if (body.customerAddress !== undefined) updateData.customerAddress = body.customerAddress;
+    if (body.customerCity !== undefined) updateData.customerCity = body.customerCity;
+    if (body.customerZip !== undefined) updateData.customerZip = body.customerZip;
+    if (body.companyName !== undefined) updateData.companyName = body.companyName;
+    if (body.invoiceType !== undefined) updateData.invoiceType = body.invoiceType;
+    if (body.eventDate !== undefined) updateData.eventDate = new Date(body.eventDate);
+    if (body.eventAddress !== undefined) updateData.eventAddress = body.eventAddress;
+    if (body.eventCity !== undefined) updateData.eventCity = body.eventCity;
+    if (body.eventZip !== undefined) updateData.eventZip = body.eventZip;
+    if (body.eventLocation !== undefined) updateData.eventLocation = body.eventLocation;
+    if (body.setupTimeStart !== undefined) updateData.setupTimeStart = body.setupTimeStart ? new Date(body.setupTimeStart) : null;
+    if (body.setupTimeLatest !== undefined) updateData.setupTimeLatest = body.setupTimeLatest ? new Date(body.setupTimeLatest) : null;
+    if (body.dismantleTimeEarliest !== undefined) updateData.dismantleTimeEarliest = body.dismantleTimeEarliest ? new Date(body.dismantleTimeEarliest) : null;
+    if (body.dismantleTimeLatest !== undefined) updateData.dismantleTimeLatest = body.dismantleTimeLatest ? new Date(body.dismantleTimeLatest) : null;
+    if (body.calculatedPrice !== undefined) updateData.calculatedPrice = body.calculatedPrice;
+    if (body.notes !== undefined) updateData.notes = body.notes;
+    if (body.withPrintFlat !== undefined) updateData.withPrintFlat = body.withPrintFlat;
+
+    const hasEquipmentUpdate = Array.isArray(body.equipmentIds);
+    const hasModelUpdate = body.model !== undefined;
+
+    if (Object.keys(updateData).length === 0 && !hasEquipmentUpdate && !hasModelUpdate) {
+      return NextResponse.json({ error: 'Keine Änderungen angegeben' }, { status: 400 });
     }
 
     const booking = await prisma.booking.update({
       where: { id },
-      data: { status },
+      data: updateData,
       include: {
         location: true,
         photobox: true,
       },
     });
 
+    if (hasModelUpdate && booking.photoboxId) {
+      await prisma.photobox.update({
+        where: { id: booking.photoboxId },
+        data: { model: body.model },
+      });
+    }
+
+    if (hasEquipmentUpdate) {
+      await prisma.bookingEquipment.deleteMany({ where: { bookingId: id } });
+      if (body.equipmentIds.length > 0) {
+        await prisma.bookingEquipment.createMany({
+          data: body.equipmentIds.map((eqId: string) => ({
+            bookingId: id,
+            equipmentId: eqId,
+          })),
+        });
+      }
+    }
+
     try {
-      if (status === 'CANCELLED') {
+      if (updateData.status === 'CANCELLED') {
         await nextcloudCalendar.removeBookingFromCalendar(booking.id);
       } else {
         await nextcloudCalendar.syncBookingToCalendar(booking);

app/api/bookings/[id]/sign/route.ts

@@ -0,0 +1,165 @@
+import { NextRequest, NextResponse } from 'next/server';
+import { prisma } from '@/lib/prisma';
+import { generateContractFromTemplate } from '@/lib/pdf-template-service';
+
+export async function POST(
+  request: NextRequest,
+  { params }: { params: { id: string } }
+) {
+  try {
+    const bookingId = params.id;
+    const body = await request.json();
+    const { signatureData } = body;
+
+    if (!signatureData) {
+      return NextResponse.json(
+        { error: 'Signatur-Daten fehlen' },
+        { status: 400 }
+      );
+    }
+
+    const booking = await prisma.booking.findUnique({
+      where: { id: bookingId },
+      include: {
+        location: true,
+        photobox: true,
+      },
+    });
+
+    if (!booking) {
+      return NextResponse.json(
+        { error: 'Buchung nicht gefunden' },
+        { status: 404 }
+      );
+    }
+
+    if (booking.contractSigned) {
+      return NextResponse.json(
+        { error: 'Vertrag wurde bereits unterschrieben' },
+        { status: 400 }
+      );
+    }
+
+    const clientIp = request.headers.get('x-forwarded-for') || 
+                     request.headers.get('x-real-ip') || 
+                     'unknown';
+
+    let priceConfig = null;
+    if (booking.photobox?.model && booking.locationId) {
+      priceConfig = await prisma.priceConfig.findUnique({
+        where: {
+          locationId_model: {
+            locationId: booking.locationId,
+            model: booking.photobox.model,
+          },
+        },
+      });
+    }
+
+    const bookingWithPriceConfig = {
+      ...booking,
+      priceConfig,
+    };
+
+    const contractPdf = await generateContractFromTemplate(
+      bookingWithPriceConfig,
+      booking.location,
+      booking.photobox,
+      signatureData
+    );
+
+    const updatedBooking = await prisma.booking.update({
+      where: { id: bookingId },
+      data: {
+        contractSigned: true,
+        contractSignedAt: new Date(),
+        contractSignedOnline: true,
+        contractSignatureData: signatureData,
+        contractSignedBy: booking.customerName,
+        contractSignedIp: clientIp,
+      },
+    });
+
+    await prisma.notification.create({
+      data: {
+        type: 'CONTRACT_SIGNED',
+        title: 'Vertrag unterschrieben',
+        message: `${booking.customerName} hat den Vertrag für Buchung ${booking.bookingNumber} online unterschrieben.`,
+        metadata: {
+          bookingId: booking.id,
+          bookingNumber: booking.bookingNumber,
+          signedOnline: true,
+        },
+      },
+    });
+
+    console.log(`✅ Vertrag online unterschrieben: ${booking.bookingNumber}`);
+
+    return NextResponse.json({
+      success: true,
+      booking: {
+        id: updatedBooking.id,
+        bookingNumber: updatedBooking.bookingNumber,
+        contractSigned: updatedBooking.contractSigned,
+        contractSignedAt: updatedBooking.contractSignedAt,
+      },
+    });
+
+  } catch (error: any) {
+    console.error('❌ Signatur-Fehler:', error);
+    return NextResponse.json(
+      { error: error.message || 'Signatur fehlgeschlagen' },
+      { status: 500 }
+    );
+  }
+}
+
+export async function GET(
+  request: NextRequest,
+  { params }: { params: { id: string } }
+) {
+  try {
+    const bookingId = params.id;
+
+    const booking = await prisma.booking.findUnique({
+      where: { id: bookingId },
+      select: {
+        id: true,
+        bookingNumber: true,
+        customerName: true,
+        eventDate: true,
+        eventLocation: true,
+        contractSigned: true,
+        contractSignedAt: true,
+        contractSignedOnline: true,
+        calculatedPrice: true,
+        photobox: {
+          select: {
+            model: true,
+          },
+        },
+        location: {
+          select: {
+            name: true,
+          },
+        },
+      },
+    });
+
+    if (!booking) {
+      return NextResponse.json(
+        { error: 'Buchung nicht gefunden' },
+        { status: 404 }
+      );
+    }
+
+    return NextResponse.json({ booking });
+
+  } catch (error: any) {
+    console.error('❌ Buchungs-Abruf Fehler:', error);
+    return NextResponse.json(
+      { error: error.message || 'Fehler beim Abrufen der Buchung' },
+      { status: 500 }
+    );
+  }
+}

app/api/bookings/create/route.ts

@@ -105,6 +105,15 @@ export async function POST(request: NextRequest) {
       },
     });
 
+    if (Array.isArray(body.equipmentIds) && body.equipmentIds.length > 0) {
+      await prisma.bookingEquipment.createMany({
+        data: body.equipmentIds.map((eqId: string) => ({
+          bookingId: booking.id,
+          equipmentId: eqId,
+        })),
+      });
+    }
+
     try {
       await nextcloudCalendar.syncBookingToCalendar(booking);
     } catch (calError) {

app/api/bookings/route.ts

@@ -1,6 +1,9 @@
 import { NextRequest, NextResponse } from 'next/server';
 import { prisma } from '@/lib/prisma';
 import { z } from 'zod';
+import { DistanceCalculator } from '@/lib/distance-calculator';
+import { PriceCalculator } from '@/lib/price-calculator';
+import { bookingAutomationService } from '@/lib/booking-automation';
 
 const bookingSchema = z.object({
   locationSlug: z.string(),
@@ -92,7 +95,62 @@ export async function POST(request: NextRequest) {
       },
     });
 
-    const calculatedPrice = priceConfig ? priceConfig.basePrice : 0;
+    if (!priceConfig) {
+      return NextResponse.json(
+        { error: 'Preiskonfiguration nicht gefunden' },
+        { status: 404 }
+      );
+    }
+
+    let distance: number | null = null;
+    let calculatedPrice = priceConfig.basePrice;
+
+    if (location.warehouseAddress && location.warehouseZip && location.warehouseCity) {
+      const warehouseAddress = DistanceCalculator.formatAddress(
+        location.warehouseAddress,
+        location.warehouseZip,
+        location.warehouseCity
+      );
+      const eventAddress = DistanceCalculator.formatAddress(
+        data.eventAddress,
+        data.eventZip,
+        data.eventCity
+      );
+
+      const distanceResult = await DistanceCalculator.calculateDistance(
+        warehouseAddress,
+        eventAddress
+      );
+
+      if (distanceResult) {
+        distance = distanceResult.distance;
+        
+        const priceBreakdown = PriceCalculator.calculateTotalPrice(
+          priceConfig.basePrice,
+          distance,
+          {
+            basePrice: priceConfig.basePrice,
+            kmFlatRate: priceConfig.kmFlatRate,
+            kmFlatRateUpTo: priceConfig.kmFlatRateUpTo,
+            pricePerKm: priceConfig.pricePerKm,
+            kmMultiplier: priceConfig.kmMultiplier,
+          }
+        );
+
+        calculatedPrice = priceBreakdown.totalPrice;
+
+        console.log('📍 Distanzberechnung:', {
+          from: warehouseAddress,
+          to: eventAddress,
+          distance: `${distance}km`,
+          breakdown: PriceCalculator.formatPriceBreakdown(priceBreakdown),
+        });
+      } else {
+        console.warn('⚠️  Distanzberechnung fehlgeschlagen, verwende nur Grundpreis');
+      }
+    } else {
+      console.warn('⚠️  Keine Lager-Adresse konfiguriert, verwende nur Grundpreis');
+    }
 
     const booking = await prisma.booking.create({
       data: {
@@ -117,6 +175,7 @@ export async function POST(request: NextRequest) {
         setupTimeLatest: new Date(data.setupTimeLatest),
         dismantleTimeEarliest: data.dismantleTimeEarliest ? new Date(data.dismantleTimeEarliest) : null,
         dismantleTimeLatest: data.dismantleTimeLatest ? new Date(data.dismantleTimeLatest) : null,
+        distance,
         calculatedPrice,
         notes: data.notes,
       },
@@ -138,6 +197,12 @@ export async function POST(request: NextRequest) {
       },
     });
 
+    // 🤖 Automatische Post-Booking Aktionen (E-Mail + Kalender)
+    console.log('📢 Starte automatische Aktionen...');
+    bookingAutomationService.runPostBookingActions(booking.id).catch(err => {
+      console.error('⚠️  Automatische Aktionen fehlgeschlagen:', err);
+    });
+
     return NextResponse.json({
       success: true,
       booking: {
@@ -174,7 +239,13 @@ export async function GET(request: NextRequest) {
     const where: any = {};
 
     if (status) {
-      where.status = status;
+      // Support multiple statuses separated by comma
+      const statuses = status.split(',').map(s => s.trim());
+      if (statuses.length > 1) {
+        where.status = { in: statuses };
+      } else {
+        where.status = status;
+      }
     }
 
     if (locationSlug) {

app/api/driver/tour-stops/[id]/status/route.ts

@@ -0,0 +1,76 @@
+import { NextRequest, NextResponse } from 'next/server';
+import { getServerSession } from 'next-auth';
+import { authOptions } from '@/lib/auth';
+import { prisma } from '@/lib/prisma';
+
+export async function PATCH(
+  request: NextRequest,
+  { params }: { params: { id: string } }
+) {
+  try {
+    const session = await getServerSession(authOptions);
+    
+    if (!session || session.user.role !== 'DRIVER') {
+      return NextResponse.json({ error: 'Unauthorized' }, { status: 401 });
+    }
+
+    const body = await request.json();
+    const { status } = body;
+
+    if (!status) {
+      return NextResponse.json({ error: 'Status is required' }, { status: 400 });
+    }
+
+    const tourStop = await prisma.tourStop.findUnique({
+      where: { id: params.id },
+      include: {
+        tour: {
+          select: {
+            driverId: true,
+          },
+        },
+      },
+    });
+
+    if (!tourStop) {
+      return NextResponse.json({ error: 'Tour stop not found' }, { status: 404 });
+    }
+
+    if (tourStop.tour.driverId !== session.user.id) {
+      return NextResponse.json({ error: 'Unauthorized' }, { status: 403 });
+    }
+
+    const updateData: any = { status };
+
+    switch (status) {
+      case 'ARRIVED':
+        updateData.arrivedAt = new Date();
+        break;
+      case 'SETUP_IN_PROGRESS':
+        updateData.setupStartedAt = new Date();
+        break;
+      case 'SETUP_COMPLETE':
+        updateData.setupCompleteAt = new Date();
+        break;
+      case 'PICKUP_IN_PROGRESS':
+        updateData.pickupStartedAt = new Date();
+        break;
+      case 'PICKUP_COMPLETE':
+        updateData.pickupCompleteAt = new Date();
+        break;
+    }
+
+    const updatedStop = await prisma.tourStop.update({
+      where: { id: params.id },
+      data: updateData,
+    });
+
+    return NextResponse.json({ tourStop: updatedStop });
+  } catch (error: any) {
+    console.error('Status update error:', error);
+    return NextResponse.json(
+      { error: error.message || 'Failed to update status' },
+      { status: 500 }
+    );
+  }
+}

app/api/driver/tours/[id]/route.ts

@@ -0,0 +1,62 @@
+import { NextRequest, NextResponse } from 'next/server';
+import { getServerSession } from 'next-auth';
+import { authOptions } from '@/lib/auth';
+import { prisma } from '@/lib/prisma';
+
+export async function GET(
+  request: NextRequest,
+  { params }: { params: { id: string } }
+) {
+  try {
+    const session = await getServerSession(authOptions);
+    
+    if (!session || session.user.role !== 'DRIVER') {
+      return NextResponse.json({ error: 'Unauthorized' }, { status: 401 });
+    }
+
+    const tour = await prisma.tour.findUnique({
+      where: { 
+        id: params.id,
+        driverId: session.user.id,
+      },
+      include: {
+        tourStops: {
+          include: {
+            booking: {
+              include: {
+                photobox: {
+                  select: {
+                    model: true,
+                    serialNumber: true,
+                  },
+                },
+              },
+            },
+            photos: {
+              select: {
+                id: true,
+                photoType: true,
+                fileName: true,
+              },
+            },
+          },
+          orderBy: {
+            stopOrder: 'asc',
+          },
+        },
+      },
+    });
+
+    if (!tour) {
+      return NextResponse.json({ error: 'Tour not found' }, { status: 404 });
+    }
+
+    return NextResponse.json({ tour });
+  } catch (error: any) {
+    console.error('Tour fetch error:', error);
+    return NextResponse.json(
+      { error: error.message || 'Failed to fetch tour' },
+      { status: 500 }
+    );
+  }
+}

app/api/equipment/route.ts

@@ -0,0 +1,30 @@
+import { NextResponse } from 'next/server';
+import { getServerSession } from 'next-auth';
+import { authOptions } from '@/lib/auth';
+import { prisma } from '@/lib/prisma';
+
+export async function GET() {
+  try {
+    const session = await getServerSession(authOptions);
+
+    if (!session || session.user.role !== 'ADMIN') {
+      return NextResponse.json({ error: 'Unauthorized' }, { status: 401 });
+    }
+
+    const equipment = await prisma.equipment.findMany({
+      where: { status: 'AVAILABLE' },
+      orderBy: { name: 'asc' },
+      select: {
+        id: true,
+        name: true,
+        type: true,
+        price: true,
+      },
+    });
+
+    return NextResponse.json({ equipment });
+  } catch (error) {
+    console.error('Equipment GET error:', error);
+    return NextResponse.json({ error: 'Internal server error' }, { status: 500 });
+  }
+}

app/api/tours/route.ts

@@ -106,6 +106,7 @@ export async function POST(request: NextRequest) {
         },
         data: {
           tourId: tour.id,
+          status: 'ASSIGNED',
         },
       });
 
@@ -145,6 +146,13 @@ export async function POST(request: NextRequest) {
         },
       });
 
+      // Create TourStops for each booking
+      const fullBookings = await prisma.booking.findMany({
+        where: { id: { in: bookingIds } },
+        include: { setupWindows: true },
+        orderBy: { setupTimeStart: 'asc' },
+      });
+
       try {
         // For route optimization, use the selected setup window time if available
         const stopsWithSetupTimes = bookings.map((booking: any) => {
@@ -182,8 +190,38 @@ export async function POST(request: NextRequest) {
             estimatedDuration: routeData.totalDuration,
           },
         });
+
+        // Create TourStops based on optimized order
+        const optimizedOrder = routeData.optimizedOrder || fullBookings.map((_, i) => i);
+        for (let i = 0; i < optimizedOrder.length; i++) {
+          const orderIndex = optimizedOrder[i];
+          const booking = fullBookings[orderIndex];
+          
+          await prisma.tourStop.create({
+            data: {
+              tourId: tour.id,
+              bookingId: booking.id,
+              stopOrder: i + 1,
+              stopType: 'DELIVERY',
+              status: 'PENDING',
+            },
+          });
+        }
       } catch (routeError) {
         console.error('Route optimization error:', routeError);
+        
+        // If route optimization fails, create TourStops in simple order
+        for (let i = 0; i < fullBookings.length; i++) {
+          await prisma.tourStop.create({
+            data: {
+              tourId: tour.id,
+              bookingId: fullBookings[i].id,
+              stopOrder: i + 1,
+              stopType: 'DELIVERY',
+              status: 'PENDING',
+            },
+          });
+        }
       }
     }
 

app/dashboard/bookings/[id]/edit/page.tsx

@@ -0,0 +1,311 @@
+"use client";
+
+import { useState, useEffect } from "react";
+import { useRouter, useParams } from "next/navigation";
+import Link from "next/link";
+
+export default function EditBookingPage() {
+  const router = useRouter();
+  const params = useParams();
+  const bookingId = params.id as string;
+
+  const [loading, setLoading] = useState(true);
+  const [saving, setSaving] = useState(false);
+  const [error, setError] = useState("");
+  const [equipmentList, setEquipmentList] = useState<any[]>([]);
+  const [selectedEquipment, setSelectedEquipment] = useState<string[]>([]);
+  const [formData, setFormData] = useState({
+    customerName: "",
+    customerEmail: "",
+    customerPhone: "",
+    customerAddress: "",
+    customerCity: "",
+    customerZip: "",
+    companyName: "",
+    invoiceType: "PRIVATE",
+    model: "",
+    eventDate: "",
+    eventAddress: "",
+    eventCity: "",
+    eventZip: "",
+    eventLocation: "",
+    setupTimeStart: "",
+    setupTimeLatest: "",
+    dismantleTimeEarliest: "",
+    dismantleTimeLatest: "",
+    calculatedPrice: 0,
+    notes: "",
+    withPrintFlat: false,
+  });
+
+  const toggleEquipment = (id: string) => {
+    setSelectedEquipment((prev) =>
+      prev.includes(id) ? prev.filter((e) => e !== id) : [...prev, id]
+    );
+  };
+
+  useEffect(() => {
+    Promise.all([
+      fetch(`/api/bookings/${bookingId}`).then((r) => r.json()),
+      fetch("/api/equipment").then((r) => r.json()),
+    ])
+      .then(([bookingData, eqData]) => {
+        const b = bookingData.booking || bookingData;
+        setFormData({
+          customerName: b.customerName || "",
+          customerEmail: b.customerEmail || "",
+          customerPhone: b.customerPhone || "",
+          customerAddress: b.customerAddress || "",
+          customerCity: b.customerCity || "",
+          customerZip: b.customerZip || "",
+          companyName: b.companyName || "",
+          invoiceType: b.invoiceType || "PRIVATE",
+          model: b.model || b.photobox?.model || "",
+          eventDate: b.eventDate ? new Date(b.eventDate).toISOString().split("T")[0] : "",
+          eventAddress: b.eventAddress || "",
+          eventCity: b.eventCity || "",
+          eventZip: b.eventZip || "",
+          eventLocation: b.eventLocation || "",
+          setupTimeStart: b.setupTimeStart ? new Date(b.setupTimeStart).toISOString().slice(0, 16) : "",
+          setupTimeLatest: b.setupTimeLatest ? new Date(b.setupTimeLatest).toISOString().slice(0, 16) : "",
+          dismantleTimeEarliest: b.dismantleTimeEarliest ? new Date(b.dismantleTimeEarliest).toISOString().slice(0, 16) : "",
+          dismantleTimeLatest: b.dismantleTimeLatest ? new Date(b.dismantleTimeLatest).toISOString().slice(0, 16) : "",
+          calculatedPrice: b.calculatedPrice || 0,
+          notes: b.notes || "",
+          withPrintFlat: b.withPrintFlat || false,
+        });
+        setEquipmentList(eqData.equipment || []);
+        if (b.bookingEquipment) {
+          setSelectedEquipment(b.bookingEquipment.map((be: any) => be.equipmentId));
+        }
+        setLoading(false);
+      })
+      .catch(() => {
+        setError("Buchung konnte nicht geladen werden");
+        setLoading(false);
+      });
+  }, [bookingId]);
+
+  const handleSubmit = async (e: React.FormEvent) => {
+    e.preventDefault();
+    setSaving(true);
+    setError("");
+
+    try {
+      const res = await fetch(`/api/bookings/${bookingId}`, {
+        method: "PATCH",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ ...formData, equipmentIds: selectedEquipment }),
+      });
+
+      const data = await res.json();
+
+      if (!res.ok) {
+        throw new Error(data.error || "Fehler beim Speichern");
+      }
+
+      router.push(`/dashboard/bookings/${bookingId}`);
+    } catch (err: any) {
+      setError(err.message);
+      setSaving(false);
+    }
+  };
+
+  if (loading) {
+    return (
+      <div className="min-h-screen bg-gradient-to-br from-gray-900 via-gray-800 to-gray-900 flex items-center justify-center">
+        <div className="text-gray-400">Laden...</div>
+      </div>
+    );
+  }
+
+  const inputClass = "w-full px-4 py-2 bg-gray-700 border border-gray-600 text-white rounded-lg focus:ring-2 focus:ring-red-500 focus:border-transparent";
+
+  return (
+    <div className="min-h-screen bg-gradient-to-br from-gray-900 via-gray-800 to-gray-900 p-8">
+      <div className="max-w-4xl mx-auto">
+        <div className="mb-8">
+          <Link
+            href={`/dashboard/bookings/${bookingId}`}
+            className="text-sm text-gray-400 hover:text-gray-300 mb-2 inline-block transition-colors"
+          >
+            &larr; Zurück zur Buchung
+          </Link>
+          <h2 className="text-3xl font-bold text-white">Buchung bearbeiten</h2>
+        </div>
+
+        <form
+          onSubmit={handleSubmit}
+          className="bg-gradient-to-br from-gray-800 to-gray-900 border border-gray-700 rounded-xl shadow-sm p-6 space-y-6"
+        >
+          <div>
+            <h3 className="text-lg font-semibold text-white mb-4">Fotobox & Ausstattung</h3>
+            <div className="grid grid-cols-2 gap-4">
+              <div className="col-span-2">
+                <label className="block text-sm font-medium text-gray-300 mb-2">Modell</label>
+                <select
+                  value={formData.model}
+                  onChange={(e) => setFormData({ ...formData, model: e.target.value })}
+                  className={inputClass}
+                >
+                  <option value="">Bitte wählen...</option>
+                  <option value="VINTAGE">Vintage</option>
+                  <option value="VINTAGE_SMILE">Vintage Smile</option>
+                  <option value="VINTAGE_PHOTOS">Vintage Photos</option>
+                  <option value="NOSTALGIE">Nostalgie</option>
+                  <option value="MAGIC_MIRROR">Magic Mirror</option>
+                </select>
+              </div>
+            </div>
+
+            {equipmentList.length > 0 && (
+              <div className="mt-4">
+                <label className="block text-sm font-medium text-gray-300 mb-2">Zusatzausstattung</label>
+                <div className="grid grid-cols-2 gap-2">
+                  {equipmentList.map((eq) => (
+                    <label
+                      key={eq.id}
+                      className={`flex items-center gap-2 p-3 rounded-lg border cursor-pointer transition-colors ${
+                        selectedEquipment.includes(eq.id)
+                          ? "bg-red-500/10 border-red-500/50 text-white"
+                          : "bg-gray-700/50 border-gray-600 text-gray-300 hover:border-gray-500"
+                      }`}
+                    >
+                      <input
+                        type="checkbox"
+                        checked={selectedEquipment.includes(eq.id)}
+                        onChange={() => toggleEquipment(eq.id)}
+                        className="accent-red-500"
+                      />
+                      {eq.name}
+                    </label>
+                  ))}
+                </div>
+              </div>
+            )}
+          </div>
+
+          <div>
+            <h3 className="text-lg font-semibold text-white mb-4">Kundendaten</h3>
+            <div className="grid grid-cols-2 gap-4">
+              <div className="col-span-2">
+                <label className="block text-sm font-medium text-gray-300 mb-2">Rechnungsart</label>
+                <div className="flex gap-4">
+                  <label className="flex items-center text-white">
+                    <input type="radio" value="PRIVATE" checked={formData.invoiceType === "PRIVATE"} onChange={(e) => setFormData({ ...formData, invoiceType: e.target.value })} className="mr-2" />
+                    Privat
+                  </label>
+                  <label className="flex items-center text-white">
+                    <input type="radio" value="BUSINESS" checked={formData.invoiceType === "BUSINESS"} onChange={(e) => setFormData({ ...formData, invoiceType: e.target.value })} className="mr-2" />
+                    Geschäftlich
+                  </label>
+                </div>
+              </div>
+              {formData.invoiceType === "BUSINESS" && (
+                <div className="col-span-2">
+                  <label className="block text-sm font-medium text-gray-300 mb-2">Firmenname</label>
+                  <input type="text" value={formData.companyName} onChange={(e) => setFormData({ ...formData, companyName: e.target.value })} className={inputClass} />
+                </div>
+              )}
+              <div className="col-span-2">
+                <label className="block text-sm font-medium text-gray-300 mb-2">Name</label>
+                <input type="text" value={formData.customerName} onChange={(e) => setFormData({ ...formData, customerName: e.target.value })} required className={inputClass} />
+              </div>
+              <div>
+                <label className="block text-sm font-medium text-gray-300 mb-2">E-Mail</label>
+                <input type="email" value={formData.customerEmail} onChange={(e) => setFormData({ ...formData, customerEmail: e.target.value })} required className={inputClass} />
+              </div>
+              <div>
+                <label className="block text-sm font-medium text-gray-300 mb-2">Telefon</label>
+                <input type="tel" value={formData.customerPhone} onChange={(e) => setFormData({ ...formData, customerPhone: e.target.value })} required className={inputClass} />
+              </div>
+              <div className="col-span-2">
+                <label className="block text-sm font-medium text-gray-300 mb-2">Adresse</label>
+                <input type="text" value={formData.customerAddress} onChange={(e) => setFormData({ ...formData, customerAddress: e.target.value })} placeholder="Straße und Hausnummer" className={inputClass} />
+              </div>
+              <div>
+                <label className="block text-sm font-medium text-gray-300 mb-2">PLZ</label>
+                <input type="text" value={formData.customerZip} onChange={(e) => setFormData({ ...formData, customerZip: e.target.value })} className={inputClass} />
+              </div>
+              <div>
+                <label className="block text-sm font-medium text-gray-300 mb-2">Stadt</label>
+                <input type="text" value={formData.customerCity} onChange={(e) => setFormData({ ...formData, customerCity: e.target.value })} className={inputClass} />
+              </div>
+            </div>
+          </div>
+
+          <div>
+            <h3 className="text-lg font-semibold text-white mb-4">Event-Details</h3>
+            <div className="grid grid-cols-2 gap-4">
+              <div>
+                <label className="block text-sm font-medium text-gray-300 mb-2">Event-Datum</label>
+                <input type="date" value={formData.eventDate} onChange={(e) => setFormData({ ...formData, eventDate: e.target.value })} required className={inputClass} />
+              </div>
+              <div>
+                <label className="block text-sm font-medium text-gray-300 mb-2">Preis (EUR)</label>
+                <input type="number" step="0.01" value={formData.calculatedPrice} onChange={(e) => setFormData({ ...formData, calculatedPrice: parseFloat(e.target.value) })} required className={inputClass} />
+              </div>
+              <div className="col-span-2">
+                <label className="block text-sm font-medium text-gray-300 mb-2">Event-Adresse</label>
+                <input type="text" value={formData.eventAddress} onChange={(e) => setFormData({ ...formData, eventAddress: e.target.value })} required className={inputClass} />
+              </div>
+              <div>
+                <label className="block text-sm font-medium text-gray-300 mb-2">PLZ</label>
+                <input type="text" value={formData.eventZip} onChange={(e) => setFormData({ ...formData, eventZip: e.target.value })} required className={inputClass} />
+              </div>
+              <div>
+                <label className="block text-sm font-medium text-gray-300 mb-2">Stadt</label>
+                <input type="text" value={formData.eventCity} onChange={(e) => setFormData({ ...formData, eventCity: e.target.value })} required className={inputClass} />
+              </div>
+              <div className="col-span-2">
+                <label className="block text-sm font-medium text-gray-300 mb-2">Location-Name (optional)</label>
+                <input type="text" value={formData.eventLocation} onChange={(e) => setFormData({ ...formData, eventLocation: e.target.value })} className={inputClass} />
+              </div>
+              <div>
+                <label className="block text-sm font-medium text-gray-300 mb-2">Aufbau ab</label>
+                <input type="datetime-local" value={formData.setupTimeStart} onChange={(e) => setFormData({ ...formData, setupTimeStart: e.target.value })} className={inputClass} />
+              </div>
+              <div>
+                <label className="block text-sm font-medium text-gray-300 mb-2">Aufbau spätestens</label>
+                <input type="datetime-local" value={formData.setupTimeLatest} onChange={(e) => setFormData({ ...formData, setupTimeLatest: e.target.value })} className={inputClass} />
+              </div>
+              <div>
+                <label className="block text-sm font-medium text-gray-300 mb-2">Abbau ab</label>
+                <input type="datetime-local" value={formData.dismantleTimeEarliest} onChange={(e) => setFormData({ ...formData, dismantleTimeEarliest: e.target.value })} className={inputClass} />
+              </div>
+              <div>
+                <label className="block text-sm font-medium text-gray-300 mb-2">Abbau spätestens</label>
+                <input type="datetime-local" value={formData.dismantleTimeLatest} onChange={(e) => setFormData({ ...formData, dismantleTimeLatest: e.target.value })} className={inputClass} />
+              </div>
+              <div className="col-span-2">
+                <label className="flex items-center text-white gap-2">
+                  <input type="checkbox" checked={formData.withPrintFlat} onChange={(e) => setFormData({ ...formData, withPrintFlat: e.target.checked })} />
+                  Druckflatrate
+                </label>
+              </div>
+              <div className="col-span-2">
+                <label className="block text-sm font-medium text-gray-300 mb-2">Notizen</label>
+                <textarea value={formData.notes} onChange={(e) => setFormData({ ...formData, notes: e.target.value })} rows={4} className={inputClass} />
+              </div>
+            </div>
+          </div>
+
+          {error && (
+            <div className="bg-red-500/20 border border-red-500/50 text-red-400 px-4 py-3 rounded-lg">
+              {error}
+            </div>
+          )}
+
+          <div className="flex gap-4 pt-4 border-t border-gray-700">
+            <Link href={`/dashboard/bookings/${bookingId}`} className="flex-1 px-4 py-3 bg-gray-700 text-gray-300 rounded-lg font-semibold text-center hover:bg-gray-600 transition-colors">
+              Abbrechen
+            </Link>
+            <button type="submit" disabled={saving} className="flex-1 px-4 py-3 bg-gradient-to-r from-red-600 to-pink-600 text-white rounded-lg font-semibold hover:from-red-700 hover:to-pink-700 transition-all shadow-lg disabled:opacity-50">
+              {saving ? "Wird gespeichert..." : "Änderungen speichern"}
+            </button>
+          </div>
+        </form>
+      </div>
+    </div>
+  );
+}

app/dashboard/bookings/[id]/page.tsx

@@ -2,14 +2,16 @@ import { getServerSession } from 'next-auth';
 import { authOptions } from '@/lib/auth';
 import { prisma } from '@/lib/prisma';
 import { redirect } from 'next/navigation';
-import BookingDetail from '@/components/BookingDetail';
 import DashboardSidebar from '@/components/DashboardSidebar';
+import BookingAutomationPanel from '@/components/BookingAutomationPanel';
+import { formatDate, formatDateTime } from '@/lib/date-utils';
+import Link from 'next/link';
 
 export default async function BookingDetailPage({ params }: { params: { id: string } }) {
   const session = await getServerSession(authOptions);
 
-  if (!session) {
-    redirect('/login');
+  if (!session || session.user.role !== 'ADMIN') {
+    redirect('/auth/signin');
   }
 
   const booking = await prisma.booking.findUnique({
@@ -17,16 +19,6 @@ export default async function BookingDetailPage({ params }: { params: { id: stri
     include: {
       location: true,
       photobox: true,
-      tour: {
-        include: {
-          driver: true,
-        },
-      },
-      bookingEquipment: {
-        include: {
-          equipment: true,
-        },
-      },
     },
   });
 
@@ -34,17 +26,224 @@ export default async function BookingDetailPage({ params }: { params: { id: stri
     redirect('/dashboard/bookings');
   }
 
-  const emails = await prisma.email.findMany({
-    where: { bookingId: booking.id },
-    orderBy: { receivedAt: 'desc' },
-  });
+  const getStatusColor = (status: string) => {
+    switch (status) {
+      case 'RESERVED': return 'bg-yellow-500/20 text-yellow-400 border border-yellow-500/50';
+      case 'CONFIRMED': return 'bg-green-500/20 text-green-400 border border-green-500/50';
+      case 'COMPLETED': return 'bg-blue-500/20 text-blue-400 border border-blue-500/50';
+      case 'CANCELLED': return 'bg-red-500/20 text-red-400 border border-red-500/50';
+      default: return 'bg-gray-500/20 text-gray-400 border border-gray-500/50';
+    }
+  };
+
+  const getStatusLabel = (status: string) => {
+    switch (status) {
+      case 'RESERVED': return 'Reserviert';
+      case 'CONFIRMED': return 'Bestätigt';
+      case 'COMPLETED': return 'Abgeschlossen';
+      case 'CANCELLED': return 'Storniert';
+      default: return status;
+    }
+  };
 
   return (
     <div className="min-h-screen bg-gradient-to-br from-gray-900 via-gray-800 to-gray-900">
       <div className="flex">
-        <DashboardSidebar user={session?.user} />
+        <DashboardSidebar user={session.user} />
         <main className="flex-1 p-8">
-          <BookingDetail booking={booking} emails={emails} user={session?.user} />
+          <div className="max-w-6xl mx-auto">
+            {/* Header */}
+            <div className="mb-8">
+              <div className="flex items-center justify-between mb-4">
+                <div>
+                  <h1 className="text-3xl font-bold text-white">{booking.bookingNumber}</h1>
+                  <p className="text-gray-400 mt-1">{booking.customerName}</p>
+                </div>
+                <div className="flex items-center gap-3">
+                  <Link
+                    href={`/dashboard/bookings/${booking.id}/edit`}
+                    className="px-4 py-2 bg-gray-700 hover:bg-gray-600 text-white rounded-lg text-sm font-medium transition-colors"
+                  >
+                    Bearbeiten
+                  </Link>
+                  <div className={`px-4 py-2 rounded-lg ${getStatusColor(booking.status)}`}>
+                    {getStatusLabel(booking.status)}
+                  </div>
+                </div>
+              </div>
+            </div>
+
+            {/* Automation Panel */}
+            <div className="mb-8">
+              <BookingAutomationPanel booking={booking} invoiceType={booking.invoiceType} />
+            </div>
+
+            {/* Booking Details */}
+            <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
+              {/* Customer Info */}
+              <div className="bg-gradient-to-br from-gray-800 to-gray-900 border border-gray-700 rounded-xl p-6 shadow-lg">
+                <h3 className="text-xl font-bold text-white mb-4">Kundendaten</h3>
+                <div className="space-y-3 text-sm">
+                  <div>
+                    <span className="text-gray-400">Name:</span>
+                    <span className="text-white ml-2 font-medium">{booking.customerName}</span>
+                  </div>
+                  <div>
+                    <span className="text-gray-400">E-Mail:</span>
+                    <span className="text-white ml-2">{booking.customerEmail}</span>
+                  </div>
+                  <div>
+                    <span className="text-gray-400">Telefon:</span>
+                    <span className="text-white ml-2">{booking.customerPhone}</span>
+                  </div>
+                  {booking.customerAddress && (
+                    <div>
+                      <span className="text-gray-400">Adresse:</span>
+                      <span className="text-white ml-2">
+                        {booking.customerAddress}, {booking.customerZip} {booking.customerCity}
+                      </span>
+                    </div>
+                  )}
+                  {booking.companyName && (
+                    <div>
+                      <span className="text-gray-400">Firma:</span>
+                      <span className="text-white ml-2">{booking.companyName}</span>
+                    </div>
+                  )}
+                </div>
+              </div>
+
+              {/* Event Info */}
+              <div className="bg-gradient-to-br from-gray-800 to-gray-900 border border-gray-700 rounded-xl p-6 shadow-lg">
+                <h3 className="text-xl font-bold text-white mb-4">Event-Details</h3>
+                <div className="space-y-3 text-sm">
+                  <div>
+                    <span className="text-gray-400">Datum:</span>
+                    <span className="text-white ml-2 font-medium">{formatDate(booking.eventDate)}</span>
+                  </div>
+                  <div>
+                    <span className="text-gray-400">Location:</span>
+                    <span className="text-white ml-2">{booking.eventLocation || '-'}</span>
+                  </div>
+                  <div>
+                    <span className="text-gray-400">Adresse:</span>
+                    <span className="text-white ml-2">
+                      {booking.eventAddress}, {booking.eventZip} {booking.eventCity}
+                    </span>
+                  </div>
+                  <div>
+                    <span className="text-gray-400">Aufbau Start:</span>
+                    <span className="text-white ml-2">{formatDateTime(booking.setupTimeStart)}</span>
+                  </div>
+                  <div>
+                    <span className="text-gray-400">Aufbau spätestens:</span>
+                    <span className="text-white ml-2">{formatDateTime(booking.setupTimeLatest)}</span>
+                  </div>
+                  {booking.dismantleTimeEarliest && (
+                    <div>
+                      <span className="text-gray-400">Abbau ab:</span>
+                      <span className="text-white ml-2">{formatDateTime(booking.dismantleTimeEarliest)}</span>
+                    </div>
+                  )}
+                  {booking.dismantleTimeLatest && (
+                    <div>
+                      <span className="text-gray-400">Abbau spätestens:</span>
+                      <span className="text-white ml-2">{formatDateTime(booking.dismantleTimeLatest)}</span>
+                    </div>
+                  )}
+                  {booking.notes && (
+                    <div className="pt-3 border-t border-gray-700">
+                      <span className="text-gray-400">Notizen:</span>
+                      <p className="text-white mt-1 whitespace-pre-wrap">{booking.notes}</p>
+                    </div>
+                  )}
+                </div>
+              </div>
+
+              {/* Photobox & Pricing */}
+              <div className="bg-gradient-to-br from-gray-800 to-gray-900 border border-gray-700 rounded-xl p-6 shadow-lg">
+                <h3 className="text-xl font-bold text-white mb-4">Fotobox & Preis</h3>
+                <div className="space-y-3 text-sm">
+                  <div>
+                    <span className="text-gray-400">Modell:</span>
+                    <span className="text-white ml-2 font-medium">{booking.photobox?.model || '-'}</span>
+                  </div>
+                  <div>
+                    <span className="text-gray-400">Serial Number:</span>
+                    <span className="text-white ml-2">{booking.photobox?.serialNumber || '-'}</span>
+                  </div>
+                  <div>
+                    <span className="text-gray-400">Druckflatrate:</span>
+                    <span className="text-white ml-2">{booking.withPrintFlat ? 'Ja' : 'Nein'}</span>
+                  </div>
+                  {booking.distance && (
+                    <div>
+                      <span className="text-gray-400">Entfernung:</span>
+                      <span className="text-white ml-2">{booking.distance.toFixed(1)} km</span>
+                    </div>
+                  )}
+                  {booking.calculatedPrice && (
+                    <div className="pt-3 border-t border-gray-700">
+                      <span className="text-gray-400">Gesamtpreis:</span>
+                      <span className="text-2xl text-pink-400 ml-2 font-bold">
+                        {booking.calculatedPrice.toFixed(2)} €
+                      </span>
+                    </div>
+                  )}
+                </div>
+              </div>
+
+              {/* Location Info */}
+              <div className="bg-gradient-to-br from-gray-800 to-gray-900 border border-gray-700 rounded-xl p-6 shadow-lg">
+                <h3 className="text-xl font-bold text-white mb-4">Standort</h3>
+                <div className="space-y-3 text-sm">
+                  <div>
+                    <span className="text-gray-400">Name:</span>
+                    <span className="text-white ml-2 font-medium">{booking.location?.name}</span>
+                  </div>
+                  <div>
+                    <span className="text-gray-400">Stadt:</span>
+                    <span className="text-white ml-2">{booking.location?.city}</span>
+                  </div>
+                  <div>
+                    <span className="text-gray-400">Website:</span>
+                    <span className="text-white ml-2">{booking.location?.websiteUrl}</span>
+                  </div>
+                  <div>
+                    <span className="text-gray-400">Kontakt:</span>
+                    <span className="text-white ml-2">{booking.location?.contactEmail}</span>
+                  </div>
+                </div>
+              </div>
+            </div>
+
+            {/* LexOffice IDs (if present) */}
+            {(booking.lexofficeContactId || booking.lexofficeOfferId || booking.lexofficeConfirmationId) && (
+              <div className="mt-6 bg-gradient-to-br from-gray-800 to-gray-900 border border-gray-700 rounded-xl p-6 shadow-lg">
+                <h3 className="text-xl font-bold text-white mb-4">LexOffice Integration</h3>
+                <div className="grid grid-cols-1 md:grid-cols-3 gap-4 text-sm">
+                  {booking.lexofficeContactId && (
+                    <div>
+                      <span className="text-gray-400">Kontakt-ID:</span>
+                      <span className="text-white ml-2 font-mono text-xs">{booking.lexofficeContactId}</span>
+                    </div>
+                  )}
+                  {booking.lexofficeOfferId && (
+                    <div>
+                      <span className="text-gray-400">Angebots-ID:</span>
+                      <span className="text-white ml-2 font-mono text-xs">{booking.lexofficeOfferId}</span>
+                    </div>
+                  )}
+                  {booking.lexofficeConfirmationId && (
+                    <div>
+                      <span className="text-gray-400">Bestätigungs-ID:</span>
+                      <span className="text-white ml-2 font-mono text-xs">{booking.lexofficeConfirmationId}</span>
+                    </div>
+                  )}
+                </div>
+              </div>
+            )}
+          </div>
         </main>
       </div>
     </div>

app/dashboard/page.tsx

@@ -7,6 +7,11 @@ import DashboardSidebar from '@/components/DashboardSidebar';
 export default async function DashboardPage() {
   const session = await getServerSession(authOptions);
 
+  const isTestMode = process.env.TEST_MODE === 'true';
+  const testEmailRecipient = process.env.TEST_EMAIL_RECIPIENT;
+  const emailEnabled = process.env.EMAIL_ENABLED !== 'false';
+  const autoWorkflows = process.env.AUTO_WORKFLOWS === 'true';
+
   const stats = {
     totalBookings: await prisma.booking.count(),
     reservedBookings: await prisma.booking.count({
@@ -41,6 +46,47 @@ export default async function DashboardPage() {
       <div className="flex">
         <DashboardSidebar user={session?.user} />
         <main className="flex-1 p-8">
+          {/* Development Mode Warning Banner */}
+          {isTestMode && (
+            <div className="mb-6 bg-yellow-500/10 border-2 border-yellow-500 rounded-xl p-4 shadow-lg">
+              <div className="flex items-start gap-3">
+                <div className="text-3xl">🧪</div>
+                <div className="flex-1">
+                  <h3 className="text-lg font-bold text-yellow-400 mb-1">
+                    TEST-MODUS AKTIV
+                  </h3>
+                  <p className="text-yellow-200 text-sm mb-2">
+                    Alle E-Mails werden an <strong>{testEmailRecipient || 'Test-E-Mail'}</strong> umgeleitet.
+                    <br />
+                    Echte Kunden erhalten KEINE E-Mails!
+                  </p>
+                  <div className="flex gap-4 text-xs text-yellow-300/80">
+                    <span>📧 E-Mails: {emailEnabled ? '✅ Aktiv' : '❌ Deaktiviert'}</span>
+                    <span>🤖 Auto-Workflows: {autoWorkflows ? '✅ Aktiv' : '❌ Deaktiviert'}</span>
+                  </div>
+                </div>
+              </div>
+            </div>
+          )}
+
+          {!emailEnabled && !isTestMode && (
+            <div className="mb-6 bg-red-500/10 border-2 border-red-500 rounded-xl p-4 shadow-lg">
+              <div className="flex items-start gap-3">
+                <div className="text-3xl">⚠️</div>
+                <div className="flex-1">
+                  <h3 className="text-lg font-bold text-red-400 mb-1">
+                    E-MAIL-VERSAND DEAKTIVIERT
+                  </h3>
+                  <p className="text-red-200 text-sm">
+                    EMAIL_ENABLED=false - Kunden erhalten keine E-Mails!
+                    <br />
+                    Setzen Sie EMAIL_ENABLED="true" in der .env Datei.
+                  </p>
+                </div>
+              </div>
+            </div>
+          )}
+
           <DashboardContent 
             user={session?.user} 
             stats={stats} 

app/dashboard/tours/new/page.tsx

@@ -0,0 +1,377 @@
+'use client';
+
+import { useState, useEffect } from 'react';
+import { useRouter } from 'next/navigation';
+import { FiCalendar, FiTruck, FiCheckSquare, FiSquare, FiMapPin, FiClock, FiSave, FiAlertCircle } from 'react-icons/fi';
+
+interface Driver {
+  id: string;
+  name: string;
+  email: string;
+  vehiclePlate: string | null;
+  vehicleModel: string | null;
+  available: boolean;
+}
+
+interface Booking {
+  id: string;
+  bookingNumber: string;
+  customerName: string;
+  eventDate: string;
+  eventAddress: string;
+  eventCity: string;
+  eventZip: string;
+  setupTimeStart: string;
+  setupTimeLatest: string;
+  status: string;
+}
+
+export default function NewTourPage() {
+  const router = useRouter();
+  const [loading, setLoading] = useState(true);
+  const [creating, setCreating] = useState(false);
+  const [error, setError] = useState<string | null>(null);
+  
+  const [drivers, setDrivers] = useState<Driver[]>([]);
+  const [bookings, setBookings] = useState<Booking[]>([]);
+  
+  const [tourDate, setTourDate] = useState('');
+  const [selectedDriver, setSelectedDriver] = useState('');
+  const [selectedBookings, setSelectedBookings] = useState<Set<string>>(new Set());
+  const [optimizationType, setOptimizationType] = useState<'fastest' | 'schedule'>('fastest');
+
+  useEffect(() => {
+    loadData();
+  }, []);
+
+  const loadData = async () => {
+    try {
+      setLoading(true);
+      setError(null);
+
+      const [driversRes, bookingsRes] = await Promise.all([
+        fetch('/api/drivers?available=true'),
+        fetch('/api/bookings?status=READY_FOR_ASSIGNMENT,OPEN_FOR_DRIVERS'),
+      ]);
+
+      if (!driversRes.ok || !bookingsRes.ok) {
+        throw new Error('Fehler beim Laden der Daten');
+      }
+
+      const driversData = await driversRes.json();
+      const bookingsData = await bookingsRes.json();
+
+      setDrivers(driversData.drivers || []);
+      setBookings(bookingsData.bookings || []);
+    } catch (err: any) {
+      setError(err.message || 'Fehler beim Laden der Daten');
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  const toggleBooking = (bookingId: string) => {
+    const newSelected = new Set(selectedBookings);
+    if (newSelected.has(bookingId)) {
+      newSelected.delete(bookingId);
+    } else {
+      newSelected.add(bookingId);
+    }
+    setSelectedBookings(newSelected);
+  };
+
+  const selectAllOnDate = () => {
+    if (!tourDate) return;
+    
+    const targetDate = new Date(tourDate).toISOString().split('T')[0];
+    const newSelected = new Set(selectedBookings);
+    
+    bookings.forEach((booking) => {
+      const bookingDate = new Date(booking.eventDate).toISOString().split('T')[0];
+      if (bookingDate === targetDate) {
+        newSelected.add(booking.id);
+      }
+    });
+    
+    setSelectedBookings(newSelected);
+  };
+
+  const handleSubmit = async (e: React.FormEvent) => {
+    e.preventDefault();
+    
+    if (!tourDate) {
+      setError('Bitte wähle ein Tourdatum');
+      return;
+    }
+    
+    if (selectedBookings.size === 0) {
+      setError('Bitte wähle mindestens eine Buchung aus');
+      return;
+    }
+
+    try {
+      setCreating(true);
+      setError(null);
+
+      const response = await fetch('/api/tours', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({
+          tourDate,
+          driverId: selectedDriver || null,
+          bookingIds: Array.from(selectedBookings),
+          optimizationType,
+        }),
+      });
+
+      if (!response.ok) {
+        const data = await response.json();
+        throw new Error(data.error || 'Fehler beim Erstellen der Tour');
+      }
+
+      const { tour } = await response.json();
+      router.push(`/dashboard/tours/${tour.id}`);
+    } catch (err: any) {
+      setError(err.message || 'Fehler beim Erstellen der Tour');
+      setCreating(false);
+    }
+  };
+
+  const groupedBookings = bookings.reduce((acc, booking) => {
+    const date = new Date(booking.eventDate).toLocaleDateString('de-DE', {
+      weekday: 'short',
+      day: '2-digit',
+      month: '2-digit',
+      year: 'numeric',
+    });
+    if (!acc[date]) acc[date] = [];
+    acc[date].push(booking);
+    return acc;
+  }, {} as Record<string, Booking[]>);
+
+  if (loading) {
+    return (
+      <div className="p-8 flex items-center justify-center">
+        <div className="text-gray-400">Lade Daten...</div>
+      </div>
+    );
+  }
+
+  return (
+    <div className="p-8 max-w-6xl mx-auto">
+      <div className="mb-8">
+        <h1 className="text-3xl font-bold text-white mb-2">Neue Tour erstellen</h1>
+        <p className="text-gray-400">Wähle Buchungen aus und weise sie einem Fahrer zu</p>
+      </div>
+
+      {error && (
+        <div className="mb-6 bg-red-500/10 border border-red-500/50 rounded-lg p-4 flex items-start gap-3">
+          <FiAlertCircle className="text-red-400 mt-0.5 flex-shrink-0" size={20} />
+          <div className="text-red-400">{error}</div>
+        </div>
+      )}
+
+      <form onSubmit={handleSubmit} className="space-y-6">
+        <div className="grid md:grid-cols-2 gap-6">
+          <div className="bg-gray-800/50 border border-gray-700 rounded-lg p-6">
+            <label className="block text-sm font-medium text-gray-300 mb-2">
+              <FiCalendar className="inline mr-2" />
+              Tourdatum *
+            </label>
+            <input
+              type="date"
+              value={tourDate}
+              onChange={(e) => setTourDate(e.target.value)}
+              required
+              className="w-full px-4 py-2 bg-gray-900 border border-gray-700 rounded-lg text-white focus:border-pink-500 focus:outline-none"
+            />
+            {tourDate && (
+              <button
+                type="button"
+                onClick={selectAllOnDate}
+                className="mt-2 text-sm text-pink-400 hover:text-pink-300"
+              >
+                Alle Buchungen an diesem Tag auswählen
+              </button>
+            )}
+          </div>
+
+          <div className="bg-gray-800/50 border border-gray-700 rounded-lg p-6">
+            <label className="block text-sm font-medium text-gray-300 mb-2">
+              <FiTruck className="inline mr-2" />
+              Fahrer zuweisen (optional)
+            </label>
+            <select
+              value={selectedDriver}
+              onChange={(e) => setSelectedDriver(e.target.value)}
+              className="w-full px-4 py-2 bg-gray-900 border border-gray-700 rounded-lg text-white focus:border-pink-500 focus:outline-none"
+            >
+              <option value="">-- Später zuweisen --</option>
+              {drivers.map((driver) => (
+                <option key={driver.id} value={driver.id}>
+                  {driver.name}
+                  {driver.vehiclePlate && ` (${driver.vehiclePlate})`}
+                </option>
+              ))}
+            </select>
+            {drivers.length === 0 && (
+              <p className="mt-2 text-sm text-yellow-400">
+                Keine verfügbaren Fahrer
+              </p>
+            )}
+          </div>
+        </div>
+
+        <div className="bg-gray-800/50 border border-gray-700 rounded-lg p-6">
+          <label className="block text-sm font-medium text-gray-300 mb-4">
+            Route-Optimierung
+          </label>
+          <div className="flex gap-4">
+            <label className="flex items-center gap-2 cursor-pointer">
+              <input
+                type="radio"
+                value="fastest"
+                checked={optimizationType === 'fastest'}
+                onChange={(e) => setOptimizationType(e.target.value as 'fastest')}
+                className="text-pink-500 focus:ring-pink-500"
+              />
+              <span className="text-white">Kürzeste Route</span>
+              <span className="text-gray-400 text-sm">(Entfernung)</span>
+            </label>
+            <label className="flex items-center gap-2 cursor-pointer">
+              <input
+                type="radio"
+                value="schedule"
+                checked={optimizationType === 'schedule'}
+                onChange={(e) => setOptimizationType(e.target.value as 'schedule')}
+                className="text-pink-500 focus:ring-pink-500"
+              />
+              <span className="text-white">Nach Zeitfenster</span>
+              <span className="text-gray-400 text-sm">(Aufbauzeiten)</span>
+            </label>
+          </div>
+        </div>
+
+        <div className="bg-gray-800/50 border border-gray-700 rounded-lg p-6">
+          <div className="flex items-center justify-between mb-4">
+            <label className="text-sm font-medium text-gray-300">
+              Buchungen auswählen * ({selectedBookings.size} ausgewählt)
+            </label>
+            <button
+              type="button"
+              onClick={() => {
+                if (selectedBookings.size === bookings.length) {
+                  setSelectedBookings(new Set());
+                } else {
+                  setSelectedBookings(new Set(bookings.map(b => b.id)));
+                }
+              }}
+              className="text-sm text-pink-400 hover:text-pink-300"
+            >
+              {selectedBookings.size === bookings.length ? 'Alle abwählen' : 'Alle auswählen'}
+            </button>
+          </div>
+
+          {bookings.length === 0 ? (
+            <div className="text-center py-8 text-gray-400">
+              <FiMapPin className="mx-auto mb-2" size={32} />
+              <p>Keine verfügbaren Buchungen</p>
+              <p className="text-sm mt-1">
+                Buchungen müssen den Status "Bereit zur Zuweisung" oder "Offen für Fahrer" haben
+              </p>
+            </div>
+          ) : (
+            <div className="space-y-4 max-h-[500px] overflow-y-auto">
+              {Object.entries(groupedBookings).map(([date, dateBookings]) => (
+                <div key={date}>
+                  <div className="text-sm font-medium text-gray-400 mb-2 sticky top-0 bg-gray-800/90 py-2">
+                    {date}
+                  </div>
+                  <div className="space-y-2">
+                    {dateBookings.map((booking) => (
+                      <div
+                        key={booking.id}
+                        onClick={() => toggleBooking(booking.id)}
+                        className={`
+                          p-4 rounded-lg border cursor-pointer transition-all
+                          ${selectedBookings.has(booking.id)
+                            ? 'bg-pink-500/10 border-pink-500/50'
+                            : 'bg-gray-900/50 border-gray-700 hover:border-gray-600'
+                          }
+                        `}
+                      >
+                        <div className="flex items-start gap-3">
+                          <div className="mt-1">
+                            {selectedBookings.has(booking.id) ? (
+                              <FiCheckSquare className="text-pink-400" size={20} />
+                            ) : (
+                              <FiSquare className="text-gray-500" size={20} />
+                            )}
+                          </div>
+                          
+                          <div className="flex-1">
+                            <div className="flex items-center gap-2 mb-1">
+                              <span className="font-medium text-white">
+                                {booking.bookingNumber}
+                              </span>
+                              <span className="text-gray-400">•</span>
+                              <span className="text-gray-300">
+                                {booking.customerName}
+                              </span>
+                            </div>
+                            
+                            <div className="flex items-center gap-4 text-sm text-gray-400">
+                              <div className="flex items-center gap-1">
+                                <FiMapPin size={14} />
+                                {booking.eventCity}
+                              </div>
+                              <div className="flex items-center gap-1">
+                                <FiClock size={14} />
+                                {new Date(booking.setupTimeStart).toLocaleTimeString('de-DE', {
+                                  hour: '2-digit',
+                                  minute: '2-digit',
+                                })}
+                                {' - '}
+                                {new Date(booking.setupTimeLatest).toLocaleTimeString('de-DE', {
+                                  hour: '2-digit',
+                                  minute: '2-digit',
+                                })}
+                              </div>
+                            </div>
+                            
+                            <div className="text-sm text-gray-500 mt-1">
+                              {booking.eventAddress}, {booking.eventZip} {booking.eventCity}
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    ))}
+                  </div>
+                </div>
+              ))}
+            </div>
+          )}
+        </div>
+
+        <div className="flex gap-4">
+          <button
+            type="button"
+            onClick={() => router.back()}
+            disabled={creating}
+            className="px-6 py-3 bg-gray-700 text-white rounded-lg hover:bg-gray-600 transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
+          >
+            Abbrechen
+          </button>
+          <button
+            type="submit"
+            disabled={creating || selectedBookings.size === 0 || !tourDate}
+            className="flex-1 flex items-center justify-center gap-2 px-6 py-3 bg-gradient-to-r from-pink-600 to-red-600 text-white rounded-lg hover:from-pink-700 hover:to-red-700 transition-all disabled:opacity-50 disabled:cursor-not-allowed shadow-lg"
+          >
+            <FiSave />
+            {creating ? 'Erstelle Tour...' : 'Tour erstellen'}
+          </button>
+        </div>
+      </form>
+    </div>
+  );
+}

app/dashboard/tours/page.tsx

@@ -1,430 +1,209 @@
-'use client';
+import { getServerSession } from 'next-auth';
+import { authOptions } from '@/lib/auth';
+import { redirect } from 'next/navigation';
+import { prisma } from '@/lib/prisma';
+import Link from 'next/link';
+import { FiPlus, FiCalendar, FiTruck, FiMapPin, FiClock } from 'react-icons/fi';
 
-import { useState, useEffect } from 'react';
-import { useRouter } from 'next/navigation';
-import { formatDate } from '@/lib/date-utils';
-import DashboardSidebar from '@/components/DashboardSidebar';
-import { useSession } from 'next-auth/react';
+export default async function ToursPage() {
+  const session = await getServerSession(authOptions);
 
-export default function ToursPage() {
-  const router = useRouter();
-  const { data: session } = useSession();
-  const [tours, setTours] = useState<any[]>([]);
-  const [drivers, setDrivers] = useState<any[]>([]);
-  const [bookings, setBookings] = useState<any[]>([]);
-  const [loading, setLoading] = useState(true);
-  const [showForm, setShowForm] = useState(false);
+  if (!session || session.user.role !== 'ADMIN') {
+    redirect('/login');
+  }
 
-  const [formData, setFormData] = useState({
-    tourDate: '',
-    driverId: '',
-    bookingIds: [] as string[],
-    optimizationType: 'fastest' as 'fastest' | 'schedule',
+  // Hole alle Touren, sortiert nach Datum
+  const tours = await prisma.tour.findMany({
+    include: {
+      driver: {
+        select: {
+          id: true,
+          name: true,
+          vehiclePlate: true,
+        },
+      },
+      bookings: {
+        select: {
+          id: true,
+          bookingNumber: true,
+          customerName: true,
+          eventCity: true,
+        },
+      },
+      tourStops: {
+        select: {
+          id: true,
+          status: true,
+        },
+      },
+    },
+    orderBy: {
+      tourDate: 'desc',
+    },
+    take: 50,
   });
 
-  useEffect(() => {
-    fetchTours();
-    fetchDrivers();
-    fetchUnassignedBookings();
-  }, []);
-
-  const fetchTours = async () => {
-    try {
-      const res = await fetch('/api/tours');
-      const data = await res.json();
-      setTours(data.tours || []);
-    } catch (error) {
-      console.error('Fetch error:', error);
-    } finally {
-      setLoading(false);
+  const getStatusColor = (status: string) => {
+    switch (status) {
+      case 'PLANNED': return 'bg-blue-500/20 text-blue-400 border-blue-500/50';
+      case 'IN_PROGRESS': return 'bg-yellow-500/20 text-yellow-400 border-yellow-500/50';
+      case 'COMPLETED': return 'bg-green-500/20 text-green-400 border-green-500/50';
+      case 'CANCELLED': return 'bg-red-500/20 text-red-400 border-red-500/50';
+      default: return 'bg-gray-500/20 text-gray-400 border-gray-500/50';
     }
   };
 
-  const fetchDrivers = async () => {
-    try {
-      const res = await fetch('/api/drivers?available=true');
-      const data = await res.json();
-      setDrivers(data.drivers || []);
-    } catch (error) {
-      console.error('Drivers fetch error:', error);
-    }
-  };
-
-  const fetchUnassignedBookings = async () => {
-    try {
-      const res = await fetch('/api/bookings');
-      const data = await res.json();
-      const unassigned = (data.bookings || []).filter((b: any) => {
-        // Must be confirmed and not assigned to a tour
-        if (!b.tourId && b.status === 'CONFIRMED') {
-          // If booking has setup windows, check if any are already selected
-          if (b.setupWindows && b.setupWindows.length > 0) {
-            const hasSelectedWindow = b.setupWindows.some((w: any) => w.selected);
-            return !hasSelectedWindow; // Exclude if any window is already selected
-          }
-          return true; // No setup windows, just check tourId
-        }
-        return false;
-      });
-      setBookings(unassigned);
-    } catch (error) {
-      console.error('Bookings fetch error:', error);
-    }
-  };
-
-  const handleSubmit = async (e: React.FormEvent) => {
-    e.preventDefault();
-    
-    try {
-      const res = await fetch('/api/tours', {
-        method: 'POST',
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify(formData),
-      });
-
-      if (res.ok) {
-        setShowForm(false);
-        setFormData({
-          tourDate: '',
-          driverId: '',
-          bookingIds: [],
-          optimizationType: 'fastest',
-        });
-        fetchTours();
-        fetchUnassignedBookings();
-      } else {
-        alert('Fehler beim Erstellen');
-      }
-    } catch (error) {
-      console.error('Create error:', error);
-      alert('Fehler beim Erstellen');
-    }
-  };
-
-  const toggleBooking = (bookingId: string) => {
-    setFormData(prev => ({
-      ...prev,
-      bookingIds: prev.bookingIds.includes(bookingId)
-        ? prev.bookingIds.filter(id => id !== bookingId)
-        : [...prev.bookingIds, bookingId],
-    }));
-  };
-
-  // Filter bookings by selected tour date
-  const availableBookings = formData.tourDate
-    ? bookings.filter(booking => {
-        const bookingDate = new Date(booking.eventDate).toISOString().split('T')[0];
-        const tourDate = formData.tourDate;
-        
-        // Check if event date matches
-        if (bookingDate === tourDate) return true;
-        
-        // Check if any setup window date matches
-        if (booking.setupWindows && booking.setupWindows.length > 0) {
-          return booking.setupWindows.some((window: any) => {
-            const windowDate = new Date(window.setupDate).toISOString().split('T')[0];
-            return windowDate === tourDate && !window.selected;
-          });
-        }
-        
-        return false;
-      })
-    : bookings;
-
-  // Group bookings by date for display
-  const bookingsByDate = bookings.reduce((acc: any, booking: any) => {
-    const date = new Date(booking.eventDate).toISOString().split('T')[0];
-    if (!acc[date]) acc[date] = [];
-    acc[date].push(booking);
-    return acc;
-  }, {});
-
-  const getStatusBadge = (status: string) => {
-    const styles: Record<string, string> = {
-      PLANNED: 'bg-blue-500/20 text-blue-400 border-blue-500/50',
-      IN_PROGRESS: 'bg-yellow-500/20 text-yellow-400 border-yellow-500/50',
-      COMPLETED: 'bg-green-500/20 text-green-400 border-green-500/50',
-      CANCELLED: 'bg-red-500/20 text-red-400 border-red-500/50',
-    };
-    return styles[status] || 'bg-gray-500/20 text-gray-400 border-gray-500/50';
-  };
-
   const getStatusLabel = (status: string) => {
-    const labels: Record<string, string> = {
-      PLANNED: 'Geplant',
-      IN_PROGRESS: 'In Arbeit',
-      COMPLETED: 'Abgeschlossen',
-      CANCELLED: 'Abgebrochen',
-    };
-    return labels[status] || status;
+    switch (status) {
+      case 'PLANNED': return 'Geplant';
+      case 'IN_PROGRESS': return 'Unterwegs';
+      case 'COMPLETED': return 'Abgeschlossen';
+      case 'CANCELLED': return 'Storniert';
+      default: return status;
+    }
   };
 
-  if (loading) {
-    return (
-      <div className="min-h-screen bg-gradient-to-br from-gray-900 via-gray-800 to-gray-900">
-        <div className="flex">
-          <DashboardSidebar user={session?.user} />
-          <div className="flex-1 p-8">
-            <p className="text-gray-300">Lädt...</p>
-          </div>
-        </div>
-      </div>
-    );
-  }
-
   return (
-    <div className="min-h-screen bg-gradient-to-br from-gray-900 via-gray-800 to-gray-900">
-      <div className="flex">
-        <DashboardSidebar user={session?.user} />
-        <main className="flex-1 p-8">
-          <div className="max-w-7xl mx-auto">
-        <div className="flex justify-between items-center mb-8">
-          <div>
-            <h1 className="text-3xl font-bold bg-gradient-to-r from-blue-400 to-cyan-500 bg-clip-text text-transparent">
-              Touren
-            </h1>
-            <p className="text-gray-400 mt-1">Verwalten Sie Fahrer-Touren</p>
-          </div>
-          <button
-            onClick={() => setShowForm(true)}
-            className="px-6 py-3 bg-gradient-to-r from-blue-600 to-cyan-600 text-white rounded-lg hover:from-blue-700 hover:to-cyan-700 font-semibold shadow-lg"
-          >
-            + Neue Tour
-          </button>
+    <div className="p-8">
+      <div className="mb-8">
+        <Link
+          href="/dashboard"
+          className="text-sm text-gray-400 hover:text-gray-300 mb-2 inline-block transition-colors"
+        >
+          ← Zurück zum Dashboard
+        </Link>
+        <div className="flex justify-between items-center">
+        <div>
+          <h1 className="text-3xl font-bold text-white">Touren</h1>
+          <p className="text-gray-400 mt-1">Verwalte Fahrer-Touren und Route-Optimierung</p>
         </div>
+        <Link
+          href="/dashboard/tours/new"
+          className="flex items-center gap-2 px-4 py-2 bg-gradient-to-r from-pink-600 to-red-600 text-white rounded-lg hover:from-pink-700 hover:to-red-700 transition-all shadow-lg"
+        >
+          <FiPlus />
+          Neue Tour erstellen
+        </Link>
+      </div>
+      </div>
 
-        {showForm && (
-          <div className="fixed inset-0 bg-black bg-opacity-70 flex items-center justify-center p-4 z-50 overflow-y-auto">
-            <div className="bg-gradient-to-br from-gray-800 to-gray-900 rounded-xl shadow-2xl max-w-3xl w-full p-8 border border-gray-700 my-8">
-              <h2 className="text-2xl font-bold mb-6 text-white">Neue Tour erstellen</h2>
-              <form onSubmit={handleSubmit} className="space-y-6">
-                <div className="grid grid-cols-2 gap-4">
-                  <div>
-                    <label className="block text-sm font-medium text-gray-300 mb-2">
-                      Tour-Datum *
-                    </label>
-                    <input
-                      type="date"
-                      value={formData.tourDate}
-                      onChange={(e) => setFormData({ ...formData, tourDate: e.target.value })}
-                      className="w-full px-4 py-2 bg-gray-700 border border-gray-600 text-white rounded-lg focus:ring-2 focus:ring-blue-500"
-                      required
-                    />
-                  </div>
+      {tours.length === 0 ? (
+        <div className="bg-gray-800/50 border border-gray-700 rounded-lg p-12 text-center">
+          <FiTruck className="mx-auto text-gray-500 text-5xl mb-4" />
+          <h3 className="text-xl font-bold text-gray-300 mb-2">Noch keine Touren</h3>
+          <p className="text-gray-400 mb-6">Erstelle deine erste Tour, um Buchungen zu Fahrern zuzuweisen.</p>
+          <Link
+            href="/dashboard/tours/new"
+            className="inline-flex items-center gap-2 px-4 py-2 bg-gradient-to-r from-pink-600 to-red-600 text-white rounded-lg hover:from-pink-700 hover:to-red-700 transition-all"
+          >
+            <FiPlus />
+            Tour erstellen
+          </Link>
+        </div>
+      ) : (
+        <div className="grid gap-4">
+          {tours.map((tour) => {
+            const completedStops = tour.tourStops.filter(s => 
+              s.status === 'SETUP_COMPLETE' || s.status === 'PICKUP_COMPLETE'
+            ).length;
+            const totalStops = tour.tourStops.length;
+            const progress = totalStops > 0 ? (completedStops / totalStops) * 100 : 0;
 
-                  <div>
-                    <label className="block text-sm font-medium text-gray-300 mb-2">
-                      Fahrer
-                    </label>
-                    <select
-                      value={formData.driverId}
-                      onChange={(e) => setFormData({ ...formData, driverId: e.target.value })}
-                      className="w-full px-4 py-2 bg-gray-700 border border-gray-600 text-white rounded-lg focus:ring-2 focus:ring-blue-500"
-                    >
-                      <option value="">Noch keinen Fahrer zuweisen</option>
-                      {drivers.map((driver) => (
-                        <option key={driver.id} value={driver.id}>
-                          {driver.name} {driver.vehiclePlate ? `(${driver.vehiclePlate})` : ''}
-                        </option>
-                      ))}
-                    </select>
-                  </div>
-                </div>
-
-                <div>
-                  <label className="block text-sm font-medium text-gray-300 mb-2">
-                    Routen-Optimierung
-                  </label>
-                  <div className="grid grid-cols-2 gap-3">
-                    <button
-                      type="button"
-                      onClick={() => setFormData({ ...formData, optimizationType: 'fastest' })}
-                      className={`px-4 py-3 rounded-lg border-2 transition-all ${
-                        formData.optimizationType === 'fastest'
-                          ? 'bg-blue-600 border-blue-500 text-white'
-                          : 'bg-gray-700 border-gray-600 text-gray-300 hover:border-gray-500'
-                      }`}
-                    >
-                      <div className="font-semibold">🚗 Schnellste Route</div>
-                      <div className="text-xs mt-1 opacity-80">Nach Distanz/Zeit</div>
-                    </button>
-                    <button
-                      type="button"
-                      onClick={() => setFormData({ ...formData, optimizationType: 'schedule' })}
-                      className={`px-4 py-3 rounded-lg border-2 transition-all ${
-                        formData.optimizationType === 'schedule'
-                          ? 'bg-purple-600 border-purple-500 text-white'
-                          : 'bg-gray-700 border-gray-600 text-gray-300 hover:border-gray-500'
-                      }`}
-                    >
-                      <div className="font-semibold">⏰ Nach Aufbauzeiten</div>
-                      <div className="text-xs mt-1 opacity-80">Zeitfenster beachten</div>
-                    </button>
-                  </div>
-                  <p className="text-xs text-gray-400 mt-2">
-                    {formData.optimizationType === 'fastest' 
-                      ? 'Optimiert nach kürzester Strecke/Zeit'
-                      : 'Berücksichtigt Aufbau-Zeitfenster der Buchungen'}
-                  </p>
-                </div>
-
-                <div>
-                  <label className="block text-sm font-medium text-gray-300 mb-2">
-                    Buchungen zuordnen ({formData.bookingIds.length} ausgewählt)
-                  </label>
-                  
-                  {!formData.tourDate && (
-                    <div className="bg-yellow-500/20 border border-yellow-500/50 rounded-lg p-4 mb-4">
-                      <p className="text-yellow-300 text-sm">
-                        ⚠️ Bitte wähle zuerst ein Tour-Datum aus, um passende Buchungen zu sehen
-                      </p>
+            return (
+              <Link
+                key={tour.id}
+                href={`/dashboard/tours/${tour.id}`}
+                className="block bg-gray-800/50 border border-gray-700 rounded-lg p-6 hover:border-pink-500/50 hover:bg-gray-800/70 transition-all"
+              >
+                <div className="flex items-start justify-between mb-4">
+                  <div className="flex-1">
+                    <div className="flex items-center gap-3 mb-2">
+                      <h3 className="text-xl font-bold text-white">{tour.tourNumber}</h3>
+                      <span className={`px-3 py-1 rounded-full text-xs font-medium border ${getStatusColor(tour.status)}`}>
+                        {getStatusLabel(tour.status)}
+                      </span>
                     </div>
-                  )}
-
-                  {formData.tourDate && availableBookings.length === 0 && (
-                    <div className="bg-blue-500/20 border border-blue-500/50 rounded-lg p-4 mb-4">
-                      <p className="text-blue-300 text-sm">
-                        ℹ️ Keine bestätigten Buchungen für {new Date(formData.tourDate).toLocaleDateString('de-DE')} gefunden
-                      </p>
-                    </div>
-                  )}
-
-                  <div className="bg-gray-700/50 border border-gray-600 rounded-lg p-4 max-h-64 overflow-y-auto">
-                    {availableBookings.length > 0 ? (
-                      <div className="space-y-2">
-                        {availableBookings.map((booking) => {
-                          const bookingDate = new Date(booking.eventDate).toISOString().split('T')[0];
-                          const isEventDate = bookingDate === formData.tourDate;
-                          const matchingWindows = booking.setupWindows?.filter((w: any) => {
-                            const windowDate = new Date(w.setupDate).toISOString().split('T')[0];
-                            return windowDate === formData.tourDate && !w.selected;
-                          }) || [];
-                          
-                          return (
-                            <label
-                              key={booking.id}
-                              className="flex items-center gap-3 p-3 bg-gray-700 rounded-lg cursor-pointer hover:bg-gray-600"
-                            >
-                              <input
-                                type="checkbox"
-                                checked={formData.bookingIds.includes(booking.id)}
-                                onChange={() => toggleBooking(booking.id)}
-                                className="w-4 h-4"
-                              />
-                              <div className="flex-1">
-                                <div className="flex items-center gap-2">
-                                  <p className="text-white font-medium">{booking.bookingNumber}</p>
-                                  {!isEventDate && matchingWindows.length > 0 && (
-                                    <span className="px-2 py-0.5 bg-purple-600 text-white text-xs rounded-full">
-                                      📦 Flexibler Aufbau
-                                    </span>
-                                  )}
-                                </div>
-                                <p className="text-sm text-gray-400">
-                                  {booking.customerName} - Event: {formatDate(booking.eventDate)}
-                                </p>
-                                <p className="text-xs text-gray-500">{booking.eventAddress}, {booking.eventCity}</p>
-                                
-                                {!isEventDate && matchingWindows.length > 0 && (
-                                  <div className="mt-2 space-y-1">
-                                    {matchingWindows.map((window: any) => (
-                                      <p key={window.id} className="text-xs text-purple-400">
-                                        🕐 Aufbau-Option: {new Date(window.setupTimeStart).toLocaleTimeString('de-DE', { hour: '2-digit', minute: '2-digit' })}
-                                        {' - '}
-                                        {new Date(window.setupTimeEnd).toLocaleTimeString('de-DE', { hour: '2-digit', minute: '2-digit' })}
-                                        {window.preferred && ' ⭐'}
-                                      </p>
-                                    ))}
-                                  </div>
-                                )}
-                                
-                                {isEventDate && booking.setupTimeStart && (
-                                  <p className="text-xs text-blue-400 mt-1">
-                                    ⏰ Aufbau: {new Date(booking.setupTimeStart).toLocaleTimeString('de-DE', { hour: '2-digit', minute: '2-digit' })}
-                                    {booking.setupTimeLatest && ` - ${new Date(booking.setupTimeLatest).toLocaleTimeString('de-DE', { hour: '2-digit', minute: '2-digit' })}`}
-                                  </p>
-                                )}
-                              </div>
-                            </label>
-                          );
+                    
+                    <div className="flex items-center gap-6 text-sm text-gray-400">
+                      <div className="flex items-center gap-2">
+                        <FiCalendar size={16} />
+                        {new Date(tour.tourDate).toLocaleDateString('de-DE', {
+                          weekday: 'short',
+                          day: '2-digit',
+                          month: '2-digit',
+                          year: 'numeric'
                         })}
                       </div>
-                    ) : (
-                      <p className="text-gray-400 text-center py-4">
-                        {formData.tourDate ? 'Keine Buchungen für dieses Datum' : 'Bitte Datum auswählen'}
-                      </p>
-                    )}
+                      
+                      {tour.driver && (
+                        <div className="flex items-center gap-2">
+                          <FiTruck size={16} />
+                          {tour.driver.name}
+                          {tour.driver.vehiclePlate && (
+                            <span className="text-gray-500">({tour.driver.vehiclePlate})</span>
+                          )}
+                        </div>
+                      )}
+                      
+                      <div className="flex items-center gap-2">
+                        <FiMapPin size={16} />
+                        {totalStops} {totalStops === 1 ? 'Stopp' : 'Stopps'}
+                      </div>
+                      
+                      {tour.estimatedDuration && (
+                        <div className="flex items-center gap-2">
+                          <FiClock size={16} />
+                          {Math.round(tour.estimatedDuration / 60)}h
+                        </div>
+                      )}
+                    </div>
                   </div>
                 </div>
 
-                <div className="flex gap-4">
-                  <button
-                    type="button"
-                    onClick={() => setShowForm(false)}
-                    className="flex-1 px-6 py-3 bg-gray-700 text-gray-300 rounded-lg hover:bg-gray-600 font-semibold"
-                  >
-                    Abbrechen
-                  </button>
-                  <button
-                    type="submit"
-                    className="flex-1 px-6 py-3 bg-gradient-to-r from-blue-600 to-cyan-600 text-white rounded-lg hover:from-blue-700 hover:to-cyan-700 font-semibold"
-                  >
-                    Erstellen
-                  </button>
-                </div>
-              </form>
-            </div>
-          </div>
-        )}
+                {/* Fortschrittsbalken */}
+                {totalStops > 0 && tour.status !== 'CANCELLED' && (
+                  <div className="mt-4">
+                    <div className="flex justify-between items-center mb-1">
+                      <span className="text-xs text-gray-400">
+                        Fortschritt: {completedStops} von {totalStops} Stopps abgeschlossen
+                      </span>
+                      <span className="text-xs text-gray-400">{progress.toFixed(0)}%</span>
+                    </div>
+                    <div className="w-full bg-gray-700 rounded-full h-2">
+                      <div
+                        className="bg-gradient-to-r from-pink-500 to-red-500 h-2 rounded-full transition-all"
+                        style={{ width: `${progress}%` }}
+                      ></div>
+                    </div>
+                  </div>
+                )}
 
-        <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
-          {tours.map((tour) => (
-            <div
-              key={tour.id}
-              onClick={() => router.push(`/dashboard/tours/${tour.id}`)}
-              className="bg-gradient-to-br from-gray-800 to-gray-900 rounded-lg shadow-xl p-6 hover:shadow-2xl transition-all cursor-pointer border border-gray-700 hover:border-blue-500"
-            >
-              <div className="flex justify-between items-start mb-4">
-                <div>
-                  <h3 className="text-lg font-bold text-white">{tour.tourNumber}</h3>
-                  <p className="text-sm text-gray-400">{formatDate(tour.tourDate)}</p>
-                </div>
-                <span className={`px-3 py-1 text-xs font-semibold rounded-full border ${getStatusBadge(tour.status)}`}>
-                  {getStatusLabel(tour.status)}
-                </span>
-              </div>
-              
-              <div className="text-sm text-gray-400 space-y-2">
-                <p>
-                  <span className="font-medium text-gray-300">Fahrer:</span>{' '}
-                  {tour.driver ? tour.driver.name : 'Nicht zugewiesen'}
-                </p>
-                <p>
-                  <span className="font-medium text-gray-300">Buchungen:</span> {tour.bookings.length}
-                </p>
-                {tour.totalDistance && (
-                  <p>
-                    <span className="font-medium text-gray-300">Strecke:</span> {tour.totalDistance} km
-                  </p>
+                {/* Buchungen-Preview */}
+                {tour.bookings.length > 0 && (
+                  <div className="mt-4 pt-4 border-t border-gray-700">
+                    <div className="text-xs text-gray-400 mb-2">Buchungen:</div>
+                    <div className="flex flex-wrap gap-2">
+                      {tour.bookings.slice(0, 5).map((booking) => (
+                        <span
+                          key={booking.id}
+                          className="px-2 py-1 bg-gray-700/50 text-gray-300 text-xs rounded"
+                        >
+                          {booking.bookingNumber}
+                        </span>
+                      ))}
+                      {tour.bookings.length > 5 && (
+                        <span className="px-2 py-1 text-gray-500 text-xs">
+                          +{tour.bookings.length - 5} weitere
+                        </span>
+                      )}
+                    </div>
+                  </div>
                 )}
-                {tour.estimatedDuration && (
-                  <p>
-                    <span className="font-medium text-gray-300">Dauer:</span> ~{tour.estimatedDuration} Min
-                  </p>
-                )}
-              </div>
-            </div>
-          ))}
+              </Link>
+            );
+          })}
         </div>
-
-        {tours.length === 0 && (
-          <div className="text-center py-12">
-            <p className="text-gray-400">Noch keine Touren vorhanden</p>
-          </div>
-        )}
-      </div>
-    </main>
-      </div>
+      )}
     </div>
   );
 }

app/driver/tours/[id]/page.tsx

@@ -0,0 +1,457 @@
+'use client';
+
+import { useState, useEffect } from 'react';
+import { useRouter } from 'next/navigation';
+import { 
+  FiArrowLeft, 
+  FiMapPin, 
+  FiNavigation, 
+  FiCheckCircle,
+  FiClock,
+  FiCamera,
+  FiAlertCircle,
+  FiPhone,
+  FiMap
+} from 'react-icons/fi';
+
+interface TourStop {
+  id: string;
+  stopOrder: number;
+  stopType: string;
+  status: string;
+  arrivedAt: string | null;
+  setupStartedAt: string | null;
+  setupCompleteAt: string | null;
+  pickupStartedAt: string | null;
+  pickupCompleteAt: string | null;
+  notes: string | null;
+  issueDescription: string | null;
+  booking: {
+    id: string;
+    bookingNumber: string;
+    customerName: string;
+    customerPhone: string;
+    eventAddress: string;
+    eventCity: string;
+    eventZip: string;
+    eventLocation: string | null;
+    setupTimeStart: string;
+    setupTimeLatest: string;
+    photobox: {
+      model: string;
+      serialNumber: string;
+    } | null;
+  };
+  photos: Array<{
+    id: string;
+    photoType: string;
+    fileName: string;
+  }>;
+}
+
+interface Tour {
+  id: string;
+  tourNumber: string;
+  tourDate: string;
+  status: string;
+  totalDistance: number | null;
+  estimatedDuration: number | null;
+  tourStops: TourStop[];
+}
+
+export default function DriverTourDetailPage({ params }: { params: { id: string } }) {
+  const router = useRouter();
+  const [tour, setTour] = useState<Tour | null>(null);
+  const [loading, setLoading] = useState(true);
+  const [updating, setUpdating] = useState(false);
+  const [expandedStop, setExpandedStop] = useState<string | null>(null);
+
+  useEffect(() => {
+    loadTour();
+  }, [params.id]);
+
+  const loadTour = async () => {
+    try {
+      setLoading(true);
+      const res = await fetch(`/api/driver/tours/${params.id}`);
+      if (!res.ok) throw new Error('Tour nicht gefunden');
+      const data = await res.json();
+      setTour(data.tour);
+    } catch (error) {
+      console.error('Load error:', error);
+      alert('Fehler beim Laden der Tour');
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  const updateStopStatus = async (stopId: string, newStatus: string) => {
+    try {
+      setUpdating(true);
+      const res = await fetch(`/api/driver/tour-stops/${stopId}/status`, {
+        method: 'PATCH',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({ status: newStatus }),
+      });
+
+      if (!res.ok) throw new Error('Status-Update fehlgeschlagen');
+      
+      await loadTour();
+    } catch (error) {
+      console.error('Update error:', error);
+      alert('Fehler beim Aktualisieren des Status');
+    } finally {
+      setUpdating(false);
+    }
+  };
+
+  const startNavigation = (stop: TourStop) => {
+    const address = `${stop.booking.eventAddress}, ${stop.booking.eventZip} ${stop.booking.eventCity}`;
+    const googleMapsUrl = `https://www.google.com/maps/dir/?api=1&destination=${encodeURIComponent(address)}`;
+    window.open(googleMapsUrl, '_blank');
+  };
+
+  const getStatusColor = (status: string) => {
+    switch (status) {
+      case 'PENDING': return 'bg-gray-100 text-gray-700 border-gray-300';
+      case 'ARRIVED': return 'bg-blue-100 text-blue-700 border-blue-300';
+      case 'SETUP_IN_PROGRESS': return 'bg-yellow-100 text-yellow-700 border-yellow-300';
+      case 'SETUP_COMPLETE': return 'bg-green-100 text-green-700 border-green-300';
+      case 'PICKUP_IN_PROGRESS': return 'bg-orange-100 text-orange-700 border-orange-300';
+      case 'PICKUP_COMPLETE': return 'bg-emerald-100 text-emerald-700 border-emerald-300';
+      case 'ISSUE': return 'bg-red-100 text-red-700 border-red-300';
+      default: return 'bg-gray-100 text-gray-700 border-gray-300';
+    }
+  };
+
+  const getStatusLabel = (status: string) => {
+    switch (status) {
+      case 'PENDING': return 'Ausstehend';
+      case 'ARRIVED': return 'Angekommen';
+      case 'SETUP_IN_PROGRESS': return 'Aufbau läuft';
+      case 'SETUP_COMPLETE': return 'Aufgebaut';
+      case 'PICKUP_IN_PROGRESS': return 'Abbau läuft';
+      case 'PICKUP_COMPLETE': return 'Abgeholt';
+      case 'ISSUE': return 'Problem';
+      default: return status;
+    }
+  };
+
+  const getNextAction = (status: string) => {
+    switch (status) {
+      case 'PENDING': return { label: 'Angekommen', newStatus: 'ARRIVED', icon: FiMapPin };
+      case 'ARRIVED': return { label: 'Aufbau starten', newStatus: 'SETUP_IN_PROGRESS', icon: FiCheckCircle };
+      case 'SETUP_IN_PROGRESS': return { label: 'Aufbau abgeschlossen', newStatus: 'SETUP_COMPLETE', icon: FiCheckCircle };
+      case 'SETUP_COMPLETE': return { label: 'Abbau starten', newStatus: 'PICKUP_IN_PROGRESS', icon: FiCheckCircle };
+      case 'PICKUP_IN_PROGRESS': return { label: 'Abbau abgeschlossen', newStatus: 'PICKUP_COMPLETE', icon: FiCheckCircle };
+      default: return null;
+    }
+  };
+
+  if (loading) {
+    return (
+      <div className="min-h-screen bg-gray-50 flex items-center justify-center">
+        <div className="text-gray-600">Lade Tour...</div>
+      </div>
+    );
+  }
+
+  if (!tour) {
+    return (
+      <div className="min-h-screen bg-gray-50 flex items-center justify-center">
+        <div className="text-gray-600">Tour nicht gefunden</div>
+      </div>
+    );
+  }
+
+  const completedStops = tour.tourStops.filter(s => 
+    s.status === 'SETUP_COMPLETE' || s.status === 'PICKUP_COMPLETE'
+  ).length;
+  const totalStops = tour.tourStops.length;
+  const progress = totalStops > 0 ? (completedStops / totalStops) * 100 : 0;
+
+  return (
+    <div className="min-h-screen bg-gray-50">
+      <div className="sticky top-0 z-10 bg-white border-b border-gray-200 shadow-sm">
+        <div className="max-w-4xl mx-auto px-4 py-4">
+          <button
+            onClick={() => router.back()}
+            className="flex items-center gap-2 text-gray-600 hover:text-gray-900 mb-3"
+          >
+            <FiArrowLeft />
+            Zurück
+          </button>
+          
+          <div className="flex items-center justify-between">
+            <div>
+              <h1 className="text-2xl font-bold text-gray-900">{tour.tourNumber}</h1>
+              <p className="text-sm text-gray-600">
+                {new Date(tour.tourDate).toLocaleDateString('de-DE', {
+                  weekday: 'long',
+                  day: '2-digit',
+                  month: 'long',
+                  year: 'numeric'
+                })}
+              </p>
+            </div>
+            {tour.estimatedDuration && (
+              <div className="text-right">
+                <div className="text-sm text-gray-600">Geschätzte Dauer</div>
+                <div className="text-lg font-bold text-gray-900">
+                  {Math.floor(tour.estimatedDuration / 60)}h {tour.estimatedDuration % 60}min
+                </div>
+              </div>
+            )}
+          </div>
+
+          <div className="mt-4">
+            <div className="flex justify-between items-center mb-2">
+              <span className="text-sm text-gray-600">
+                Fortschritt: {completedStops} von {totalStops} Stopps
+              </span>
+              <span className="text-sm font-medium text-gray-900">
+                {progress.toFixed(0)}%
+              </span>
+            </div>
+            <div className="w-full bg-gray-200 rounded-full h-3">
+              <div
+                className="bg-green-500 h-3 rounded-full transition-all"
+                style={{ width: `${progress}%` }}
+              ></div>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <div className="max-w-4xl mx-auto px-4 py-6 space-y-4">
+        {tour.tourStops.length === 0 ? (
+          <div className="bg-white rounded-xl p-8 text-center border border-gray-200">
+            <FiMapPin className="mx-auto text-gray-400 mb-4" size={48} />
+            <p className="text-gray-600">Keine Stopps für diese Tour</p>
+          </div>
+        ) : (
+          tour.tourStops.map((stop, index) => {
+            const isExpanded = expandedStop === stop.id;
+            const nextAction = getNextAction(stop.status);
+            const isCompleted = stop.status === 'SETUP_COMPLETE' || stop.status === 'PICKUP_COMPLETE';
+
+            return (
+              <div
+                key={stop.id}
+                className={`bg-white rounded-xl border-2 transition-all ${
+                  isCompleted 
+                    ? 'border-green-300 bg-green-50/30' 
+                    : stop.status === 'ISSUE'
+                    ? 'border-red-300'
+                    : 'border-gray-200'
+                }`}
+              >
+                <div className="p-4">
+                  <div className="flex items-start gap-4">
+                    <div className={`flex-shrink-0 w-10 h-10 rounded-full flex items-center justify-center text-white font-bold ${
+                      isCompleted ? 'bg-green-500' : 'bg-gray-400'
+                    }`}>
+                      {isCompleted ? <FiCheckCircle size={20} /> : index + 1}
+                    </div>
+                    
+                    <div className="flex-1">
+                      <div className="flex items-start justify-between mb-2">
+                        <div>
+                          <h3 className="font-bold text-gray-900">
+                            {stop.booking.customerName}
+                          </h3>
+                          <p className="text-sm text-gray-600">
+                            {stop.booking.bookingNumber}
+                          </p>
+                        </div>
+                        <span className={`px-3 py-1 rounded-full text-xs font-medium border ${getStatusColor(stop.status)}`}>
+                          {getStatusLabel(stop.status)}
+                        </span>
+                      </div>
+
+                      <div className="space-y-2 text-sm text-gray-700 mb-3">
+                        <div className="flex items-start gap-2">
+                          <FiMapPin className="mt-0.5 flex-shrink-0" />
+                          <div>
+                            {stop.booking.eventAddress}, {stop.booking.eventZip} {stop.booking.eventCity}
+                            {stop.booking.eventLocation && (
+                              <div className="text-gray-600">({stop.booking.eventLocation})</div>
+                            )}
+                          </div>
+                        </div>
+                        
+                        <div className="flex items-center gap-2">
+                          <FiClock className="flex-shrink-0" />
+                          <span>
+                            Aufbau: {new Date(stop.booking.setupTimeStart).toLocaleTimeString('de-DE', {
+                              hour: '2-digit',
+                              minute: '2-digit',
+                            })}
+                            {' - '}
+                            {new Date(stop.booking.setupTimeLatest).toLocaleTimeString('de-DE', {
+                              hour: '2-digit',
+                              minute: '2-digit',
+                            })}
+                          </span>
+                        </div>
+
+                        {stop.booking.photobox && (
+                          <div className="flex items-center gap-2">
+                            <FiCamera className="flex-shrink-0" />
+                            <span>
+                              {stop.booking.photobox.model} (SN: {stop.booking.photobox.serialNumber})
+                            </span>
+                          </div>
+                        )}
+                      </div>
+
+                      <div className="flex gap-2">
+                        <button
+                          onClick={() => startNavigation(stop)}
+                          className="flex-1 flex items-center justify-center gap-2 px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 transition-colors"
+                        >
+                          <FiNavigation size={16} />
+                          Navigation
+                        </button>
+
+                        {nextAction && (
+                          <button
+                            onClick={() => updateStopStatus(stop.id, nextAction.newStatus)}
+                            disabled={updating}
+                            className="flex-1 flex items-center justify-center gap-2 px-4 py-2 bg-green-600 text-white rounded-lg hover:bg-green-700 transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
+                          >
+                            <nextAction.icon size={16} />
+                            {nextAction.label}
+                          </button>
+                        )}
+
+                        {stop.booking.customerPhone && (
+                          <a
+                            href={`tel:${stop.booking.customerPhone}`}
+                            className="px-4 py-2 border border-gray-300 text-gray-700 rounded-lg hover:bg-gray-50 transition-colors flex items-center justify-center"
+                          >
+                            <FiPhone size={16} />
+                          </a>
+                        )}
+
+                        <button
+                          onClick={() => setExpandedStop(isExpanded ? null : stop.id)}
+                          className="px-4 py-2 border border-gray-300 text-gray-700 rounded-lg hover:bg-gray-50 transition-colors"
+                        >
+                          {isExpanded ? '▼' : '▶'}
+                        </button>
+                      </div>
+
+                      {isExpanded && (
+                        <div className="mt-4 pt-4 border-t border-gray-200 space-y-3">
+                          <div>
+                            <div className="text-xs font-medium text-gray-600 mb-1">Timeline</div>
+                            <div className="space-y-1 text-sm">
+                              {stop.arrivedAt && (
+                                <div className="text-gray-700">
+                                  ✓ Angekommen: {new Date(stop.arrivedAt).toLocaleTimeString('de-DE')}
+                                </div>
+                              )}
+                              {stop.setupStartedAt && (
+                                <div className="text-gray-700">
+                                  ✓ Aufbau gestartet: {new Date(stop.setupStartedAt).toLocaleTimeString('de-DE')}
+                                </div>
+                              )}
+                              {stop.setupCompleteAt && (
+                                <div className="text-gray-700">
+                                  ✓ Aufbau abgeschlossen: {new Date(stop.setupCompleteAt).toLocaleTimeString('de-DE')}
+                                </div>
+                              )}
+                              {stop.pickupStartedAt && (
+                                <div className="text-gray-700">
+                                  ✓ Abbau gestartet: {new Date(stop.pickupStartedAt).toLocaleTimeString('de-DE')}
+                                </div>
+                              )}
+                              {stop.pickupCompleteAt && (
+                                <div className="text-gray-700">
+                                  ✓ Abbau abgeschlossen: {new Date(stop.pickupCompleteAt).toLocaleTimeString('de-DE')}
+                                </div>
+                              )}
+                            </div>
+                          </div>
+
+                          {stop.photos.length > 0 && (
+                            <div>
+                              <div className="text-xs font-medium text-gray-600 mb-1">
+                                Fotos ({stop.photos.length})
+                              </div>
+                              <div className="flex gap-2 flex-wrap">
+                                {stop.photos.map((photo) => (
+                                  <div key={photo.id} className="text-xs px-2 py-1 bg-gray-100 rounded">
+                                    {photo.photoType}
+                                  </div>
+                                ))}
+                              </div>
+                            </div>
+                          )}
+
+                          {stop.notes && (
+                            <div>
+                              <div className="text-xs font-medium text-gray-600 mb-1">Notizen</div>
+                              <div className="text-sm text-gray-700 bg-gray-50 p-2 rounded">
+                                {stop.notes}
+                              </div>
+                            </div>
+                          )}
+
+                          {stop.issueDescription && (
+                            <div>
+                              <div className="text-xs font-medium text-red-600 mb-1">Problem</div>
+                              <div className="text-sm text-red-700 bg-red-50 p-2 rounded border border-red-200">
+                                {stop.issueDescription}
+                              </div>
+                            </div>
+                          )}
+
+                          <div className="flex gap-2 pt-2">
+                            <button className="flex-1 px-3 py-2 text-sm border border-gray-300 text-gray-700 rounded-lg hover:bg-gray-50">
+                              <FiCamera className="inline mr-2" />
+                              Foto hochladen
+                            </button>
+                            <button 
+                              onClick={() => updateStopStatus(stop.id, 'ISSUE')}
+                              className="flex-1 px-3 py-2 text-sm border border-red-300 text-red-700 rounded-lg hover:bg-red-50"
+                            >
+                              <FiAlertCircle className="inline mr-2" />
+                              Problem melden
+                            </button>
+                          </div>
+                        </div>
+                      )}
+                    </div>
+                  </div>
+                </div>
+              </div>
+            );
+          })
+        )}
+      </div>
+
+      {tour.tourStops.length > 1 && (
+        <div className="fixed bottom-4 right-4">
+          <button
+            onClick={() => {
+              const firstStop = tour.tourStops[0];
+              if (firstStop) {
+                const addresses = tour.tourStops.map(s => 
+                  `${s.booking.eventAddress}, ${s.booking.eventZip} ${s.booking.eventCity}`
+                );
+                const url = `https://www.google.com/maps/dir/?api=1&origin=${encodeURIComponent(addresses[0])}&destination=${encodeURIComponent(addresses[addresses.length - 1])}&waypoints=${encodeURIComponent(addresses.slice(1, -1).join('|'))}`;
+                window.open(url, '_blank');
+              }
+            }}
+            className="flex items-center gap-2 px-6 py-3 bg-blue-600 text-white rounded-full shadow-lg hover:bg-blue-700 transition-colors"
+          >
+            <FiMap size={20} />
+            Gesamte Route
+          </button>
+        </div>
+      )}
+    </div>
+  );
+}