# Invoice #INV-2024-058

<Badge tone="warning">Payment pending</Badge>

<Card title="Summary">
<Columns>
<Stat label="Amount due" value="$2,450.00 USD" icon="currency-circle-dollar" note="Invoice total" />
<Stat label="Due date" value="March 28, 2025" icon="calendar" note="11 days left" />
<Stat label="Issue date" value="February 26, 2025" icon="receipt" note="INV-2024-058" />
</Columns>
</Card>

<Card title="Invoice breakdown">
| Description | Qty | Rate | Amount |
|---|---|---|---|
| Brand identity design | 1 | $1,500.00 | $1,500.00 |
| Website homepage layout | 1 | $800.00 | $800.00 |
| Logo usage guidelines | 1 | $150.00 | $150.00 |

<Columns>
<div>

**Subtotal:** $2,450.00
**No taxes applied.**

</div>
<div>

<Callout tone="info" title="Payment terms">Payment due within 14 days of the issue date. Late invoices may accrue a 1.5% monthly fee.</Callout>

</div>
</Columns>
</Card>

<Card title="Pay this invoice">
<Callout tone="success" title="Ready when you are">Paying by bank transfer or card. You'll receive a receipt by email instantly.</Callout>

<Columns>
<Button variant="primary" size="large" icon="credit-card">Pay $2,450.00 now</Button>
<Button variant="secondary" size="large" icon="bank">Pay by bank transfer</Button>
</Columns>

<Details title="Payment details">
**Bank transfer:** Nordea, Account 1234 56 78901, SWIFT: NDEAFIHH
**Reference:** INV-2024-058
</Details>
</Card>

<Card title="Questions?">
Contact the sender at <a href="mailto:billing@studioexample.com">billing@studioexample.com</a> or reply directly to the invoice email.
</Card>

<FollowUps>
- Can I get a payment plan?
- What happens if I miss the due date?
- Send me a PDF copy of this invoice
</FollowUps>