/* HIMTECH kategori sayfası sol kategori menüsü pro/kompakt görünüm */

.shop-layout{
  grid-template-columns:230px 1fr !important;
  gap:22px !important;
  align-items:start !important;
}

.filter{
  background:#fff !important;
  border:1px solid #e6edf5 !important;
  border-radius:18px !important;
  padding:12px !important;
  box-shadow:0 12px 34px rgba(7,17,31,.07) !important;
  position:sticky !important;
  top:118px !important;
  max-height:calc(100vh - 140px) !important;
  overflow:auto !important;
}

.filter::-webkit-scrollbar{
  width:5px;
}

.filter::-webkit-scrollbar-thumb{
  background:#d8e1ee;
  border-radius:999px;
}

.filter h3{
  margin:2px 4px 10px !important;
  font-size:15px !important;
  line-height:1 !important;
  color:#07111f !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
}

.filter h3:after{
  content:"";
  width:26px;
  height:3px;
  border-radius:99px;
  background:#e31b2f;
  display:block;
}

.filter a{
  display:grid !important;
  grid-template-columns:1fr auto !important;
  align-items:center !important;
  gap:8px !important;
  padding:9px 10px !important;
  margin:2px 0 !important;
  border-radius:12px !important;
  background:transparent !important;
  border:1px solid transparent !important;
  color:#1f2a3d !important;
  font-weight:850 !important;
  line-height:1.18 !important;
  transition:.16s ease !important;
}

.filter a:hover{
  background:#f4f7fb !important;
  border-color:#edf2f7 !important;
  transform:translateX(2px);
}

.filter a.active{
  background:linear-gradient(135deg,#fff1f3,#f8fafc) !important;
  border-color:#ffd4dc !important;
  color:#e31b2f !important;
  box-shadow:inset 4px 0 0 #e31b2f !important;
}

.filter a span{
  font-size:14px !important;
  line-height:1.18 !important;
}

.filter a small{
  min-width:26px !important;
  height:22px !important;
  padding:0 7px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  border-radius:999px !important;
  background:#eef3f8 !important;
  color:#07111f !important;
  font-size:11px !important;
  font-weight:950 !important;
  margin:0 !important;
}

.filter a.active small{
  background:#e31b2f !important;
  color:#fff !important;
}

/* Alttaki yardım kutusu sidebarı gereksiz büyütmesin */
.filter .help-box{
  margin-top:12px !important;
  padding:12px !important;
  border-radius:14px !important;
  background:linear-gradient(135deg,#07111f,#0b1c33) !important;
  color:#fff !important;
}

.filter .help-box b{
  font-size:13px !important;
  display:block !important;
  margin-bottom:5px !important;
}

.filter .help-box p{
  font-size:12px !important;
  line-height:1.35 !important;
  margin:0 0 9px !important;
  color:#cbd5e1 !important;
}

.filter .help-box .btn{
  width:100% !important;
  min-height:34px !important;
  padding:8px 10px !important;
  border-radius:10px !important;
  font-size:12px !important;
}

/* Ürün alanı daha geniş ve düzenli dursun */
.shop-main{
  min-width:0 !important;
}

.toolbar{
  border-radius:17px !important;
  padding:12px 14px !important;
}

.toolbar b{
  font-size:18px !important;
}

/* Mobilde kategori menüsü yatay kaydırmalı kompakt hale gelsin */
@media(max-width:1100px){
  .shop-layout{
    grid-template-columns:1fr !important;
  }

  .filter{
    position:static !important;
    max-height:none !important;
    overflow:visible !important;
  }

  .filter{
    display:block !important;
  }

  .filter h3{
    margin-bottom:8px !important;
  }
}

@media(max-width:760px){
  .filter{
    padding:10px !important;
    border-radius:16px !important;
  }

  .filter a{
    padding:8px 9px !important;
  }

  .filter a span{
    font-size:13px !important;
  }

  .filter .help-box{
    display:none !important;
  }
}

/* Sol kategori destek kutusu WhatsApp butonu yeşil */
.filter .help-box .btn,
.filter .help-box .btn.primary,
.filter .help-box a.btn,
.filter .help-box a[href*="wa.me"]{
  background:linear-gradient(135deg,#16a34a,#0f8a3a) !important;
  color:#ffffff !important;
  border:0 !important;
  box-shadow:0 12px 26px rgba(22,163,74,.28) !important;
  opacity:1 !important;
}

.filter .help-box .btn:hover,
.filter .help-box .btn.primary:hover,
.filter .help-box a.btn:hover,
.filter .help-box a[href*="wa.me"]:hover{
  background:linear-gradient(135deg,#18b653,#0d7f35) !important;
  transform:translateY(-1px);
}