/* Shop-specific overrides — minimal additions only
   Imports: reuse global foundations and loyalty button/dashboard styles
*/
@import url("../../assets/css/style.css");
@import url("../../loyalty/css/buttons.css");
@import url("../../loyalty/dashboard/css/dashboard.css");

/* Small overrides and utility classes for the shop module */
:root {
  /* Do not define new color vars; use existing palette from global CSS */
}

.shop-container { background: linear-gradient(#0d0d0d, #111); }
.shop-sidebar { background: transparent; }
.shop-main { color: #fff; }

.product-card { transition: transform 300ms ease, box-shadow 300ms ease; }
product-card { transition: transform 300ms ease, box-shadow 300ms ease; }

.hover-glow { /* rely on loyalty's glow classes; small fallback */ }
.product-card:hover { transform: none !important; box-shadow: none !important; }

.badge { background: #9BE2F2; color: #031216; padding: 2px 8px; border-radius: 999px; font-weight:600; }

.empty-panel { background: rgba(255,255,255,0.02); border: 1px solid rgba(255,255,255,0.04); }

/* Responsive product grid */
#products.grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 1024px) {
  #products.grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  #products.grid { grid-template-columns: repeat(1, minmax(0, 1fr)); }
  .shop-sidebar { display: none; }
}

/* List view adjustments */
.list-view .product-card { display: flex; gap: 1rem; align-items: center; }
.list-view .product-card img { width: 160px; height: auto; }
