diff --git a/README.md b/README.md
index 267879f..11c439a 100644
--- a/README.md
+++ b/README.md
@@ -31,6 +31,8 @@ One canonical implementation, consumed by both repos, makes this class of drift
**2026-07-25, Vorkasse fixes (v0.2.3).** `isPaidImmediately()` matched `paymentMethodTitle` with an exact `!==` check against the literal string `"Überweisung"` — the consuming shop renamed its Vorkasse row to `"Überweisung (Vorkasse)"` the same day (to make room for a possible future *automated* bank-transfer method, e.g. "Sofortüberweisung", routed through a real payment gateway), which would have silently made every unpaid Vorkasse invoice show "✓ Bereits beglichen". Changed to `startsWith("Überweisung")` — same "only Überweisung is the named exception" design, tolerant of a suffix qualifier on that one title. Also added an explicit instruction in the unpaid case (previously the *absence* of the paid confirmation was the only signal, no actual text): "Bitte überweisen Sie den Rechnungsbetrag unter Angabe der Bestellnummer … auf die unten stehende Bankverbindung. Die Bestellung wird nach Zahlungseingang bearbeitet (in der Regel innerhalb von 1–2 Werktagen)." — same plain-text treatment as the paid confirmation (`unpaidNoticeText`, muted rather than green — an unpaid Vorkasse invoice isn't a problem, just an expected pending state).
+**2026-07-25, unpaid-notice layout fix (v0.2.4).** The new unpaid-Vorkasse instruction (v0.2.3) reused `paidBadgeRow`, which lives inside `summary`'s `alignItems: "flex-end"` column (240pt-wide, designed for the short one-line paid confirmation) — so the longer two-sentence instruction shrank to content width and read as squeezed under the narrow summary card instead of a proper full-width note. Moved to its own sibling row (`unpaidNoticeRow`, `width: "100%"`, `marginTop: 20` vs. `paidBadgeRow`'s 10) outside `summary` entirely, left-aligned instead of right-aligned.
+
## How this is consumed
Not published to npm — installed as a git dependency:
diff --git a/package.json b/package.json
index d3b84eb..59ce3e3 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "@einfach-produktiv/invoicing",
- "version": "0.2.3",
+ "version": "0.2.4",
"private": true,
"description": "Shared invoice / correction-invoice (Stornorechnung, Gutschrift) PDF generation and VAT-breakdown math, consumed as a git dependency by both the einfach-produktiv frontend and the payload backend — not published to npm.",
"type": "module",
diff --git a/src/invoicePdf.tsx b/src/invoicePdf.tsx
index 69893c6..564c80d 100644
--- a/src/invoicePdf.tsx
+++ b/src/invoicePdf.tsx
@@ -53,9 +53,17 @@ const styles = StyleSheet.create({
// Same plain-text treatment as paidBadgeText (no pill/box, see that
// style's own comment) — muted, not an error/warning color, since an
// unpaid Vorkasse invoice isn't a problem, just a pending, expected
- // state. Right-aligned + a max width so the two-sentence instruction
- // wraps under the summary card instead of running the full page width.
- unpaidNoticeText: { fontSize: 9, color: TEXT_MUTED, textAlign: "right", maxWidth: 220 },
+ // state. `width: "100%"` + left-aligned + its own row (not
+ // `paidBadgeRow`) — an earlier version reused `paidBadgeRow`, which
+ // sits inside `summary`'s `alignItems: "flex-end"` column, so a
+ // right-aligned, unconstrained-width Text there just shrank to content
+ // and read as squeezed under the narrow summaryBox instead of a proper
+ // full-width instruction. `unpaidNoticeRow` below breaks out of that.
+ unpaidNoticeText: { fontSize: 9, lineHeight: 1.5, color: TEXT_MUTED, textAlign: "left" },
+ // More top space than paidBadgeRow's 10 — this is a longer, more
+ // important instruction than a one-line confirmation, needs to read as
+ // its own section, not crowd the summary card above it.
+ unpaidNoticeRow: { width: "100%", alignSelf: "stretch", marginTop: 20 },
table: { borderRadius: 6, overflow: "hidden", borderWidth: 1, borderColor: BORDER, marginTop: 8, marginBottom: 16 },
tableHeader: { flexDirection: "row", backgroundColor: BG_MUTED, paddingVertical: 8, paddingHorizontal: 10 },
// Every item row shares this same tinted background now — no more
@@ -463,18 +471,22 @@ export function InvoiceDocument({ order, seller }: { order: InvoiceOrder; seller
)}
- {paid ? (
+ {paid && (
✓ Bereits beglichen ({order.paymentMethodTitle})
- ) : (
-
-
- Bitte überweisen Sie den Rechnungsbetrag unter Angabe der Bestellnummer {order.orderNumber} auf die unten stehende Bankverbindung. Die Bestellung wird nach Zahlungseingang bearbeitet (in der Regel innerhalb von 1–2 Werktagen).
-
-
)}
+ {/* Sibling of `summary`, not nested inside it — `summary`'s own
+ `alignItems: "flex-end"` is meant for the narrow paid-badge
+ case, not this full-width, multi-sentence instruction. */}
+ {!paid && (
+
+
+ Bitte überweisen Sie den Rechnungsbetrag unter Angabe der Bestellnummer {order.orderNumber} auf die unten stehende Bankverbindung. Die Bestellung wird nach Zahlungseingang bearbeitet (in der Regel innerhalb von 1–2 Werktagen).
+
+
+ )}