/* ซ่อน children เริ่มต้น และตกแต่งปุ่ม/ไอคอนกางพับ */
ul.product-categories.cs-collapsible-ready,
ul.product-categories {
  list-style: none;
  margin: 0;
  padding-left: 0;
}

/* จัดระยะของรายการ */
ul.product-categories.cs-collapsible-ready li {
  position: relative;
  padding-left: 1.6em;
}

/* ปุ่ม toggle ด้านหน้า (เป็นปุ่มกด, ไม่ใช่ลิงก์) */
.cs-cat-toggle {
  position: absolute;
  left: 0;
  top: 0.2em;
  width: 1.2em;
  height: 1.2em;
  border: 1px solid currentColor;
  border-radius: .2em;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  font-size: 0.8em;
  user-select: none;
}

/* ไอคอนเครื่องหมาย + หรือ – (ผ่าน data-state) */
.cs-cat-toggle::before {
  content: attr(data-icon);
}

/* เริ่มต้น children ซ่อนไว้ */
ul.product-categories.cs-collapsible-ready li.cat-parent > ul.children {
  display: none;
  margin-top: .4em;
  margin-bottom: .4em;
  padding-left: 0.8em;
  border-left: 1px dashed rgba(0,0,0,.2);
}

/* เมื่อขยาย (JS จะใส่ class .cs-expanded ที่ li ) */
ul.product-categories.cs-collapsible-ready li.cs-expanded > ul.children {
  display: block;
}

/* เน้นหมวดปัจจุบันเล็กน้อย */
ul.product-categories.cs-collapsible-ready li.current-cat > a,
ul.product-categories.cs-collapsible-ready li.current-cat-parent > a,
ul.product-categories.cs-collapsible-ready li.current-cat-ancestor > a {
  font-weight: 600;
}

/* ระยะห่างลิงก์กับปุ่ม */
ul.product-categories.cs-collapsible-ready li > a {
  display: inline-block;
}

/* ปรับระยะกรณีธีมมีไอคอนอื่นอยู่แล้ว */
ul.product-categories.cs-collapsible-ready li.cat-parent > a {
  margin-left: .2em;
}