.page{padding:16px 0}
@media(min-width:992px){.page{padding:30px 0}}

.mobile-filter-btn{display:none}
@media(max-width:991px){
  .mobile-filter-btn{
    position:fixed;bottom:16px;left:50%;transform:translateX(-50%);
    z-index:1000;background:#111;color:#fff;width:90%;
    padding:14px;border-radius:14px;text-align:center;
    font-weight:700;box-shadow:0 8px 24px rgba(0,0,0,.35);
  }
}

.mobile-filter-popup{
  position:fixed;left:0;right:0;bottom:-100%;
  height:85%;background:#fff;z-index:2000;
  border-radius:18px 18px 0 0;
  padding:20px;transition:.35s;overflow-y:auto;
}
.mobile-filter-popup.active{bottom:0}

.close-filter{
  text-align:center;font-weight:700;padding:10px;
  background:#f4f4f4;border-radius:10px;
  margin-bottom:12px;cursor:pointer;
}

.layout{display:flex;gap:24px}
.sidebar{
  width:260px;background:#fff;padding:18px;
  border-radius:14px;border:1px solid #eee;
  height:fit-content;
}
@media(max-width:991px){.sidebar{display:none}}

.product-grid{flex:1}
.product-card{
  background:#fff;border-radius:16px;border:1px solid #eee;
  overflow:hidden;transition:.2s;position:relative;
}
.product-card:hover{
  transform:translateY(-4px);
  box-shadow:0 10px 24px rgba(0,0,0,.12);
}

.fav-btn{
  position:absolute;
  top:8px;
  right:8px;
  font-size:24px;
  cursor:pointer;
  z-index:20;
  transition:.2s;
}
.fav-btn:hover{transform:scale(1.15)}

.badge-box{
  position:absolute;top:10px;left:10px;
  display:flex;flex-direction:column;gap:6px;z-index:5;
}
.badge{font-size:11px;font-weight:800;padding:6px 12px;border-radius:999px;color:#fff}
.badge-campaign{background:#ff9800;color:#111}
.badge-out{background:#b91c1c}
.badge-low{background:#f59e0b;color:#111}

.product-image{width:100%;aspect-ratio:1/1;background:#f5f5f5}
.product-image img{width:100%;height:100%;object-fit:cover}

.product-body{padding:12px}
.product-brand{font-size:12px;color:#888}
.product-title{font-size:14px;font-weight:700;margin:4px 0 6px}
.price-box{display:flex;align-items:center;gap:8px}
.old-price{font-size:12px;color:#999;text-decoration:line-through}
.new-price{font-size:17px;font-weight:800;color:#dc2626}

.product-btn{
  display:block;margin-top:10px;background:#111;color:#fff;
  text-align:center;padding:10px;border-radius:10px;font-weight:700;font-size:14px;
}
.product-btn.disabled{background:#bbb;pointer-events:none}

