# PartyContract
Hợp đồng đặt tiệc: khách đặt, số ly, cọc, tiền trả khi giao, thưởng và hai nút Ký / Bỏ qua.

## Khi nào dùng
- Đầu ngày khi có khách đặt tiệc (8–45 ly): cọc 35% nhận ngay, 65% trả khi giao, thưởng 25% khi giao đủ.
- Sau khi ký, thẻ đổi sang trạng thái đã ký để nhắc chỉ tiêu trong ca.

## Biến thể
| Biến thể | Lớp | Dùng khi |
|---|---|---|
| Chờ ký | `tt-party-contract` | Viền và nền pha `gold`, có tiêu đề, 3 ô tiền, nút Ký / Bỏ qua |
| Đã ký | `tt-party-contract is-accepted` | Viền và nền pha `mint`, thay nút bằng dòng "Đã ký hợp đồng" và mẹo |

## Cấu trúc
```html
<article class="tt-party-contract" aria-labelledby="pc1">
  <div class="tt-party-contract__header">
    <span class="tt-badge tt-badge--accent">🎉 Tiệc công ty</span>
    <span class="tt-party-contract__deadline">⏰ Giao trong ca hôm nay</span>
  </div>
  <h3 class="tt-party-contract__title" id="pc1">Tiệc trà chiều cuối tuần</h3>
  <div class="tt-party-contract__client">👤 Đại diện đặt: <b>Chị Thảo</b> · Số lượng: <span class="tt-party-contract__cups">20 ly trà</span></div>
  <div class="tt-party-contract__finance">
    <div class="tt-party-contract__box tt-party-contract__box--deposit">
      <span class="tt-party-contract__box-label">Cọc 35% nhận ngay</span>
      <span class="tt-party-contract__box-value">+200k</span></div>
    <!-- --payout (65% trả khi giao), --bonus (thưởng 25%) -->
  </div>
  <p class="tt-party-contract__desc">...</p>
  <div class="tt-party-contract__actions"><!-- lưới 2fr 1fr, không ghi đè nút -->
    <button type="button" class="tt-button tt-button--primary" data-action="accept">✍️ Ký hợp đồng (+200k)</button>
    <button type="button" class="tt-button tt-button--small tt-button--ghost" data-action="reject">Bỏ qua</button>
  </div>
</article>
```
Huy hiệu loại tiệc dùng `tt-badge--accent` (chờ ký) hoặc `tt-badge--count` (đã ký). Với tổng tiền 500k (20 ly): cọc 200k, trả khi giao 360k, thưởng 140k.

## Trạng thái
| Trạng thái | Hiệu ứng |
|---|---|
| Chờ ký | Nền `gold` 16%, viền `gold` |
| `is-accepted` | Nền `mint` 12%, viền `mint`, huy hiệu đổi sang `tt-badge--count`, vạch trên 3 ô tiền `mint` |

## Hành vi JS
`TTMU.businessCards(root, { onAction })`: "accept" và "reject" gọi `onAction(action, nút, thẻ)`.

## Token sử dụng
`gold`, `mint`, `link`, `panel`, `line`, `ink`, `soft`, `radius-10/16`, `space-4/6/8/12/14`.

## Khả năng tiếp cận
- `article` gắn `aria-labelledby` tới tiêu đề; số ly và 3 khoản tiền đều bằng chữ.
- Ba ô tiền khác nhau bằng nhãn chữ, vạch màu phía trên chỉ là trang trí.
- Huy hiệu dùng `tt-badge` nên chữ đạt tương phản như Badge.

## Nên / Không nên
| Nên | Không nên |
|---|---|
| Ghi rõ phần trăm trong nhãn ô tiền (35% / 65% / 25%) | Chỉ ghi "Cọc" mà không nói tỉ lệ |
| Một nút chính cho "Ký hợp đồng" | Đặt hai nút chính cạnh nhau |

## Nguồn
`.party-contract-card`, `.party-contract-card.accepted`, `.party-header`, `.party-badge`, `.party-status`, `.party-deadline`, `.party-title`, `.party-client`, `.party-finance`, `.p-fin-box`, `.party-desc`, `.party-tip`, `.party-actions`, `.party-accept-btn`, `.party-reject-btn` — css/style.css; markup `partyContractCard` trong js/game.js.
- Gradient vàng, `!important` và hiệu ứng `partyCardGlow` của game bỏ; nút Ký dùng `tt-button--primary` và huy hiệu dùng `tt-badge` của hệ thống.