Implement complete frontend with admin panel and theme system

- Add admin authentication and dashboard
- Create event management pages (list, create, edit, archive)
- Implement gallery enhancements (search, sorting, bulk download)
- Add email configuration and archive management pages
- Integrate Umami analytics with tracking throughout the app
- Add comprehensive error boundaries and loading states
- Implement accessibility features (WCAG 2.1 AA compliance)
- Create theme system with preset themes and customization
- Add branding settings and company information management
- Fix backend database initialization and health check
- Configure proper API URLs and environment variables

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>

CLAUDE.md

@@ -128,12 +128,20 @@ Background services run as separate processes:
 6. **Umami Analytics**: Track password entries, downloads, views, expiration warnings
 
 ## Environment Variables
-Required in `.env`:
+
+### Backend (.env)
 - `JWT_SECRET` - Token signing
 - `ADMIN_URL`, `FRONTEND_URL` - CORS origins
 - `SMTP_*` - Email configuration
 - `DB_*` - PostgreSQL credentials (production)
-- `UMAMI_*` - Analytics configuration
+- `UMAMI_URL` - Umami instance URL (for server-side tracking)
+- `UMAMI_WEBSITE_ID` - Website ID from Umami
+
+### Frontend (.env)
+- `VITE_API_URL` - Backend API URL
+- `VITE_UMAMI_URL` - Umami analytics URL
+- `VITE_UMAMI_WEBSITE_ID` - Website ID from Umami
+- `VITE_UMAMI_SHARE_URL` - (Optional) Public share URL for embedded dashboard
 
 ## Testing Approach
 - Jest with Supertest for API testing
@@ -141,6 +149,110 @@ Required in `.env`:
 - Database migrations run before tests
 - Mock email sending in tests
 
+## Umami Analytics Integration
+
+The frontend includes comprehensive Umami analytics integration for tracking user behavior and gallery performance.
+
+### Tracked Events:
+- **Gallery Events**:
+  - `gallery_password_entry` - Password attempts (success/failure)
+  - `gallery_photo_view` - Individual photo views
+  - `gallery_photo_download` - Single photo downloads
+  - `gallery_bulk_download` - Bulk/all photo downloads
+  - `gallery_expired` - Expired gallery access attempts
+- **Admin Events**:
+  - `admin_login` - Admin authentication
+  - `admin_event_created` - New event creation
+  - `admin_event_archived` - Event archiving
+  - `admin_event_deleted` - Event deletion
+  - `admin_settings_updated` - Settings changes
+- **User Behavior**:
+  - Search queries (with debouncing)
+  - Expiration warning views
+  - Page views with automatic tracking
+
+### Setup:
+1. Install Umami (self-hosted or cloud)
+2. Create a website in Umami dashboard
+3. Set environment variables:
+   ```
+   VITE_UMAMI_URL=https://your-umami-instance.com
+   VITE_UMAMI_WEBSITE_ID=your-website-id
+   VITE_UMAMI_SHARE_URL=https://your-umami-instance.com/share/...
+   ```
+
+### Analytics Dashboard:
+- Admin panel includes analytics page at `/admin/analytics`
+- Summary view with key metrics
+- Option to embed full Umami dashboard
+- Real-time event tracking
+
+## Accessibility & Performance Features
+
+### Accessibility (WCAG 2.1 AA Compliance)
+- **Error Boundaries**: Graceful error handling with recovery options
+- **Skip Links**: Skip to main content for keyboard navigation
+- **ARIA Labels**: Proper labeling for screen readers
+- **Focus Management**: Focus trap in modals, visible focus indicators
+- **Keyboard Navigation**: Full keyboard support in gallery lightbox (arrows, escape, +/-, d for download)
+- **Loading States**: Skeleton screens instead of spinners for better UX
+- **Offline Support**: Visual indicator when offline
+- **Form Validation**: Accessible error messages with aria-describedby
+
+### Performance Optimizations
+- **Lazy Loading**: Images load on scroll with Intersection Observer
+- **Skeleton Screens**: Instant visual feedback during loading
+- **Error Recovery**: Component-level error boundaries prevent full page crashes
+- **Optimistic Updates**: Immediate UI updates with background sync
+- **Debounced Search**: Prevents excessive API calls
+- **Analytics**: Non-blocking Umami integration
+
+### Component Library Enhancements
+- `<ErrorBoundary>` - Catches and displays errors gracefully
+- `<PageErrorBoundary>` - Full-page error recovery
+- `<Skeleton>` - Flexible skeleton loader with variants
+- `<OfflineIndicator>` - Network status monitoring
+- `<SkipLink>` - Accessibility navigation
+- `useFocusTrap` - Modal focus management hook
+- `useOnlineStatus` - Network status hook
+
+## Theme System & Branding
+
+### Theme Features
+- **Dynamic Theming**: CSS variables for runtime theme switching
+- **Preset Themes**: Default, Wedding, Birthday, Corporate, Minimal
+- **Customization Options**:
+  - Primary/Accent/Background/Text colors
+  - Font family selection
+  - Border radius (none, sm, md, lg)
+  - Custom logo upload
+  - Custom CSS injection
+- **Event-Specific Themes**: Override global theme per gallery
+- **Live Preview**: Real-time theme changes in admin panel
+
+### Theme Context API
+```typescript
+const { theme, setTheme, setThemeByName } = useTheme();
+```
+
+### Branding Settings
+- Company name, tagline, and support email
+- Custom footer text
+- Optional watermarking on downloads
+- Logo upload for gallery header
+
+### CSS Variables
+```css
+--color-primary: #5C8762;
+--color-primary-light: #7aa583;
+--color-primary-dark: #4a6f4f;
+--color-accent: #22c55e;
+--color-background: #fafafa;
+--color-text: #171717;
+--font-family: 'Inter', sans-serif;
+--border-radius: 0.5rem;
+```
+
 ## Success Metrics (from PRD)
 - Time to generate gallery: <2 minutes
 - Guest satisfaction: >90%