(function() {
  'use strict';
  
  // Prevent multiple injections
  if (window.__appBannerInjected) {
    return;
  }
  window.__appBannerInjected = true;

  // Check if it's a mobile device - EXIT if not mobile
  const isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
  if (!isMobile) {
    return;
  }

  // Check if banner was previously closed
  const STORAGE_KEY = 'app_banner_closed';
  if (localStorage.getItem(STORAGE_KEY) === 'true') {
    return;
  }

  // Detect device and set appropriate URL
  const isIOS = /iPad|iPhone|iPod/.test(navigator.userAgent);
  const APP_STORE_URL = 'https://apps.apple.com/us/app/%D9%83%D8%A8%D8%B4-%D9%86%D8%AC%D8%AF/id6733216537';
  const PLAY_STORE_URL = 'https://play.google.com/store/apps/details?id=com.kabshnajd.app&pli=1';
  const downloadUrl = isIOS ? APP_STORE_URL : PLAY_STORE_URL;

  // Create banner HTML with BEM classes
  const bannerHTML = `
    <div class="app-banner" id="app-download-banner">
      <div class="app-banner__container">
        <button class="app-banner__close" id="app-banner-close" aria-label="إغلاق">
          ×
        </button>

        <div class="app-banner__logo">
          <img 
            src="https://i.ibb.co/yBWPBFQz/34a4aab8f15b3499c81361d053f5bc250187a4b2.png" 
            alt="كبش نجد"
            class="app-banner__logo-img"
          />
        </div>

        <div class="app-banner__content">
          <h2 class="app-banner__title">كبش نجد</h2>
          <p class="app-banner__subtitle">حمل التطبيق</p>
          <p class="app-banner__description">وفعّل التنبيه لمعرفة وصول الشحنات</p>
        </div>
        
        <a href="${downloadUrl}" 
           class="app-banner__button" 
           id="app-banner-download" 
           target="_blank" 
           rel="noopener noreferrer">
          تنزيل
        </a>
      </div>
    </div>
  `;

  // Inject banner into page
  const tempDiv = document.createElement('div');
  tempDiv.innerHTML = bannerHTML;
  const bannerElement = tempDiv.firstElementChild;
  
  // Wait for DOM to be ready
  function injectBanner() {
    if (!document.body) {
      setTimeout(injectBanner, 50);
      return;
    }

    document.body.insertBefore(bannerElement, document.body.firstChild);
    
    // Add padding to body to prevent content overlap
    setTimeout(() => {
      const bannerHeight = bannerElement.offsetHeight;
      const originalPaddingTop = window.getComputedStyle(document.body).paddingTop;
      const originalPaddingValue = parseInt(originalPaddingTop) || 0;
      document.body.style.paddingTop = (originalPaddingValue + bannerHeight) + 'px';
      document.body.style.transition = 'padding-top 0.3s ease-out';
    }, 50);

    // Attach event listeners after banner is injected
    attachEventListeners();
  }

  if (document.readyState === 'loading') {
    document.addEventListener('DOMContentLoaded', injectBanner);
  } else {
    injectBanner();
  }

  // Handle close button
  function closeBanner() {
    const banner = document.getElementById('app-download-banner');
    if (!banner) return;

    // Add hiding class for animation
    banner.classList.add('app-banner--hiding');
    
    // Remove banner and restore body padding after animation
    setTimeout(() => {
      const bannerHeight = banner.offsetHeight;
      banner.remove();
      
      // Restore original body padding
      const currentPadding = parseInt(window.getComputedStyle(document.body).paddingTop) || 0;
      document.body.style.paddingTop = Math.max(0, currentPadding - bannerHeight) + 'px';
      
      // Store closed state
      localStorage.setItem(STORAGE_KEY, 'true');
    }, 300);
  }

  // Add event listeners
  function attachEventListeners() {
    const closeBtn = document.getElementById('app-banner-close');
    if (closeBtn) {
      closeBtn.addEventListener('click', function(e) {
        e.preventDefault();
        e.stopPropagation();
        closeBanner();
      });
    } else {
      console.warn('App banner close button not found');
    }

    // Prevent accidental interactions
    const downloadBtn = document.getElementById('app-banner-download');
    if (downloadBtn) {
      downloadBtn.addEventListener('touchstart', function(e) {
        e.stopPropagation();
      });
    }
  }

})();