Auftragsbestaetigung: Dialog Schritt 4 (Vorschau, Entwurf speichern, Senden mit Rueckfrage und Sperre)

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

src/components/auftraege/auftrag.css

@@ -76,3 +76,18 @@
   .auftrag-item + .auftrag-item .auftrag-item-label, .auftrag-item-label { position: static; width: auto; height: auto; margin: 0; overflow: visible; clip: auto; white-space: normal; }
   .auftrag-narrow { max-width: none; }
 }
+
+/* Dialog: Schrittleiste, Vorschau, Fuss */
+.auftrag-schritte { list-style: none; margin: 0 0 16px; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 20px; font-size: 13px; color: var(--text-2); }
+.auftrag-schritte li[aria-current="step"] { color: var(--text); font-weight: 600; }
+.auftrag-schritt-nr { margin-right: 6px; }
+.auftrag-pdf { width: 100%; height: min(70vh, 640px); border: 1px solid var(--line); border-radius: var(--radius); background: var(--bg-subtle); }
+.auftrag-foot { display: flex; flex: 1; flex-wrap: wrap; align-items: center; gap: 8px; }
+.auftrag-foot .grow { flex: 1; }
+
+@media (max-width: 860px) {
+  .auftrag-schritt-text { display: none; }
+  .auftrag-schritte li[aria-current="step"] .auftrag-schritt-text { display: inline; }
+  .auftrag-pdf { height: 50vh; }
+  .auftrag-foot .btn { flex: 1 1 auto; }
+}