/* Add custom Js code below */
window.addEventListener("load", (event) => {
  // ================== WORK HOURS SETTINGS ==================
  const WORK_START_HOUR = 8;  // 8 AM
  const WORK_END_HOUR = 17;   // 5 PM

  function isWithinWorkingHours() {
    const now = new Date();          // يعتمد على وقت جهاز العميل
    const h = now.getHours();        // 0-23
    return h >= WORK_START_HOUR && h < WORK_END_HOUR;
  }

  function outOfHoursMessage() {
    return "⏰ الدعم الفني متاح خلال أوقات الدوام فقط: من ٨ صباحًا حتى ٥ مساءً بتوقيت السععودية";
  }
  // =========================================================

  let popupTimeout;
  let persistentTipInterval;
  let chatIsOpen = false;
  let popupVisible = false;

  const chatTips = [
    "هل تحتاج مساعدة؟ اضغط هنا 👋",
    "مرحبًا! نحن جاهزون للإجابة على أسئلتك ✅",
    "لا تتردد، تواصل معنا الآن 📞",
    "اضغط لبدء المحادثة 💬",
    "فريق الدعم بانتظارك الآن 🔧",
    "عندك استفسار؟ خلينا نساعدك 👇",
  ];

  var openSvg = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 35 35" class="design-iconfont" style="display: block;">
  <style>
    .pulse {
      animation: pulse 1.5s infinite;
      transform-origin: center;
    }
    @keyframes pulse {
      0% { transform: scale(1.2); }
      50% { transform: scale(1.45); }
      100% { transform: scale(1.2); }
    }
  </style>
  <g class="pulse" fill="#fff">
    <path d="M27.48,16.89c-0.07-0.02-0.14-0.03-0.22-0.04c0.01-0.18-0.01-0.36-0.05-0.54c0.04-0.38,0.06-0.76,0.06-1.15
      c0-5.47-4.47-9.91-10-9.91s-10,4.44-10,9.91c0,0.39,0.02,0.77,0.06,1.15c-0.04,0.18-0.06,0.36-0.05,0.54
      c-0.07,0.01-0.14,0.02-0.21,0.04l-0.57,0.16c-0.63,0.18-0.95,0.9-0.77,1.54l1.23,4.9c0.17,0.67,0.83,1.06,1.45,0.89l0.57-0.16
      l0.05,0.21c0.11,0.49,0.46,0.84,0.84,0.91c2.3,3.1,6.15,3.23,7.19,3.2h2.16c0.8,0,1.45-0.57,1.45-1.27s-0.65-1.27-1.45-1.27
      h-2.16c-0.8,0-1.45,0.57-1.45,1.27c0,0.11,0.02,0.22,0.05,0.32c-2.71-0.37-4.45-1.71-5.23-2.56l0.41-0.12
      c0.59-0.17,0.89-0.88,0.73-1.52l-1.72-7.29c-0.1-0.43-0.44-0.74-0.82-0.73c0-4.6,3.95-8.33,8.8-8.33s8.8,3.73,8.8,8.33
      c-0.38,0-0.72,0.3-0.82,0.73l-1.72,7.29c-0.16,0.64,0.14,1.34,0.73,1.52l1.07,0.32c0.59,0.17,1.2-0.18,1.36-0.84l0.04-0.21
      c0.03,0.01,0.07,0.03,0.11,0.04l0.57,0.16c0.62,0.18,1.28-0.22,1.45-0.89l1.23-4.9c0.17-0.67-0.14-1.36-0.77-1.54L27.88,16.89z"></path>
  </g>
</svg>`;

  var closeSvg =
    '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" class="design-iconfont">\n' +
    '  <path d="M6.95955989,6.95955989 C7.35008418,6.56903559 7.98324916,6.56903559 8.37377345,6.95955989 L15.9996667,14.5846667 L23.6262266,6.95955989 C24.0167508,6.56903559 24.6499158,6.56903559 25.0404401,6.95955989 C25.4309644,7.35008418 25.4309644,7.98324916 25.0404401,8.37377345 L17.4136667,15.9996667 L25.0404401,23.6262266 C25.4009241,23.9867105 25.4286536,24.5539416 25.1236287,24.9462328 L25.0404401,25.0404401 C24.6499158,25.4309644 24.0167508,25.4309644 23.6262266,25.0404401 L15.9996667,17.4136667 L8.37377345,25.0404401 C7.98324916,25.4309644 7.35008418,25.4309644 6.95955989,25.0404401 C6.56903559,24.6499158 6.56903559,24.0167508 6.95955989,23.6262266 L14.5846667,15.9996667 L6.95955989,8.37377345 C6.59907592,8.01328949 6.57134639,7.44605843 6.87637128,7.05376722 Z" fill="#FFF" fill-rule="evenodd"/>\n' +
    "</svg>";

  var config = {
    parentClass: "",
    btnSize: 56,
    btnLeft: "",
    btnRight: 16,
    btnTop: "",
    btnBottom: 30,
    liveChatUrl:
      "https://brafco.a.gdms.cloud/liveChat?liveChatAccess=MF9hNTkxMDE4NzBmY2I0MzRiYjRiNDhkMGU3ZTM0OTVlOV9jMDc0YWRjNzVkM2EmNWNkMTEyMmNjOTI1Njk4MDc5ZDBlYTljZGM3MzU2OWE=",
    liveChatWidth: 400,
    liveChatHeight: 680,
    expandDire: "",
  };

  initLiveChat(config);

  function preventScroll(e) {
    e.preventDefault();
  }

  function randomTip() {
    return chatTips[Math.floor(Math.random() * chatTips.length)];
  }

  function getPopupText() {
    return isWithinWorkingHours() ? randomTip() : outOfHoursMessage();
  }

  function createPersistentPopup() {
    let popup = document.getElementById("chat-popup-tip");
    if (!popup) {
      popup = document.createElement("div");
      popup.id = "chat-popup-tip";
      popup.style.position = "fixed";
      popup.style.bottom = "90px";
      popup.style.right = "30px";
      popup.style.padding = "12px 16px";
      popup.style.backgroundColor = "#ffffff";
      popup.style.borderRadius = "12px";
      popup.style.boxShadow = "0 4px 16px rgba(0,0,0,0.15)";
      popup.style.fontSize = "15px";
      popup.style.color = "#333";
      popup.style.zIndex = "100001";
      popup.style.maxWidth = "280px";
      popup.style.lineHeight = "1.5";
      popup.style.transition = "opacity 0.4s ease";
      popup.style.pointerEvents = "auto";
      popup.style.display = "flex";
      popup.style.alignItems = "center";
      popup.style.justifyContent = "space-between";
      popup.style.gap = "12px";

      const span = document.createElement("span");
      span.id = "chat-popup-message";
      span.innerText = getPopupText();
      popup.appendChild(span);

      const closeBtn = document.createElement("button");
      closeBtn.innerText = "✖";
      closeBtn.style.border = "none";
      closeBtn.style.background = "transparent";
      closeBtn.style.cursor = "pointer";
      closeBtn.style.fontSize = "16px";
      closeBtn.style.color = "#999";
      closeBtn.onclick = () => {
        hidePopup();
        schedulePopup();
      };
      popup.appendChild(closeBtn);

      document.body.appendChild(popup);
    }

    popupVisible = true;
    updatePopupMessage();
    popup.style.display = "flex";
    startPopupLoop();
  }

  function hidePopup() {
    const popup = document.getElementById("chat-popup-tip");
    if (popup) popup.style.display = "none";
    popupVisible = false;
    clearInterval(persistentTipInterval);
  }

  function schedulePopup() {
    clearTimeout(popupTimeout);
    popupTimeout = setTimeout(() => {
      if (!chatIsOpen) {
        showPersistentPopup();
      }
    }, 90000);
  }

  function startPopupLoop() {
    clearInterval(persistentTipInterval);
    persistentTipInterval = setInterval(() => {
      if (popupVisible && !chatIsOpen) {
        // خارج الدوام: لا نغير النص كل مرة (يبقى ثابت)
        if (isWithinWorkingHours()) updatePopupMessage();
      }
    }, 90000);
  }

  function showPersistentPopup() {
    if (chatIsOpen) return;
    createPersistentPopup();
  }

  function updatePopupMessage() {
    const span = document.getElementById("chat-popup-message");
    if (span) {
      span.innerText = getPopupText();
      animatePopup();
    }
  }

  function animatePopup() {
    const popup = document.getElementById("chat-popup-tip");
    if (popup) {
      popup.style.transition =
        "transform 0.4s cubic-bezier(0.22, 1, 0.36, 1)";
      popup.style.transform = "scale(1.2)";
      setTimeout(() => {
        popup.style.transform = "scale(1)";
      }, 230);
    }
  }

  function initLiveChat(config) {
    // لو خارج الدوام: أظهر رسالة الدوام مباشرة
    showPersistentPopup();

    var bodyDom = document.body;
    if (config.parentClass) {
      bodyDom = document.querySelector("." + config.parentClass);
    }
    if (!bodyDom.style.position) {
      bodyDom.style.position = "relative";
    }

    var entryBtn = document.createElement("div");
    entryBtn.className = "live-chat-entry close";
    btnInitStyle();
    btnCloseStyle();
    bodyDom.appendChild(entryBtn);

    entryBtn.onclick = function () {
      // =========== OUT OF HOURS: block opening ===========
      if (!isWithinWorkingHours()) {
        // تأكد أنه مغلق
        chatIsOpen = false;
        hidePopup();
        showPersistentPopup();

        // اغلق الواجهة لو كانت مفتوحة
        const wrapper = document.getElementById("liveChatWrapper");
        if (wrapper) {
          wrapper.classList.remove("open");
          wrapper.style.display = "none";
        }

        this.classList.remove("open");
        this.classList.add("close");
        btnCloseStyle();
        return;
      }
      // ===================================================

      hidePopup();
      var liveChatIframe = document.getElementById("liveChatIframe");

      if (this.classList.contains("close")) {
        this.classList.remove("close");
        this.classList.add("open");
        btnOpenStyle();

        chatIsOpen = true;

        if (liveChatIframe) {
          iframeOpenStyle(liveChatIframe);
        } else {
          iframeInit();
          iframeOpenStyle();
        }
      } else {
        this.classList.remove("open");
        this.classList.add("close");
        btnCloseStyle();

        chatIsOpen = false;

        if (liveChatIframe) {
          iframeCloseStyle(liveChatIframe);
        }
      }
    };

    entryBtn.addEventListener("mouseover", () => {
      entryBtn.style.backgroundColor = "#4299FC";
    });

    entryBtn.addEventListener("mouseout", () => {
      entryBtn.style.backgroundColor = "#3F8EF0";
    });

    function btnInitStyle() {
      entryBtn.style.position = "fixed";
      entryBtn.style.bottom =
        typeof config.btnBottom === "number"
          ? config.btnBottom + "px"
          : config.btnBottom;
      entryBtn.style.right =
        typeof config.btnRight === "number"
          ? config.btnRight + "px"
          : config.btnRight;
      entryBtn.style.zIndex = "9999";
      entryBtn.style.top =
        typeof config.btnTop === "number" && config.btnTop >= 0
          ? config.btnTop + "px"
          : config.btnTop;
      entryBtn.style.left =
        typeof config.btnLeft === "number" && config.btnLeft >= 0
          ? config.btnLeft + "px"
          : config.btnLeft;
      entryBtn.style.bottom =
        typeof config.btnBottom === "number" && config.btnBottom >= 0
          ? config.btnBottom + "px"
          : config.btnBottom;
      entryBtn.style.right =
        typeof config.btnRight === "number" && config.btnRight >= 0
          ? config.btnRight + "px"
          : config.btnRight;
      entryBtn.style.width = config.btnSize >= 0 ? config.btnSize + "px" : "50px";
      entryBtn.style.height = config.btnSize >= 0 ? config.btnSize + "px" : "50px";
      entryBtn.style.borderRadius =
        config.btnSize >= 0 ? config.btnSize / 2 + "px" : "25px";
      entryBtn.style.backgroundColor = "#3F8EF0";
      entryBtn.style.padding = "12px";
      entryBtn.style.cursor = "pointer";
      entryBtn.style.userSelect = "none";
      entryBtn.style.boxSizing = "border-box";
      entryBtn.style.zIndex = 100000;
      entryBtn.innerHTML = openSvg + closeSvg;
    }

    function btnCloseStyle() {
      entryBtn.querySelectorAll("svg")[0].style.display = "block";
      entryBtn.querySelectorAll("svg")[1].style.display = "none";
    }

    function btnOpenStyle() {
      entryBtn.querySelectorAll("svg")[0].style.display = "none";
      entryBtn.querySelectorAll("svg")[1].style.display = "block";
    }

    function iframeInit() {
      const isMobile = window.innerWidth <= 768;

      const iframeWrapper = document.createElement("div");
      iframeWrapper.id = "liveChatWrapper";
      iframeWrapper.style.position = "fixed";
      iframeWrapper.style.zIndex = 99998;

      if (isMobile) {
        iframeWrapper.style.top = "0";
        iframeWrapper.style.left = "0";
        iframeWrapper.style.width = "100vw";
        iframeWrapper.style.height = window.innerHeight + "px";
        iframeWrapper.style.borderRadius = "12px";
        iframeWrapper.style.backgroundColor = "#fff";
      } else {
        iframeWrapper.style.bottom = "20px";
        iframeWrapper.style.right = "20px";
        iframeWrapper.style.width = config.liveChatWidth + "px";
        iframeWrapper.style.height = config.liveChatHeight + "px";
        iframeWrapper.style.borderRadius = "12px";
        iframeWrapper.style.backgroundColor = "#F5F7FA";
        iframeWrapper.style.boxShadow = "0 2px 16px 0 #00000029";
      }

      iframeWrapper.style.border = "none";
      iframeWrapper.style.overflow = "hidden";

      const iframeBox = document.createElement("iframe");
      iframeBox.id = "liveChatIframe";
      iframeBox.src = config.liveChatUrl;
      iframeBox.style.width = "100%";
      iframeBox.style.height = "100%";
      iframeBox.style.border = "none";
      iframeBox.allow = "camera; microphone; autoplay; speaker; speaker-selection";
      iframeBox.sandbox =
        "allow-same-origin allow-scripts allow-forms allow-popups allow-downloads";

      iframeWrapper.appendChild(iframeBox);
      document.body.appendChild(iframeWrapper);
      iframeWrapper.style.display = "none";
    }

    function iframeOpenStyle() {
      const wrapper = document.getElementById("liveChatWrapper");
      if (wrapper) {
        wrapper.style.display = "block";
        setTimeout(() => {
          wrapper.classList.add("open");
        }, 10);

        const isMobile = window.innerWidth <= 768;
        if (isMobile) {
          document.body.style.overflow = "hidden";
          document.addEventListener("touchmove", preventScroll, { passive: false });
        }
      }
    }

    function iframeCloseStyle() {
      schedulePopup();
      const wrapper = document.getElementById("liveChatWrapper");
      if (wrapper) {
        wrapper.classList.remove("open");
        setTimeout(() => {
          wrapper.style.display = "none";
        }, 300);
      }

      document.body.style.overflow = "";
      document.removeEventListener("touchmove", preventScroll);
    }

    // (اختياري) طلب وقت السعودية - تركته كما هو عندك
    fetch("/api/saudi-time")
      .then((res) => res.json())
      .then((data) => console.log(data))
      .catch(() => {});
  }
});