- Reworked the tenant admin login page

- Updated the User model to implement Filament’s tenancy contracts
- Seeded a ready-to-use demo tenant (user, tenant, active package, purchase)
- Introduced a branded, translated 403 error page to replace the generic forbidden message for unauthorised admin hits
- Removed the public “Register” links from the marketing header
- hardened join event logic and improved error handling in the guest pwa.

docs/prp/03-api.md

@@ -19,10 +19,10 @@ Key Endpoints (abridged)
 - Settings: read/update tenant theme, limits, legal page links.
 
 Guest Polling (no WebSockets in v1)
-- GET `/events/{slug}/stats` — lightweight counters for Home info bar.
+- GET `/events/{token}/stats` — lightweight counters for Home info bar.
   - Response: `{ online_guests: number, tasks_solved: number, latest_photo_at: ISO8601 }`.
   - Cache: `Cache-Control: no-store`; include `ETag` for conditional requests.
-- GET `/events/{slug}/photos?since=<ISO8601|cursor>` — incremental gallery refresh.
+- GET `/events/{token}/photos?since=<ISO8601|cursor>` — incremental gallery refresh.
   - Response: `{ data: Photo[], next_cursor?: string, latest_photo_at: ISO8601 }`.
   - Use `If-None-Match` or `If-Modified-Since` to return `304 Not Modified` when unchanged.
 

docs/prp/07-guest-pwa.md

@@ -87,9 +87,9 @@ Technical Notes
 - Realtime model: periodic polling (no WebSockets). Home counters every 10s; gallery delta every 30s with exponential backoff when tab hidden or offline.
 
 API Touchpoints
-- GET `/api/v1/events/{slug}` — public event metadata (when open) + theme.
-- GET `/api/v1/events/{slug}/photos` — paginated gallery (approved only).
-- POST `/api/v1/events/{slug}/photos` — signed upload initiation; returns URL + fields.
+- GET `/api/v1/events/{token}` — public event metadata (when open) + theme.
+- GET `/api/v1/events/{token}/photos` — paginated gallery (approved only).
+- POST `/api/v1/events/{token}/photos` — signed upload initiation; returns URL + fields.
 - POST (S3) — direct upload to object storage; then backend finalize call.
 - POST `/api/v1/photos/{id}/like` — idempotent like with device token.
 

docs/prp/tenant-app-specs/capacitor-setup.md

@@ -121,9 +121,9 @@ packages/mobile/         # Shared Native-Config (optional)
   - **Privacy**: Usage Descriptions in Info.plist (z.B. "Kamera für QR-Scans").
 
 - **PWA-Fallback** (Web):
-  - **manifest.json**: `start_url: '/event-admin/'`, `display: 'standalone'`.
-  - **Service Worker**: Caching von Assets; Background Sync für Mutations.
-  - **Distribution**: Hosting auf `admin.fotospiel.app` mit A2HS-Prompt.
+  - **manifest.json**: liegt unter `public/manifest.json` (Scope `/event-admin/`, Theme-Farbe `#f43f5e`, Shortcuts für Welcome & Dashboard).
+  - **Service Worker**: `public/admin-sw.js` cached Shell + Assets, liefert Offline-Fallback `/event-admin` für Navigations-Anfragen.
+  - **Distribution**: Hosting auf `admin.fotospiel.app` mit A2HS-Prompt; Bubblewrap/TWA nutzt `https://admin.fotospiel.app/manifest.json`.
 
 ### Native Features (Erweiterung zu settings-config.md)
 - **Push-Notifications**:

docs/prp/tenant-app-specs/functional-specs.md

@@ -1,100 +1,87 @@
-# Funktionale Spezifikationen für die Tenant Admin App
+# Funktionale Spezifikationen – Tenant-Admin-App
 
 ## Status
-- **Version**: 1.0.0 (2025-09-13)
-- **Supersedes**: Teile von docs/prp/06-tenant-admin-pwa.md und docs/prp-addendum-2025-09-08-tenant-admin-pwa.md
+- **Version**: 1.1.0 (Stand 2025-10-13)
+- **Ersetzt**: docs/prp/06-tenant-admin-pwa.md, docs/prp-addendum-2025-09-08-tenant-admin-pwa.md (Legacy-Referenz über Git History).
 
 ## Deliverables
-Die Tenant Admin App muss folgende Kernfunktionen bereitstellen:
-- **Event-Management**: CRUD-Operationen für Events (Erstellen, Bearbeiten, Archivieren, Veröffentlichen).
-- **Gallery-Management**: Hochladen, Moderieren, Featured-Setten von Photos; Thumbnail-Generierung.
-- **Member-Management**: Hinzufügen/Entfernen von Event-Mitgliedern; Rollen (Admin, Member).
-- **Task & Emotion Management**: Zuweisen von Tasks und Emotions zu Events; Overrides für Tenant-spezifische Bibliotheken.
-- **Settings-Management**: Tenant-spezifische Einstellungen (Theme, Limits, Legal Pages).
-- **Billing & Purchases**: Kaufen von Packages (pro Event oder Tenant); Ledger-Übersicht; Integration mit Stripe.
-- **Notifications**: Push-Benachrichtigungen für neue Photos, Event-Updates, niedrigen Credit-Balance.
-- **Offline-Support**: Caching von Events und Photos; Queuing von Uploads/Mutations mit Sync bei Online-Wiederkehr.
-- **Audit & Compliance**: Logging kritischer Aktionen; ETag-basierte Conflict-Resolution; GDPR-konforme Datenlöschung.
-
-Die App ist API-first und interagiert ausschließlich über den Backend-API-Endpunkt `/api/v1/tenant/*`.
+Die Admin-App muss folgende Kernfunktionen bereitstellen:
+- **Geführtes Onboarding**: Welcome Flow (Hero, How-It-Works, Paketwahl, Zusammenfassung, Erstes Event). Automatische Weiterleitung für Tenants ohne aktive Events.
+- **Event-Management**: Erstellen, Bearbeiten, Veröffentlichen, Archivieren; Join-Token-Verwaltung.
+- **Galerie-Management**: Upload, Moderation, Feature-Flags, Analytics.
+- **Mitglieder-Verwaltung**: Einladungen, Rollen, Zugriffskontrolle.
+- **Tasks & Emotions**: Bibliothek, Zuweisung, Fortschritts-Tracking.
+- **Abrechnung**: Paketübersicht, Stripe/PayPal Checkout, Ledger.
+- **Einstellungen**: Branding, Limits, Rechtstexte, Benachrichtigungen.
+- **Offline-Support**: App-Shell-Caching, Queueing von Mutationen, Sync bei Reconnect.
+- **Compliance**: Audit-Logging, GDPR-konforme Löschung, ETag-basierte Konfliktlösung.
 
 ## Capabilities
 ### Authentifizierung & Autorisierung
-- **OAuth2 Flow**: Authorization Code + PKCE für sichere Token-Erfassung.
-- **Token-Management**: Refresh-Tokens mit automatischer Rotation; Secure Storage (Keychain/Keystore).
-- **Tenant-Scoping**: Alle Requests enthalten `tenant_id` aus Token; Backend-Policies enforcen Isolation.
-- **Roles**: Unterstützung für `tenant_admin` (volle CRUD), `member` (read-only + Uploads).
+- OAuth2 Authorization Code mit PKCE, Refresh-Tokens via Secure Storage (Web: IndexedDB, Capacitor: Preferences/Keychain).
+- Tenant-Scoped Tokens; Rollen `tenant_admin` (vollständig) & `member` (read-only, Upload).
 
-### Core Features
-- **Event Lifecycle**: 
-  - Erstellen: Erfordert Package-Auswahl (Free oder Kauf); Slug-Generierung (unique pro Tenant).
-  - Bearbeiten: Update von Datum, Ort, Tasks, Emotions, Join-Link.
-  - Veröffentlichen: Generiert QR-Code und Share-Link; aktiviert Guest-PWA-Zugriff.
-  - Archivieren: Soft-Delete mit Retention-Periode (GDPR); Credit-Rückerstattung optional.
-- **Photo Management**:
-  - Upload: Signed URLs für direkte S3-Uploads; automatisierte Thumbnail-Generierung.
-  - Moderation: Approve/Reject/Feature; Bulk-Operations.
-  - Analytics: Stats zu Likes, Views, Uploads pro Event.
-- **Task & Emotion System**:
-  - Bibliothek: Globale + Tenant-spezifische Tasks/Emotions.
-  - Zuweisung: Drag-and-Drop zu Events; Fortschritts-Tracking.
-- **Billing Integration**:
-  - Package-Auswahl: Anzeige verfügbarer Packages und Kauf (Einmalkauf/Subscription).
-  - Ledger: Historie von Package-Käufen und Nutzung.
-  - Stripe-Checkout: Server-side Intent-Erstellung; Webhook-Handling für Confirmation.
+### Onboarding Journey
+- Routen `/event-admin/welcome/*` bilden den Flow.
+- `useOnboardingProgress` persistiert Fortschritt (localStorage) und synchronisiert mit Backend (`onboarding_completed_at`).
+- Paketwahl nutzt `GET /tenant/packages`; Stripe/PayPal-Fallbacks informieren bei fehlender Konfiguration.
+- Dashboard weist per CTA auf offenes Onboarding hin, bis ein erstes Event erstellt wurde.
 
-### Offline & Sync
-- **Service Worker**: Cache von App-Shell, Events, Photos (Cache-Control: max-age=5min für dynamische Daten).
-- **Background Sync**: Queued Mutations (z.B. Photo-Approvals) syncen bei Connectivity.
-- **Conflict Resolution**: ETag/If-Match Headers; Optimistic Updates mit Rollback bei Conflicts.
+### Event Lifecycle
+- Erstellung prüft Paketverfügbarkeit; generiert Join-Token.
+- Bearbeiten erlaubt Statuswechsel, Aufgaben, Emotions, Join-Token-Verwaltung.
+- Veröffentlichen schaltet Guest-PWA frei; Archivieren respektiert Retention-Policy.
 
-### Error Handling & UX
-- **Rate Limits**: 429-Responses handhaben mit Retry-Logic und User-Feedback ("Zu viele Anfragen, versuche es später").
-- **Offline Mode**: Degradiertes UI (Read-Only); Sync-Status-Indikator.
-- **i18n**: react-i18next mit JSON (`public/lang/{locale}/admin.json`); de/en; Locale aus User-Profile oder URL-Prefix (/de/, /en/); Detection via LanguageDetector; RTL nicht in MVP.
-
-## API-Integration
-Die App konsumiert den API-Contract aus docs/prp/03-api.md. Schlüssel-Endpunkte:
-
-### Auth
-- `POST /oauth/token`: PKCE-Code für Access/Refresh-Token.
-- `POST /oauth/token/refresh`: Token-Rotation.
-
-### Events
-- `GET /tenant/events`: Liste (paginiert, filterbar nach Status/Datum).
-- `POST /tenant/events`: Erstellen (validiert Tenant-Package und erstellt Event-Package).
-- `GET /tenant/events/{id}`: Details inkl. Tasks, Stats, package_limits.
-- `PATCH /tenant/events/{id}`: Update (ETag für Concurrency).
-- `DELETE /tenant/events/{id}`: Archivieren.
-
-### Photos
-- `GET /tenant/events/{event_id}/photos?since={cursor}`: Inkrementelle Liste.
-- `POST /tenant/events/{event_id}/photos`: Metadata + signed Upload-URL.
-- `PATCH /tenant/photos/{id}`: Moderation (approve, feature).
-- `DELETE /tenant/photos/{id}`: Löschung mit Audit.
+### Medien & Moderation
+- Direktupload via signed URLs, Thumbnail-Generierung serverseitig.
+- Moderations-Grid mit Bulk-Aktionen, Filter (Neu, Genehmigt, Featured).
+- Analytics: Likes, Uploadzahlen, aktive Gäste.
 
 ### Tasks & Emotions
-- `GET /tenant/tasks`: Tenant-Overrides + globale Bibliothek.
-- `POST /tenant/events/{id}/tasks`: Zuweisung.
-- Ähnlich für Emotions.
+- Globale + Tenant-spezifische Bibliothek.
+- Drag-and-Drop Zuweisung, Fortschritt je Event, Emotion-Tagging.
+
+### Billing & Checkout
+- Pakete + Credit-Balance anzeigen.
+- Stripe PaymentIntent & PayPal Smart Buttons; Fallback-Meldung bei fehlender Konfiguration.
+- Ledger mit Historie (Paginierung, Filter).
 
 ### Settings
-- `GET /tenant/settings`: Tenant-Konfig (Theme, Limits, Legal-Links).
-- `PATCH /tenant/settings`: Update.
+- Branding (Logo, Farben), Domain/Links, Legal Pages.
+- Notification Preferences, Paketlimits, Onboarding-Reset.
 
-### Billing
-- `GET /tenant/packages`: Tenant-Packages und Limits.
-- `POST /tenant/purchases/intent`: Stripe-Checkout-Session für Package erstellen.
-- `GET /api/v1/packages`: Verfügbare Packages.
+### Offline & Sync
+- Service Worker `public/admin-sw.js` cached App-Shell `/event-admin` und statische Assets, liefert Offline-Fallback für Navigation.
+- Mutationen werden gequeued und nach Reconnect synchronisiert.
+- ETag / If-Match für konfliktfreie Updates, Optimistic UI mit Rollback.
 
-### Pagination & Errors
-- Standard: `page`, `per_page` (max 50 für Mobile).
-- Errors: Parsen von `{ error: { code, message } }`; User-freundliche Messages (z.B. "Package-Limit überschritten").
+### Fehlerbehandlung & UX
+- Rate-Limit (429) → Retry-Hinweis.
+- Offline-Banner + Retry-Buttons an kritischen Stellen (Checkout, Upload).
+- i18n via `react-i18next` (de/en); Strings in `public/lang/{locale}/admin.json`.
 
-## Non-Functional Requirements
-- **Performance**: Ladezeiten < 2s; Lazy-Loading für Galleries.
-- **Sicherheit**: Kein PII-Logging; Token-Expiration-Handling; CSRF-Schutz via PKCE.
-- **Accessibility**: Framework7 ARIA-Support; Dark Mode (System-Preference).
-- **Testing**: Unit-Tests für API-Calls; E2E-Tests für Flows (Cypress).
+## API-Integration
+Die App nutzt Endpunkte aus `docs/prp/03-api.md`.
 
-Für detaillierte UI-Seiten siehe pages-ui.md; für Settings siehe settings-config.md.
+| Bereich | Endpunkte |
+| --- | --- |
+| Auth | `POST /oauth/token`, `POST /oauth/token/refresh` |
+| Onboarding | `GET /tenant/me` (Progress Flags), `GET /tenant/packages`, `POST /tenant/events` |
+| Events | `GET/POST/PATCH/DELETE /tenant/events`, `POST /tenant/events/{event}/toggle`, Join-Token Routen |
+| Medien | `GET /tenant/events/{event}/photos`, `POST /tenant/events/{event}/photos`, `PATCH /tenant/photos/{id}` |
+| Tasks & Emotions | `GET /tenant/tasks`, `POST /tenant/events/{event}/tasks`, `GET /tenant/emotions` |
+| Settings | `GET/PATCH /tenant/settings`, `GET /tenant/credits/balance`, `POST /tenant/purchases/intent` |
+
+## Nicht-funktionale Anforderungen
+- **Performance**: Ladezeit < 2s; Code-Splitting der Onboarding-Screens.
+- **Sicherheit**: Keine sensiblen Logs; CSRF-mitigiert via PKCE/OAuth; Token-Refresh automatisiert.
+- **Accessibility**: Tastaturbedienung, Fokus-Indikatoren, `prefers-reduced-motion`.
+- **Internationalisierung**: Sprachumschaltung in Einstellungen; Standard de, Fallback en.
+
+## Teststrategie
+- **PHPUnit**: Feature-Tests für Auth-Guards (Tenant ohne Events → Welcome Flow).
+- **React Testing Library**: `TenantWelcomeLayout`, `PackageSelection`, `OnboardingGuard`, `OrderSummary`.
+- **Playwright**: `tests/e2e/tenant-onboarding-flow.test.ts` deckt Login, Welcome → Packages → Summary → Event Setup ab; Erweiterung um Stripe/PayPal Happy Paths und Offline/Retry geplant.
+- **Smoke Tests**: `npm run test:e2e` in CI mit optionalen Credentials (`E2E_TENANT_EMAIL`, `E2E_TENANT_PASSWORD`, Stripe/PayPal Keys).
+
+Für UI-Details siehe `docs/prp/tenant-app-specs/pages-ui.md`. Einstellungen werden in `docs/prp/tenant-app-specs/settings-config.md` beschrieben.

docs/prp/tenant-app-specs/pages-ui-legacy.md

@@ -0,0 +1,9 @@
+# Legacy-UI-Referenz (Framework7, Stand 2025-09-13)
+
+Die ursprüngliche Dokumentation zur Framework7-basierten Tenant-Admin-App wurde im Commit-Verlauf abgelegt (`pages-ui.md` bis einschließlich 2025-09-13).
+
+Sie enthält:
+- Wireframes für Login, Dashboard, Events, Fotos, Members, Tasks, Settings, Billing.
+- Hinweise zur Nutzung von Framework7-Komponenten (Toolbar, List, Card, Pull-to-Refresh, Infinite Scroll).
+
+Für Migrations- oder Vergleichszwecke kann die Version über `git show <commit>:docs/prp/tenant-app-specs/pages-ui.md` abgerufen werden. Die aktuelle Implementierung basiert dagegen auf React + Tailwind (siehe `pages-ui.md`).

docs/prp/tenant-app-specs/pages-ui.md

@@ -1,186 +1,68 @@
-# Seiten und UI-Design für die Tenant Admin App
+# Seiten- und UI-Design für die Tenant-Admin-App
 
 ## Status
-- **Version**: 1.0.0 (2025-09-13)
-- **Fokus**: Mobile-First Design mit Framework7 v8+ für native iOS/Android-Look & Feel.
+- **Version**: 1.1.0 (Stand 2025-10-13)
+- **Technologie**: React 19, TailwindCSS (shadcn/ui), React Router 7, React Query 5.
+- **Hinweis**: Die Framework7-Wireframes aus 2025-09 bleiben als historische Referenz erhalten und sind im Anhang dokumentiert.
 
-## Allgemeines UI-Prinzipien
-- **Framework7-Komponenten**: Toolbar (Navigation), List (Datenlisten), Card (Karten für Events/Photos), Modal (Details/Actions), Pull-to-Refresh (Sync), Infinite-Scroll (Pagination).
-- **Theming**: System-Dark-Mode-Support; Tenant-spezifische Farben (Primary/Secondary aus Settings).
-- **Navigation**: Tabbar unten (Dashboard, Events, Photos, Settings); Side-Menu für Profile/Logout.
-- **Offline-Indikator**: Banner oben ("Offline-Modus: Änderungen werden synchronisiert").
-- **Loading**: Spinner für API-Calls; Skeleton-Screens für Listen.
-- **i18n**: LTR für de/en (react-i18next); alle Strings via `t('admin.key')`; Icons von Lucide React (aktuell, nicht Framework7).
+## Design-Grundlagen
+- **Design Tokens**: Farbverlauf `#f43f5e → #6366f1`, Slate-Neutrals für Typografie, Primärschrift `Clash Display`, Fließtext `Inter`.
+- **Komponentensystem**: shadcn/ui-Basis (Button, Card, Tabs, Sheet, Dialog). Erweiterungen unter `resources/js/admin/components`.
+- **Navigation**: Obere App-Bar mit Breadcrumb & Quick Actions, mobile Tabbar (Dashboard, Events, Tasks, Einstellungen).
+- **Responsiveness**: Breakpoints `sm` (375px), `md` (768px), `xl` (1280px). Onboarding-Screens nutzen Full-Height Layouts auf Mobile, Split-Grid auf Desktop.
+- **Accessibility**: `prefers-reduced-motion`, Fokus-Ringe (Tailwind Plugin), ARIA für Carousel, Tabs, Dialoge.
+- **Offline UX**: Banner oben rechts (`Offline – deine Änderungen werden synchronisiert, sobald du wieder online bist`) + Retry-CTA.
 
-## Benötigte Seiten und Komponenten
+## Geführtes Onboarding (Welcome Flow)
+| Schritt | Route | Komponenten | Besondere Elemente |
+| --- | --- | --- | --- |
+| Hero | `/event-admin/welcome` | `TenantWelcomeLayout`, `WelcomeStepCard`, `EmblaCarousel` | CTA „Pakete entdecken“, sekundärer Link „Später entscheiden“ |
+| How It Works | `/event-admin/welcome` (Carousel Slide) | Icon Cards, Animated Gradients | 3 Vorteile (Fotos festhalten, Aufgaben, Gäste aktivieren) |
+| Paketwahl | `/event-admin/welcome/packages` | `PackageCard`, `PricingToggle`, `QueryPackageList` | Stripe/PayPal Pricing, Feature-Badges, Auswahl persistiert im Onboarding-Context |
+| Zusammenfassung | `/event-admin/welcome/summary` | `OrderSummaryCard`, Stripe Elements, PayPal Buttons | Hinweise bei fehlender Zahlungs-Konfiguration, CTA „Weiter zum Setup“ |
+| Event Setup | `/event-admin/welcome/event` | `FirstEventForm`, `FormStepper`, Toasts | Formular (Name, Datum, Sprache, Feature-Toggles) + Abschluss CTA „Event erstellen“ |
 
-### 1. Auth-Seiten (OAuth-Flow)
-#### Login-Seite
-- **Zweck**: OAuth-Authorization (PKCE-Challenge generieren, Redirect zu /oauth/authorize).
-- **Layout**: 
-  - Zentrale Card mit Logo, App-Name, "Mit Google/Email anmelden"-Buttons.
-  - Footer: "Noch kein Account? Registrieren" (Redirect zu Register).
-- **Framework7-Komponenten**:
-  - `f7-page` mit `f7-navbar` (Titel: "Willkommen zur Event Photo App").
-  - `f7-block` für Content; `f7-button` (large, filled) für OAuth-Start.
-  - `f7-preloader` während Redirect.
-- **Wireframe-Beschreibung**:
-  ```
-  [Navbar: Logo | Willkommen]
-  [Block: App-Beschreibung]
-  [Button: Anmelden mit Google]
-  [Button: Anmelden mit Email]
-  [Footer: Registrieren-Link]
-  ```
-- **API**: Kein direkter Call; Browser-Redirect zu Backend.
+### Guards & Fortschritt
+- `useOnboardingProgress` (Context + localStorage) speichert `activeStep`, ausgewähltes Paket und Event-Entwurf.
+- Auth-Guard leitet Tenant ohne Events auf `/event-admin/welcome` um; nach Abschluss setzt Backend `onboarding_completed_at`.
+- Dashboard hero banner zeigt CTA „Geführtes Setup fortsetzen“, solange `onboarding_completed_at` fehlt.
+- Offlinezustand: Payment-Sektion zeigt Fallback-Karte „Zahlungsdienste offline – bitte erneut versuchen“.
 
-#### Register-Seite (ähnlich Login)
-- **Unterschiede**: Form für Email/Password + Terms-Checkbox; Submit zu `/oauth/register`.
+### Assets & PWA
+- Manifest: `public/manifest.json` (Scope `/event-admin/`, Theme-Farbe `#f43f5e`, Shortcuts für Welcome & Dashboard).
+- Service Worker: `public/admin-sw.js` cached Shell `/event-admin` + statische Assets; Navigation requests → Netzwerk-First mit Cache-Fallback.
+- Registrierung: erfolgt in `resources/js/admin/main.tsx` beim `window.load` Event.
 
-### 2. Dashboard (Home)
-- **Zweck**: Übersicht über aktive Events, Stats, schnelle Actions.
-- **Layout**: 
-  - Top: Willkommens-Banner mit Tenant-Name, Credit-Balance.
-  - Stats-Cards: Aktive Events, Ungeprüfte Photos, Tasks-Fortschritt.
-  - Quick-Actions: "Neues Event erstellen", "Photos moderieren".
-- **Framework7-Komponenten**:
-  - `f7-toolbar` unten: Tabs (Home, Events, Photos, Settings).
-  - `f7-card` für Stats (mit `f7-icon` und Zahlen).
-  - `f7-list` für Quick-Actions (link mit Arrow).
-  - `f7-pull-to-refresh` für Sync.
-- **Wireframe-Beschreibung**:
-  ```
-  [Toolbar: Home | Events | Photos | Settings]
-  [Banner: Hallo [Name]! 3 Credits übrig]
-  [Row: Card(Events: 2 aktiv) | Card(Photos: 15 neu) | Card(Tasks: 80%)]
-  [List: > Neues Event | > Moderieren | > Einstellungen]
-  ```
-- **API**: `GET /tenant/dashboard` (Stats); `GET /tenant/credits/balance`.
+## Kernseiten nach dem Onboarding
+- **Dashboard**: Hero-CTA zum Welcome Flow, Statistik-Kacheln (Events aktiv, Uploads, Credits), Quick Actions (Event anlegen, Fotos moderieren, Tasks verwalten).
+- **Events**: Suchfeld + Filter Pills, Card-Layout mit Status-Badges (`Draft`, `Live`, `Archived`), Detail-Drawer mit Quick Stats.
+- **Fotos**: Moderationsgrid (Masonry), Filter (Neu, Genehmigt, Featured), Bulk-Aktionen in Sticky-Footer.
+- **Tasks**: Tabs (Bibliothek, Zuweisungen), Drag-and-Drop (React Beautiful DnD), Inline-Editor für Aufgaben.
+- **Einstellungen**: Accordion-Struktur (Branding, Legal Pages, Benachrichtigungen, Abrechnung). Preview-Panel für Farben und Logos.
+- **Abrechnung**: Kreditübersicht, Kauflog (infinite-scroll), Zahlungsoptionen (Stripe Karte, PayPal Checkout).
 
-### 3. Events-Übersicht
-- **Zweck**: Liste aller Events mit Filter (aktiv/archiviert), Suche.
-- **Layout**: 
-  - Navbar: Suche-Feld, Filter-Button (Dropdown: Status, Datum).
-  - Infinite-Scroll-Liste von Event-Cards (Titel, Datum, Status-Tag, Photo-Count).
-  - FAB: "+" für Neues Event.
-- **Framework7-Komponenten**:
-  - `f7-searchbar` in Navbar.
-  - `f7-list` mit `f7-list-item` (Thumbnail, Title, Subtitle: Datum, Badge: Status).
-  - `f7-fab` (floating action button).
-  - `f7-segmented` für Filter-Tabs.
-- **Wireframe-Beschreibung**:
-  ```
-  [Navbar: Suche | Filter ▼]
-  [Segmented: Alle | Aktiv | Archiviert]
-  [List-Item: [Thumb] Hochzeit Müller (15.09.) [Tag: Aktiv] 45 Photos]
-  [List-Item: ...]
-  [+ FAB unten rechts]
-  ```
-- **API**: `GET /tenant/events?page=1&status=active` (paginiert).
+## Informationsarchitektur (aktuelle React-Router-Konfiguration)
+```
+/event-admin
+├── dashboard
+├── events
+│   ├── :slug (Detailseiten, Tabs: Overview, Tasks, Media, Members, Stats)
+│   └── :slug/edit
+├── tasks
+├── members
+├── settings
+├── billing
+└── welcome
+    ├── (index)            # Hero + How It Works Carousel
+    ├── packages
+    ├── summary
+    └── event
+```
 
-### 4. Event-Details-Seite
-- **Zweck**: Vollständige Event-Info, Edit-Modus, zugehörige Tasks/Photos.
-- **Layout**: 
-  - Tabs: Details, Tasks, Photos, Members, Stats.
-  - Edit-Button (öffnet Modal für Update).
-  - QR-Code-Section für Join-Link.
-- **Framework7-Komponenten**:
-  - `f7-tabs` mit `f7-tab` für Subseiten.
-  - `f7-card` für Details (Datum, Ort, Beschreibung).
-  - `f7-qrcode` (via Plugin) für Share-Link.
-  - `f7-button` (edit-icon) → `f7-modal` mit Form.
-- **Wireframe-Beschreibung**:
-  ```
-  [Navbar: Event-Titel | Edit-Icon]
-  [Tabs: Details | Tasks | Photos | Members | Stats]
-  [Details-Tab: Card(Datum: 15.09., Ort: Berlin) | QR-Code: Scan zum Beitreten]
-  [Tasks-Tab: Checklist (Drag-to-reorder)]
-  [Photos-Tab: Grid von Thumbs]
-  ```
-- **API**: `GET /tenant/events/{id}`; `PATCH /tenant/events/{id}` (ETag).
+## Testabdeckung (UI)
+- **Jest/RTL**: `TenantWelcomeLayout`, `WelcomeStepCard`, `PackageSelection`, `OnboardingGuard`.
+- **Playwright**: `tests/e2e/tenant-onboarding-flow.test.ts` (Login Guard, Welcome → Packages → Summary → Event Setup). Erweiterbar um Stripe/PayPal-Happy-Path sowie Offline-/Retry-Szenarien.
 
-### 5. Photo-Gallery-Seite (pro Event)
-- **Zweck**: Moderation von Photos; Grid-View mit Lightbox.
-- **Layout**: 
-  - Filter: Neu/Ungeprüft/Featured; Sortierung (Datum, Likes).
-  - Masonry-Grid von Photo-Cards (Thumb, Timestamp, Like-Count).
-  - Long-Press: Multi-Select für Bulk-Actions (Approve/Delete).
-- **Framework7-Komponenten**:
-  - `f7-photoset` oder custom Grid mit `f7-card` (small).
-  - `f7-lightbox` für Fullscreen-View.
-  - `f7-checkbox` für Multi-Select.
-  - `f7-popover` für Actions (Approve, Feature, Delete).
-- **Wireframe-Beschreibung**:
-  ```
-  [Navbar: Photos (Event) | Filter ▼]
-  [Grid: 3xN Cards [Thumb | Zeit | Likes] [Checkbox]]
-  [Lightbox: Fullscreen Photo mit Zoom, Actions]
-  [Bottom-Bar (bei Select): Approve All | Delete Selected]
-  ```
-- **API**: `GET /tenant/events/{id}/photos`; `PATCH /tenant/photos/{id}` (Batch).
+## Legacy-Referenz (Framework7 Entwurf 2025-09)
+Die ursprünglichen Wireframes für Framework7 (Toolbar, FAB, Infinite Scroll) sind weiterhin im Repo historisiert (`docs/prp/tenant-app-specs/pages-ui-legacy.md`). Für Vergleiche bei Regressionen oder Migrationen bitte dort nachsehen.
 
-### 6. Members-Seite
-- **Zweck**: Verwalten von Event-Mitgliedern (Hinzufügen per Email, Rollen).
-- **Layout**: Liste von User-Cards (Name, Rolle, Joined-At); Invite-Button.
-- **Framework7-Komponenten**:
-  - `f7-list` mit `f7-list-item` (Avatar, Name, Badge: Rolle).
-  - `f7-modal` für Invite-Form (Email-Input, Send-Button).
-- **Wireframe-Beschreibung**:
-  ```
-  [Navbar: Members | + Invite]
-  [List: Anna (Admin) | Ben (Member) | ...]
-  [Modal: Email eingeben | Rolle wählen | Senden]
-  ```
-- **API**: `GET /tenant/events/{id}/members`; `POST /tenant/events/{id}/members`.
-
-### 7. Tasks-Seite
-- **Zweck**: Bibliothek verwalten, zu Events zuweisen, Fortschritt tracken.
-- **Layout**: Tabs: Meine Tasks, Bibliothek; Drag-and-Drop zwischen Listen.
-- **Framework7-Komponenten**:
-  - `f7-tabs`; `f7-sortable-list` für Drag-and-Drop.
-  - `f7-checkbox` für Zuweisung.
-- **Wireframe-Beschreibung**:
-  ```
-  [Tabs: Events | Bibliothek]
-  [Sortable List: Task1 [Checkbox] | Task2 ...]
-  [Drag: Von Bibliothek zu Event-Liste]
-  ```
-- **API**: `GET /tenant/tasks`; `POST /tenant/events/{id}/tasks`.
-
-### 8. Settings-Seite
-- **Zweck**: Tenant-Einstellungen bearbeiten (Theme, Limits, Legal).
-- **Layout**: Accordion-Sections (Theme, Notifications, Legal, App).
-- **Framework7-Komponenten**:
-  - `f7-accordion` für Sections.
-  - `f7-toggle`, `f7-select`, `f7-color-picker` für Optionen.
-- **Wireframe-Beschreibung**:
-  ```
-  [Navbar: Einstellungen]
-  [Accordion: Theme ▼ [Color-Picker] | Notifications [Toggle Push]]
-  [Legal: Impressum-Link bearbeiten]
-  [App: Logout-Button]
-  ```
-- **API**: `GET/PATCH /tenant/settings`. Details in settings-config.md.
-
-### 9. Billing-Seite
-- **Zweck**: Credit-Balance anzeigen, Packs kaufen.
-- **Layout**: Balance-Card; Liste von Purchase-Options; Ledger-Historie.
-- **Framework7-Komponenten**:
-  - `f7-card` für Balance (mit Warning bei niedrig).
-  - `f7-list` für Packs (Preis, Events-Count, Buy-Button).
-  - `f7-infinite-scroll` für Ledger.
-- **Wireframe-Beschreibung**:
-  ```
-  [Card: Balance: 3 Credits | [Warning: Niedrig!]]
-  [List: 5 Events (29€) [Buy] | 10 Events (49€) [Buy]]
-  [Ledger: Kauf 29.09. +5 | Event-Erstellung -1]
-  ```
-- **API**: `GET /tenant/credits/balance`; `POST /tenant/purchases/intent`.
-
-## Zusätzliche UI-Elemente
-- **Modals**: Confirm-Delete, Photo-Preview, Error-Alerts.
-- **Notifications**: `f7-notification` für Sync-Erfolg, neue Photos.
-- **Offline-Handling**: `f7-block` mit "Syncing..." Progress-Bar.
-- **Accessibility**: ARIA-Labels für alle interaktiven Elemente; VoiceOver-Support.
-
-Für Capacitor-spezifische UI-Anpassungen siehe capacitor-setup.md.