# POS — Checkout (redesign)

Redesign exploration of the payment screen. **In progress** — four interactive prototypes gathered
side by side to compare direction. Responsive (fills any width ≥ ~900px), each reuses the
`pos-checkout-navbar` component and the design-system tokens.

## Variants

| File | Direction | Highlights |
|---|---|---|
| `variants/a-spec.html` | **Baseline** | 1:1 from `Checkout-spec.md` — the current build, for reference. |
| `variants/b-progress.html` | **Progress** | Live payment progress bar; quick-amount chips (Exact·+10·+20·+50·Round); method list with per-method amounts (split); dynamic method paging to numpad height. |
| `variants/c-tiles.html` | **Tiles** | 3-metric hero (Total·Paid·Due→Change); methods as a 2-column icon **tile grid**; removable **split-tender chips**; Charge→Complete action. |
| `variants/d-minimal.html` | **Minimal** | Az-saz: airy whitespace, hairline dividers, **borderless numpad**, quiet method list with check, single primary action. |

## Shared prototype interactivity

- **Numpad** edits the active method's amount live; first keypress replaces a pre-filled value.
- **Split payment** — every method holds its own entered amount; totals roll up.
- **Remaining / Change** — computed live (over-tender shows change; fully-paid state).
- **Dynamic method pagination** — the method area equals the numpad height; the number of methods
  per page grows with available height (pulled from later pages), pager adapts.
- **Quick-amount** helpers (b, c): Exact / +n / Round to the remaining due.
- **Print receipt** + **Send to fiscal** toggles (default off); fiscal on → tax-register selector →
  **Tax register modal** (search · radio · apply).

## Status

`in-progress` — collecting feedback to choose one direction, then promote the winner to `accepted.html`.
