# Phase 4E — Profile & Settings

> Fünftes Päckchen aus Phase 4. Folgt auf 4D Companies.

**Status**: ✅ abgeschlossen · **Aufwand**: ~½ Tag · **Risiko**: niedrig

---

## Scope

**Admin / „/settings/*" (alle Rollen)**

- `resources/views/livewire/settings/profile.blade.php` (117 Z.)
- `resources/views/livewire/settings/password.blade.php` (82 Z.)
- `resources/views/livewire/settings/appearance.blade.php` (21 Z.)
- `resources/views/livewire/settings/delete-user-form.blade.php`
  (59 Z., wird in profile.blade.php als Komponente eingebunden)

**Customer („Mein Bereich")**

- `resources/views/livewire/customer/profile.blade.php` (451 Z.)
- `resources/views/livewire/customer/security.blade.php` (295 Z.)

NICHT in diesem Päckchen:

- `customer/invoices.blade.php`, `customer/tokens.blade.php`,
  `customer/bookings.blade.php`, `customer/company-switcher` —
  eigenes Päckchen 4F.
- 2FA-Pages aus Fortify-Standard-Setup — bleiben FluxUI bis sie
  separat angepackt werden.

## Ziel

Beide Settings-Strecken im Hub-Vokabular wie Press-Releases / 
Companies:

- **Page-Header** mit Rolle-Pille („Admin Backend" oder
  „User Backend") + Eyebrow + H1 + Subtitle.
- **Form-Sektionen** als `.panel` mit `.panel-head` und
  `section-eyebrow`.
- **FluxUI-Form-Felder** bleiben (`flux:field`, `flux:input`,
  `flux:label`, `flux:error`, `flux:checkbox`, `flux:radio`,
  `flux:textarea`, `flux:button`).
- **Required-Marker** auf Hub-Token (`text-[color:var(--color-err)]`).
- **Save-Action** in eigenem Panel-Footer mit Save-Indicator-Span.
- **Flash-/Success-Messages** auf Hub-Token-Pillen.
- **Danger-Zone** (Delete-Account, Sessions löschen) als
  `.panel` mit `is-danger`-Akzent (linker Roter Strip).

## Was explizit NICHT angefasst wird

- Volt-Logik in allen Dateien.
- `<x-settings.layout>` Wrapper-Komponente (falls vorhanden) —
  Layout-only-Änderungen, keine Hülle.
- 2FA-/Confirm-Password-Modals.
- Test-relevante Strings auf customer/profile + customer/security:
  - **profile**: „Rechnungsadresse"
  - **security**: „Konto-Sicherheit", „Letzter Login",
    „Aktive Sessions", „Passwort ändern", „E-Mail-Adresse ändern",
    „Zwei-Faktor-Authentifizierung"

## Akzeptanzkriterien

- [x] Plan
- [x] `partials/settings-heading` zentral auf Hub-Page-Header.
- [x] `components/settings/layout` zentral auf Hub-Sidebar +
  Content-Panel.
- [x] `settings/appearance` Hub-styled (profitiert vom neuen
  Wrapper, kein Body-Touch nötig).
- [x] `settings/profile` Hub-styled + Verification-Hinweis als
  Hub-Warn-Box + Save-Button mit Token-„Saved."-Pill.
- [x] `settings/delete-user-form` als Hub-Danger-Box mit
  linkem Roten Strip. Modal-Markup unverändert.
- [x] `settings/password` Hub-styled (Save-Bar mit Border-Top).
- [x] `customer/profile` Hub-styled: Header, 3 Panels (Konto,
  Profil, Rechnungsadresse), Aktionen-Panel, Zugeordnete-Firmen-
  Panel mit Hub-Badges.
- [x] `customer/security` Hub-styled: Header, 4-spaltige
  KPI-Reihe, Passwort+E-Mail 2-Col-Grid, 2FA-Panel mit
  Hub-Recovery-Codes, Sessions-Panel mit Hub-Empty-State.
- [x] Tests grün:
  - `Settings|CustomerProfileSecurity|CustomerCompanyContext`
    → 33 passed (146 assertions).
  - Volle Suite → 230 passed, 3 skipped, 1 pre-existing
    `ApiDocumentationTest`-Fail (nicht von 4E).
- [x] Build + Pint + PROGRESS.

## Notes

- Der zentrale Umbau der beiden Wrapper (`settings-heading`,
  `settings.layout`) hat sich bezahlt gemacht: die drei
  `settings/*`-Pages sind weitgehend identisch klein geblieben,
  Page-Header und Side-Nav kommen automatisch im Hub-Look.
- `<x-action-message>` für „Saved."-Toast bleibt drin, aber
  der Slot ist auf einen Hub-getönten `<span>` umgestellt.
- Empty-State für „Aktive Sessions" nutzt das gleiche
  Hub-Icon-Box-Pattern wie auf den Press-Releases-Listen.
- 2FA-QR-Container behält explizit weißen Hintergrund —
  QR-Codes brauchen hohen Kontrast unabhängig vom Mode.
- Alle Test-Pflicht-Strings unverändert: „Rechnungsadresse",
  „Konto-Sicherheit", „Letzter Login", „Aktive Sessions",
  „Passwort ändern", „E-Mail-Adresse ändern",
  „Zwei-Faktor-Authentifizierung".