12-05-2026 Frontend dev

2026-05-12 18:32:33 +02:00 · 2026-05-12 18:32:33 +02:00 · 5b8bdf4182
commit 5b8bdf4182
parent 405df0a122
779 changed files with 480564 additions and 6241 deletions
--- a/_docs/ASSET-URLS-GUIDE.md
+++ b/_docs/ASSET-URLS-GUIDE.md
@ -0,0 +1,277 @@
+# Asset-URLs für Multi-Domain Vite-Setup
+
+## Empfohlene Asset-URLs
+
+Für dein Multi-Domain-Setup empfehle ich folgende Asset-URLs:
+
+### ✅ Aktuelle Konfiguration (EMPFOHLEN)
+
+| Bereich | Domain | Asset-URL | Port | Verwendung |
+|---------|--------|-----------|------|------------|
+| **Backend** | presseportale.test | `assets.presseportale.test` | 5177 | Portal + FluxUI |
+| **Frontend** | presseecho.test<br>businessportal24.test | `assets-web.presseportale.test` | 5178 | Beide Frontend-Domains |
+
+### Warum diese URLs?
+
+#### 1. **assets.presseportale.test** (Portal/Backend)
+- ✅ Kurz und prägnant
+- ✅ Eindeutig dem Portal zugeordnet
+- ✅ Keine zusätzliche Subdomain-Tiefe
+- ✅ Folgt gängiger Konvention
+
+#### 2. **assets-web.presseportale.test** (Web/Frontend)
+- ✅ Klar als "Web" (Frontend) gekennzeichnet
+- ✅ Ein Asset-Server für beide Frontend-Domains
+- ✅ Gute Trennung zu Portal-Assets
+- ✅ Einfach zu merken
+
+## Alternative Namenskonventionen
+
+Falls du andere URLs bevorzugst, hier sind Alternativen:
+
+### Option A: Mit Suffix-Präfix
+```
+portal-assets.presseportale.test  → Port 5177
+web-assets.presseportale.test     → Port 5178
+```
+- ⚠️ Etwas länger
+- ✅ Sehr explizit
+
+### Option B: Mit "vite" im Namen
+```
+vite.presseportale.test          → Port 5177
+vite-web.presseportale.test      → Port 5178
+```
+- ⚠️ Technologie-spezifisch (was wenn du später zu einem anderen Build-Tool wechselst?)
+- ⚠️ Weniger klar was geladen wird
+
+### Option C: Separate Domains pro Frontend
+```
+assets.presseportale.test           → Port 5177 (Portal)
+assets.presseecho.test           → Port 5178 (Presseecho)
+assets.businessportal24.test     → Port 5178 (Businessportal24)
+```
+- ⚠️ Mehr DNS-Einträge nötig
+- ⚠️ Beide Frontend-Domains würden trotzdem auf denselben Port zeigen
+- ❌ Unnötig komplex
+
+### ✅ Empfehlung: Bleib bei der aktuellen Lösung!
+
+## Traefik-Konfiguration (aktuell in docker-compose.yml)
+
+```yaml
+# Portal Assets (Backend)
+- "traefik.http.routers.assets-portal.rule=Host(`assets.presseportale.test`)"
+- "traefik.http.routers.assets-portal.entrypoints=websecure"
+- "traefik.http.routers.assets-portal.tls=true"
+- "traefik.http.routers.assets-portal.service=assets-portal-service"
+- "traefik.http.services.assets-portal-service.loadbalancer.server.port=5177"
+- "traefik.http.services.assets-portal-service.loadbalancer.server.scheme=http"
+
+# Web Assets (Frontend)
+- "traefik.http.routers.assets-web.rule=Host(`assets-web.presseportale.test`)"
+- "traefik.http.routers.assets-web.entrypoints=websecure"
+- "traefik.http.routers.assets-web.tls=true"
+- "traefik.http.routers.assets-web.service=assets-web-service"
+- "traefik.http.services.assets-web-service.loadbalancer.server.port=5178"
+- "traefik.http.services.assets-web-service.loadbalancer.server.scheme=http"
+```
+
+## Port-Mapping in docker-compose.yml
+
+```yaml
+ports:
+    - '${VITE_PORT_PORTAL:-5177}:5177'
+    - '${VITE_PORT_WEB:-5178}:5178'
+```
+
+## Umgebungsvariablen (.env)
+
+```env
+# Vite Asset Domains
+ASSET_URL_PORTAL=https://assets.presseportale.test
+ASSET_URL_WEB=https://assets-web.presseportale.test
+
+# Vite Development Ports
+VITE_PORT_PORTAL=5177
+VITE_PORT_WEB=5178
+```
+
+## DNS / Hosts-Datei
+
+Füge folgende Einträge zu deiner `/etc/hosts` (Linux/Mac) oder `C:\Windows\System32\drivers\etc\hosts` (Windows) hinzu:
+
+```
+127.0.0.1 presseportale.test
+127.0.0.1 presseecho.test
+127.0.0.1 businessportal24.test
+127.0.0.1 assets.presseportale.test
+127.0.0.1 assets-web.presseportale.test
+```
+
+## Vite-Konfigurationen
+
+### vite.portal.config.js
+```javascript
+export default defineConfig({
+    // ...
+    server: {
+        https: false,
+        cors: true,
+        host: "0.0.0.0",
+        port: 5177,
+        hmr: {
+            host: "assets.presseportale.test",  // ← Asset-URL
+            protocol: "wss",
+        },
+    },
+    // ...
+});
+```
+
+### vite.web.config.js
+```javascript
+export default defineConfig({
+    // ...
+    server: {
+        https: false,
+        cors: true,
+        host: "0.0.0.0",
+        port: 5178,
+        hmr: {
+            host: "assets-web.presseportale.test",  // ← Asset-URL
+            protocol: "wss",
+        },
+    },
+    // ...
+});
+```
+
+## Wie funktioniert das Routing?
+
+```
+Browser-Request
+    ↓
+1. User besucht: https://presseecho.test
+    ↓
+2. Laravel lädt View mit: @vite(['resources/css/web/theme-presseecho.css', ...])
+    ↓
+3. Vite-Helper generiert: <script src="https://assets-web.presseportale.test/@vite/client"></script>
+                          <link href="https://assets-web.presseportale.test/resources/css/web/theme-presseecho.css">
+    ↓
+4. Browser requested: assets-web.presseportale.test
+    ↓
+5. Traefik routet zu: Container Port 5178
+    ↓
+6. Vite Web Server antwortet
+    ↓
+7. HMR WebSocket öffnet: wss://assets-web.presseportale.test
+    ↓
+8. ✅ Hot Module Replacement funktioniert!
+```
+
+## Testing
+
+### 1. DNS-Auflösung testen
+```bash
+# Sollte zu 127.0.0.1 auflösen
+ping assets.presseportale.test
+ping assets-web.presseportale.test
+```
+
+### 2. Vite-Server starten
+```bash
+npm run dev:all
+```
+
+Du solltest sehen:
+```
+[PORTAL] VITE v6.0.x ready in xxx ms
+[PORTAL] ➜  Local:   http://0.0.0.0:5177/
+[PORTAL] ➜  Network: use --host to expose
+[WEB]    VITE v6.0.x ready in xxx ms
+[WEB]    ➜  Local:   http://0.0.0.0:5178/
+```
+
+### 3. Browser-Test
+Öffne:
+- https://presseportale.test (sollte Assets von assets.presseportale.test laden)
+- https://presseecho.test (sollte Assets von assets-web.presseportale.test laden)
+- https://businessportal24.test (sollte Assets von assets-web.presseportale.test laden)
+
+### 4. HMR-Test
+1. Öffne Browser DevTools (F12)
+2. Gehe zu "Network" Tab
+3. Filter auf "WS" (WebSocket)
+4. Du solltest Verbindungen zu `wss://assets.*.presseportale.test` sehen
+5. Ändere eine CSS-Datei
+6. Browser sollte automatisch neu laden (ohne vollständigen Page-Refresh)
+
+## Troubleshooting
+
+### Assets werden nicht geladen
+
+**Problem:** Assets 404 oder laden nicht
+
+**Lösung:**
+```bash
+# 1. Vite-Server läuft?
+npm run dev:all
+
+# 2. Ports erreichbar?
+curl http://localhost:5177
+curl http://localhost:5178
+
+# 3. Traefik routet korrekt?
+docker compose logs laravel.test | grep traefik
+```
+
+### HMR funktioniert nicht
+
+**Problem:** Hot Module Replacement lädt nicht automatisch neu
+
+**Lösung:**
+1. Browser-Console checken (F12 → Console)
+2. WebSocket-Verbindung prüfen (F12 → Network → WS)
+3. Falls "WebSocket connection failed":
+   ```bash
+   # Traefik-Logs checken
+   docker compose logs laravel.test
+   
+   # Vite-Server neu starten
+   npm run dev:all
+   ```
+
+### "Mixed Content"-Fehler
+
+**Problem:** Browser blockiert HTTP-Assets auf HTTPS-Site
+
+**Lösung:**
+- Stelle sicher, dass HMR mit `wss://` (nicht `ws://`) läuft
+- Prüfe `protocol: "wss"` in Vite-Configs
+- Traefik sollte SSL für Asset-Domains bereitstellen
+
+## Zusammenfassung
+
+### ✅ Verwende diese Asset-URLs:
+
+```
+assets.presseportale.test       → Port 5177 (Portal/Backend)
+assets-web.presseportale.test   → Port 5178 (Web/Frontend)
+```
+
+### ✅ Vorteile:
+- Kurz und prägnant
+- Klare Trennung Backend/Frontend
+- Ein Asset-Server für beide Frontend-Domains
+- Einfach zu merken und zu konfigurieren
+- Folgt Best Practices
+
+### ✅ Bereits konfiguriert in:
+- ✅ docker-compose.yml (Traefik-Labels + Port-Mapping)
+- ✅ vite.portal.config.js (HMR-Host)
+- ✅ vite.web.config.js (HMR-Host)
+- ✅ .env.example (Variablen-Vorlage)
+
+**Du bist ready to go! 🚀**
+
--- a/_docs/BUSINESSPORTAL24_CSS_OPTIMIZATION.md
+++ b/_docs/BUSINESSPORTAL24_CSS_OPTIMIZATION.md
@ -0,0 +1,232 @@
+# Businessportal24 CSS Optimierung
+
+## 📊 Übersicht
+
+Die `theme-businessportal24.css` wurde optimiert und von **669 auf 560 Zeilen** reduziert.
+
+---
+
+## ❌ Entfernte Duplikate (verschoben nach shared-styles.css)
+
+### 1. **Hero Banner Styles** (Zeilen 218-237)
+```css
+/* ENTFERNT - Jetzt in shared-styles.css */
+.hero-gradient { ... }
+.hero-title { ... }
+.hero-subtitle { ... }
+```
+
+**Grund:** Identisch in beiden Themes, jetzt zentral verwaltet.
+
+---
+
+### 2. **Section Indicator** (Zeilen 262-271)
+```css
+/* ENTFERNT - Nutzt jetzt .gradient-indicator aus shared-styles.css */
+.section-indicator { ... }
+```
+
+**Grund:** Nahezu identisch zu `.gradient-indicator` - gemeinsame Klasse nutzen.
+
+---
+
+### 3. **Industry Icon Badge** (duplikate Definition)
+```css
+/* ENTFERNT - Jetzt in shared-styles.css */
+.industry-icon-badge img { ... }
+```
+
+**Grund:** Bereits in shared-styles.css definiert.
+
+---
+
+## ✅ Behaltene Businessportal24-spezifische Styles
+
+### 1. **Float & Glow Design System**
+```css
+.variant-float-glow                    → Haupthintergrund
+.variant-float-glow .card-hover:hover  → Enhanced Shadow Glow
+```
+
+---
+
+### 2. **Pagination mit Gradient**
+```css
+.pagination-btn          → Glassy Pagination Buttons
+.pagination-active       → Gradient für aktive Seite
+.pagination-nav          → Navigation Arrows
+```
+
+---
+
+### 3. **Glassmorphism Components**
+```css
+.glass-button           → Glassmorphism Button Style
+.company-glass-badge    → Glassy Company Badge
+```
+
+---
+
+### 4. **Content Cards mit Glow**
+```css
+.featured-content article       → Float-Cards mit Glow
+.press-releases-wrapper article → Press Release Cards
+```
+
+---
+
+### 5. **Businessportal24 Utilities**
+```css
+.ad-badge              → Anzeige-Kennzeichnung
+.glow-soft             → Weiche Glows
+.glow-medium           → Mittlere Glows
+.glow-strong           → Starke Glows
+.shadow-elegant        → Elegante Schatten
+.shadow-card           → Card Schatten
+.shadow-premium        → Premium Schatten
+```
+
+---
+
+## 📦 Struktur der optimierten Datei
+
+```
+1. CSS Variables (Zeilen 1-190)
+   ├── Theme-spezifische HSL-Farben
+   ├── Dark Mode Variablen
+   ├── Shadow-Definitionen
+   └── Zinc-Color-System
+
+2. Base & Components (Zeilen 191-155)
+   ├── Base Overrides
+   └── Component Overrides
+
+3. Float & Glow Design (Zeilen 156-560)
+   ├── Haupthintergrund
+   ├── Filter Bar
+   ├── AD Badge
+   ├── Content Kacheln
+   ├── Glass Button
+   ├── Pagination
+   ├── Glow Utilities
+   └── Responsive
+```
+
+---
+
+## 🔄 Migration
+
+### Schritt 1: Backup erstellen
+```bash
+cp resources/css/web/theme-businessportal24.css resources/css/web/theme-businessportal24-backup.css
+```
+
+### Schritt 2: Optimierte Version aktivieren
+```bash
+mv resources/css/web/theme-businessportal24-optimized.css resources/css/web/theme-businessportal24.css
+```
+
+### Schritt 3: Testen
+- Businessportal24-Seite aufrufen
+- Hero Banner prüfen
+- Highlights-Slider prüfen
+- Pagination prüfen
+- Float & Glow Effekte prüfen
+
+---
+
+## 🎯 Vorteile
+
+### 1. **Keine Duplikate mehr**
+- Hero-Styles nur einmal (shared-styles.css)
+- Industry-Icons zentral verwaltet
+- Section-Indicator durch gradient-indicator ersetzt
+
+### 2. **Bessere Wartbarkeit**
+- Klare Trennung: Gemeinsam vs. Theme-spezifisch
+- Einfachere Updates
+- Konsistenz garantiert
+
+### 3. **Kleinere Dateigröße**
+- Von 669 auf 560 Zeilen (-16%)
+- Weniger Code zum Laden
+- Bessere Performance
+
+### 4. **Theme-spezifische Identität bewahrt**
+- Float & Glow Design bleibt
+- Glassmorphism-Effekte bleiben
+- Pagination-Gradient bleibt
+- Alle Businessportal24-spezifischen Features intakt
+
+---
+
+## 📋 Checkliste nach Migration
+
+- [ ] Hero Banner wird korrekt angezeigt
+- [ ] Highlights-Slider funktioniert
+- [ ] Gradient-Indicator erscheint bei Titles
+- [ ] Pagination mit Gradient funktioniert
+- [ ] Float & Glow Effekte auf Cards funktionieren
+- [ ] Dark Mode funktioniert
+- [ ] Glass-Button-Style funktioniert
+- [ ] Industry-Icons werden angezeigt
+- [ ] Responsive Design funktioniert
+
+---
+
+## 🔍 Vergleich: Vorher vs. Nachher
+
+### Vorher (669 Zeilen)
+```
+✗ Hero-Styles dupliziert (20 Zeilen)
+✗ Industry-Icons dupliziert (10 Zeilen)
+✗ Section-Indicator redundant (10 Zeilen)
+✗ Unstrukturiert
+✗ Schwer wartbar
+```
+
+### Nachher (560 Zeilen)
+```
+✓ Keine Duplikate
+✓ Zentral verwaltete gemeinsame Styles
+✓ Klare Struktur
+✓ Leicht wartbar
+✓ Theme-Identität bewahrt
+✓ -109 Zeilen (-16%)
+```
+
+---
+
+## 💡 Best Practice für zukünftige Styles
+
+### Fragen vor dem Hinzufügen neuer Styles:
+
+1. **Ist dieser Style gemeinsam?**
+   - JA → In `shared-styles.css` einfügen
+   - NEIN → In Theme-CSS einfügen
+
+2. **Gibt es einen ähnlichen Style bereits?**
+   - JA → Bestehenden Style erweitern
+   - NEIN → Neuen Style erstellen
+
+3. **Ist dieser Style theme-spezifisch?**
+   - JA → Theme-CSS mit Kommentar
+   - NEIN → shared-styles.css
+
+4. **Brauche ich CSS-Variables?**
+   - JA → In Theme-CSS im :root definieren
+   - NEIN → Direkte Werte nutzen
+
+---
+
+## 🚀 Zusammenfassung
+
+Die Businessportal24-CSS ist jetzt:
+- ✅ **Optimiert** (16% kleiner)
+- ✅ **Duplikatfrei**
+- ✅ **Gut strukturiert**
+- ✅ **Wartbar**
+- ✅ **Theme-Identität bewahrt**
+
+Alle Businessportal24-spezifischen Features (Float & Glow, Glassmorphism, Pagination-Gradient) bleiben vollständig erhalten!
+
--- a/_docs/CATEGORY_SERVICE_DOCUMENTATION.md
+++ b/_docs/CATEGORY_SERVICE_DOCUMENTATION.md
@ -0,0 +1,353 @@
+# CategoryService Dokumentation
+
+Der `CategoryService` ist eine zentrale Service-Klasse für die Verwaltung aller Kategorien in der Anwendung.
+
+## 📁 Pfad
+```
+app/Services/CategoryService.php
+```
+
+## 🎯 Zweck
+
+Der CategoryService bietet eine zentrale Stelle für:
+- Kategorie-Definitionen (Name, Slug, Icon, Farbe, etc.)
+- Farb-Mappings und Gradients
+- Icon-Pfade für Heroicons
+- Helper-Methoden für Kategorie-Zugriff
+
+## 📖 Verfügbare Methoden
+
+### 1. `getCategories()`
+Gibt alle verfügbaren Kategorien zurück.
+
+```php
+use App\Services\CategoryService;
+
+$categories = CategoryService::getCategories();
+// Returns: Array mit allen Kategorien
+```
+
+**Rückgabe-Struktur:**
+```php
+[
+    [
+        'name' => 'Wirtschaft',
+        'slug' => 'wirtschaft',
+        'description' => 'Unternehmensnachrichten, Finanzberichte, Wirtschaftstrends',
+        'count' => '2.450+',
+        'icon' => 'chart-bar',
+        'color' => 'blue',
+    ],
+    // ... weitere Kategorien
+]
+```
+
+### 2. `getCategoryBySlug(string $slug)`
+Findet eine Kategorie anhand ihres Slugs.
+
+```php
+$category = CategoryService::getCategoryBySlug('wirtschaft');
+// Returns: Array mit Kategorie-Daten oder null
+```
+
+### 3. `getCategorySlugs()`
+Gibt alle Kategorie-Slugs als Array zurück.
+
+```php
+$slugs = CategoryService::getCategorySlugs();
+// Returns: ['wirtschaft', 'technologie', 'gesundheit', ...]
+```
+
+### 4. `getColorGradients()`
+Gibt alle Farb-Gradient-Mappings zurück.
+
+```php
+$gradients = CategoryService::getColorGradients();
+// Returns: ['blue' => 'from-blue-500/10 to-blue-600/10', ...]
+```
+
+### 5. `getColorClasses()`
+Gibt alle Farb-CSS-Klassen zurück.
+
+```php
+$classes = CategoryService::getColorClasses();
+// Returns: ['blue' => 'text-blue-500', ...]
+```
+
+### 6. `getGradientForColor(string $color)`
+Gibt den Gradient für eine bestimmte Farbe zurück.
+
+```php
+$gradient = CategoryService::getGradientForColor('blue');
+// Returns: 'from-blue-500/10 to-blue-600/10'
+```
+
+### 7. `getClassForColor(string $color)`
+Gibt die CSS-Klasse für eine bestimmte Farbe zurück.
+
+```php
+$class = CategoryService::getClassForColor('blue');
+// Returns: 'text-blue-500'
+```
+
+### 8. `getIconPath(string $iconName)`
+Generiert den Pfad zu einem Heroicon.
+
+```php
+$path = CategoryService::getIconPath('chart-bar');
+// Returns: '/heroicons/optimized/24/outline/chart-bar.svg'
+```
+
+### 9. `count()`
+Gibt die Gesamtanzahl der Kategorien zurück.
+
+```php
+$total = CategoryService::count();
+// Returns: 12
+```
+
+## 🔧 Verwendungsbeispiele
+
+### Beispiel 1: Kategorien in Blade anzeigen
+
+```blade
+@php
+    use App\Services\CategoryService;
+    $categories = CategoryService::getCategories();
+@endphp
+
+<div class="grid grid-cols-3 gap-4">
+    @foreach($categories as $category)
+        <a href="/kategorie/{{ $category['slug'] }}">
+            <div class="category-card">
+                <img src="{{ CategoryService::getIconPath($category['icon']) }}" 
+                     alt="{{ $category['name'] }}">
+                <h3>{{ $category['name'] }}</h3>
+                <p>{{ $category['description'] }}</p>
+            </div>
+        </a>
+    @endforeach
+</div>
+```
+
+### Beispiel 2: Kategorie in Controller verwenden
+
+```php
+use App\Services\CategoryService;
+
+class CategoryController extends Controller
+{
+    public function show(string $slug)
+    {
+        $category = CategoryService::getCategoryBySlug($slug);
+        
+        if (!$category) {
+            abort(404);
+        }
+        
+        return view('kategorie', [
+            'category' => $category,
+            'allCategories' => CategoryService::getCategories(),
+        ]);
+    }
+}
+```
+
+### Beispiel 3: Kategorie-Navigation
+
+```blade
+@php
+    use App\Services\CategoryService;
+    $categories = CategoryService::getCategories();
+@endphp
+
+<nav class="category-nav">
+    @foreach($categories as $category)
+        <a href="/kategorie/{{ $category['slug'] }}" 
+           class="nav-item {{ request()->segment(2) === $category['slug'] ? 'active' : '' }}">
+            {{ $category['name'] }}
+        </a>
+    @endforeach
+</nav>
+```
+
+### Beispiel 4: Dropdown mit Kategorien
+
+```blade
+<select name="category" class="form-select">
+    <option value="">Kategorie wählen</option>
+    @foreach(App\Services\CategoryService::getCategories() as $cat)
+        <option value="{{ $cat['slug'] }}">{{ $cat['name'] }}</option>
+    @endforeach
+</select>
+```
+
+### Beispiel 5: Kategorie-Filter in Livewire
+
+```php
+use App\Services\CategoryService;
+use Livewire\Component;
+
+class PressReleaseFilter extends Component
+{
+    public $selectedCategory = '';
+    public $categories = [];
+    
+    public function mount()
+    {
+        $this->categories = CategoryService::getCategories();
+    }
+    
+    public function render()
+    {
+        return view('livewire.press-release-filter');
+    }
+}
+```
+
+### Beispiel 6: Farb-Gradient verwenden
+
+```blade
+@php
+    use App\Services\CategoryService;
+    $category = CategoryService::getCategoryBySlug('wirtschaft');
+    $gradient = CategoryService::getGradientForColor($category['color']);
+    $iconColor = CategoryService::getClassForColor($category['color']);
+@endphp
+
+<div class="bg-gradient-to-br {{ $gradient }} rounded-lg p-4">
+    <img src="{{ CategoryService::getIconPath($category['icon']) }}" 
+         class="h-8 w-8 {{ $iconColor }}" 
+         alt="{{ $category['name'] }}">
+    <h3>{{ $category['name'] }}</h3>
+</div>
+```
+
+## 🎨 Verfügbare Kategorien
+
+Aktuell sind folgende Kategorien definiert:
+
+| Name | Slug | Icon | Farbe |
+|------|------|------|-------|
+| Wirtschaft | wirtschaft | chart-bar | blue |
+| Technologie | technologie | cpu-chip | purple |
+| Gesundheit | gesundheit | heart | green |
+| Finanzen | finanzen | currency-dollar | yellow |
+| Automotive | automotive | truck | red |
+| Immobilien | immobilien | building-office | indigo |
+| Energie | energie | bolt | orange |
+| Bildung | bildung | academic-cap | cyan |
+| Handel | handel | shopping-cart | pink |
+| Tourismus | tourismus | globe-alt | teal |
+| Sport | sport | trophy | lime |
+| Kultur | kultur | musical-note | violet |
+
+## ➕ Neue Kategorie hinzufügen
+
+Um eine neue Kategorie hinzuzufügen, bearbeiten Sie die `getCategories()` Methode in `app/Services/CategoryService.php`:
+
+```php
+public static function getCategories(): array
+{
+    return [
+        // ... bestehende Kategorien
+        [
+            'name' => 'Neue Kategorie',
+            'slug' => 'neue-kategorie',
+            'description' => 'Beschreibung der neuen Kategorie',
+            'count' => '0+',
+            'icon' => 'icon-name', // Heroicon Name
+            'color' => 'emerald', // Farbe
+        ],
+    ];
+}
+```
+
+**Wichtig:** Wenn Sie eine neue Farbe verwenden, fügen Sie diese auch in `getColorGradients()` und `getColorClasses()` hinzu!
+
+## 🎯 Best Practices
+
+1. **Verwenden Sie immer den CategoryService** statt hardcodierte Kategorien
+2. **Caching:** Für bessere Performance können Kategorien gecacht werden
+3. **Validierung:** Nutzen Sie `getCategoryBySlug()` zur Validierung von Kategorie-Parametern
+4. **Konsistenz:** Alle Kategorie-Daten sollten nur über den Service abgerufen werden
+
+## 🔄 Migration von inline Arrays
+
+**Vorher:**
+```blade
+@php
+    $categories = [
+        ['name' => 'Wirtschaft', 'slug' => 'wirtschaft', ...],
+        // ...
+    ];
+@endphp
+```
+
+**Nachher:**
+```blade
+@php
+    use App\Services\CategoryService;
+    $categories = CategoryService::getCategories();
+@endphp
+```
+
+## 📊 Performance-Tipps
+
+Wenn Sie die Kategorien häufig verwenden, können Sie sie in einem View Composer laden:
+
+```php
+// app/Providers/ViewServiceProvider.php
+use App\Services\CategoryService;
+use Illuminate\Support\Facades\View;
+
+public function boot()
+{
+    View::composer('*', function ($view) {
+        $view->with('globalCategories', CategoryService::getCategories());
+    });
+}
+```
+
+Dann in Blade:
+```blade
+@foreach($globalCategories as $category)
+    <!-- ... -->
+@endforeach
+```
+
+## 🧪 Testing
+
+Beispiel für einen Test:
+
+```php
+use App\Services\CategoryService;
+use Tests\TestCase;
+
+class CategoryServiceTest extends TestCase
+{
+    public function test_get_categories_returns_array()
+    {
+        $categories = CategoryService::getCategories();
+        
+        $this->assertIsArray($categories);
+        $this->assertNotEmpty($categories);
+    }
+    
+    public function test_get_category_by_slug()
+    {
+        $category = CategoryService::getCategoryBySlug('wirtschaft');
+        
+        $this->assertNotNull($category);
+        $this->assertEquals('Wirtschaft', $category['name']);
+    }
+}
+```
+
+## 📝 Changelog
+
+- **v1.0** - Initiale Version mit allen 12 Kategorien
+- Unterstützt Heroicons
+- Farb-Mappings für alle Kategorien
+- Helper-Methoden für einfachen Zugriff
+
--- a/_docs/COMPONENT_DOCUMENTATION.md
+++ b/_docs/COMPONENT_DOCUMENTATION.md
@ -0,0 +1,485 @@
+# Komponenten-Dokumentation
+
+Diese Dokumentation beschreibt alle wiederverwendbaren Blade-Komponenten für die Presseecho und Businessportal24 Themes.
+
+## Inhaltsverzeichnis
+1. [Layout-Komponenten](#layout-komponenten)
+2. [Navigation-Komponenten](#navigation-komponenten)
+3. [Content-Komponenten](#content-komponenten)
+4. [Card-Komponenten](#card-komponenten)
+5. [Verwendungsbeispiele](#verwendungsbeispiele)
+
+---
+
+## Layout-Komponenten
+
+### Content-Layout
+**Pfad:** `resources/views/components/web/content-layout.blade.php`
+
+Hauptlayout für Unterseiten mit optionaler Sidebar.
+
+**Props:**
+- `$sidebar` (slot): Sidebar-Inhalt (optional)
+- `$sidebarPosition` (string): Position der Sidebar - `'left'` oder `'right'` (default: `'right'`)
+
+**Beispiel ohne Sidebar:**
+```blade
+<x-web.content-layout>
+    <article>
+        <!-- Ihr Content hier -->
+    </article>
+</x-web.content-layout>
+```
+
+**Beispiel mit Sidebar:**
+```blade
+<x-web.content-layout>
+    <x-slot name="sidebar">
+        <x-web.sidebar-widget title="Filter">
+            <!-- Sidebar-Inhalte -->
+        </x-web.sidebar-widget>
+    </x-slot>
+    
+    <article>
+        <!-- Hauptcontent -->
+    </article>
+</x-web.content-layout>
+```
+
+### Page Header
+**Pfad:** `resources/views/components/web/page-header.blade.php`
+
+Header für Unterseiten mit Titel, Subtitle und optionalem Bild.
+
+**Props:**
+- `$title` (string, required): Hauptüberschrift
+- `$subtitle` (string, optional): Untertitel
+- `$meta` (slot, optional): Meta-Informationen (Badges, Datum, etc.)
+- `$image` (string, optional): URL für Header-Bild
+- `$compact` (bool): Kompakte Version (default: `false`)
+
+**Beispiel:**
+```blade
+<x-web.page-header 
+    title="Die Zukunft der KI"
+    subtitle="Exklusive Einblicke in die Herausforderungen">
+    <x-slot name="meta">
+        <span class="badge badge-primary">Exklusiv-Interview</span>
+        <span>17. Oktober 2024</span>
+    </x-slot>
+</x-web.page-header>
+```
+
+---
+
+## Navigation-Komponenten
+
+### Main Navigation
+**Pfad:** `resources/views/components/web/main-navigation.blade.php`
+
+Sticky Navigation für verschiedene Themes.
+
+**Props:**
+- `$theme` (string): Theme-Name - `'presseecho'` oder `'businessportal24'` (default: `'presseecho'`)
+- `$items` (array, optional): Custom Navigation-Items
+
+**Beispiel Standard:**
+```blade
+<x-web.main-navigation theme="presseecho" />
+```
+
+**Beispiel Custom Items:**
+```blade
+<x-web.main-navigation 
+    theme="presseecho"
+    :items="[
+        ['label' => 'Kategorien', 'url' => '/kategorien'],
+        ['label' => 'Autoren', 'url' => '/autoren'],
+    ]" 
+/>
+```
+
+### Breadcrumb
+**Pfad:** `resources/views/components/web/breadcrumb.blade.php`
+
+Breadcrumb-Navigation für Unterseiten.
+
+**Props:**
+- `$items` (array, required): Array von Breadcrumb-Items
+
+**Beispiel:**
+```blade
+<x-web.breadcrumb :items="[
+    ['label' => 'Themendossiers', 'url' => '/themendossiers'],
+    ['label' => 'KI & Innovation', 'url' => '/themendossiers/ki'],
+    ['label' => 'Artikel-Titel']
+]" />
+```
+
+---
+
+## Content-Komponenten
+
+### Section Header
+**Pfad:** `resources/views/components/web/section-header.blade.php`
+
+Header für Content-Sections.
+
+**Props:**
+- `$title` (string, required): Section-Titel
+- `$subtitle` (string, optional): Subtitle
+- `$size` (string): Größe - `'small'`, `'medium'`, `'large'` (default: `'medium'`)
+
+**Beispiel:**
+```blade
+<x-web.section-header 
+    title="Neueste Analysen"
+    subtitle="Fundierte Einschätzungen von Branchenexperten"
+    size="medium" 
+/>
+```
+
+### Hero Banner
+**Pfad:** `resources/views/components/web/hero-banner.blade.php`
+
+Hero-Section für Startseiten.
+
+**Props:**
+- `$theme` (string): Theme-Name (default: `'presseecho'`)
+- `$title` (slot): Hero-Titel
+- `$subtitle` (slot): Hero-Subtitle
+
+**Beispiel:**
+```blade
+<x-web.hero-banner theme="presseecho">
+    <x-slot name="title">
+        Exklusive Fachmeldungen <span class="opacity-50">für Ihre Recherche</span>
+    </x-slot>
+    <x-slot name="subtitle">
+        Exklusive Wirtschaftsinformationen für Journalisten
+    </x-slot>
+</x-web.hero-banner>
+```
+
+### Sidebar Widget
+**Pfad:** `resources/views/components/web/sidebar-widget.blade.php`
+
+Widget-Container für Sidebar-Elemente.
+
+**Props:**
+- `$title` (string, optional): Widget-Titel
+- `$icon` (slot, optional): Icon als SVG
+
+**Beispiel:**
+```blade
+<x-web.sidebar-widget title="Über den Autor">
+    <div class="flex items-start gap-4">
+        <div class="w-16 h-16 rounded-full bg-gradient-to-br from-[var(--color-primary)] to-[var(--color-secondary)]">
+            <!-- Avatar -->
+        </div>
+        <div>
+            <h4 class="font-semibold">Dr. Maria Schmidt</h4>
+            <p class="text-sm">Expertin für KI</p>
+        </div>
+    </div>
+</x-web.sidebar-widget>
+```
+
+---
+
+## Card-Komponenten
+
+### Article Card
+**Pfad:** `resources/views/components/web/article-card.blade.php`
+
+Standard-Karte für Artikel.
+
+**Props:**
+- `$article` (array, required): Artikel-Daten
+
+**Erforderliche Array-Struktur:**
+```php
+$article = [
+    'badge' => 'Analyse',
+    'badgeType' => 'primary', // primary, secondary, success, warning
+    'category' => 'Industrie 4.0',
+    'categoryBadgeType' => 'secondary',
+    'date' => '2024-10-16',
+    'dateFormatted' => '16. Okt 2024',
+    'title' => 'Artikeltitel',
+    'teaser' => 'Kurzbeschreibung...',
+    'author' => 'Thomas Müller',
+    'authorInitials' => 'TM',
+    'image' => 'https://...',
+];
+```
+
+**Beispiel:**
+```blade
+<div class="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
+    @foreach ($articles as $article)
+        <x-web.article-card :article="$article" />
+    @endforeach
+</div>
+```
+
+### Dossier Card
+**Pfad:** `resources/views/components/web/dossier-card.blade.php`
+
+Karte für Themendossiers.
+
+**Props:**
+- `$dossier` (array, required): Dossier-Daten
+
+**Erforderliche Array-Struktur:**
+```php
+$dossier = [
+    'title' => 'KI in der Industrie',
+    'description' => 'Alle Facetten der künstlichen Intelligenz...',
+    'articleCount' => 12,
+    'image' => 'https://...',
+];
+```
+
+**Beispiel:**
+```blade
+<div class="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
+    @foreach ($dossiers as $dossier)
+        <x-web.dossier-card :dossier="$dossier" />
+    @endforeach
+</div>
+```
+
+### Highlight Card
+**Pfad:** `resources/views/components/web/highlight-card.blade.php`
+
+Karte für Highlights (wird im Slider verwendet).
+
+**Props:**
+- `$highlight` (array, required): Highlight-Daten
+
+**Erforderliche Array-Struktur:**
+```php
+$highlight = [
+    'badge' => 'Exklusiv-Interview',
+    'badgeType' => 'primary',
+    'industry' => 'KI & Innovation',
+    'date' => '17. Oktober 2024',
+    'title' => 'Die Zukunft der KI',
+    'text' => 'Beschreibungstext...',
+    'author' => 'Dr. Maria Schmidt',
+    'authorRole' => 'Expertin für KI',
+    'initials' => 'MS',
+    'image' => 'https://...',
+];
+```
+
+### Highlights Slider
+**Pfad:** `resources/views/components/web/highlights-slider.blade.php`
+
+Interaktiver Slider für Highlights mit Navigation und Keyboard-Support.
+
+**Props:**
+- `$highlights` (array, required): Array von Highlight-Daten
+- `$theme` (string): Theme-Name (default: `'presseecho'`)
+
+**Beispiel:**
+```blade
+@php
+    $highlights = [
+        [
+            'badge' => 'Exklusiv-Interview',
+            'badgeType' => 'primary',
+            'industry' => 'KI & Innovation',
+            'date' => '17. Oktober 2024',
+            'title' => 'Die Zukunft der KI',
+            'text' => 'Interview-Text...',
+            'author' => 'Dr. Maria Schmidt',
+            'authorRole' => 'Expertin',
+            'initials' => 'MS',
+            'image' => 'https://...',
+        ],
+        // ... weitere Highlights
+    ];
+@endphp
+
+<x-web.highlights-slider :highlights="$highlights" theme="presseecho" />
+```
+
+---
+
+## Verwendungsbeispiele
+
+### Beispiel 1: Artikel-Detailseite
+
+```blade
+@extends('web.layouts.web-master')
+
+@section('content')
+<main class="min-h-screen flex flex-col bg-white dark:bg-zinc-950">
+    <livewire:web.burger-menu />
+    <livewire:web.header />
+    
+    <x-web.main-navigation theme="presseecho" />
+    
+    <div class="container mx-auto px-4">
+        <x-web.breadcrumb :items="[
+            ['label' => 'Themendossiers', 'url' => '/themendossiers'],
+            ['label' => 'KI & Innovation', 'url' => '/ki'],
+            ['label' => 'Artikel-Titel']
+        ]" />
+    </div>
+    
+    <x-web.page-header 
+        title="Die Zukunft der KI"
+        subtitle="Exklusive Einblicke">
+        <x-slot name="meta">
+            <span class="badge badge-primary">Interview</span>
+            <span>17. Oktober 2024</span>
+        </x-slot>
+    </x-web.page-header>
+    
+    <x-web.content-layout>
+        <x-slot name="sidebar">
+            <x-web.sidebar-widget title="Über den Autor">
+                <!-- Author Info -->
+            </x-web.sidebar-widget>
+        </x-slot>
+        
+        <article class="prose prose-lg">
+            <!-- Artikel-Content -->
+        </article>
+    </x-web.content-layout>
+    
+    <livewire:web.footer />
+</main>
+@endsection
+```
+
+### Beispiel 2: Kategorie-Übersicht
+
+```blade
+@extends('web.layouts.web-master')
+
+@section('content')
+<main class="min-h-screen flex flex-col bg-white dark:bg-zinc-950">
+    <livewire:web.burger-menu />
+    <livewire:web.header />
+    
+    <x-web.main-navigation theme="presseecho" />
+    
+    <div class="container mx-auto px-4">
+        <x-web.breadcrumb :items="[
+            ['label' => 'Themendossiers', 'url' => '/themendossiers'],
+            ['label' => 'KI & Innovation']
+        ]" />
+    </div>
+    
+    <x-web.page-header 
+        title="KI & Innovation"
+        subtitle="Alle Artikel zum Thema"
+        image="https://..." />
+    
+    <x-web.content-layout>
+        <x-slot name="sidebar">
+            <x-web.sidebar-widget title="Filter">
+                <!-- Filter-Optionen -->
+            </x-web.sidebar-widget>
+        </x-slot>
+        
+        <div class="grid md:grid-cols-2 gap-6">
+            @foreach ($articles as $article)
+                <x-web.article-card :article="$article" />
+            @endforeach
+        </div>
+    </x-web.content-layout>
+    
+    <livewire:web.footer />
+</main>
+@endsection
+```
+
+---
+
+## CSS-Klassen
+
+### Badge-Typen
+- `badge` - Basis-Badge
+- `badge-primary` - Primary-Farbe
+- `badge-secondary` - Secondary-Farbe
+- `badge-success` - Erfolg (Grün)
+- `badge-warning` - Warnung (Gelb)
+
+### Button-Typen
+- `btn-primary` - Primary-Button mit Gradient
+- `btn-secondary` - Secondary-Button
+- `pagination-btn` - Pagination-Button
+- `pagination-active` - Aktive Pagination-Seite
+
+### Card-Typen
+- `card` - Basis-Karte
+- `card-hover` - Karte mit Hover-Effekt
+- `highlight-card` - Highlight-Karte (Slider)
+
+### Layout-Klassen
+- `section-light-bg` - Heller Section-Hintergrund
+- `section-gradient-bg` - Gradient Section-Hintergrund
+- `page-header` - Page-Header-Container
+- `page-header-compact` - Kompakter Page-Header
+
+---
+
+## Theme-Anpassung
+
+Alle Komponenten respektieren die Theme-Variablen:
+
+```css
+:root {
+    --primary: /* HSL-Werte */
+    --secondary: /* HSL-Werte */
+    --color-primary: /* Hex-Werte */
+    --color-secondary: /* Hex-Werte */
+}
+```
+
+**Presseecho:**
+- Primary: `#345636` (Grün)
+- Secondary: `#6b8f71` (Hellgrün)
+
+**Businessportal24:**
+- Primary: `#cf3628` (Rot)
+- Secondary: `#f0834a` (Orange)
+
+---
+
+## Best Practices
+
+1. **Komponenten-Verwendung:**
+   - Nutzen Sie immer die wiederverwendbaren Komponenten
+   - Vermeiden Sie duplizierte HTML-Strukturen
+   - Verwenden Sie Props für dynamische Inhalte
+
+2. **CSS-Klassen:**
+   - Nutzen Sie die vordefinierten CSS-Klassen aus `shared-styles.css`
+   - Vermeiden Sie Inline-Styles, wo möglich
+   - Theme-spezifische Overrides in den jeweiligen Theme-CSS-Dateien
+
+3. **Datenstruktur:**
+   - Halten Sie sich an die definierten Array-Strukturen
+   - Verwenden Sie `@php`-Blöcke für Daten-Definitionen
+   - Dokumentieren Sie Custom-Properties
+
+4. **Accessibility:**
+   - Verwenden Sie semantische HTML-Tags
+   - Fügen Sie `aria-label` zu interaktiven Elementen hinzu
+   - Testen Sie die Keyboard-Navigation
+
+---
+
+## Support
+
+Bei Fragen zur Verwendung der Komponenten:
+- Siehe Beispiele unter `/resources/views/web/examples/`
+- Konsultieren Sie diese Dokumentation
+- Prüfen Sie die bestehenden Implementierungen in `presseecho.blade.php`
+
--- a/_docs/DOMAINS-CONFIG.md
+++ b/_docs/DOMAINS-CONFIG.md
@ -0,0 +1,114 @@
+# Multi-Domain-Konfiguration für Laravel
+
+Dieses Projekt unterstützt mehrere Domains mit unterschiedlichen Styles und Konfigurationen.
+Die Domains werden über `.env`-Variablen konfiguriert.
+
+## Basis-Konfiguration
+
+Füge die folgenden Variablen zu deiner `.env`-Datei hinzu:
+
+```env
+# Domain-Konfigurationen
+APP_NAME=presseportale
+APP_URL=https://presseportale.test
+APP_PRIMARY="#3ea3dc"
+APP_ACCENT="#5c5c60"
+
+# Entwicklungseinstellungen für Domains
+DEV_SIMULATE_DOMAIN=false
+DEV_SIMULATED_DOMAIN=presseportale.test
+```
+
+## Entwicklungsmodus
+
+Während der Entwicklung kann es nützlich sein, verschiedene Domains zu simulieren,
+ohne die Host-Datei bearbeiten zu müssen:
+
+1. Setze `DEV_SIMULATE_DOMAIN=true` in deiner `.env`-Datei.
+2. Setze `DEV_SIMULATED_DOMAIN` auf eine der konfigurierten Domains (z.B. `landing1.local`).
+
+Dies bewirkt, dass die Anwendung so reagiert, als würde sie unter der angegebenen Domain laufen,
+unabhängig von der tatsächlichen URL.
+
+## Domain-spezifische Konfiguration
+
+Jede Domain kann eigene Einstellungen haben:
+
+### Haupt-Website (presseportale.test)
+
+-   `APP_URL`: Die Domain für die Haupt-Website (https://presseportale.test)
+-   `APP_NAME`: Der Name der Haupt-Website (presseportale)
+-   `APP_PRIMARY`: Die primäre Farbe im HEX-Format (#3ea3dc)
+-   `APP_ACCENT`: Die Akzentfarbe im HEX-Format (#5c5c60)
+
+### Presseecho (presseecho.test)
+
+-   `APP_PRESSEECHO`: Die Domain für Presseecho (presseecho.test)
+-   `APP_PRESSEECHO_URL`: Die vollständige URL (https://presseecho.test)
+-   `APP_PRESSEECHO_NAME`: Der Name der Website (presseecho)
+-   `APP_PRESSEECHO_PRIMARY`: Die primäre Farbe im HEX-Format (#e94a3c)
+-   `APP_PRESSEECHO_ACCENT`: Die Akzentfarbe im HEX-Format (#5c5c60)
+
+### Business Portal (businessportal24.test)
+
+-   `APP_BUSINESSPORTAL`: Die Domain für das Business Portal (businessportal24.test)
+-   `APP_BUSINESSPORTAL_URL`: Die vollständige URL (https://businessportal24.test)
+-   `APP_BUSINESSPORTAL_NAME`: Der Name der Website (businessportal24)
+-   `APP_BUSINESSPORTAL_PRIMARY`: Die primäre Farbe im HEX-Format (#f69f0f)
+-   `APP_BUSINESSPORTAL_ACCENT`: Die Akzentfarbe im HEX-Format (#5c5c60)
+
+## Hosts-Datei konfigurieren
+
+Um die verschiedenen Domains lokal zu testen, füge folgende Zeilen zu deiner Hosts-Datei hinzu:
+
+```
+127.0.0.1    presseportale.test
+127.0.0.1    presseecho.test
+127.0.0.1    businessportal24.test
+```
+
+Die Hosts-Datei befindet sich unter:
+
+-   Windows: `C:\Windows\System32\drivers\etc\hosts`
+-   macOS/Linux: `/etc/hosts`
+
+## Verwendung im Code
+
+Im Code kannst du auf die Domain-Konfiguration zugreifen:
+
+```php
+// Domain-Name in einem View
+{{ $domainName }}
+
+// Theme in einem View
+{{ $theme }}
+
+// Vollständige Domain-Konfiguration
+{{ $domainConfig['description'] }}
+
+// Über die app-Config
+{{ config('app.theme') }}
+{{ config('app.domain_name') }}
+
+// Aktuelle Domain ermitteln
+{{ request()->getHost() }}
+
+// Domain-spezifische Assets laden
+@vite(['resources/css/web/theme-main.css'])
+```
+
+## Aktuelle Implementierung
+
+Das Projekt verwendet bereits eine Multi-Domain-Architektur mit:
+
+-   **Hauptwebsite:** `presseportale.test` - Hauptwebsite mit blauem Theme (#3ea3dc)
+-   **Presseecho:** `presseecho.test` - Presseecho-Website mit rotem Theme (#e94a3c)
+-   **Business Portal:** `businessportal24.test` - Business Portal mit orangem Theme (#f69f0f)
+
+Jede Domain kann eigene Farben, Namen und Konfigurationen haben und lädt automatisch domainspezifische Assets über Vite.
+
+## Verfügbare Routen
+
+-   **Web:** `/`, `/welcome`
+-   **Auth:** `/login`, `/register`, `/forgot-password`
+-   **Admin:** `/dashboard`, `/admin/users`, `/settings/*` (falls implementiert)
--- a/_docs/FINAL-FIX-SUMMARY.md
+++ b/_docs/FINAL-FIX-SUMMARY.md
@ -0,0 +1,103 @@
+# ✅ Finale Fehlerbehebung - Asset-URL Probleme gelöst
+
+## 🔍 Ursprüngliches Problem
+
+Auf https://presseportale.test erschien der Fehler:
+```
+[Error] Not allowed to use restricted network host "0.0.0.0": 
+https://0.0.0.0:5178/@vite/client
+```
+
+## 🎯 Ursache
+
+1. **Falscher Build-Ordner**: `routes/domains.php` verwendete `build/admin` statt `build/portal`
+2. **Falscher Port**: Portal versuchte Port 5178 (Web) statt 5177 (Portal) zu verwenden
+3. **Fehlende CSS-Datei**: `portal.css` existierte nicht, `vite.portal.config.js` referenzierte sie aber
+
+## ✅ Durchgeführte Fixes
+
+### 1. Build-Ordner korrigiert
+**Datei**: `routes/domains.php`
+```php
+// VORHER (❌ FALSCH):
+Vite::useBuildDirectory('build/admin');
+
+// NACHHER (✅ RICHTIG):
+Vite::useBuildDirectory('build/portal');
+```
+
+### 2. CSS-Datei umbenannt
+```bash
+resources/css/app.css → resources/css/portal.css
+```
+
+### 3. Alle Views aktualisiert
+Geänderte Dateien:
+- `resources/views/partials/head.blade.php`
+- `resources/views/partials/admin-head.blade.php`  
+- `resources/views/layouts/admin-master.blade.php`
+- `resources/views/web/layouts/admin-master.blade.php`
+
+Alle verwenden jetzt:
+```php
+@vite(['resources/css/portal.css', 'resources/js/app.js'])
+```
+
+### 4. Vite-Server neu gestartet
+```bash
+pkill -f "vite --config"
+npm run dev:all
+```
+
+## 🧪 Verifikation
+
+```bash
+# Portal CSS wird korrekt geladen:
+curl -Iks https://assets.presseportale.test/resources/css/portal.css
+# → HTTP/2 200 ✅
+
+# Web Assets funktionieren:
+curl -Iks https://assets.presseecho.test/resources/css/web/theme-presseecho.css
+curl -Iks https://assets.businessportal24.test/resources/css/web/theme-businessportal24.css
+```
+
+## 📋 Finale Struktur
+
+| Domain | Asset-Domain | Port | Build-Dir | CSS-Datei |
+|--------|-------------|------|-----------|-----------|
+| presseportale.test | assets.presseportale.test | 5177 | build/portal | portal.css |
+| presseecho.test | assets.presseecho.test | 5178 | build/web | theme-presseecho.css |
+| businessportal24.test | assets.businessportal24.test | 5178 | build/web | theme-businessportal24.css |
+
+## 🚀 Nächste Schritte
+
+1. **Browser testen**: Öffne https://presseportale.test und mache einen Hard-Refresh (`Ctrl+Shift+R`)
+2. **Keine Fehler mehr**: Die "0.0.0.0" Fehler sollten verschwunden sein
+3. **Assets laden über HTTPS**: Alle CSS/JS-Dateien werden über die korrekten Asset-Subdomains geladen
+
+## 📝 Wichtige Hinweise
+
+- **Vite-Server laufen im Hintergrund**: Logs unter `/tmp/vite-server.log`
+- **Bei Änderungen**: Vite HMR (Hot Module Replacement) funktioniert jetzt korrekt
+- **Produktion**: Für Production einfach `npm run build` ausführen
+
+## ⚠️ Falls Docker Container neu gestartet wurden
+
+Falls du die Docker Container neu gestartet hast, stelle sicher dass:
+
+1. ✅ DNS-Einträge in `/etc/hosts` vorhanden sind:
+   ```
+   127.0.0.1 assets.presseportale.test
+   127.0.0.1 assets.presseecho.test
+   127.0.0.1 assets.businessportal24.test
+   ```
+
+2. ✅ Vite-Server laufen:
+   ```bash
+   npm run dev:all > /tmp/vite-server.log 2>&1 &
+   ```
+
+## 🎉 Ergebnis
+
+Alle drei Domains laden jetzt ihre Assets korrekt über HTTPS von ihren jeweiligen Asset-Subdomains!
+
--- a/_docs/FINALE-ASSET-URL-FIXES.md
+++ b/_docs/FINALE-ASSET-URL-FIXES.md
@ -0,0 +1,107 @@
+# ✅ Finale Asset-URL Fixes - Zusammenfassung
+
+## 🔧 Was wurde geändert
+
+### 1. `config/domains.php`
+Jede Domain hat jetzt eine dedizierte `asset_url`:
+- `portal`: `https://assets.presseportale.test`
+- `presseecho`: `https://assets.presseecho.test`
+- `businessportal24`: `https://assets.businessportal24.test`
+
+### 2. `app/Providers/ThemeServiceProvider.php`
+- Setzt `config('app.asset_url')` dynamisch basierend auf der Domain
+- Aktualisiert die `public/hot` Datei mit der richtigen Asset-URL
+- Vite verwendet nun die domain-spezifische Asset-URL
+
+### 3. `vite.web.config.js`
+- Hinzugefügt: `allowedHosts` für alle Asset-Domains
+- Erlaubt Anfragen von beiden Web-Asset-Domains
+
+### 4. `config/vite.php` (NEU)
+- Neue Laravel Vite-Konfiguration
+- Verwendet die dynamische `ASSET_URL` aus der Umgebung
+
+## 🚀 Jetzt testen
+
+### 1. Vite-Server neu starten
+
+```bash
+# Stoppe alle Vite-Server
+pkill -f "vite --config"
+
+# Starte neu
+npm run dev:all > /tmp/vite-server.log 2>&1 &
+
+# Prüfe Status
+sleep 5 && tail -30 /tmp/vite-server.log
+```
+
+### 2. Im Browser testen
+
+Öffne mit Hard-Refresh (`Ctrl+Shift+R`):
+- ✅ https://presseportale.test
+- ✅ https://presseecho.test  
+- ✅ https://businessportal24.test
+
+### 3. Erwartetes Verhalten
+
+**VORHER (❌)**:
+```
+https://0.0.0.0:5178/@vite/client
+```
+
+**NACHHER (✅)**:
+```
+https://assets.presseportale.test/@vite/client
+https://assets.presseecho.test/@vite/client
+https://assets.businessportal24.test/@vite/client
+```
+
+## 🔍 Debug-Befehle
+
+Falls Probleme auftreten:
+
+```bash
+# 1. Prüfe Hot-File
+cat public/hot
+
+# 2. Prüfe Asset-Domains
+curl -Ik https://assets.presseecho.test/@vite/client
+curl -Ik https://assets.businessportal24.test/@vite/client
+
+# 3. Prüfe Vite-Server Logs
+tail -50 /tmp/vite-server.log
+
+# 4. Cache leeren
+php artisan config:clear && php artisan view:clear
+```
+
+## 📋 Wie es funktioniert
+
+1. **Request kommt an** → z.B. `businessportal24.test`
+2. **ThemeServiceProvider** erkennt die Domain
+3. **Config wird geladen** → `config/domains.php` für `businessportal24`
+4. **Asset-URL wird gesetzt** → `https://assets.businessportal24.test`
+5. **Hot-File wird aktualisiert** → `public/hot` bekommt die richtige URL
+6. **Vite lädt Assets** → Von der richtigen Asset-Domain (Port 5178)
+7. **Traefik leitet weiter** → Von Port 443 (HTTPS) zu Port 5178 (intern)
+
+## ✨ Vorteile der neuen Lösung
+
+✅ Saubere Trennung pro Domain
+✅ Keine Port-Nummern in URLs
+✅ HTTPS funktioniert korrekt
+✅ Dynamische Asset-URLs basierend auf Domain
+✅ Funktioniert mit Vite HMR (Hot Module Replacement)
+✅ Erweiterbar für neue Domains
+
+## 🎯 Nächste Schritte
+
+Wenn alles funktioniert:
+1. Dokumentiere die neue Struktur im Team
+2. Lösche alte/temporäre Dokumentationsdateien
+3. Commit die Änderungen
+
+Viel Erfolg! 🚀
+
+
--- a/_docs/FINAL_OPTIMIZATION_SUMMARY.md
+++ b/_docs/FINAL_OPTIMIZATION_SUMMARY.md
@ -0,0 +1,439 @@
+# Finale Optimierungs-Zusammenfassung
+
+## Übersicht
+
+Diese Dokumentation fasst alle durchgeführten Optimierungen für Presseecho und Businessportal24 zusammen, einschließlich der neuen Unterseiten-Komponenten.
+
+---
+
+## 📊 Statistiken
+
+### Dateien erstellt/optimiert
+
+| Kategorie | Anzahl | Details |
+|-----------|--------|---------|
+| **Blade-Komponenten** | 11 | Layout, Navigation, Content, Cards |
+| **CSS-Dateien** | 3 | shared-styles, theme-presseecho, theme-businessportal24 |
+| **Beispiel-Seiten** | 2 | Article-Detail, Category-Overview |
+| **Dokumentation** | 2 | Component-Docs, Optimization-Summary |
+
+### Code-Reduktion
+
+| Datei | Vorher | Nachher | Reduktion |
+|-------|--------|---------|-----------|
+| **presseecho.blade.php** | 243 Zeilen | 211 Zeilen | -32 Zeilen |
+| **theme-presseecho.css** | 166 Zeilen | 145 Zeilen | -21 Zeilen |
+| **theme-businessportal24.css** | 512 Zeilen | 512 Zeilen | Optimiert |
+
+### Wiederverwendbarkeit
+
+- **11 Blade-Komponenten** können in allen Unterseiten verwendet werden
+- **Gemeinsame CSS-Klassen** in `shared-styles.css` (726 Zeilen)
+- **Theme-agnostische Komponenten** für beide Portale nutzbar
+
+---
+
+## 🎯 Durchgeführte Optimierungen
+
+### 1. Layout-Komponenten
+
+#### Content-Layout (`content-layout.blade.php`)
+- Flexibles Layout mit optionaler Sidebar
+- Unterstützt Left/Right Sidebar-Positionierung
+- Responsive Grid-System
+
+**Vorher:**
+```blade
+<div class="container mx-auto px-4">
+    <div class="grid lg:grid-cols-12 gap-8">
+        <main class="lg:col-span-8">...</main>
+        <aside class="lg:col-span-4">...</aside>
+    </div>
+</div>
+```
+
+**Nachher:**
+```blade
+<x-web.content-layout>
+    <x-slot name="sidebar">...</x-slot>
+    <main>...</main>
+</x-web.content-layout>
+```
+
+#### Page Header (`page-header.blade.php`)
+- Unterstützt Titel, Subtitle, Meta-Infos
+- Optionales Header-Bild
+- Kompakte Variante verfügbar
+
+### 2. Navigation-Komponenten
+
+#### Main Navigation (`main-navigation.blade.php`)
+- Theme-spezifische Navigation
+- Custom Items möglich
+- Sticky Positioning
+- Gradient Underline Hover-Effekt
+
+**Vorher:** 41 Zeilen inline HTML
+**Nachher:** 1 Zeile Komponenten-Call
+
+```blade
+<x-web.main-navigation theme="presseecho" />
+```
+
+#### Breadcrumb (`breadcrumb.blade.php`)
+- Automatische Home-Link
+- Responsive Darstellung
+- Accessibility-optimiert
+
+### 3. Content-Komponenten
+
+#### Section Header (`section-header.blade.php`)
+- 3 Größen: small, medium, large
+- Gradient Indicator
+- Theme-agnostisch
+
+#### Hero Banner (`hero-banner.blade.php`)
+- Theme-spezifische Gradients
+- Flexible Slots für Title/Subtitle
+- Responsive Padding
+
+#### Sidebar Widget (`sidebar-widget.blade.php`)
+- Konsistentes Widget-Design
+- Optionaler Titel + Icon
+- Hover-Effekte
+
+### 4. Card-Komponenten
+
+Alle Card-Komponenten unterstützen:
+- Dark Mode
+- Hover-Effekte
+- Responsive Images
+- Industry Icons
+- Badge-System
+
+#### Article Card
+- Standardisierte Artikel-Darstellung
+- Author Avatars mit Initialen
+- Kategorien und Badges
+
+#### Dossier Card
+- Spezielle Darstellung für Themendossiers
+- Artikel-Counter
+- Glassmorphism-Effekte
+
+#### Highlight Card
+- Für Highlights-Slider optimiert
+- Grid-Layout mit Bild
+- Meta-Informationen
+
+### 5. Highlights Slider
+
+**Features:**
+- JavaScript-gesteuerter Slider
+- Navigation Buttons
+- Pagination Dots
+- Keyboard-Navigation (Pfeiltasten)
+- Touch/Scroll Support
+- Smooth Scrolling
+- Automatisches Update der aktiven Dots
+
+**CSS-Optimierung:**
+- `overflow-y: visible` für Hover-Effekte
+- Padding-Adjustments für Schatten
+- Scroll-Snap für besseres UX
+
+---
+
+## 🎨 CSS-Optimierungen
+
+### Shared Styles (`shared-styles.css`)
+
+**Neue Additions:**
+- Page Header Styles (50 Zeilen)
+- Sidebar Widget Styles (50 Zeilen)
+- Navigation States (10 Zeilen)
+- Responsive Breakpoints
+
+**Vereinheitlichte Klassen:**
+```css
+/* Badges */
+.badge, .badge-primary, .badge-secondary, etc.
+
+/* Buttons */
+.btn-primary, .btn-secondary, .pagination-btn
+
+/* Cards */
+.card, .card-hover, .highlight-card
+
+/* Layout */
+.section-light-bg, .section-gradient-bg, .page-header
+```
+
+### Theme-spezifische CSS
+
+**Presseecho:**
+- Softer Shadows
+- Subtle Gradients
+- Premium Borders
+- Grün-Farbschema
+
+**Businessportal24:**
+- Float & Glow Design
+- Glassmorphism Effects
+- Shadow Glows
+- Rot/Orange-Farbschema
+
+---
+
+## 📁 Dateistruktur
+
+```
+/var/www/html/
+├── resources/
+│   ├── css/
+│   │   └── web/
+│   │       ├── shared-styles.css          ✨ (726 Zeilen)
+│   │       ├── theme-presseecho.css       ✅ (145 Zeilen)
+│   │       └── theme-businessportal24.css ✅ (512 Zeilen)
+│   │
+│   └── views/
+│       ├── components/
+│       │   └── web/
+│       │       ├── main-navigation.blade.php    ✨
+│       │       ├── breadcrumb.blade.php         ✨
+│       │       ├── page-header.blade.php        ✨
+│       │       ├── content-layout.blade.php     ✨
+│       │       ├── sidebar-widget.blade.php     ✨
+│       │       ├── section-header.blade.php     ✅
+│       │       ├── hero-banner.blade.php        ✅
+│       │       ├── article-card.blade.php       ✅
+│       │       ├── dossier-card.blade.php       ✅
+│       │       ├── highlight-card.blade.php     ✅
+│       │       └── highlights-slider.blade.php  ✅
+│       │
+│       └── web/
+│           ├── presseecho.blade.php             ✅ (optimiert)
+│           └── examples/
+│               ├── article-detail.blade.php     ✨
+│               └── category-overview.blade.php  ✨
+│
+└── COMPONENT_DOCUMENTATION.md                   ✨
+└── FINAL_OPTIMIZATION_SUMMARY.md                ✨
+
+✨ = Neu erstellt
+✅ = Optimiert/Aktualisiert
+```
+
+---
+
+## 🚀 Verwendung für Unterseiten
+
+### Artikel-Detailseite
+
+```blade
+<x-web.main-navigation theme="presseecho" />
+
+<x-web.breadcrumb :items="[...]" />
+
+<x-web.page-header title="..." subtitle="...">
+    <x-slot name="meta">...</x-slot>
+</x-web.page-header>
+
+<x-web.content-layout>
+    <x-slot name="sidebar">
+        <x-web.sidebar-widget title="Autor">...</x-web.sidebar-widget>
+        <x-web.sidebar-widget title="Tags">...</x-web.sidebar-widget>
+    </x-slot>
+    
+    <article class="prose">...</article>
+</x-web.content-layout>
+```
+
+### Kategorie-Übersicht
+
+```blade
+<x-web.main-navigation theme="presseecho" />
+
+<x-web.breadcrumb :items="[...]" />
+
+<x-web.page-header title="..." subtitle="..." image="..." />
+
+<x-web.content-layout>
+    <x-slot name="sidebar">
+        <x-web.sidebar-widget title="Filter">...</x-web.sidebar-widget>
+    </x-slot>
+    
+    <div class="grid md:grid-cols-2 gap-6">
+        @foreach ($articles as $article)
+            <x-web.article-card :article="$article" />
+        @endforeach
+    </div>
+</x-web.content-layout>
+```
+
+### Themendossier
+
+```blade
+<x-web.page-header 
+    title="KI & Innovation"
+    subtitle="Alle Facetten der KI"
+    image="..." />
+
+<div class="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
+    @foreach ($dossiers as $dossier)
+        <x-web.dossier-card :dossier="$dossier" />
+    @endforeach
+</div>
+```
+
+---
+
+## ✅ Vorteile der Optimierung
+
+### 1. Code-Qualität
+- **DRY-Prinzip**: Keine Code-Duplikation mehr
+- **Wartbarkeit**: Änderungen nur an einer Stelle nötig
+- **Lesbarkeit**: Klare Komponenten-Namen und Struktur
+
+### 2. Konsistenz
+- **Einheitliches Design**: Alle Seiten nutzen gleiche Komponenten
+- **Theme-Support**: Beide Themes nutzen gleiche Basis
+- **Responsive**: Alle Komponenten mobile-optimiert
+
+### 3. Entwickler-Erfahrung
+- **Schnellere Entwicklung**: Komponenten einfach zusammenstecken
+- **Dokumentation**: Umfassende Docs verfügbar
+- **Beispiele**: Referenz-Implementierungen vorhanden
+
+### 4. Performance
+- **Weniger CSS**: Gemeinsame Styles einmal geladen
+- **Kleinere Dateien**: Reduzierte Blade-Templates
+- **Caching**: Komponenten können gecacht werden
+
+### 5. Skalierbarkeit
+- **Neue Unterseiten**: Schnell erstellt mit Komponenten
+- **Theme-Erweiterung**: Einfach neue Themes hinzufügen
+- **Feature-Addition**: Zentrale Komponenten erweitern
+
+---
+
+## 📋 Checkliste für neue Unterseiten
+
+- [ ] Layout-Komponente wählen (`content-layout`)
+- [ ] Navigation hinzufügen (`main-navigation`)
+- [ ] Breadcrumb implementieren (`breadcrumb`)
+- [ ] Page-Header erstellen (`page-header`)
+- [ ] Content mit passenden Cards füllen
+- [ ] Sidebar-Widgets hinzufügen (optional)
+- [ ] Theme-Variable setzen
+- [ ] Responsive testen
+- [ ] Dark Mode prüfen
+- [ ] Accessibility validieren
+
+---
+
+## 🎓 Best Practices
+
+### Komponenten-Verwendung
+
+**✅ Gut:**
+```blade
+<x-web.article-card :article="$article" />
+```
+
+**❌ Schlecht:**
+```blade
+<article class="...">
+    <!-- 50 Zeilen duplizierter Code -->
+</article>
+```
+
+### CSS-Klassen
+
+**✅ Gut:**
+```blade
+<button class="btn-primary">Klick mich</button>
+```
+
+**❌ Schlecht:**
+```blade
+<button style="background: linear-gradient(...)">Klick mich</button>
+```
+
+### Datenstruktur
+
+**✅ Gut:**
+```php
+@php
+    $articles = [
+        ['title' => '...', 'author' => '...', ...]
+    ];
+@endphp
+```
+
+**❌ Schlecht:**
+```blade
+<!-- Hardcoded Daten direkt im HTML -->
+```
+
+---
+
+## 🔄 Migration bestehender Seiten
+
+### Schritt 1: Navigation ersetzen
+```blade
+<!-- Alt -->
+<nav class="...">...</nav>
+
+<!-- Neu -->
+<x-web.main-navigation theme="presseecho" />
+```
+
+### Schritt 2: Content-Struktur anpassen
+```blade
+<!-- Alt -->
+<div class="container">
+    <div class="grid">...</div>
+</div>
+
+<!-- Neu -->
+<x-web.content-layout>
+    ...
+</x-web.content-layout>
+```
+
+### Schritt 3: Cards vereinheitlichen
+```blade
+<!-- Alt -->
+<article class="...">...</article>
+
+<!-- Neu -->
+<x-web.article-card :article="$article" />
+```
+
+---
+
+## 📚 Weitere Ressourcen
+
+- **Komponenten-Dokumentation**: `/COMPONENT_DOCUMENTATION.md`
+- **Beispiel-Seiten**: `/resources/views/web/examples/`
+- **Theme-CSS**: `/resources/css/web/`
+- **Shared-Styles**: `/resources/css/web/shared-styles.css`
+
+---
+
+## 🎉 Zusammenfassung
+
+Mit dieser Optimierung haben wir:
+
+1. ✅ **11 wiederverwendbare Komponenten** erstellt
+2. ✅ **726 Zeilen gemeinsame CSS-Styles** zentralisiert
+3. ✅ **Code-Duplikation eliminiert** (>100 Zeilen gespart)
+4. ✅ **Konsistentes Design** über alle Seiten etabliert
+5. ✅ **Unterseiten-Support** vollständig implementiert
+6. ✅ **Theme-Flexibilität** für beide Portale gesichert
+7. ✅ **Umfassende Dokumentation** bereitgestellt
+8. ✅ **Best Practices** definiert und dokumentiert
+
+Die Code-Basis ist jetzt **wartbar**, **skalierbar** und **zukunftssicher**! 🚀
+
--- a/_docs/FORTIFY-SANCTUM-SETUP.md
+++ b/_docs/FORTIFY-SANCTUM-SETUP.md
@ -0,0 +1,185 @@
+# Laravel Fortify & Sanctum Setup
+
+## Übersicht
+
+Dieses Projekt wurde mit Laravel Fortify für die Authentifizierung und Laravel Sanctum für API-Token-Management konfiguriert. Die Authentifizierung verwendet Livewire-Komponenten mit Flux UI für eine moderne, reaktive Benutzeroberfläche.
+
+## Installation
+
+Die Pakete wurden bereits installiert und konfiguriert:
+
+```bash
+composer require laravel/fortify laravel/sanctum
+```
+
+## Konfiguration
+
+### Fortify
+
+-   **Konfigurationsdatei**: `config/fortify.php`
+-   **Service Provider**: `app/Providers/FortifyServiceProvider.php`
+-   **Aktionen**: `app/Actions/Fortify/`
+-   **Livewire-Komponenten**: `resources/views/livewire/auth/`
+
+### Sanctum
+
+-   **Konfigurationsdatei**: `config/sanctum.php`
+-   **Migrationen**: Ausgeführt
+-   **User Model**: Aktualisiert mit `HasApiTokens` Trait
+
+## Features
+
+### Fortify Features (aktiviert)
+
+-   ✅ Benutzerregistrierung (Livewire + Flux UI)
+-   ✅ Passwort-Reset (Livewire + Flux UI)
+-   ✅ Profilaktualisierung
+-   ✅ Passwort-Update
+-   ✅ Zwei-Faktor-Authentifizierung
+-   ⚠️ E-Mail-Verifizierung (deaktiviert in der Konfiguration)
+
+### Sanctum Features
+
+-   ✅ API-Token-Erstellung
+-   ✅ Token-Revocation
+-   ✅ Geschützte API-Routen
+
+## Technologie-Stack
+
+-   **Laravel Fortify**: Backend-Authentifizierung
+-   **Laravel Sanctum**: API-Token-Management
+-   **Livewire**: Reaktive Frontend-Komponenten
+-   **Flux UI**: Moderne UI-Komponenten
+-   **Volt**: Livewire-Komponenten-Syntax
+
+## Routen
+
+### Web-Authentifizierung (presseportale.test)
+
+-   `GET /login` - Anmeldeseite (Livewire)
+-   `POST /login` - Anmeldung (Livewire)
+-   `POST /logout` - Abmeldung
+-   `GET /register` - Registrierungsseite (Livewire)
+-   `POST /register` - Registrierung (Livewire)
+-   `GET /forgot-password` - Passwort vergessen (Livewire)
+-   `POST /forgot-password` - Passwort-Reset-Link senden (Livewire)
+-   `GET /reset-password/{token}` - Passwort zurücksetzen (Livewire)
+-   `POST /reset-password` - Neues Passwort setzen (Livewire)
+-   `GET /verify-email` - E-Mail-Verifizierung (Livewire)
+-   `GET /confirm-password` - Passwort bestätigen (Livewire)
+
+### API-Routen (api.presseportale.test)
+
+-   `GET /api/user` - Aktueller Benutzer (geschützt)
+-   `GET /api/profile` - Benutzerprofil (geschützt)
+-   `POST /api/login` - API-Anmeldung (öffentlich)
+
+## Verwendung
+
+### Web-Authentifizierung
+
+1. Besuchen Sie `http://portal.presseportale.test/login`
+2. Registrieren Sie sich oder melden Sie sich an
+3. Nutzen Sie die verschiedenen Authentifizierungsfeatures
+
+### API-Authentifizierung
+
+1. **Token erstellen**:
+
+```bash
+curl -X POST http://api.presseportale.test/login \
+  -H "Content-Type: application/json" \
+  -d '{"email":"user@example.com","password":"password"}'
+```
+
+2. **Geschützte Route aufrufen**:
+
+```bash
+curl -X GET http://api.presseportale.test/api/user \
+  -H "Authorization: Bearer YOUR_TOKEN_HERE"
+```
+
+### Zwei-Faktor-Authentifizierung
+
+1. Aktivieren Sie 2FA in Ihren Benutzereinstellungen
+2. Scannen Sie den QR-Code mit Ihrer Authentifizierungs-App
+3. Geben Sie den Code bei der Anmeldung ein
+
+## Livewire-Komponenten
+
+Alle Auth-Komponenten befinden sich in `resources/views/livewire/auth/`:
+
+-   `login.blade.php` - Anmeldeseite mit Flux UI
+-   `register.blade.php` - Registrierungsseite mit Flux UI
+-   `forgot-password.blade.php` - Passwort vergessen mit Flux UI
+-   `reset-password.blade.php` - Passwort zurücksetzen mit Flux UI
+-   `verify-email.blade.php` - E-Mail-Verifizierung mit Flux UI
+-   `confirm-password.blade.php` - Passwort bestätigen mit Flux UI
+
+### Flux UI Features
+
+-   Moderne, responsive Benutzeroberfläche
+-   Eingabevalidierung in Echtzeit
+-   Rate Limiting mit visuellen Feedback
+-   Dark Mode Unterstützung
+-   Barrierefreiheit
+
+## Anpassungen
+
+### Fortify-Konfiguration anpassen
+
+Bearbeiten Sie `config/fortify.php` um Features zu aktivieren/deaktivieren:
+
+```php
+'features' => [
+    Features::registration(),
+    Features::resetPasswords(),
+    Features::emailVerification(), // Aktivieren für E-Mail-Verifizierung
+    Features::updateProfileInformation(),
+    Features::updatePasswords(),
+    Features::twoFactorAuthentication([
+        'confirm' => true,
+        'confirmPassword' => true,
+    ]),
+],
+```
+
+### Livewire-Komponenten anpassen
+
+Bearbeiten Sie die Komponenten in `resources/views/livewire/auth/`:
+
+```php
+// Beispiel: Login-Komponente anpassen
+new #[Layout('components.layouts.auth')] class extends Component {
+    #[Validate('required|string|email')]
+    public string $email = '';
+
+    // Ihre Anpassungen hier...
+}
+```
+
+### Sanctum-Konfiguration anpassen
+
+Bearbeiten Sie `config/sanctum.php` um Token-Einstellungen zu ändern:
+
+```php
+'expiration' => null, // Token-Ablaufzeit (null = nie)
+'guard' => ['web'], // Guards für Sanctum
+```
+
+## Sicherheit
+
+-   Alle Passwörter werden automatisch gehashed
+-   CSRF-Schutz ist aktiviert
+-   Rate Limiting ist konfiguriert
+-   Zwei-Faktor-Authentifizierung ist verfügbar
+-   API-Tokens können widerrufen werden
+-   Livewire-Komponenten haben eingebaute Sicherheitsfeatures
+
+## Nächste Schritte
+
+1. Konfigurieren Sie E-Mail-Einstellungen in `.env` für Passwort-Reset
+2. Aktivieren Sie E-Mail-Verifizierung falls gewünscht
+3. Passen Sie die Livewire-Komponenten an Ihr Design an
+4. Erstellen Sie zusätzliche API-Routen nach Bedarf
+5. Konfigurieren Sie Flux UI Themes nach Ihren Wünschen
--- a/_docs/OPTIMIZATION_SUMMARY.md
+++ b/_docs/OPTIMIZATION_SUMMARY.md
@ -0,0 +1,431 @@
+# Optimierungs-Zusammenfassung: Presseecho & Businessportal24
+
+## 📋 Überblick
+
+Die beiden Hauptseiten wurden vollständig refactored und optimiert. Alle gemeinsamen Komponenten wurden ausgelagert, CSS wurde vereinheitlicht und die Wartbarkeit deutlich verbessert.
+
+---
+
+## 🎯 Neue Komponenten
+
+### 1. **highlights-slider.blade.php**
+Wiederverwendbarer Slider für Highlight-Artikel mit:
+- Navigation (Pfeil-Buttons)
+- Pagination (Dots)
+- Keyboard-Navigation
+- Theme-Support (Presseecho/Businessportal24)
+- Accessibility (ARIA-Labels)
+
+**Verwendung:**
+```blade
+<x-web.highlights-slider :highlights="$highlights" theme="presseecho" />
+```
+
+---
+
+### 2. **highlight-card.blade.php**
+Einzelne Highlight-Card mit:
+- Industry Icons (automatisch gemappt)
+- Responsivem Design
+- Hover-Effekten
+- Author-Info
+
+**Verwendung:**
+```blade
+<x-web.highlight-card :highlight="$highlight" />
+```
+
+---
+
+### 3. **hero-banner.blade.php**
+Wiederverwendbarer Hero-Banner mit:
+- Theme-Support
+- Decorative Pattern (optional für Businessportal24)
+- Animationen
+
+**Verwendung:**
+```blade
+<x-web.hero-banner theme="presseecho">
+    <x-slot name="title">
+        Ihr Titel <span class="text-[var(--color-white)]/50">mit Akzent</span>
+    </x-slot>
+    <x-slot name="subtitle">
+        Ihr Untertitel
+    </x-slot>
+</x-web.hero-banner>
+```
+
+---
+
+### 4. **section-header.blade.php**
+Wiederverwendbarer Section-Header mit:
+- 3 Größen (large, medium, small)
+- Gradient-Indicator
+- Optionaler Subtitle
+
+**Verwendung:**
+```blade
+<x-web.section-header 
+    title="Ihr Titel"
+    subtitle="Optionaler Untertitel"
+    size="medium" />
+```
+
+---
+
+### 5. **article-card.blade.php**
+Artikel-Card für "Neueste Analysen" mit:
+- Bild
+- Badge
+- Author mit Initials
+- Hover-Effekte
+
+**Verwendung:**
+```blade
+<x-web.article-card :article="$article" />
+```
+
+---
+
+### 6. **dossier-card.blade.php**
+Dossier-Card für "Themendossiers" mit:
+- Overlay-Design
+- Gradient-Overlay
+- Article-Count Badge
+
+**Verwendung:**
+```blade
+<x-web.dossier-card :dossier="$dossier" />
+```
+
+---
+
+## 🎨 CSS-Struktur
+
+### **shared-styles.css**
+Alle gemeinsamen Styles für beide Themes:
+
+#### Neue Klassen:
+```css
+/* Slider */
+.gradient-indicator      → Gradient-Balken für Titel
+.slider-wrapper          → Slider-Container
+.highlights-slider       → Slider selbst
+.slider-nav-btn          → Navigation-Buttons
+.slider-dots / .slider-dot → Pagination-Dots
+
+/* Highlight Cards */
+.highlight-card          → Card-Container
+.highlight-card-link     → Link-Wrapper
+.highlight-card-image    → Bild-Bereich
+.highlight-card-content  → Content-Bereich
+.highlight-meta          → Meta-Informationen
+.highlight-title         → Titel
+.highlight-text          → Text/Teaser
+.highlight-footer        → Footer mit Company
+.highlight-badge         → Badge für Content-Type
+
+/* Sections */
+.section-light-bg        → Heller Section-Hintergrund
+.section-gradient-bg     → Gradient Section-Hintergrund
+
+/* Hero */
+.hero-gradient           → Hero-Banner Gradient
+.hero-title              → Hero-Titel mit Text-Shadow
+.hero-subtitle           → Hero-Untertitel
+
+/* Icons */
+.industry-icon-badge     → Industry-Icon Styling
+```
+
+---
+
+### **theme-presseecho.css**
+Nur noch Presseecho-spezifische Overrides:
+- Color-Variablen
+- Dark-Mode-Variablen
+- Softer Shadows
+- Gradient-Borders
+
+**Reduziert von 166 auf 141 Zeilen** ✅
+
+---
+
+### **theme-businessportal24.css**
+Businessportal24-spezifische Styles:
+- Color-Variablen
+- Dark-Mode-Variablen
+- Float & Glow Effects
+- Pagination-Styles
+- Glassmorphism Components
+- Glow Utilities
+
+**Optimiert von 669 auf 560 Zeilen (-16%)** ✅
+Duplikate entfernt (Hero, Industry-Icons, Section-Indicator) ✅
+
+---
+
+## 📊 Optimierungs-Ergebnisse
+
+### **Blade-Dateien**
+
+#### Presseecho.blade.php
+- **Vorher:** 602 Zeilen
+- **Nachher:** ~280 Zeilen (optimiert)
+- **Reduktion:** ~53% 🎉
+
+#### Businessportal24.blade.php
+- **Vorher:** 422 Zeilen
+- **Nachher:** ~180 Zeilen (optimiert)
+- **Reduktion:** ~57% 🎉
+
+#### Code-Duplikation
+- **Vorher:** Slider-Code 2x (480 Zeilen)
+- **Nachher:** 1x Komponente (130 Zeilen)
+- **Gesamt-Ersparnis:** 350 Zeilen ✅
+
+---
+
+### **CSS-Dateien**
+
+#### theme-presseecho.css
+- **Vorher:** 166 Zeilen
+- **Nachher:** 141 Zeilen
+- **Reduktion:** 15% 🎉
+
+#### theme-businessportal24.css
+- **Vorher:** 669 Zeilen
+- **Nachher:** 560 Zeilen
+- **Reduktion:** 16% 🎉
+
+#### shared-styles.css
+- **Vorher:** 280 Zeilen
+- **Nachher:** 608 Zeilen
+- **Hinzugefügt:** +328 Zeilen gemeinsame Styles
+
+#### Gesamt CSS-Bilanz
+- **Vorher:** 1.115 Zeilen (166 + 669 + 280)
+- **Nachher:** 1.309 Zeilen (141 + 560 + 608)
+- **Netto:** +194 Zeilen
+- **Aber:** Keine Duplikate mehr, bessere Wartbarkeit! ✅
+
+---
+
+## ✅ Vorteile
+
+### 1. **DRY (Don't Repeat Yourself)**
+- Code nur einmal geschrieben
+- Änderungen nur an einer Stelle
+
+### 2. **Wartbarkeit**
+- Klare Trennung von Concerns
+- Komponenten sind unabhängig testbar
+- Einfaches Debugging
+
+### 3. **Konsistenz**
+- Gleiches Design auf beiden Seiten
+- Einheitliche Naming-Convention
+- Zentrale Style-Verwaltung
+
+### 4. **Performance**
+- Weniger CSS-Duplikate
+- Optimierte Selektoren
+- Besseres Caching
+
+### 5. **Wiederverwendbarkeit**
+- Komponenten für neue Seiten nutzbar
+- Theme-System einfach erweiterbar
+- Schnelles Prototyping
+
+### 6. **Accessibility**
+- ARIA-Labels überall
+- Keyboard-Navigation
+- Focus-States
+
+---
+
+## 🚀 Verwendung der optimierten Dateien
+
+### Blade-Dateien
+
+#### Presseecho
+```bash
+# Backup erstellen
+mv resources/views/web/presseecho.blade.php resources/views/web/presseecho-old.blade.php
+
+# Optimierte Version aktivieren
+mv resources/views/web/presseecho-optimized.blade.php resources/views/web/presseecho.blade.php
+```
+
+#### Businessportal24
+```bash
+# Backup erstellen
+mv resources/views/web/businessportal24.blade.php resources/views/web/businessportal24-old.blade.php
+
+# Optimierte Version aktivieren
+mv resources/views/web/businessportal24-optimized.blade.php resources/views/web/businessportal24.blade.php
+```
+
+---
+
+### CSS-Dateien
+
+#### Businessportal24 CSS
+```bash
+# Backup erstellen
+cp resources/css/web/theme-businessportal24.css resources/css/web/theme-businessportal24-backup.css
+
+# Optimierte Version aktivieren
+mv resources/css/web/theme-businessportal24-optimized.css resources/css/web/theme-businessportal24.css
+
+# Oder direkt ersetzen (shared-styles.css ist bereits aktualisiert)
+# Die Presseecho-CSS ist bereits optimiert
+```
+
+#### Wichtig
+Die `shared-styles.css` wurde bereits optimiert und enthält jetzt alle gemeinsamen Styles. Beide Theme-CSS-Dateien importieren diese automatisch via `@import "./shared-styles.css";`
+
+---
+
+## 📝 Datenstruktur
+
+### Highlights Array
+```php
+$highlights = [
+    [
+        'badge' => 'Exklusiv-Interview',
+        'badgeType' => 'primary',  // oder 'secondary'
+        'industry' => 'KI & Innovation',
+        'date' => '17. Oktober 2024',
+        'title' => 'Ihr Titel',
+        'text' => 'Ihr Teaser-Text',
+        'author' => 'Dr. Maria Schmidt',
+        'authorRole' => 'Expertin',  // optional
+        'initials' => 'MS',          // optional
+        'image' => 'https://...',
+    ],
+];
+```
+
+### Articles Array
+```php
+$articles = [
+    [
+        'badge' => 'Analyse',
+        'badgeType' => 'primary',
+        'category' => 'Industrie 4.0',
+        'categoryBadgeType' => 'secondary',
+        'date' => '2024-10-16',
+        'dateFormatted' => '16. Okt 2024',
+        'title' => 'Ihr Titel',
+        'teaser' => 'Ihr Teaser',
+        'author' => 'Thomas Müller',      // optional
+        'authorInitials' => 'TM',         // optional
+        'image' => 'https://...',
+    ],
+];
+```
+
+### Dossiers Array
+```php
+$dossiers = [
+    [
+        'title' => 'KI in der Industrie',
+        'description' => 'Beschreibung',
+        'articleCount' => 12,
+        'image' => 'https://...',
+    ],
+];
+```
+
+---
+
+## 🎯 Best Practices
+
+1. **Komponenten klein halten** - Jede Komponente hat einen spezifischen Zweck
+2. **Props dokumentieren** - `@props` klar definieren
+3. **Theme-Support** - Theme-Parameter wo nötig
+4. **Accessibility** - ARIA-Labels und Keyboard-Navigation
+5. **Dark Mode** - Alle Komponenten Dark-Mode-ready
+6. **Responsive** - Mobile-First Approach
+
+---
+
+## 📚 Weitere Optimierungsmöglichkeiten
+
+1. **Lazy Loading** für Bilder implementieren
+2. **Intersection Observer** für Scroll-Animationen
+3. **Service Worker** für Offline-Support
+4. **Image Optimization** mit WebP/AVIF
+5. **Critical CSS** für above-the-fold Content
+6. **Component Caching** mit Blade-Cache
+
+---
+
+## 🛠️ Wartung
+
+### Bei neuen Sections:
+1. Gemeinsame Styles in `shared-styles.css`
+2. Theme-spezifische Overrides in Theme-CSS
+3. Neue Komponente in `components/web/`
+4. Datenstruktur dokumentieren
+
+### Bei Style-Änderungen:
+1. Prüfen ob gemeinsam oder theme-spezifisch
+2. In entsprechender Datei ändern
+3. Beide Themes testen
+
+---
+
+## ✨ Zusammenfassung
+
+Die Optimierung hat die Codebase deutlich verbessert:
+
+### Blade-Dateien
+- **~50% weniger Code** in beiden Hauptdateien
+- **6 neue wiederverwendbare Komponenten**
+- **350 Zeilen** Duplikate eliminiert
+- **Konsistentes Design** auf beiden Seiten
+
+### CSS-Dateien
+- **~16% kleiner** (theme-businessportal24.css)
+- **~15% kleiner** (theme-presseecho.css)
+- **Keine Duplikate** mehr zwischen Themes
+- **Vereinheitlichte Struktur** mit shared-styles.css
+- **328 Zeilen** gemeinsame Styles zentral verwaltet
+
+### Vorteile
+- ✅ **Bessere Wartbarkeit** - Änderungen nur an einer Stelle
+- ✅ **DRY-Prinzip** - Don't Repeat Yourself konsequent umgesetzt
+- ✅ **Theme-Identität** - Businessportal24 behält Float & Glow Design
+- ✅ **Wiederverwendbar** - Komponenten für neue Seiten nutzbar
+- ✅ **Performance** - Weniger Code, besseres Caching
+- ✅ **Accessibility** - ARIA-Labels und Keyboard-Navigation
+- ✅ **Responsive** - Mobile-First Approach
+
+### Dateien
+```
+Neue Komponenten:
+├── components/web/highlights-slider.blade.php    (130 Zeilen)
+├── components/web/highlight-card.blade.php       (89 Zeilen)
+├── components/web/hero-banner.blade.php          (34 Zeilen)
+├── components/web/section-header.blade.php       (33 Zeilen)
+├── components/web/article-card.blade.php         (40 Zeilen)
+└── components/web/dossier-card.blade.php         (24 Zeilen)
+
+Optimierte Blade-Dateien:
+├── presseecho-optimized.blade.php                (242 Zeilen)
+└── businessportal24-optimized.blade.php          (139 Zeilen)
+
+Optimierte CSS-Dateien:
+├── shared-styles.css                             (608 Zeilen) ✅ Aktualisiert
+├── theme-presseecho.css                          (141 Zeilen) ✅ Optimiert
+└── theme-businessportal24-optimized.css          (560 Zeilen) → Zu aktivieren
+
+Dokumentation:
+├── OPTIMIZATION_SUMMARY.md                       (Hauptdokumentation)
+└── BUSINESSPORTAL24_CSS_OPTIMIZATION.md          (CSS-Details)
+```
+
+Alle Änderungen sind rückwärtskompatibel und können schrittweise implementiert werden.
+
--- a/_docs/THEME-INTEGRATION.md
+++ b/_docs/THEME-INTEGRATION.md
@ -0,0 +1,309 @@
+# Theme-Integration Anleitung
+
+## Überblick
+
+Das Projekt nutzt ein dynamisches Theme-System mit 3 Domains:
+
+| Domain | Theme | Primary Color | Secondary Color | CSS-Datei |
+|--------|-------|---------------|-----------------|-----------|
+| **presseportale.test** | portal | #526266 | #82a0a7 | `resources/css/portal.css` |
+| **presseecho.test** | presseecho | #345636 (Grün) | #6b8f71 | `resources/css/web/theme-presseecho.css` |
+| **businessportal24.test** | businessportal24 | #cf3628 (Rot) | #f0834a | `resources/css/web/theme-businessportal24.css` |
+
+## CSS-Dateien in Blade-Templates laden
+
+### Backend (Portal)
+
+Im Portal-Layout (`resources/views/layouts/portal/app.blade.php`):
+
+```blade
+<!DOCTYPE html>
+<html lang="de">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>{{ config('app.name') }}</title>
+    
+    {{-- Portal CSS mit FluxUI --}}
+    @vite(['resources/css/portal.css', 'resources/js/app.js'])
+</head>
+<body>
+    @yield('content')
+</body>
+</html>
+```
+
+### Frontend (Web) - Dynamisch
+
+Im Web-Layout (`resources/views/layouts/web/app.blade.php`):
+
+```blade
+<!DOCTYPE html>
+<html lang="de">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>{{ $domainConfig['description'] ?? config('app.name') }}</title>
+    
+    {{-- Dynamisches Theme-Loading basierend auf Domain --}}
+    @if($theme === 'presseecho')
+        @vite(['resources/css/web/theme-presseecho.css', 'resources/js/app.js'])
+    @elseif($theme === 'businessportal24')
+        @vite(['resources/css/web/theme-businessportal24.css', 'resources/js/app.js'])
+    @else
+        {{-- Fallback --}}
+        @vite(['resources/css/web/shared-styles.css', 'resources/js/app.js'])
+    @endif
+</head>
+<body>
+    @yield('content')
+</body>
+</html>
+```
+
+### Alternative: Helper-basiert
+
+Sie können auch den ThemeHelper verwenden:
+
+```blade
+@php
+    $themeCss = match($theme) {
+        'presseecho' => 'resources/css/web/theme-presseecho.css',
+        'businessportal24' => 'resources/css/web/theme-businessportal24.css',
+        default => 'resources/css/web/shared-styles.css',
+    };
+@endphp
+
+@vite([$themeCss, 'resources/js/app.js'])
+```
+
+## Verfügbare Theme-Variablen in Views
+
+Der `ThemeServiceProvider` macht folgende Variablen in allen Views verfügbar:
+
+```php
+$theme              // z.B. 'portal', 'presseecho', 'businessportal24'
+$viewPrefix         // z.B. 'portal', 'web'
+$domainName         // z.B. 'presseecho.test'
+$domainUrl          // z.B. 'https://presseecho.test'
+$domainConfig       // Array mit kompletter Domain-Konfiguration
+```
+
+### Beispiel-Nutzung in Blade
+
+```blade
+{{-- Domain-Name anzeigen --}}
+<h1>Willkommen auf {{ $domainName }}</h1>
+
+{{-- Theme-spezifische Farben --}}
+<div style="color: {{ $domainConfig['color_scheme']['primary'] }}">
+    Primary Color Text
+</div>
+
+{{-- Font-Familie --}}
+<p style="font-family: {{ $domainConfig['font'] }}">
+    Custom Font Text
+</p>
+
+{{-- Conditional Content basierend auf Theme --}}
+@if($theme === 'presseecho')
+    <p>Presseecho-spezifischer Content</p>
+@elseif($theme === 'businessportal24')
+    <p>Businessportal24-spezifischer Content</p>
+@else
+    <p>Portal Content</p>
+@endif
+```
+
+## CSS-Variablen nutzen
+
+Alle Themes verwenden CSS-Variablen für konsistentes Styling:
+
+```blade
+{{-- Tailwind Classes mit Theme-Variablen --}}
+<button class="bg-primary text-white hover:bg-secondary">
+    Klicken
+</button>
+
+<div class="border border-border bg-card text-card-foreground rounded-lg p-4">
+    Card Content
+</div>
+
+{{-- Primary & Secondary Buttons --}}
+<button class="btn btn-primary">Primary Action</button>
+<button class="btn btn-secondary">Secondary Action</button>
+```
+
+## CSS-Variablen-Referenz
+
+Alle Themes definieren folgende CSS-Variablen:
+
+```css
+/* Layout */
+--background          /* Hintergrundfarbe */
+--foreground          /* Textfarbe */
+
+/* Cards */
+--card                /* Card-Hintergrund */
+--card-foreground     /* Card-Text */
+
+/* Popover */
+--popover             /* Popover-Hintergrund */
+--popover-foreground  /* Popover-Text */
+
+/* Brand Colors */
+--primary             /* Primärfarbe */
+--secondary           /* Sekundärfarbe */
+
+/* UI States */
+--muted               /* Gedämpfte Farbe */
+--muted-foreground    /* Gedämpfter Text */
+--accent              /* Akzentfarbe */
+--accent-foreground   /* Akzent-Text */
+--destructive         /* Fehler/Löschen */
+--destructive-foreground /* Fehler-Text */
+
+/* Form Elements */
+--border              /* Border-Farbe */
+--input               /* Input-Hintergrund */
+--ring                /* Focus-Ring */
+
+/* Border Radius */
+--radius              /* Standard Border-Radius */
+
+/* Typography */
+--font-primary        /* Haupt-Schriftart */
+--font-secondary      /* Sekundär-Schriftart */
+```
+
+## Tailwind-Klassen mit Theme-Variablen
+
+```blade
+{{-- Background Colors --}}
+<div class="bg-background text-foreground">...</div>
+<div class="bg-card text-card-foreground">...</div>
+<div class="bg-primary text-white">...</div>
+<div class="bg-secondary text-white">...</div>
+
+{{-- Text Colors --}}
+<p class="text-foreground">...</p>
+<p class="text-muted-foreground">...</p>
+<p class="text-primary">...</p>
+<p class="text-secondary">...</p>
+
+{{-- Borders --}}
+<div class="border border-border">...</div>
+<input class="border-input">
+
+{{-- Border Radius --}}
+<div class="rounded-lg">...</div>  {{-- nutzt --radius --}}
+<div class="rounded-md">...</div>
+<div class="rounded-sm">...</div>
+```
+
+## Dark Mode
+
+Alle Themes unterstützen Dark Mode durch die `.dark`-Klasse:
+
+```blade
+{{-- Dark Mode Toggle --}}
+<html class="dark">
+    {{-- Alle CSS-Variablen werden automatisch angepasst --}}
+</html>
+
+{{-- JavaScript Toggle --}}
+<button onclick="document.documentElement.classList.toggle('dark')">
+    Toggle Dark Mode
+</button>
+```
+
+## ThemeHelper verwenden
+
+Der `ThemeHelper` bietet praktische Methoden:
+
+```blade
+{{-- Logo abrufen --}}
+<img src="{{ asset(App\Helpers\ThemeHelper::getLogoPath('positive')) }}" alt="Logo">
+<img src="{{ asset(App\Helpers\ThemeHelper::getLogoPath('negative')) }}" alt="Logo Dark">
+
+{{-- Favicon --}}
+<link rel="icon" href="{{ asset(App\Helpers\ThemeHelper::getFaviconPath()) }}">
+
+{{-- Primary/Secondary Colors (für inline styles) --}}
+<div style="background: {{ App\Helpers\ThemeHelper::getPrimaryColor() }}">...</div>
+
+{{-- Font-Familie --}}
+<style>
+    body {
+        font-family: {{ App\Helpers\ThemeHelper::getFont() }};
+    }
+</style>
+
+{{-- Domain Config --}}
+@php
+    $config = App\Helpers\ThemeHelper::getDomainConfig();
+@endphp
+```
+
+## Vite Dev Server starten
+
+```bash
+# Beide Server gleichzeitig
+npm run dev:all
+
+# Nur Backend (Portal)
+npm run dev:portal
+
+# Nur Frontend (Web)
+npm run dev:web
+```
+
+## Production Build
+
+```bash
+# Alle Builds
+npm run build
+
+# Einzelne Builds
+npm run build:portal
+npm run build:web
+```
+
+## Testing verschiedener Themes
+
+### Via URL-Parameter (für Development)
+
+Der `ThemeServiceProvider` unterstützt einen `?theme=` URL-Parameter zum Testen:
+
+```
+https://presseportale.test?theme=presseecho
+https://presseportale.test?theme=businessportal24
+```
+
+### Via Host
+
+Einfach die entsprechende Domain aufrufen:
+
+```
+https://presseportale.test        → Portal Theme
+https://presseecho.test        → Presseecho Theme
+https://businessportal24.test  → Businessportal24 Theme
+```
+
+## Troubleshooting
+
+### Styles werden nicht geladen
+1. Prüfe ob der richtige Vite-Server läuft (`npm run dev:all`)
+2. Prüfe ob die richtige CSS-Datei im Blade-Template geladen wird
+3. Cache leeren: `php artisan config:clear && php artisan view:clear`
+
+### Falsche Farben
+1. Prüfe `config/domains.php` für Domain-Konfiguration
+2. Prüfe die CSS-Variablen in der Theme-Datei
+3. Browser-Cache leeren (Strg+Shift+R)
+
+### Theme wechselt nicht
+1. Prüfe `ThemeServiceProvider` ob Domain erkannt wird
+2. Prüfe `.env` für Domain-Konfiguration
+3. `php artisan config:clear` ausführen
+
--- a/_docs/VITE-SETUP-NEUE-STRUKTUR.md
+++ b/_docs/VITE-SETUP-NEUE-STRUKTUR.md
@ -0,0 +1,90 @@
+# Neue Vite Asset-URL Struktur
+
+## ✅ Neue saubere Trennung
+
+Jede Domain hat jetzt ihre eigene dedizierte Asset-Subdomain:
+
+| Domain | Asset-Subdomain | Port | Vite-Config |
+|--------|----------------|------|-------------|
+| `presseportale.test` | `assets.presseportale.test` | 5177 | `vite.portal.config.js` |
+| `presseecho.test` | `assets.presseecho.test` | 5178 | `vite.web.config.js` |
+| `businessportal24.test` | `assets.businessportal24.test` | 5178 | `vite.web.config.js` |
+
+## 📋 Notwendige Schritte
+
+### 1. DNS / Hosts-Datei aktualisieren
+
+Füge folgende Einträge zu deiner Hosts-Datei hinzu (lokal auf deinem Host-System, NICHT im Container):
+
+**macOS/Linux**: `/etc/hosts`
+**Windows**: `C:\Windows\System32\drivers\etc\hosts`
+
+```
+127.0.0.1 assets.presseportale.test
+127.0.0.1 assets.presseecho.test
+127.0.0.1 assets.businessportal24.test
+```
+
+### 2. Docker Container neu starten
+
+Die Traefik-Konfiguration wurde aktualisiert. Starte die Container neu:
+
+```bash
+# Auf dem Host-System (außerhalb des Containers):
+docker compose restart
+```
+
+### 3. Vite-Server starten
+
+Im DevContainer:
+
+```bash
+cd /var/www/html
+npm run dev:all
+```
+
+## 🔧 Was wurde geändert?
+
+### 1. `docker-compose.yml`
+Neue Traefik-Routen hinzugefügt:
+- `assets.presseportale.test` → Port 5177 (Portal)
+- `assets.presseecho.test` → Port 5178 (Presseecho)
+- `assets.businessportal24.test` → Port 5178 (Businessportal24)
+
+### 2. `app/Helpers/ThemeHelper.php`
+Neue Methode `getAssetUrl()` die die richtige Asset-URL basierend auf dem Theme zurückgibt.
+
+### 3. `app/Providers/AppServiceProvider.php`
+Setzt die Asset-URL dynamisch basierend auf der aktuellen Domain.
+
+### 4. `vite.web.config.js`
+HMR-Konfiguration vorbereitet für dynamische Host-Zuweisung.
+
+## 🧪 Testen
+
+Nach dem Neustart kannst du testen:
+
+```bash
+# Im DevContainer:
+curl -Ik https://assets.presseportale.test/@vite/client
+curl -Ik https://assets.presseecho.test/@vite/client
+curl -Ik https://assets.businessportal24.test/@vite/client
+```
+
+Alle sollten einen 200 OK Status zurückgeben (nachdem die Vite-Server laufen).
+
+## 🎯 Vorteile der neuen Struktur
+
+✅ Saubere Trennung pro Domain
+✅ Keine Konflikte zwischen Portal und Web
+✅ Einfacher zu debuggen
+✅ Klare URL-Struktur
+✅ Flexibel erweiterbar für neue Domains
+
+## ⚠️ Wichtig
+
+Die Vite-Server müssen laufen, damit die Assets geladen werden können:
+- **Entwicklung**: `npm run dev:all`
+- **Produktion**: Assets werden aus `public/build/*` geladen (kein Vite-Server nötig)
+
+
--- a/_docs/VITE-SETUP.md
+++ b/_docs/VITE-SETUP.md
@ -0,0 +1,145 @@
+# Vite Multi-Domain Setup
+
+## Übersicht
+
+Dieses Projekt verwendet **2 separate Vite-Ports** für unterschiedliche Domain-Bereiche:
+
+| Bereich | Port | Vite Config | Tailwind Config | Domains | FluxUI |
+|---------|------|-------------|-----------------|---------|--------|
+| **Backend (Portal)** | 5177 | `vite.portal.config.js` | `tailwind.portal.config.js` | `presseportale.test` | ✅ Ja |
+| **Frontend (Web)** | 5178 | `vite.web.config.js` | `tailwind.web.config.js` | `presseecho.test`, `businessportal24.test` | ❌ Nein |
+
+## Warum 2 Ports?
+
+### Ein Port reicht NICHT aus, weil:
+- Vite kann nur **eine Konfiguration gleichzeitig** ausführen
+- Backend nutzt **FluxUI** (flux-pro/flux), Frontend nicht
+- Unterschiedliche **Build-Verzeichnisse** (`build/portal` vs `build/web`)
+- Unterschiedliche **Tailwind-Konfigurationen**
+
+### Frontend-Domains teilen sich einen Port, weil:
+- Beide nutzen die **gleichen Views/Components**
+- Unterschiede nur in **CSS-Variablen** (Theme-Farben)
+- **ThemeServiceProvider** entscheidet zur Laufzeit welches Theme geladen wird
+
+## Development Server starten
+
+### Option 1: Beide Server gleichzeitig starten (empfohlen)
+```bash
+npm run dev:all
+```
+Startet beide Vite-Server parallel mit `concurrently`
+
+### Option 2: Nur Backend (Portal)
+```bash
+npm run dev:portal
+```
+- Port: 5177
+- HMR-Host: assets.presseportale.test
+- Domain: presseportale.test
+
+### Option 3: Nur Frontend (Web)
+```bash
+npm run dev:web
+```
+- Port: 5178
+- HMR-Host: assets-web.presseportale.test
+- Domains: presseecho.test, businessportal24.test
+
+## Production Build
+
+### Alle Builds erstellen
+```bash
+npm run build
+```
+Erstellt beide Builds nacheinander
+
+### Einzelne Builds
+```bash
+npm run build:portal  # Nur Backend
+npm run build:web     # Nur Frontend
+```
+
+## Port-Übersicht
+
+| Port | Service | Beschreibung |
+|------|---------|--------------|
+| 5177 | Vite Portal | Backend Dev Server mit FluxUI |
+| 5178 | Vite Web | Frontend Dev Server (Presseecho & Businessportal24) |
+| 33069 | MySQL | Datenbank |
+| 6382 | Redis | Cache |
+| 8027 | Mailpit | E-Mail Dashboard |
+
+## Build-Verzeichnisse
+
+```
+public/
+├── build/
+│   ├── portal/          # Backend Assets
+│   │   ├── manifest.json
+│   │   └── assets/
+│   └── web/             # Frontend Assets (beide Domains)
+│       ├── manifest.json
+│       └── assets/
+```
+
+## Theme-System
+
+### Backend (Portal)
+- **Domain:** presseportale.test
+- **Theme:** `portal`
+- **CSS:** `resources/css/portal.css`
+- **Views:** `resources/views/portal/**`
+- **FluxUI:** Ja (flux-pro/flux)
+
+### Frontend (Presseecho)
+- **Domain:** presseecho.test
+- **Theme:** `presseecho`
+- **CSS:** `resources/css/web/theme-presseecho.css`
+- **Views:** `resources/views/web/**`
+- **Farben:** Über CSS-Variablen in theme-presseecho.css
+
+### Frontend (Businessportal24)
+- **Domain:** businessportal24.test
+- **Theme:** `businessportal24`
+- **CSS:** `resources/css/web/theme-businessportal24.css`
+- **Views:** `resources/views/web/**`
+- **Farben:** Über CSS-Variablen in theme-businessportal24.css
+
+## Traefik / HMR-Setup
+
+Beide Vite-Server laufen intern auf HTTP (`https: false`), Traefik übernimmt SSL-Terminierung:
+
+- **Portal HMR:** `wss://assets.presseportale.test` → Port 5177
+- **Web HMR:** `wss://assets-web.presseportale.test` → Port 5178
+
+## Troubleshooting
+
+### HMR funktioniert nicht
+1. Prüfe ob beide Vite-Server laufen: `npm run dev:all`
+2. Prüfe Traefik-Routing für HMR-Hosts
+3. Browser-Console checken für WebSocket-Fehler
+
+### Styles werden nicht geladen
+1. Prüfe ob der richtige Vite-Server für die Domain läuft
+2. Prüfe `ThemeServiceProvider` Konfiguration
+3. Build-Manifest prüfen: `public/build/portal/manifest.json` oder `public/build/web/manifest.json`
+
+### Port bereits belegt
+```bash
+# Port-Nutzung prüfen
+lsof -i :5177
+lsof -i :5178
+
+# Prozess beenden
+kill -9 <PID>
+```
+
+## Deprecated Files
+
+Diese Dateien werden nicht mehr verwendet:
+- ❌ `vite.config.js` (alt)
+- ❌ `tailwind.config.js` (alt)
+
+Sie bleiben nur als Referenz erhalten.
+
--- a/_docs/WICHTIG-NAECHSTE-SCHRITTE.md
+++ b/_docs/WICHTIG-NAECHSTE-SCHRITTE.md
@ -0,0 +1,109 @@
+# ⚠️ WICHTIG: Nächste Schritte
+
+## ✅ Was wurde bereits erledigt
+
+1. ✅ `docker-compose.yml` aktualisiert mit neuen Asset-Domains
+2. ✅ `ThemeHelper.php` erweitert mit `getAssetUrl()` Methode
+3. ✅ `AppServiceProvider.php` aktualisiert für dynamische Asset-URLs
+4. ✅ `vite.web.config.js` vorbereitet für domain-spezifische Assets
+5. ✅ Laravel Cache geleert
+6. ✅ Vite-Server gestartet (laufen auf Port 5177 und 5178)
+
+## 🔴 ERFORDERLICH: Docker Container neu starten
+
+**Die Traefik-Konfiguration wurde geändert, daher MUSST du die Container neu starten!**
+
+### Auf deinem Host-System (NICHT im DevContainer):
+
+```bash
+# Im Projektverzeichnis (wo docker-compose.yml liegt)
+docker compose restart
+
+# ODER komplett neu starten für saubere Umgebung:
+docker compose down
+docker compose up -d
+```
+
+## 📋 DNS-Einträge hinzufügen
+
+Füge diese Zeilen zu deiner **Hosts-Datei** auf dem **Host-System** hinzu:
+
+**macOS/Linux**: `/etc/hosts`
+```bash
+sudo nano /etc/hosts
+```
+
+**Windows**: `C:\Windows\System32\drivers\etc\hosts` (als Administrator öffnen)
+
+**Einträge:**
+```
+127.0.0.1 assets.presseportale.test
+127.0.0.1 assets.presseecho.test
+127.0.0.1 assets.businessportal24.test
+```
+
+## 🧪 Nach dem Neustart testen
+
+Zurück im DevContainer:
+
+```bash
+# Vite-Server sind bereits gestartet, check den Status:
+tail -20 /tmp/vite-server.log
+
+# Teste die Asset-URLs:
+curl -Ik https://assets.presseportale.test/@vite/client
+curl -Ik https://assets.presseecho.test/@vite/client
+curl -Ik https://assets.businessportal24.test/@vite/client
+
+# Alle sollten HTTP 200 oder 304 zurückgeben
+```
+
+## 🌐 Im Browser testen
+
+Öffne:
+- https://businessportal24.test
+- https://presseecho.test
+- https://presseportale.test
+
+Die Assets sollten nun korrekt über HTTPS von den jeweiligen Asset-Subdomains geladen werden!
+
+## 🎯 Neue URL-Struktur
+
+| Hauptdomain | Asset-Domain | Port | Build-Dir |
+|------------|-------------|------|-----------|
+| presseportale.test | assets.presseportale.test | 5177 | public/build/portal |
+| presseecho.test | assets.presseecho.test | 5178 | public/build/web |
+| businessportal24.test | assets.businessportal24.test | 5178 | public/build/web |
+
+## 📖 Weitere Dokumentation
+
+- `VITE-SETUP-NEUE-STRUKTUR.md` - Detaillierte Erklärung der neuen Struktur
+- `setup-new-asset-urls.sh` - Setup-Script (optional)
+
+## ❓ Probleme?
+
+Falls nach dem Neustart immer noch Fehler auftreten:
+
+1. **Cache komplett leeren:**
+   ```bash
+   php artisan config:clear
+   php artisan cache:clear
+   php artisan view:clear
+   php artisan route:clear
+   ```
+
+2. **Vite-Server neu starten:**
+   ```bash
+   pkill -f "vite --config"
+   npm run dev:all > /tmp/vite-server.log 2>&1 &
+   ```
+
+3. **Browser Hard-Refresh:**
+   - Chrome/Firefox: `Ctrl + Shift + R` (Windows/Linux)
+   - Safari: `Cmd + Shift + R` (macOS)
+
+4. **Traefik Logs prüfen** (auf Host-System):
+   ```bash
+   docker compose logs traefik | tail -50
+   ```
+
--- a/_docs/ZUSAMMENFASSUNG-VITE-SETUP.md
+++ b/_docs/ZUSAMMENFASSUNG-VITE-SETUP.md
@ -0,0 +1,285 @@
+# Zusammenfassung: Multi-Domain Vite-Setup
+
+## Antwort auf die Hauptfrage: Reicht ein Vite-Port?
+
+### ❌ NEIN - Ein Port reicht NICHT aus!
+
+Du benötigst **mindestens 2 Vite-Ports**:
+- **Port 5177** für Portal (Backend mit FluxUI)
+- **Port 5178** für Web (Frontend: Presseecho & Businessportal24)
+
+## Begründung
+
+### Warum 2 Ports?
+
+1. **Unterschiedliche Vite-Konfigurationen**
+   - Portal: Verwendet FluxUI (flux-pro/flux)
+   - Web: Kein FluxUI, nur Tailwind CSS
+
+2. **Unterschiedliche Tailwind-Konfigurationen**
+   - Portal: `tailwind.portal.config.js` (mit FluxUI-Content-Paths)
+   - Web: `tailwind.web.config.js` (ohne FluxUI)
+
+3. **Unterschiedliche Build-Verzeichnisse**
+   - Portal: `public/build/portal`
+   - Web: `public/build/web`
+
+4. **Vite-Limitierung**
+   - Ein Vite Dev Server kann nur **eine Konfiguration** gleichzeitig ausführen
+   - Für verschiedene Configs = separate Vite-Prozesse = separate Ports
+
+### Warum können Presseecho & Businessportal24 einen Port teilen?
+
+1. **Gleiche Views/Components**
+   - Beide nutzen `resources/views/web/**`
+   - Gleiche Blade-Templates und Livewire-Components
+
+2. **Gleiche Vite-Konfiguration**
+   - Beide laden die gleichen CSS-Input-Dateien
+   - Beide bauen nach `public/build/web`
+
+3. **Theme-Unterschiede nur in CSS-Variablen**
+   - Presseecho: Grüne Farben (#345636, #6b8f71)
+   - Businessportal24: Rote Farben (#cf3628, #f0834a)
+   - Unterschiede werden durch CSS Custom Properties gesteuert
+
+4. **Runtime-Entscheidung**
+   - `ThemeServiceProvider` erkennt die Domain zur Laufzeit
+   - Lädt automatisch die richtige Theme-CSS-Datei
+
+## Architektur-Übersicht
+
+```
+┌─────────────────────────────────────────────────────────────┐
+│                    Docker Container                         │
+├─────────────────────────────────────────────────────────────┤
+│                                                             │
+│  ┌──────────────────┐         ┌──────────────────┐        │
+│  │   Vite Portal    │         │    Vite Web      │        │
+│  │   Port: 5177     │         │   Port: 5178     │        │
+│  │                  │         │                  │        │
+│  │  - FluxUI ✅     │         │  - FluxUI ❌     │        │
+│  │  - portal.css    │         │  - presseecho    │        │
+│  │  - build/portal  │         │  - businessp24   │        │
+│  │                  │         │  - build/web     │        │
+│  └──────────────────┘         └──────────────────┘        │
+│          ↓                            ↓                    │
+│  ┌──────────────────┐         ┌──────────────────┐        │
+│  │  presseportale.test │         │  presseecho.test │        │
+│  │                  │         │  businessp24.test│        │
+│  └──────────────────┘         └──────────────────┘        │
+│                                                             │
+└─────────────────────────────────────────────────────────────┘
+```
+
+## Vorgenommene Änderungen
+
+### 1. Vite-Konfigurationen aktualisiert
+
+#### ✅ `vite.portal.config.js`
+- Port: **5177**
+- Input: `resources/css/portal.css`
+- Build: `public/build/portal`
+- HMR: `assets.presseportale.test`
+- FluxUI: ✅ Ja
+
+#### ✅ `vite.web.config.js`
+- Port: **5178** (geändert von 5177!)
+- Input: `theme-presseecho.css`, `theme-businessportal24.css`
+- Build: `public/build/web`
+- HMR: `assets-web.presseportale.test`
+- FluxUI: ❌ Nein
+
+#### ❌ `vite.config.js` (deprecated)
+- Als DEPRECATED markiert
+- Wird nicht mehr verwendet
+
+### 2. Tailwind-Konfigurationen aktualisiert
+
+#### ✅ `tailwind.portal.config.js`
+- Content-Pfade für Portal + FluxUI
+- Dokumentation hinzugefügt
+
+#### ✅ `tailwind.web.config.js`
+- Content-Pfade für Web (ohne FluxUI)
+- Dokumentation hinzugefügt
+
+#### ❌ `tailwind.config.js` (deprecated)
+- Als DEPRECATED markiert
+- Wird nicht mehr verwendet
+
+### 3. Neue CSS-Theme-Dateien erstellt
+
+#### ✅ `resources/css/web/shared-styles.css`
+- Gemeinsame Styles für beide Frontend-Themes
+- Typography, Components, Utilities
+
+#### ✅ `resources/css/web/theme-presseecho.css`
+- Primary: #345636 (Grün)
+- Secondary: #6b8f71 (Hellgrün)
+- Font: Montserrat
+- CSS-Variablen für HSL-Farben
+- Dark-Mode-Support
+
+#### ✅ `resources/css/web/theme-businessportal24.css`
+- Primary: #cf3628 (Rot)
+- Secondary: #f0834a (Orange)
+- Font: Montserrat
+- CSS-Variablen für HSL-Farben
+- Dark-Mode-Support
+
+### 4. `package.json` Scripts aktualisiert
+
+```json
+{
+  "dev": "Hinweismeldung",
+  "dev:portal": "vite --config vite.portal.config.js",
+  "dev:web": "vite --config vite.web.config.js",
+  "dev:all": "concurrently beide gleichzeitig",
+  "build": "beide Builds nacheinander",
+  "build:portal": "nur Portal",
+  "build:web": "nur Web"
+}
+```
+
+### 5. `devcontainer.json` aktualisiert
+
+- Port **5178** zu forwardPorts hinzugefügt
+- Port-Label aktualisiert
+
+### 6. Dokumentation erstellt
+
+- ✅ `VITE-SETUP.md` - Technische Vite-Dokumentation
+- ✅ `THEME-INTEGRATION.md` - Integration in Blade-Templates
+- ✅ `ZUSAMMENFASSUNG-VITE-SETUP.md` - Diese Datei
+
+## So startest du die Dev-Server
+
+### Option 1: Beide gleichzeitig (empfohlen)
+```bash
+npm run dev:all
+```
+Startet:
+- Portal auf Port 5177
+- Web auf Port 5178
+
+### Option 2: Nur Backend
+```bash
+npm run dev:portal
+```
+
+### Option 3: Nur Frontend
+```bash
+npm run dev:web
+```
+
+## Production Builds
+
+```bash
+# Alle Builds erstellen
+npm run build
+
+# Nur Portal
+npm run build:portal
+
+# Nur Web
+npm run build:web
+```
+
+## URLs für Development
+
+| URL | Vite-Port | Theme | FluxUI |
+|-----|-----------|-------|--------|
+| https://presseportale.test | 5177 | portal | ✅ |
+| https://presseecho.test | 5178 | presseecho | ❌ |
+| https://businessportal24.test | 5178 | businessportal24 | ❌ |
+
+## HMR (Hot Module Replacement)
+
+- **Portal:** `wss://assets.presseportale.test` → Port 5177
+- **Web:** `wss://assets-web.presseportale.test` → Port 5178
+
+⚠️ **Wichtig:** Traefik muss beide HMR-Hosts routen!
+
+## Nächste Schritte
+
+### 1. Traefik-Konfiguration prüfen
+Stelle sicher, dass Traefik beide Vite-Ports routet:
+
+```yaml
+# docker-compose.yml oder traefik.yml
+labels:
+  # Portal Assets
+  - "traefik.http.routers.vite-portal.rule=Host(`assets.presseportale.test`)"
+  - "traefik.http.routers.vite-portal.service=vite-portal"
+  - "traefik.http.services.vite-portal.loadbalancer.server.port=5177"
+  
+  # Web Assets
+  - "traefik.http.routers.vite-web.rule=Host(`assets-web.presseportale.test`)"
+  - "traefik.http.routers.vite-web.service=vite-web"
+  - "traefik.http.services.vite-web.loadbalancer.server.port=5178"
+```
+
+### 2. DNS/Hosts-Datei aktualisieren
+
+```
+127.0.0.1 presseportale.test
+127.0.0.1 presseecho.test
+127.0.0.1 businessportal24.test
+127.0.0.1 assets.presseportale.test
+127.0.0.1 assets-web.presseportale.test
+```
+
+### 3. Blade-Templates aktualisieren
+
+Siehe `THEME-INTEGRATION.md` für Details zur Integration in Templates.
+
+Beispiel für Web-Layout:
+
+```blade
+@if($theme === 'presseecho')
+    @vite(['resources/css/web/theme-presseecho.css', 'resources/js/app.js'])
+@elseif($theme === 'businessportal24')
+    @vite(['resources/css/web/theme-businessportal24.css', 'resources/js/app.js'])
+@endif
+```
+
+### 4. Alte Theme-Dateien aufräumen (optional)
+
+Diese Dateien werden nicht mehr benötigt:
+- `resources/css/web/theme-main.css`
+- `resources/css/web/theme-landing1.css`
+- `resources/css/web/theme-landing2.css`
+
+### 5. Testen
+
+```bash
+# 1. Dev-Server starten
+npm run dev:all
+
+# 2. Browser öffnen
+# - https://presseportale.test (Backend)
+# - https://presseecho.test (Frontend Grün)
+# - https://businessportal24.test (Frontend Rot)
+
+# 3. HMR testen
+# - Datei ändern
+# - Browser sollte auto-refresh
+```
+
+## Vorteile dieser Lösung
+
+✅ **Saubere Trennung**: Backend und Frontend komplett getrennt
+✅ **FluxUI isoliert**: Nur im Backend verfügbar
+✅ **Effizient**: Frontend-Domains teilen Build-Pipeline
+✅ **Flexibel**: Neue Themes einfach durch neue CSS-Dateien hinzufügbar
+✅ **Developer-freundlich**: HMR funktioniert für alle Domains
+✅ **Production-ready**: Separate Builds für optimale Performance
+
+## Fragen?
+
+- Technische Details → `VITE-SETUP.md`
+- Blade-Integration → `THEME-INTEGRATION.md`
+- Domain-Konfiguration → `config/domains.php`
+- Theme-Provider → `app/Providers/ThemeServiceProvider.php`
+
--- a/_docs/api/v1.yml
+++ b/_docs/api/v1.yml
@ -0,0 +1,656 @@
+openapi: 3.1.0
+info:
+  title: Presseportale API
+  version: 1.0.0
+  description: >
+    REST API for customer integrations after the 2026 migration. Legacy
+    `api_key` query parameters and `X-Api-Key` headers are no longer accepted.
+servers:
+  - url: /api/v1
+security:
+  - sanctumBearer: []
+tags:
+  - name: Press Releases
+  - name: Press Release Images
+  - name: Companies
+  - name: Categories
+  - name: Newsletter
+paths:
+  /press-releases:
+    get:
+      tags: [Press Releases]
+      summary: List own press releases
+      description: Requires `press-releases:read`.
+      parameters:
+        - $ref: '#/components/parameters/StatusFilter'
+        - $ref: '#/components/parameters/PerPage'
+      responses:
+        '200':
+          description: Paginated press release collection.
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/PaginatedPressReleases'
+        '401':
+          $ref: '#/components/responses/Unauthenticated'
+        '403':
+          $ref: '#/components/responses/Forbidden'
+        '410':
+          $ref: '#/components/responses/LegacyApiKeyGone'
+    post:
+      tags: [Press Releases]
+      summary: Create a press release
+      description: Requires `press-releases:write`.
+      requestBody:
+        required: true
+        content:
+          application/json:
+            schema:
+              $ref: '#/components/schemas/StorePressReleaseRequest'
+      responses:
+        '201':
+          description: Press release created.
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/PressReleaseResponse'
+        '403':
+          $ref: '#/components/responses/Forbidden'
+        '422':
+          $ref: '#/components/responses/ValidationError'
+  /press-releases/{pressRelease}:
+    get:
+      tags: [Press Releases]
+      summary: Show one own press release
+      description: Requires `press-releases:read`.
+      parameters:
+        - $ref: '#/components/parameters/PressReleaseId'
+      responses:
+        '200':
+          description: Press release resource.
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/PressReleaseResponse'
+        '403':
+          $ref: '#/components/responses/Forbidden'
+    patch:
+      tags: [Press Releases]
+      summary: Update one own draft or rejected press release
+      description: Requires `press-releases:write`.
+      parameters:
+        - $ref: '#/components/parameters/PressReleaseId'
+      requestBody:
+        required: true
+        content:
+          application/json:
+            schema:
+              $ref: '#/components/schemas/UpdatePressReleaseRequest'
+      responses:
+        '200':
+          description: Press release updated.
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/PressReleaseResponse'
+        '409':
+          $ref: '#/components/responses/Conflict'
+        '422':
+          $ref: '#/components/responses/ValidationError'
+    delete:
+      tags: [Press Releases]
+      summary: Delete one own unpublished press release
+      description: Requires `press-releases:write`.
+      parameters:
+        - $ref: '#/components/parameters/PressReleaseId'
+      responses:
+        '204':
+          description: Press release deleted.
+        '409':
+          $ref: '#/components/responses/Conflict'
+  /press-releases/{pressRelease}/images:
+    get:
+      tags: [Press Release Images]
+      summary: List images for one own press release
+      description: Requires `press-releases:read`.
+      parameters:
+        - $ref: '#/components/parameters/PressReleaseId'
+      responses:
+        '200':
+          description: Press release image collection.
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/PressReleaseImageCollection'
+        '403':
+          $ref: '#/components/responses/Forbidden'
+    post:
+      tags: [Press Release Images]
+      summary: Upload an image for one own draft or rejected press release
+      description: Requires `press-release-images:write`. The uploaded image is limited to 5 MB.
+      parameters:
+        - $ref: '#/components/parameters/PressReleaseId'
+      requestBody:
+        required: true
+        content:
+          multipart/form-data:
+            schema:
+              $ref: '#/components/schemas/StorePressReleaseImageRequest'
+      responses:
+        '201':
+          description: Press release image uploaded.
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/PressReleaseImageResponse'
+        '403':
+          $ref: '#/components/responses/Forbidden'
+        '409':
+          $ref: '#/components/responses/Conflict'
+        '422':
+          $ref: '#/components/responses/ValidationError'
+  /press-release-images/{pressReleaseImage}:
+    delete:
+      tags: [Press Release Images]
+      summary: Delete one own press release image
+      description: Requires `press-release-images:write`; only draft or rejected press releases may be changed.
+      parameters:
+        - $ref: '#/components/parameters/PressReleaseImageId'
+      responses:
+        '204':
+          description: Press release image deleted.
+        '403':
+          $ref: '#/components/responses/Forbidden'
+        '409':
+          $ref: '#/components/responses/Conflict'
+  /companies:
+    get:
+      tags: [Companies]
+      summary: List own companies
+      description: Requires `companies:read`.
+      parameters:
+        - $ref: '#/components/parameters/PerPage'
+      responses:
+        '200':
+          description: Paginated company collection.
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/PaginatedCompanies'
+        '403':
+          $ref: '#/components/responses/Forbidden'
+  /companies/{company}:
+    get:
+      tags: [Companies]
+      summary: Show one own company
+      description: Requires `companies:read`.
+      parameters:
+        - $ref: '#/components/parameters/CompanyId'
+      responses:
+        '200':
+          description: Company resource.
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/CompanyResponse'
+        '403':
+          $ref: '#/components/responses/Forbidden'
+  /categories:
+    get:
+      tags: [Categories]
+      summary: List active categories
+      description: Requires `press-releases:read`.
+      responses:
+        '200':
+          description: Category collection.
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/CategoryCollection'
+        '403':
+          $ref: '#/components/responses/Forbidden'
+  /newsletter/subscribe:
+    post:
+      tags: [Newsletter]
+      summary: Subscribe an email address
+      description: Requires `newsletter:subscribe`.
+      requestBody:
+        required: true
+        content:
+          application/json:
+            schema:
+              $ref: '#/components/schemas/SubscribeNewsletterRequest'
+      responses:
+        '201':
+          description: Subscription created.
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/NewsletterSubscriptionResponse'
+        '403':
+          $ref: '#/components/responses/Forbidden'
+        '422':
+          $ref: '#/components/responses/ValidationError'
+components:
+  securitySchemes:
+    sanctumBearer:
+      type: http
+      scheme: bearer
+      bearerFormat: Sanctum personal access token
+  parameters:
+    PressReleaseId:
+      name: pressRelease
+      in: path
+      required: true
+      schema:
+        type: integer
+    PressReleaseImageId:
+      name: pressReleaseImage
+      in: path
+      required: true
+      schema:
+        type: integer
+    CompanyId:
+      name: company
+      in: path
+      required: true
+      schema:
+        type: integer
+    StatusFilter:
+      name: status
+      in: query
+      required: false
+      schema:
+        type: string
+        enum: [draft, review, published, rejected, archived]
+    PerPage:
+      name: per_page
+      in: query
+      required: false
+      schema:
+        type: integer
+        minimum: 1
+        maximum: 100
+        default: 25
+  responses:
+    Unauthenticated:
+      description: Missing or invalid Bearer token.
+    Forbidden:
+      description: Token ability missing or resource does not belong to the authenticated user.
+    Conflict:
+      description: Requested state transition is not allowed.
+    ValidationError:
+      description: Validation failed.
+      content:
+        application/json:
+          schema:
+            $ref: '#/components/schemas/ValidationError'
+    LegacyApiKeyGone:
+      description: Legacy API keys are no longer supported.
+      content:
+        application/json:
+          schema:
+            $ref: '#/components/schemas/LegacyApiKeyGone'
+  schemas:
+    StorePressReleaseRequest:
+      type: object
+      required: [company_id, category_id, language, title, text]
+      properties:
+        company_id:
+          type: integer
+        category_id:
+          type: integer
+        language:
+          type: string
+          minLength: 2
+          maxLength: 2
+          example: de
+        title:
+          type: string
+          maxLength: 255
+        text:
+          type: string
+        backlink_url:
+          type: string
+          format: uri
+          nullable: true
+        keywords:
+          type: string
+          nullable: true
+          maxLength: 255
+        status:
+          type: string
+          enum: [draft, review]
+          default: draft
+        teaser_begin:
+          type: integer
+          nullable: true
+          minimum: 0
+        teaser_end:
+          type: integer
+          nullable: true
+          minimum: 0
+        no_export:
+          type: boolean
+          nullable: true
+    UpdatePressReleaseRequest:
+      allOf:
+        - $ref: '#/components/schemas/StorePressReleaseRequest'
+      required: []
+    SubscribeNewsletterRequest:
+      type: object
+      required: [portal, email]
+      properties:
+        portal:
+          type: string
+          enum: [presseecho, businessportal24]
+        email:
+          type: string
+          format: email
+          maxLength: 190
+        salutation_key:
+          type: string
+          nullable: true
+          maxLength: 20
+        first_name:
+          type: string
+          nullable: true
+          maxLength: 80
+        last_name:
+          type: string
+          nullable: true
+          maxLength: 80
+    StorePressReleaseImageRequest:
+      type: object
+      required: [image]
+      properties:
+        image:
+          type: string
+          format: binary
+          description: JPEG, PNG or WebP image, max. 5 MB.
+        title:
+          type: string
+          nullable: true
+          maxLength: 120
+        description:
+          type: string
+          nullable: true
+          maxLength: 500
+        copyright:
+          type: string
+          nullable: true
+          maxLength: 255
+        is_preview:
+          type: boolean
+          nullable: true
+    PressRelease:
+      type: object
+      properties:
+        id:
+          type: integer
+        uuid:
+          type: string
+          format: uuid
+        legacy:
+          $ref: '#/components/schemas/LegacyReference'
+        portal:
+          type: string
+          enum: [presseecho, businessportal24]
+        language:
+          type: string
+        title:
+          type: string
+        slug:
+          type: string
+        text:
+          type: string
+        backlink_url:
+          type: string
+          nullable: true
+        keywords:
+          type: string
+          nullable: true
+        status:
+          type: string
+          enum: [draft, review, published, rejected, archived]
+        hits:
+          type: integer
+        teaser:
+          type: object
+          properties:
+            begin:
+              type: integer
+              nullable: true
+            end:
+              type: integer
+              nullable: true
+        no_export:
+          type: boolean
+        published_at:
+          type: string
+          format: date-time
+          nullable: true
+        company:
+          $ref: '#/components/schemas/Company'
+        category:
+          $ref: '#/components/schemas/Category'
+        images:
+          type: array
+          items:
+            $ref: '#/components/schemas/PressReleaseImage'
+        created_at:
+          type: string
+          format: date-time
+          nullable: true
+        updated_at:
+          type: string
+          format: date-time
+          nullable: true
+    Company:
+      type: object
+      properties:
+        id:
+          type: integer
+        legacy:
+          $ref: '#/components/schemas/LegacyReference'
+        portal:
+          type: string
+          enum: [presseecho, businessportal24]
+        type:
+          type: string
+          nullable: true
+        name:
+          type: string
+        slug:
+          type: string
+        email:
+          type: string
+          nullable: true
+        website:
+          type: string
+          nullable: true
+        phone:
+          type: string
+          nullable: true
+        country_code:
+          type: string
+          nullable: true
+        is_active:
+          type: boolean
+        created_at:
+          type: string
+          format: date-time
+          nullable: true
+        updated_at:
+          type: string
+          format: date-time
+          nullable: true
+    Category:
+      type: object
+      properties:
+        id:
+          type: integer
+        legacy:
+          $ref: '#/components/schemas/LegacyReference'
+        portal:
+          type: string
+          enum: [presseecho, businessportal24]
+          nullable: true
+        is_active:
+          type: boolean
+        translations:
+          type: object
+          additionalProperties:
+            type: object
+            properties:
+              name:
+                type: string
+              slug:
+                type: string
+              description:
+                type: string
+                nullable: true
+    PressReleaseImage:
+      type: object
+      properties:
+        id:
+          type: integer
+        press_release_id:
+          type: integer
+        url:
+          type: string
+          format: uri
+        disk:
+          type: string
+        path:
+          type: string
+        title:
+          type: string
+          nullable: true
+        description:
+          type: string
+          nullable: true
+        copyright:
+          type: string
+          nullable: true
+        is_preview:
+          type: boolean
+        sort_order:
+          type: integer
+        width:
+          type: integer
+          nullable: true
+        height:
+          type: integer
+          nullable: true
+        mime:
+          type: string
+          nullable: true
+        created_at:
+          type: string
+          format: date-time
+          nullable: true
+        updated_at:
+          type: string
+          format: date-time
+          nullable: true
+    LegacyReference:
+      type: object
+      properties:
+        portal:
+          type: string
+          nullable: true
+        id:
+          type: integer
+          nullable: true
+    PressReleaseResponse:
+      type: object
+      properties:
+        data:
+          $ref: '#/components/schemas/PressRelease'
+    PressReleaseImageResponse:
+      type: object
+      properties:
+        data:
+          $ref: '#/components/schemas/PressReleaseImage'
+    CompanyResponse:
+      type: object
+      properties:
+        data:
+          $ref: '#/components/schemas/Company'
+    PaginatedPressReleases:
+      type: object
+      properties:
+        data:
+          type: array
+          items:
+            $ref: '#/components/schemas/PressRelease'
+        links:
+          type: object
+        meta:
+          type: object
+    PaginatedCompanies:
+      type: object
+      properties:
+        data:
+          type: array
+          items:
+            $ref: '#/components/schemas/Company'
+        links:
+          type: object
+        meta:
+          type: object
+    CategoryCollection:
+      type: object
+      properties:
+        data:
+          type: array
+          items:
+            $ref: '#/components/schemas/Category'
+    PressReleaseImageCollection:
+      type: object
+      properties:
+        data:
+          type: array
+          items:
+            $ref: '#/components/schemas/PressReleaseImage'
+    NewsletterSubscriptionResponse:
+      type: object
+      properties:
+        message:
+          type: string
+        data:
+          type: object
+          properties:
+            id:
+              type: integer
+            portal:
+              type: string
+            email:
+              type: string
+              format: email
+            is_confirmed:
+              type: boolean
+    LegacyApiKeyGone:
+      type: object
+      properties:
+        message:
+          type: string
+          example: Legacy API keys are no longer supported.
+        migration_url:
+          type: string
+          format: uri
+        docs_url:
+          type: string
+          format: uri
+    ValidationError:
+      type: object
+      properties:
+        message:
+          type: string
+        errors:
+          type: object
+          additionalProperties:
+            type: array
+            items:
+              type: string