document.addEventListener("DOMContentLoaded", function () {
  // 🧼 إزالة فوتر سلة الأصلي
  const oldFooter = document.querySelector("footer.store-footer");
  if (oldFooter) oldFooter.remove();

  // 🪄 تنسيقات الفوتر
  const style = document.createElement("style");
  style.innerHTML = `
    .custom-footer {
      position:relative;
      width:100%;
      overflow:hidden;
      color:#fff;
      display:flex;
      align-items:center;
      justify-content:center;
    }

    .custom-footer video {
      position:absolute;
      top:50%; left:50%;
      width:100%; height:100%;
      object-fit:cover;
      z-index:0;
      transform:translate(-50%,-50%);
    }

    .custom-footer .overlay {
      position:absolute;
      top:0; left:0;
      width:100%; height:100%;
      background:rgba(25, 25, 25, 0.25);
      backdrop-filter:blur(5px);
      -webkit-backdrop-filter:blur(5px);
      z-index:1;
    }

    .footer-content {
      position:relative;
      z-index:2;
      display:flex;
      flex-direction:column;
      align-items:center;
      justify-content:center;
      padding:30px 15px;
      text-align:center;
      gap:18px;
      width:100%;
    }

    .footer-logo {
      max-height:90px;
      width:10rem;
      margin-bottom:10px;
      filter: drop-shadow(0 0 25px #ddb231ff) drop-shadow(0 0 35px #f4dbd0);
      animation: logoAppear 1.2s ease forwards;
    }

    @keyframes logoAppear {
      from {opacity:0; transform:translateY(-30px) scale(0.9);}
      to {opacity:1; transform:translateY(0) scale(1);}
    }

    .footer-links {
      display:flex;
      gap:15px;
      flex-wrap:wrap;
      justify-content:center;
      align-items:center;
    }

    .footer-links a {
      color:#24c4dc;
      font-size:15px;
      text-decoration:none;
      background:rgba(48, 48, 48, 0.35);
      backdrop-filter: blur(8px);
      -webkit-backdrop-filter: blur(8px);
      padding:12px 16px;
      border-radius:12px;
      transition:all 0.3s ease;
      font-weight:bold;
      display:block;
    }

    .footer-links a:hover {
      background:rgba(38, 38, 38, 0.3);
      transform:scale(1.05);
      box-shadow:0 0 15px rgba(255, 255, 255, 0.6);
    }

    .footer-copy {
      font-size:13px;
      margin-top:10px;
      opacity:0.9;
    }

    .footer-advaz {
      font-size:14px;
      font-weight:bold;
      margin-top:8px;
      text-shadow:0 0 10px rgba(36, 36, 36, 0.6);
      color:#24c4dc;
    }

    @media (max-width:767px){
      .footer-links {
        flex-direction:column;
        gap:10px;
        align-items:center;
      }
    }
  `;
  document.head.appendChild(style);

  const whatsappNumber = "9966533600580"; 
  const whatsappLink = `https://wa.me/${whatsappNumber}`;

  const footerHTML = `
    <footer class="custom-footer">
      <video autoplay muted loop playsinline preload="auto" src="https://www.pexels.com/download/video/4982734/"></video>
      <div class="overlay"></div>
      <div class="footer-content">
        <img src="https://cdn.salla.sa/lGANAW/OgbHA04yoFwu2T6TZCByyKNyyYJ3EZyqxkXInsLj.png" alt="footer-logo" class="footer-logo" />
        
        <div class="footer-links">
          <a href="https://tech-point1.store/%D8%B3%D9%8A%D8%A7%D8%B3%D8%A9-%D8%A7%D9%84%D8%A7%D8%B3%D8%AA%D8%AE%D8%AF%D8%A7%D9%85-%D9%88%D8%A7%D9%84%D8%AE%D8%B5%D9%88%D8%B5%D9%8A%D8%A9/page-1555072821">سياسة الاستخدام والخصوصية</a>
          <a href="https://tech-point1.store/%D8%B3%D9%8A%D8%A7%D8%B3%D8%A9-%D8%A7%D9%84%D8%A7%D8%B3%D8%AA%D8%A8%D8%AF%D8%A7%D9%84-%D9%88%D8%A7%D9%84%D8%A5%D8%B3%D8%AA%D8%B1%D8%AC%D8%A7%D8%B9/page-2021311799" target="_blank">سياسة الاستبدال والاسترجاع</a>
          <a href="${whatsappLink}" target="_blank">تواصل معنا</a>
        </div>

        <salla-payments></salla-payments>

        <div class="footer-copy">جميع الحقوق محفوظة  تِــك بوينت  © 2025</div>
        <div class="footer-advaz">برمجة وتطوير ADFAZ</div>
      </div>
    </footer>
  `;
  
  document.body.insertAdjacentHTML("beforeend", footerHTML);
});


document.addEventListener("DOMContentLoaded", function () {
  const style = document.createElement("style");
  style.innerHTML = `
    .s-block.s-block--fixed-banner.wide-placeholder,
    .s-block.s-block--fixed-banner.wide-placeholder .container,
    .s-block.s-block--fixed-banner.wide-placeholder a.banner {
      width: 100% !important;
      max-width: 100% !important;
      margin: 0 auto !important;
      padding: 0 !important;
    }

    .s-block.s-block--fixed-banner.wide-placeholder img {
      width: 100% !important;
      height: auto !important;
      object-fit: cover !important;
    }
  `;
  document.head.appendChild(style);
});

/* =================================================================================================================================================================================== */

document.addEventListener("DOMContentLoaded", function() {
  const elements = document.querySelectorAll('.banner--fixed img');
  function handleScroll() {
    const windowHeight = window.innerHeight;
    elements.forEach(element => {
      const rect = element.getBoundingClientRect();
      if (rect.top <= windowHeight * 0.8) {
        element.classList.add('visible');
      }
    });
  }
  window.addEventListener('scroll', handleScroll);
  handleScroll();
});

/* =================================================================================================================================================================================== */
/* FAQ Section */
const section = document.querySelector('#app > div.app-inner.flex.flex-col.min-h-full > section.s-block.s-block--categories');

const faqData = [
  { question: "هل هناك توصيل لدول الخليج؟", answer: "نعم نوفر الشحن لكل دول الخليج وبأسعار مغرية" },
  { question: "هل يمكن ارجاع المنتج في حالة لم يعجبني؟", answer: "نعم ندعم في متجرنا سياسة الاسترجاع بشرط أن لا تتجاوز المدة 10 أيام من استلام المنتج" },
  { question: "هل منتجاتكم أصلية؟", answer: "أكيد نحن نفخر بأن منتجاتنا أصلية وذات جودة عالية" }
];

if (section) {
  section.innerHTML = '';

  let questionsHTML = faqData.map(({ question, answer }) => `
    <div class="question-item">
      <div class="question standard-question-item-bg-color">
        <h6>${question}</h6>
        <i class="sicon-keyboard_arrow_down"></i>
      </div>
      <div class="answer standard-question-item-bg-color">
        <p>${answer}</p>
      </div>
    </div>
  `).join('');

  section.innerHTML = `
    <section class="questions-block standard">
      <div class="questions_container">
        <div class="s-block_title_container">
          <div class="main-title"><h5>الأسئلة الشائعة</h5></div>
        </div>
        <div class="relative py-10">
          <div class="question_content">${questionsHTML}</div>
        </div>
      </div>
    </section>
  `;

  const script = document.createElement('script');
  script.textContent = `
    document.querySelectorAll('.question-item .question').forEach(question => {
      question.addEventListener('click', function () {
        const answer = this.nextElementSibling;
        const isVisible = answer.classList.contains('show');
        document.querySelectorAll('.answer').forEach(a => a.classList.remove('show'));
        document.querySelectorAll('.question').forEach(q => q.classList.remove('open'));
        if (!isVisible) {
          answer.classList.add('show');
          this.classList.add('open');
        }
      });
    });
  `;
  section.appendChild(script);
}
const whatsappButton = document.createElement('div');

whatsappButton.style.position = 'fixed';
whatsappButton.style.bottom = '80px';
whatsappButton.style.right = '20px';
whatsappButton.style.width = '50px';
whatsappButton.style.height = '50px';
whatsappButton.style.backgroundColor = '#355E3B'; 
whatsappButton.style.backgroundImage = 'url("https://cdn-icons-png.flaticon.com/512/124/124034.png")';
whatsappButton.style.backgroundSize = '100%';
whatsappButton.style.backgroundRepeat = 'no-repeat';
whatsappButton.style.backgroundPosition = 'center';
whatsappButton.style.borderRadius = '50%';
whatsappButton.style.boxShadow = '0 4px 8px rgba(0, 0, 0, 0.2)';
whatsappButton.style.cursor = 'pointer';
whatsappButton.style.zIndex = '1000';
whatsappButton.style.animation = 'pulse 1.5s infinite';

whatsappButton.onclick = function () {
  window.open('https://wa.me/966533600580', '_blank');
};
document.body.appendChild(whatsappButton);