<script>
const wrapper = document.querySelector(".sigmaweb-search-input-t1 .e-search-input-wrapper");
const input = wrapper.querySelector("input");

// ساختن div متحرک (مثل placeholder)
const customDiv = document.createElement("div");
customDiv.className = "sigmaweb-category-box-t1";

const ul = document.createElement("ul");
const items = ["در فروشگاه", "محصولات", "موبایل، تبلت، لپ تاپ"];

items.forEach((text) => {
  const li = document.createElement("li");
  li.textContent = text;

  // وقتی روی li کلیک شد، فوکوس روی input بره
  li.addEventListener("click", () => input.focus());

  ul.appendChild(li);
});

customDiv.appendChild(ul);
wrapper.appendChild(customDiv);

// مخفی کردن li هنگام تایپ یا فوکوس
const toggleList = () => {
  if (input === document.activeElement) {
    // اگر input فوکوس شده باشه
    customDiv.style.display = "none";
  } else {
    customDiv.style.display = input.value.trim() === "" ? "block" : "none";
  }
};

input.addEventListener("input", toggleList);
input.addEventListener("focus", toggleList); // هنگام فوکوس
input.addEventListener("blur", toggleList); // وقتی فوکوس رفت
toggleList(); // حالت اولیه

</script>