주문 요약

74. 프로모션/쿠폰 코드 UI Design a promo code input system: **Input Location**: - Cart/checkout summary section - Collapsible: "Have a promo code?" - Expands to show input **Input Design**: - Text input + Apply button - Button: inline right or below - Placeholder: "Enter code" - Loading state on apply **Success State**: - Green check icon - Code displayed: "SAVE20 applied" - Discount amount shown - Remove link **Error States**: - Invalid code: red text below - Expired code message - Minimum not met: "Spend $X more" - Already applied message **Discount Display** (in summary): - Line item: "Discount (SAVE20)" - Amount: -$20.00 in green - Before total **Multiple Codes** (if allowed): - List of applied codes - Each removable - Input for additional **Auto-Apply**: - URL parameter support: ?promo=SAVE20 - Auto-apply on page load - Show success message **Code Suggestions** (logged in): - "Available codes" dropdown - Show user's available promos - Click to apply **Visual Feedback**: - Spinner during validation - Success animation - Total updates smoothly **Gift Card vs Promo**: - Separate inputs if different - Gift card: shows remaining balance - Can combine: gift card + promo **Mobile Considerations**: - Full-width input - Clear tap targets - Keyboard dismiss on apply Tech: React + React Hook Form + Tailwind