:root{
  --app-bg:#f1f5f9;
  --header-bg:#403D3D;
  --footer-bg:#403D3D;

  /* CHANGE ICON COLORS FROM HERE */
  --icon-color:#403D3D;
  --wishlist-color:#ef4444;
  --cart-color:#2563eb;
}


body { 
  font-family: Inter, sans-serif; 
  background: var(--app-bg);
}

.header-bg{ background: var(--header-bg); }
.footer-bg{ background: var(--footer-bg); }

.glass {
  background: rgba(255,255,255,0.8);
  backdrop-filter: blur(16px);
}

.scroll-x {
  display: flex;
  gap: 12px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
}

.scroll-x::-webkit-scrollbar { display: none; }
.snap { scroll-snap-align: start; }

/* ✅ SAME HEIGHT EVERYWHERE */
.product-img{
  width:100%;
  aspect-ratio:1/1; /* perfect square */
  height:auto;
  object-fit:cover;
  border-radius:10px;
  display:block;
}

.product-img1{
  width:100%;
  aspect-ratio:1/1; /* perfect square for best sellers */
  height:auto;
  object-fit:cover;
  border-radius:10px;
  display:block;
}

.product-card{
  position:relative;
}

/* Wishlist button */
.wishlist-btn{
  position:absolute;
  top:10px;
  right:10px;
  width:28px;  /* smaller background */
  height:28px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:white;
  border-radius:50%;
  box-shadow:0 3px 8px rgba(0,0,0,.15);
  cursor:pointer;
  z-index:10;
}

.wishlist-btn i{
  font-size:12px; /* smaller heart */
}



/* ICON COLORS */
.icon{
  color:var(--icon-color);
  font-size:15px;
  color:lab(97.03% 0.67 0.22);
  transition:.2s;
}


.wishlist{
  color:var(--wishlist-color);
  font-size:18px;
  padding:6px;
  border-radius:8px;
  background:rgba(239,68,68,.1);
  transition:.2s;
}


.cart{
  color:var(--cart-color);
  font-size:18px;
  padding:6px;
  border-radius:8px;
  background:rgba(37,99,235,.1); /* highlight */
  transition:.2s;
}



.price-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
}

.hero{
  background: white;
}

.vendor-img {
      width: 100px;
      border-radius: 10px;
      object-fit: cover;
      margin: 12px auto;
      display: block;
    }

    .stars {
      text-align:center;
      margin-top:6px;
      font-size:16px;
      letter-spacing:2px;
    }
    .star { color:#fbbf24; }
    .star.empty { color:#e5e7eb; }