// Paste into Salla "Customize via JS" (no <script> tags)
(function () {
  // Lazy-load non-hero images, prioritize hero images
  document.addEventListener("DOMContentLoaded", function () {
    document.querySelectorAll("img").forEach(function (img) {
      const inHero = img.closest(".hero, .hero-slider, .main-slider, .salla-slider, .banner-hero, .home-hero");
      if (inHero) {
        img.setAttribute("loading", "eager");
        img.setAttribute("fetchpriority", "high");
      } else {
        if (!img.hasAttribute("loading")) img.setAttribute("loading", "lazy");
        img.setAttribute("decoding", "async");
      }
    });
  });

  // Lock aspect ratios early to reduce CLS
  function lockRatio(selector, ratio) {
    document.querySelectorAll(selector).forEach(function (box) {
      var w = box.clientWidth || (box.parentElement ? box.parentElement.clientWidth : 0);
      if (w > 0) box.style.minHeight = Math.round(w / ratio) + "px";
    });
  }
  function applyLocks() {
    var mobile = window.matchMedia("(max-width:640px)").matches;
    lockRatio(".hero, .hero-slider, .main-slider, .salla-slider, .banner-hero, .home-hero", mobile ? (16/10) : (16/10));
    lockRatio(".product-card .product-img, .product-item .product-img, .product-media, .product-card__image-wrapper", 1);
    lockRatio(".blog-card .post-thumb, .brand-card .brand-thumb, .section-banner .banner-image", (16/9));
  }
  document.addEventListener("readystatechange", function () {
    if (document.readyState === "interactive") applyLocks();
  });
  window.addEventListener("load", applyLocks);
  window.addEventListener("resize", debounce(applyLocks, 150));

  function debounce(fn, wait){ var t; return function(){ clearTimeout(t); t=setTimeout(fn, wait); }; }
})();