Design P6: kleine Tabellen-, Dialog- und Autocomplete-Ergaenzungen

Block 'Kunden-Unterseiten (P6)' direkt vor KOMPAT: table-wrap bricht lange Woerter, aria-current-Zeile auf --bg-subtle, .cell-actions fuer Zeilenaktionen, Dialogfuss mit flex-wrap und umbrechenden Knoepfen, .autocomplete .input mit voller Breite.

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

src/styles/global.css

@@ -1194,6 +1194,26 @@ button.list-row:hover .faint, button.list-row[aria-pressed="true"] .faint { colo
 .services-stack > .pick-empty { padding: 0; } /* der Abstand kommt aus gap */
 /* ===== ENDE Projekte (P5) ===== */
 
+/* ===== Kunden-Unterseiten (P6) ===== */
+/* Kleine Ergaenzungen fuer Gutschriften, Angebote und E-Mail-Speicher. Steht direkt vor KOMPAT: gewinnt bei gleicher Spezifitaet */
+/* ueber die Bausteinregeln oberhalb durch die Reihenfolge, nie durch eine Erzwingung. */
+
+/* table-wrap gilt nur fuer die drei P6-Tabellen: lange Namen, Domains und Anbieter brechen statt die Seite zu verbreitern */
+.table.table-wrap td { overflow-wrap: anywhere; }
+/* Die aufgeklappte Gutschrift liegt auf --bg-subtle; die Zeilen sind nicht klickbar, daher kein tr.row */
+.table tr[aria-current="true"] td { background: var(--bg-subtle); }
+/* Aktionszeile in der letzten Zelle (button.link / .link-danger); ersetzt das gestrichene .mt-1. Nur fuer das div: P5 nutzt */
+/* td.cell-actions als Zellenmarker der Projektliste (display bleibt table-cell), die Klasse darf dort kein Flex setzen. */
+div.cell-actions { display: flex; flex-wrap: wrap; gap: 4px 16px; margin-top: 6px; }
+/* Dialogfuss bricht um, wenn Knoepfe und Hinweis nicht in eine Zeile passen (Handy) */
+.dialog-foot { flex-wrap: wrap; }
+/* Eine lange Knopfbeschriftung (Wortlaut bleibt, z. B. "Angebot anlegen und aufs laufende Abo anwenden") bricht im Dialogfuss um, */
+/* statt ihn zu verbreitern: .btn ist nowrap, Umbrechen der Zeile allein reicht nicht. Einzeilig bleibt der Knopf 32 px hoch. */
+.dialog-foot .btn { white-space: normal; height: auto; min-height: 32px; padding-top: 6px; padding-bottom: 6px; text-align: center; }
+/* deckt auch verschachtelte Felder, P7 prueft die Regel */
+.autocomplete .input { width: 100%; }
+/* ===== ENDE Kunden-Unterseiten (P6) ===== */
+
 /* ===== KOMPAT (bis P10) ===== */
 /* Uebergangsschicht: alte Klassen im neuen Look, damit Seiten und Dialoge, die noch nicht umgebaut sind, weiss, kastenlos */
 /* und lesbar bleiben. Steht am Dateiende und gewinnt dort gegen die Altregeln und gegen die anderen Stylesheets (global.css */