fix(storefront): premium UX polish for cart, checkout

- cart.component.scss: normalize hardcoded hex colors to design tokens
  (--text-primary, --text-secondary, --bg-primary/--bg-secondary/
  --bg-tertiary, --border-color, --error-color, --success-color,
  --warning-color, --shadow-*, --transition-*, --radius-* fallbacks)
  across cart items, quantity controls, summary, login gate, terms
  checkbox, payment modal, payment-active QR screen, and bank-payment
  iframe modal
- cart.component.scss: deduplicate an accidental duplicate
  .close-modal-btn rule block (identical CSS repeated twice)
- cart.component.scss: add focus-visible rings to clear-cart, remove,
  quantity, checkout, close-modal, retry-payment, copy/open-link,
  telegram-login, and card-payment buttons
- cart.component.scss: delivery-required warning now pairs an icon
  with the text instead of relying on color/background alone
- cart.component.html: add warning icon + role="alert" to the
  delivery-required notice; add aria-live/aria-label to the quantity
  value so screen readers announce quantity changes
- delivery-selector.component.scss: normalize hardcoded hex colors to
  design tokens; remove dead :host-context(.cart-container.alt) rules
  left over after the .alt theme was removed from cart.component in
  RC-Visual-02 (cart-container never carries an .alt class anymore);
  add hover/focus-visible states to the delivery <select>

Build verified green via `npm run build`.

Out of scope / skipped:
- Did not restructure the payment modal or bank-payment iframe overlay
  into shared app-dialog - it has custom multi-step state (creating/
  waiting/success/error/timeout) and an already-implemented manual
  focus-trap; restructuring it is a composition change, not visual
  polish
- Did not convert clearCart()'s native confirm() to a custom
  confirm-remove dialog - no existing storefront confirm-dialog
  pattern to follow, and adding one is a composition/architecture
  change
- spinner-large/spinner-small left untouched per RC-Visual-02 guidance
  (in-progress action state, not content loading)
- .email-form block (email/phone capture after payment success) is
  dead CSS behind commented-out markup; left in place rather than
  deleting, since removing it is a code-cleanup call, not visual
  polish
- region-selector/language-selector are header-only, not part of the
  cart/checkout flow - left untouched
- no dedicated checkout page exists; checkout is the payment section
  of the cart page, covered above

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

src/app/components/delivery-selector/delivery-selector.component.scss

@@ -6,8 +6,8 @@
   margin-top: 12px;
   padding: 12px;
   border-radius: var(--radius-md, 12px);
-  border: 1px solid #d3dad9;
-  background: #fafbfb;
+  border: 1px solid var(--border-color);
+  background: var(--bg-secondary);
 }
 
 .delivery-label {
@@ -15,23 +15,28 @@
   margin-bottom: 8px;
   font-size: var(--font-size-sm, 0.8125rem);
   font-weight: var(--font-weight-bold, 700);
-  color: #3f5f5c;
+  color: var(--text-primary);
 }
 
 .delivery-control select {
   width: 100%;
   padding: 10px 12px;
-  border-radius: 10px;
-  border: 1px solid #c9d5d3;
-  background: #fff;
-  color: #1f2937;
+  border-radius: var(--radius-sm, 10px);
+  border: 1px solid var(--border-color);
+  background: var(--bg-primary);
+  color: var(--text-primary);
   font-size: var(--font-size-base, 0.875rem);
   line-height: 1.4;
+  transition: border-color var(--transition-normal), box-shadow var(--transition-normal);
+
+  &:hover {
+    border-color: var(--primary-color);
+  }
 }
 
-.delivery-control select:focus {
+.delivery-control select:focus-visible {
   outline: none;
-  border-color: #497671;
+  border-color: var(--primary-color);
   box-shadow: 0 0 0 3px rgba(73, 118, 113, 0.12);
 }
 
@@ -39,8 +44,8 @@
   display: grid;
   gap: 4px;
   margin-top: 10px;
-  font-size: 0.82rem;
-  color: #697777;
+  font-size: var(--font-size-sm, 0.8125rem);
+  color: var(--text-secondary);
   line-height: 1.45;
 }
 
@@ -58,25 +63,3 @@
   background: rgba(37, 99, 235, 0.12);
 }
 
-:host-context(.cart-container.alt) .delivery-selector {
-  border-color: #d1fae5;
-  background: #f9fffc;
-}
-
-:host-context(.cart-container.alt) .delivery-label {
-  color: #047857;
-}
-
-:host-context(.cart-container.alt) .delivery-control select {
-  border-color: #bbf7d0;
-}
-
-:host-context(.cart-container.alt) .delivery-control select:focus {
-  border-color: #10b981;
-  box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.12);
-}
-
-:host-context(.cart-container.alt) .delivery-meta {
-  color: #4b5563;
-}
-