/* Product grid */
.grid{
  display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr));
  gap:16px; padding-bottom:24px;
}
.card{
  background:#fff; border:1px solid #eee; border-radius:var(--radius); box-shadow:var(--shadow);
  padding:12px;
}
.card h3{ font-size:16px; margin:8px 0 6px }
.card .price{ font-weight:700 }

/* Add button row over the thumb */
.card .actions{ display:flex; align-items:center; margin-bottom:8px }
.card .btn{ padding:6px 10px; border-radius:8px; border:none; background:var(--brand); color:var(--brand-ink) }

/* Tooltips used on grid cards */
.card-tooltip{
  position:absolute; z-index:5; background:#111; color:#fff; padding:8px 10px; border-radius:8px; box-shadow:var(--shadow);
  transform:translateY(6px); display:none; max-width:260px;
}
.card-tooltip.show{ display:block }

/* Cart page */
.cart-title{ margin:12px 0 16px }
.cart-items-container{ display:grid; gap:12px }
.cart-item{
  display:grid; grid-template-columns:var(--thumb-size) 1fr auto;
  gap:12px; align-items:center; background:#fff; border:1px solid #eee; border-radius:var(--radius); padding:10px;
}
.cart-meta{ color:var(--muted); font-size:14px; display:flex; gap:8px; align-items:center }
.cart-ctrls{ display:flex; align-items:center; gap:8px }
.qty-controls-group{ display:inline-flex; align-items:center; gap:4px }
.qty-input-field{ width:52px; text-align:center; padding:6px 8px; border:1px solid #ddd; border-radius:8px }

.cart-summary{
  display:flex; align-items:center; justify-content:space-between; padding:12px 0 28px; border-top:1px dashed #e5e7eb; margin-top:16px;
}