/* Add custom Js code below */ 
window.addEventListener("load", (event) => {
      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=MF85NjYxMjgyZDMxM2Q0YWQ2YWM1ZTgwODE0ZGZmZmE1ZV9jMDc0YWRjNzVkM2EmZGQ1OWRlMTM4NjY4MzRmMjA0NjQ2Y2UwNjljNzI0OGM=',
    "liveChatWidth": 400,
    "liveChatHeight": 680,
    "expandDire": ""
  }
  
  initLiveChat(config);
  
        function preventScroll(e) {
        e.preventDefault();
      }
      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.opacity = "0";
          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 = randomTip();
          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.opacity = "1";
        startPopupLoop();
      }
      
      function hidePopup() {
        const popup = document.getElementById("chat-popup-tip");
        if (popup) popup.style.opacity = "0";
        popupVisible = false;
        // clearInterval(persistentTipInterval);
      }

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

      function startPopupLoop() {
        clearInterval(persistentTipInterval);
        persistentTipInterval = setInterval(() => {
          if (popupVisible && !chatIsOpen) {
            updatePopupMessage();
          }
        }, 90000);
      }

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

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

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

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();
  iframeInit()
    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 () {
    hidePopup();
      var liveChatIframe = document.getElementById('liveChatIframe')
      if (this.classList.contains('close')) {
        this.classList.remove('close')
        this.classList.add('open')
        btnOpenStyle()
        if (liveChatIframe) {
          iframeOpenStyle(liveChatIframe)
        } else {
          iframeInit()
          iframeOpenStyle()
        }
      } else {
        this.classList.remove('open')
        this.classList.add('close')
        btnCloseStyle()
        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);
}

  }
})