.cart-page { padding: var(--space-8) 0 var(--space-16); }
.cart-page h1 { font-size: var(--font-size-3xl); margin-bottom: var(--space-8); }
.cart-layout { display: grid; grid-template-columns: 1fr 360px; gap: var(--space-8); align-items: start; }
.cart-items-list { display: flex; flex-direction: column; gap: var(--space-4); }

.cart-item {
  background: var(--color-surface); border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm); padding: var(--space-4);
  display: grid; grid-template-columns: 80px 1fr auto; gap: var(--space-4); align-items: center;
}
.cart-item-img { width: 80px; height: 80px; object-fit: cover; border-radius: var(--radius-md); }
.cart-item-name { font-weight: 600; font-size: var(--font-size-base); margin-bottom: var(--space-1); }
.cart-item-unit { font-size: var(--font-size-xs); color: var(--color-text-muted); }
.cart-item-pricing { margin-top: var(--space-2); }
.cart-item-member-price { font-weight: 700; color: var(--color-secondary); }
.cart-item-regular-price { font-size: var(--font-size-xs); color: var(--color-text-muted); text-decoration: line-through; }
.cart-item-savings { font-size: var(--font-size-xs); color: var(--color-savings); font-weight: 600; margin-top: 2px; }
.cart-item-controls { display: flex; flex-direction: column; align-items: flex-end; gap: var(--space-3); }
.qty-control { display: flex; align-items: center; gap: var(--space-2); }
.qty-btn {
  width: 28px; height: 28px; border-radius: var(--radius-full);
  border: 2px solid var(--color-border); display: flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: var(--font-size-lg); color: var(--color-text);
  transition: all var(--transition-fast); cursor: pointer;
}
.qty-btn:hover { border-color: var(--color-primary); color: var(--color-primary); }
.qty-value { font-weight: 700; min-width: 24px; text-align: center; }
.remove-btn { font-size: var(--font-size-xs); color: var(--color-error); cursor: pointer; }
.remove-btn:hover { text-decoration: underline; }

/* Summary */
.order-summary {
  background: var(--color-surface); border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md); padding: var(--space-6);
  position: sticky; top: calc(var(--header-height) + var(--subnav-height) + var(--space-4));
}
.order-summary h2 { font-size: var(--font-size-xl); margin-bottom: var(--space-6); }
.summary-row { display: flex; justify-content: space-between; align-items: center; padding: var(--space-3) 0; border-bottom: 1px solid var(--color-border); font-size: var(--font-size-sm); }
.summary-row:last-of-type { border-bottom: none; }
.summary-row.savings { color: var(--color-savings); font-weight: 600; }
.summary-row.free-ship { color: var(--color-success); }
.summary-total { display: flex; justify-content: space-between; align-items: center; font-size: var(--font-size-xl); font-weight: 700; padding-top: var(--space-4); border-top: 2px solid var(--color-border); margin-top: var(--space-2); }
.summary-savings-callout {
  background: var(--color-savings-light); border-radius: var(--radius-md);
  padding: var(--space-3) var(--space-4); margin: var(--space-4) 0;
  font-size: var(--font-size-sm); color: var(--color-savings); font-weight: 600; text-align: center;
}
.checkout-btn { width: 100%; margin-top: var(--space-5); }
.free-ship-progress { margin-top: var(--space-4); font-size: var(--font-size-xs); color: var(--color-text-muted); }
.free-ship-bar { height: 4px; background: var(--color-border); border-radius: 2px; margin-top: var(--space-1); overflow: hidden; }
.free-ship-bar-fill { height: 100%; background: var(--color-success); border-radius: 2px; transition: width var(--transition-slow); }

/* Order confirmation */
.order-confirmation {
  text-align: center; padding: var(--space-16); background: var(--color-surface);
  border-radius: var(--radius-xl); box-shadow: var(--shadow-md);
}
.order-confirmation-icon { font-size: 4rem; margin-bottom: var(--space-4); }
.order-confirmation h2 { font-size: var(--font-size-2xl); margin-bottom: var(--space-2); }
.order-id { font-family: monospace; background: var(--color-bg); padding: var(--space-2) var(--space-4); border-radius: var(--radius-sm); font-size: var(--font-size-sm); margin: var(--space-4) 0; }
.order-savings { color: var(--color-savings); font-weight: 700; font-size: var(--font-size-lg); }

@media (max-width: 900px) {
  .cart-layout { grid-template-columns: 1fr; }
  .order-summary { position: static; }
}
@media (max-width: 480px) {
  .cart-item { grid-template-columns: 64px 1fr; }
  .cart-item-controls { grid-column: 1 / -1; flex-direction: row; justify-content: space-between; }
}