/* Add custom Js styles below */ 
document.addEventListener("DOMContentLoaded", () => {
  const container = document.querySelector(
    ".s-block--features.container .grid"
  );

  if (!container) return;

  // Prevent duplicates
  const existingItems = container.querySelectorAll(".s-block--features__item");
  if (existingItems.length >= 5) return; // stop if already 5 or more

  // Define new items
  const newFeatures = [
    {
      icon: "sicon-gift",
      title: "حماية تامة من التسريب و الإلتهابات",
      desc: "جفاف يدوم 12 ساعة وراحة تحبينها من اول إستخدام",
    },
    {
      icon: "sicon-star",
      title: "وسائل دفع أمنة و سهلة",
      desc: "اختاري الطريقة اللي تريحك كلها متوفرة",
    },
  ];

  // Add them
  newFeatures.forEach((feature) => {
    const div = document.createElement("div");
    div.className = "s-block--features__item";
    div.innerHTML = `
      <div class="feature-icon">
        <i class="${feature.icon}"></i>
      </div>
      <h2>${feature.title}</h2>
      <p>${feature.desc}</p>
    `;
    container.appendChild(div);
  });

  // Optional: force 5 items per row
  container.style.gridTemplateColumns = "repeat(5, minmax(0, 1fr))";
});
document.addEventListener("DOMContentLoaded", function() {
  const iconMap = {
    "sicon-store2": "https://i.postimg.cc/52nGSfwG/icon1.png",
    "sicon-shipping-fast": "https://i.postimg.cc/6pYSfBdP/icon2.png",
    "sicon-fire": "https://i.postimg.cc/P52cQdmF/icon3.png",
    "sicon-gift": "https://i.postimg.cc/0yc309pX/icon4.png",
    "sicon-star": "https://i.postimg.cc/FHDqVhjB/icon5.png"
  };

  // Loop through all <i> tags inside .feature-icon
  document.querySelectorAll('.feature-icon i').forEach(icon => {
    const className = Array.from(icon.classList).find(c => c.startsWith('sicon-'));
    const imageUrl = iconMap[className];

    if (imageUrl) {
      const img = document.createElement('img');
      img.src = imageUrl;
      img.alt = className;
      img.style.width = '70px'; 
      img.style.height = '70px';
      img.style.objectFit = 'contain';
      icon.replaceWith(img);
    }
  });
});
function fixContacts() {
  const contactList = document.querySelector(".s-contacts-list");
  if (contactList) {
    contactList.classList.remove("s-contacts-list-vertical");
    contactList.classList.add("s-contacts-list-horizontal");
    document.querySelectorAll(".s-contacts-item .unicode").forEach(el => {
      el.style.display = "none";
    });
    return true; // done
  }
  return false; // not found yet
}

document.addEventListener("DOMContentLoaded", () => {
  // Run immediately
  if (!fixContacts()) {
    // Retry every 500ms until the element appears
    const interval = setInterval(() => {
      if (fixContacts()) clearInterval(interval);
    }, 500);
  }
});
document.addEventListener("DOMContentLoaded", () => {
  // Select the grid container in the footer
  const footerGrid = document.querySelector(".store-footer__inner .grid");
  
  // Check if it exists
  if (footerGrid) {
    // Create a new div for the logo
    const logoDiv = document.createElement("div");
    logoDiv.className = "footer-logo";
    logoDiv.innerHTML = `
      <a href="/" class="footer-logo-link">
        <img src="https://i.postimg.cc/1zvDj9Pp/10.png" alt="Rony Baby Logo" class="footer-logo-img">
      </a>
    `;
    
    // Insert it at the beginning of the footer grid
    footerGrid.prepend(logoDiv);
  }
});
document.addEventListener("DOMContentLoaded", function() {
  const oldHref = "tel:+966504797660";
  const newHref = "https://www.instagram.com/ronybaby_sa/?igsh=aGF3a3Zoc2NpNzlj";

  // Use a small delay to ensure dynamic content (like Salla's components) is loaded
  setTimeout(() => {
    document.querySelectorAll(`a[href="${oldHref}"]`).forEach(link => {
      link.setAttribute("href", newHref);
      console.log("Link updated:", link);
    });
  }, 1000); // wait 1 second after load
});
document.addEventListener("DOMContentLoaded", function() {
  const oldHref = "mailto:mtager-s@hotmail.com";
  const newHref = "https://www.snapchat.com/@ronybabystore?sender_web_id=139e9f07-7a63-4dca-8128-e707c8de8363&device_type=desktop&is_copy_url=true";

  // Use a small delay to ensure dynamic content (like Salla's components) is loaded
  setTimeout(() => {
    document.querySelectorAll(`a[href="${oldHref}"]`).forEach(link => {
      link.setAttribute("href", newHref);
      console.log("Link updated:", link);
    });
  }, 1000); // wait 1 second after load
});
document.addEventListener("DOMContentLoaded", function() {
  const oldHref = "tel:966504797660";
  const newHref = "https://www.tiktok.com/@r0nybaby?_t=ZS-901R7iGD3Vh&_r=1";

  // Use a small delay to ensure dynamic content (like Salla's components) is loaded
  setTimeout(() => {
    document.querySelectorAll(`a[href="${oldHref}"]`).forEach(link => {
      link.setAttribute("href", newHref);
      console.log("Link updated:", link);
    });
  }, 1000); // wait 1 second after load
});
document.addEventListener("DOMContentLoaded", function() {
  setTimeout(() => {
    const footerMenu = document.querySelector('.s-menu-footer-list');
    if (footerMenu && !footerMenu.querySelector('.custom-contact-section')) {

      const newContent = `
        <div class="custom-contact-section">
          <h4>اتصل بنا</h4>
          <div class="custom-contact-icons">
            <a href="tel:966504797660" class="phone" target="_blank" rel="noopener noreferrer"></a>
            <a href="mailto:mtager-s@hotmail.com" class="email" target="_blank" rel="noopener noreferrer"></a>
          </div>
        </div>
              `;

      footerMenu.insertAdjacentHTML('afterbegin', newContent);
      
    }
  }, 1500);
});
document.addEventListener("DOMContentLoaded", function() {
  setTimeout(() => {
    const targetSection = document.querySelector("#app > div.app-inner.flex.flex-col.min-h-full > section:nth-child(14)");
    if (targetSection && !targetSection.querySelector('.custom-blog-header')) {
      const headerHTML = `
        <div class="s-block__title custom-blog-header">
          <div class="right-side">
            <h2>المدونة</h2>
            <span>ليش حفاضة طفلي تسرب؟</span>
          </div>
        </div>
      `;
      const container = targetSection.querySelector('.container');
      if (container) {
        container.insertAdjacentHTML('beforebegin', headerHTML);
      }
    }
  }, 1500);
});
document.addEventListener("DOMContentLoaded", function() {
  setTimeout(() => {
    const iconClasses = [
      'sicon-packed-box',
      'sicon-fabric-swatch',
      'sicon-cake',
      'sicon-game-controller-alt',
      'sicon-barcode-scan',
      'sicon-inbox-full'
    ];

    const images = [
      "https://i.postimg.cc/W3tyKy1K/07.png",
      "https://i.postimg.cc/1t4dTd3c/06.png",
      "https://i.postimg.cc/cH6zjzLQ/05.png",
      "https://i.postimg.cc/V65hThkX/04.png",
      "https://i.postimg.cc/MTXL4LpV/03.png",
      "https://i.postimg.cc/wBwPwzgQ/02.png"
    ];

    iconClasses.forEach((cls, index) => {
      const icon = document.querySelector(`.${cls}`);
      if (icon && !icon.classList.contains('replaced-icon')) {
        const img = document.createElement('img');
        img.src = images[index];
        img.alt = `مقاس ${index + 1}`;
        img.style.width = "182px";
        img.style.height = "211px";
        img.style.display = "block";
        img.style.margin = "0 auto";

        icon.classList.add('replaced-icon');
        icon.replaceWith(img);
      }
    });
  }, 100);
});

document.addEventListener("DOMContentLoaded", function() {
  setTimeout(() => {
    const featuresSection = document.querySelector('.s-block.s-block--features.container');
    if (featuresSection && !featuresSection.querySelector('.s-block__title')) {
      const titleHTML = `
        <div class="s-block__title">
          <div class="right-side">
            <h2>ليش تختارين روني بيبي؟</h2>
          </div>
        </div>
      `;
      featuresSection.insertAdjacentHTML('afterbegin', titleHTML);
      
    }
  }, 100); 
});
document.addEventListener("DOMContentLoaded", function () {
  let isSetup = false;
  let burger;
  let originalSearchParent; // store original parent for restore

  function init() {
    const menu = document.querySelector("#mobile-menu");
    if (!menu) return setTimeout(init, 100); // wait for Salla DOM
    handleMode(menu);
    window.addEventListener("resize", () => handleMode(menu));
  }

  function handleMode(menu) {
    const isDesktop = window.innerWidth >= 1024;

    if (isDesktop && !isSetup) {
      setupDesktop(menu);
      isSetup = true;
    } else if (!isDesktop && isSetup) {
      restoreMobile(menu);
      isSetup = false;
    }
  }

  function setupDesktop(menu) {
    // hide mobile menu
    Object.assign(menu.style, {
      display: "none",
      transform: "translateX(100%)",
      opacity: "0",
      transition: "transform 0.25s ease, opacity 0.25s ease",
    });

    // create burger if not exist
    burger = document.getElementById("burger-btn") || document.createElement("button");
    burger.innerHTML = "&#9776;";
    burger.id = "burger-btn";
    burger.type = "button";

    Object.assign(burger.style, {
      fontSize: "24px",
      background: "transparent",
      border: "none",
      cursor: "pointer",
      color: "#333",
      marginLeft: "10px",
      position: "static",
      order: "-1",
    });

    moveSearchAndBurger();

    let open = false;

    function openMenu() {
      menu.style.display = "block";
      Object.assign(menu.style, {
        position: "fixed",
        top: "0",
        right: "0",
        width: "250px",
        height: "100vh",
        background: "#fff",
        overflowY: "auto",
        zIndex: "999",
        padding: "20px",
        boxShadow: "2px 0 10px rgba(0,0,0,0.2)",
      });
      requestAnimationFrame(() => {
        menu.style.transform = "translateX(0)";
        menu.style.opacity = "1";
      });
      open = true;
    }

    function closeMenu() {
      menu.style.transform = "translateX(100%)";
      menu.style.opacity = "0";
      setTimeout(() => (menu.style.display = "none"), 250);
      open = false;
    }

    burger.onclick = (e) => {
      e.stopPropagation();
      open ? closeMenu() : openMenu();
    };

    document.addEventListener("click", (ev) => {
      if (open && !menu.contains(ev.target) && ev.target !== burger) closeMenu();
    });

    const closeBtn = menu.querySelector(".btn--close");
    if (closeBtn) closeBtn.addEventListener("click", closeMenu);
  }

  function restoreMobile(menu) {
    // remove burger
    if (burger) {
      burger.remove();
      burger = null;
    }

    // restore menu style
    menu.removeAttribute("style");

    // restore search visibility / position
    const search = document.querySelector(".header-search");
    if (search) {
      search.style.display = "none"; // completely hide on mobile
    }
  }

  function moveSearchAndBurger() {
    const header = document.querySelector(".flex.items-stretch.justify-between.relative");
    const search = document.querySelector(".header-search");
    const right = header?.querySelector(":scope > .flex.items-center.justify-end");

    if (!search) return;

    // store original parent for restore
    if (!originalSearchParent) {
      originalSearchParent = search.parentElement;
    }

    // show and move search bar
    search.style.display = "flex";

    if (header && search && right) {
      search.className = "flex items-center header-search";
      header.insertBefore(search, right);
      Object.assign(search.style, {
        flex: "1",
        justifyContent: "center",
        display: "flex",
      });
    }

    if (search && burger && !search.contains(burger)) {
      search.insertBefore(burger, search.firstChild);
    }
  }

  init();
});/* Add custom Js code below */