<!-- OPEN BUTTON -->
<button id="open-ai-popup">
  ASK OUR AI
</button>

<!-- POPUP -->
<div id="ai-popup-overlay">
  <div id="ai-popup-container">

    <div id="ai-popup-header">
      <span>Ask Our AI</span>
      <button id="ai-popup-close">&times;</button>
    </div>

    <div id="ai-popup-box">
      <iframe
        src="https://nplwebai.naperol.com:444/"
        allow="clipboard-read; clipboard-write"
      ></iframe>
    </div>

  </div>
</div>

<style>
/* OPEN BUTTON */
#open-ai-popup {
  position: fixed;
  bottom: 20px;
  right: 20px;

  padding: 8px 22px;              /* tighter height */
  border: none;
  border-radius: 999px;           /* perfect pill shape */

  background: linear-gradient(135deg, #6A5AE0, #5B3FD6);
  color: #fff;

  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.5px;

  cursor: pointer;
  z-index: 9999;

  box-shadow: 0 6px 16px rgba(91, 63, 214, 0.35);
  transition: all 0.2s ease;
}

#open-ai-popup:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 20px rgba(91, 63, 214, 0.45);
}

/* OVERLAY */
#ai-popup-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.45);
  display: none;   /* keep only this */
  z-index: 10000;

  justify-content: center;
  align-items: center;
}

/* MAIN CONTAINER */
#ai-popup-container {
  width: 90%;
  max-width: 1200px;
  height: 80%;
  display: flex;
  flex-direction: column;
}

/* HEADER */
#ai-popup-header {
  /*background: #ffffff;*/
  background: linear-gradient(135deg, #5B3FD6, #3A8DFF);
  color: #fff;
  border-radius: 16px 16px 0 0;
  padding: 12px 18px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-weight: 600;
}

#ai-popup-close {
  font-size: 26px;
  background: none;
  color: white;
  border: none;
  cursor: pointer;
}

/* IFRAME BOX */
#ai-popup-box {
  flex: 1;
  background: #fff;
  border-radius: 0 0 16px 16px;
  overflow: hidden;
}

#ai-popup-box iframe {
  width: 100%;
  height: 100%;
  border: none;
}
</style>

<script>
(function(){
  const openBtn = document.getElementById('open-ai-popup');
  const overlay = document.getElementById('ai-popup-overlay');
  const closeBtn = document.getElementById('ai-popup-close');

  openBtn.onclick = () => overlay.style.display = 'flex';
  closeBtn.onclick = () => overlay.style.display = 'none';

  overlay.onclick = e => {
    if (e.target === overlay) overlay.style.display = 'none';
  };
})();
</script>
<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" href="https://aidoit.in/wp-sitemap-index.xsl" ?>
<sitemapindex xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"><sitemap><loc>https://aidoit.in/wp-sitemap-posts-post-1.xml</loc></sitemap><sitemap><loc>https://aidoit.in/wp-sitemap-posts-page-1.xml</loc></sitemap><sitemap><loc>https://aidoit.in/wp-sitemap-posts-portfolio-1.xml</loc></sitemap><sitemap><loc>https://aidoit.in/wp-sitemap-posts-service-1.xml</loc></sitemap><sitemap><loc>https://aidoit.in/wp-sitemap-posts-case-study-1.xml</loc></sitemap><sitemap><loc>https://aidoit.in/wp-sitemap-posts-courses-1.xml</loc></sitemap><sitemap><loc>https://aidoit.in/wp-sitemap-posts-header-1.xml</loc></sitemap><sitemap><loc>https://aidoit.in/wp-sitemap-posts-footer-1.xml</loc></sitemap><sitemap><loc>https://aidoit.in/wp-sitemap-posts-ct-mega-menu-1.xml</loc></sitemap><sitemap><loc>https://aidoit.in/wp-sitemap-taxonomies-category-1.xml</loc></sitemap><sitemap><loc>https://aidoit.in/wp-sitemap-taxonomies-post_tag-1.xml</loc></sitemap><sitemap><loc>https://aidoit.in/wp-sitemap-taxonomies-portfolio-category-1.xml</loc></sitemap><sitemap><loc>https://aidoit.in/wp-sitemap-taxonomies-service-category-1.xml</loc></sitemap><sitemap><loc>https://aidoit.in/wp-sitemap-taxonomies-case-study-category-1.xml</loc></sitemap><sitemap><loc>https://aidoit.in/wp-sitemap-users-1.xml</loc></sitemap></sitemapindex>
