<Card title="Package tracking" subtitle="Order #1042 · Delivered by SwiftPost">
<Badge tone="info">In transit</Badge>
</Card>

<Card title="Current location">
<Map title="Package route" route="true">
| Stop | Lat | Lng | Note |
|---|---|---|---|
| Fulfillment center | 40.7128 | -74.0060 | Picked up |
| Regional hub | 41.8781 | -87.6298 | Scanned |
| Local depot | 34.0522 | -118.2437 | Out for delivery |
</Map>
</Card>

<Card title="Delivery estimate">
<Columns>
<Stat label="Estimated delivery" value="Fri, Jun 14" icon="calendar" />
<Stat label="Delivered by" value="8:00 PM" icon="clock" />
<Stat label="Distance left" value="12.4 km" icon="map-pin" />
</Columns>
<Progress value="72" max="100" label="Route progress" tone="info" />
</Card>

<Card title="Report a problem">
<Callout tone="warning" title="Need help?">
If your package is late, damaged, or missing, let us know and we'll fix it.
</Callout>
<Form name="report-problem">
<Select label="What's wrong?" placeholder="Choose an issue" options="Delayed delivery | Package damaged | Wrong item | Package missing | Other" required="true" />
<TextArea label="Describe the problem" placeholder="Tell us what happened…" rows="3" hint="Include photos if you can" />
<File label="Add photos" accept="image/*" multiple="true" hint="Optional" />
<Button>Submit report</Button>
</Form>
</Card>

<Card title="Delivery details">
<KeyValue>
| Label | Value |
|---|---|
| Order number | #1042 |
| Tracking number | SWP-8823-114 |
| Shipped from | New York, NY |
| Current location | Los Angeles, CA |
| Weight | 2.3 kg |
| Signature required | No |
</KeyValue>
</Card>

<FollowUps>
- What should I do if the package is late?
- Can I change the delivery address?
- Where is the nearest pickup point?
- How do I contact the courier?
</FollowUps>