// =========================================================
// COMPLETE SALLA FOOTER ADDRESS INJECTION WITH MAP LINK
// =========================================================
(function() {
    // Detect store language automatically
    var isArabic = document.documentElement.lang === 'ar' || document.documentElement.dir === 'rtl';

    // Set address text and Google Maps link based on active language
    var addressText = isArabic 
        ? "مصنع القريشي للرخام، ملهم، الرياض 15466، المملكة العربية السعودية" 
        : "Quraishi Marble Factory, Malham, Riyadh 15466, Saudi Arabia";
        
    var mapsUrl = isArabic
        ? "https://www.google.com/maps/search/?api=1&query=%D9%85%D8%B5%D9%86%D8%B9+%D8%A7%D9%84%D9%82%D8%B1%D9%8A%D8%B4%D9%8A+%D9%84%D9%84%D8%B1%D8%AE%D8%A7%D9%85+%D9%85%D9%84%D9%87%D9%85+%D8%A7%D9%84%D8%B1%D9%8A%D8%A7%D8%B6"
        : "https://www.google.com/maps/search/?api=1&query=Quraishi+Marble+Factory,+Malham,+Riyadh+15466,+Saudi+Arabia";

    // Check every 500ms for Salla's dynamic contact list container
    var checkExist = setInterval(function() {
        var contactContainer = document.querySelector('.s-footer-contact-list ul') || 
                               document.querySelector('.s-contacts-list') || 
                               document.querySelector('.s-footer-contacts ul') ||
                               document.querySelector('[class*="contacts"] ul');

        // If container is found and our custom address doesn't already exist, inject it
        if (contactContainer && !document.getElementById('custom-marble-address')) {
            clearInterval(checkExist); 

            // Create the new list item wrapper
            var addressElement = document.createElement('li');
            addressElement.id = 'custom-marble-address';
            addressElement.className = 's-contacts-item s-contacts-address-item';
            addressElement.style.display = 'flex';
            addressElement.style.gap = '10px';
            addressElement.style.marginTop = '12px';

            // SVG Location Pin Icon (inherits styling from your CSS)
            var iconHTML = '<div class="s-contacts-icon" style="display: flex; align-items: center;">' +
                           '<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" style="fill: transparent !important;"><path d="M20 10c0 6-8 12-8 12s-8-6-8-12a8 8 0 0 1 16 0Z"></path><circle cx="12" cy="10" r="3"></circle></svg>' +
                           '</div>';

            // Create text container with clickable anchor link pointing directly to Google Maps
            var textHTML = '<div class="s-contacts-address-text">' +
                           '<a href="' + mapsUrl + '" target="_blank" class="footer-map-link">' + 
                           addressText + 
                           '</a>' +
                           '</div>';

            // Combine components and append to the contact list
            addressElement.innerHTML = iconHTML + textHTML;
            contactContainer.appendChild(addressElement);
        }
    }, 500);

    // Fallback: Stop checking after 10 seconds to preserve performance
    setTimeout(function() {
        clearInterval(checkExist);
    }, 10000);
})();

// =========================================================================
// 2. AUTO-ROTATE HERO SLIDER EVERY 2.5 SECONDS
// =========================================================================
(function () {
    function speedUpAutoplay() {
        var swiperEl = document.querySelector('.home-slider .swiper') || document.querySelector('.s-slider-container') || document.querySelector('.swiper');
        var sw = swiperEl ? swiperEl.swiper : null;
        if (sw && sw.params && sw.params.autoplay) {
            sw.params.autoplay.delay = 2500;
            sw.params.autoplay.disableOnInteraction = false;
            if (sw.autoplay) {
                sw.autoplay.stop();
                sw.autoplay.start();
            }
            return true;
        }
        return false;
    }
    var attempts = 0;
    var timer = setInterval(function () {
        attempts++;
        if (speedUpAutoplay() || attempts > 40) {
            clearInterval(timer);
        }
    }, 500);
})();

// =========================================================================
// 3. TAG GALLERY SECTION + BILINGUAL HEADING ABOVE CENTER TABLES GRID
//    (Uses MutationObserver so it works whenever sections lazy-load,
//     no matter how long the visitor takes to scroll to them.)
// =========================================================================
(function () {
    function tagGallery() {
        var gallery = document.querySelector('.s-block--banners');
        if (gallery && !gallery.id) {
            gallery.id = 'qm-gallery-section';
        }
        return !!(gallery && gallery.id);
    }

    function addHeading() {
        var list = document.querySelector('.s-products-list-wrapper');
        if (list && !document.getElementById('qm-tables-heading')) {
            var heading = document.createElement('div');
            heading.id = 'qm-tables-heading';
            heading.innerHTML =
                '<h2>Our Center Tables Collection</h2>' +
                '<p>مجموعة طاولات الوسط الفاخرة لدينا</p>';
            var anchor = list.closest('salla-products-list') || list;
            anchor.parentElement.insertBefore(heading, anchor);
        }
        return !!document.getElementById('qm-tables-heading');
    }

    function runChecks() {
        var galleryDone = tagGallery();
        var headingDone = addHeading();
        return galleryDone && headingDone;
    }

    if (runChecks()) return;

    var observer = new MutationObserver(function () {
        if (runChecks()) {
            observer.disconnect();
        }
    });
    observer.observe(document.body, { childList: true, subtree: true });

    // Safety net in case MutationObserver misses something
    var fallbackTries = 0;
    var fallbackTimer = setInterval(function () {
        fallbackTries++;
        if (runChecks() || fallbackTries > 120) {
            clearInterval(fallbackTimer);
        }
    }, 500);
})();

// =========================================================================
// 5. GALLERY & CONTACT US SIDE PANEL (TOP-LEFT HAMBURGER) - BILINGUAL EN/AR
// =========================================================================
(function () {
    if (document.getElementById('qm-side-toggle')) return;

    var email = 'sales@quraishimarble.com';
    var phone = '+966 55 225 8436';
    var phoneHref = 'tel:+966552258436';
    var addressEn = 'Quraishi Marble Factory, Malham, Riyadh 15466, Saudi Arabia';
    var addressAr = 'مصنع القريشي للرخام، ملهم، الرياض 15466، المملكة العربية السعودية';
    var mapsUrl = 'https://www.google.com/maps/search/?api=1&query=Quraishi+Marble+Factory,+Malham,+Riyadh+15466,+Saudi+Arabia';

    var toggle = document.createElement('button');
    toggle.id = 'qm-side-toggle';
    toggle.type = 'button';
    toggle.setAttribute('aria-label', 'Open menu');
    toggle.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#ffffff" stroke-width="2" stroke-linecap="round"><line x1="3" y1="6" x2="21" y2="6"></line><line x1="3" y1="12" x2="21" y2="12"></line><line x1="3" y1="18" x2="21" y2="18"></line></svg>';

    var overlay = document.createElement('div');
    overlay.id = 'qm-side-overlay';

    var panel = document.createElement('aside');
    panel.id = 'qm-side-panel';

    var mailIcon = '<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M2 6h20v12H2z"/><path d="M22 6l-10 7L2 6"/></svg>';
    var phoneIcon = '<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.12.81.3 1.6.54 2.37a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.71-1.11a2 2 0 0 1 2.11-.45c.77.24 1.56.42 2.37.54A2 2 0 0 1 22 16.92z"/></svg>';
    var pinIcon = '<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"/><circle cx="12" cy="10" r="3"></circle></svg>';

    panel.innerHTML =
        '<button type="button" class="qm-close-btn" aria-label="Close">&times;</button>' +
        '<a href="#qm-gallery-section" class="qm-gallery-link">Our Gallery</a>' +
        '<div class="qm-gallery-sub">معرضنا</div>' +
        '<h3 class="qm-contact-heading">Contact Us</h3>' +
        '<div class="qm-contact-heading-sub">تواصل معنا</div>' +
        '<div class="qm-contact-row"><span class="qm-icon">' + mailIcon + '</span><a href="mailto:' + email + '">' + email + '</a></div>' +
        '<div class="qm-contact-row"><span class="qm-icon">' + phoneIcon + '</span><a href="' + phoneHref + '">' + phone + '</a></div>' +
        '<div class="qm-contact-row"><span class="qm-icon">' + pinIcon + '</span><span><a href="' + mapsUrl + '" target="_blank" rel="noopener" style="color:#fff;text-decoration:none;">' + addressEn + '<span class="qm-ar">' + addressAr + '</span></a></span></div>';

    document.body.appendChild(overlay);
    document.body.appendChild(panel);
    document.body.appendChild(toggle);

    function openPanel() {
        panel.classList.add('qm-open');
        overlay.classList.add('qm-open');
    }
    function closePanel() {
        panel.classList.remove('qm-open');
        overlay.classList.remove('qm-open');
    }

    toggle.addEventListener('click', openPanel);
    overlay.addEventListener('click', closePanel);
    panel.querySelector('.qm-close-btn').addEventListener('click', closePanel);
    panel.querySelector('.qm-gallery-link').addEventListener('click', function (e) {
        var target = document.querySelector('#qm-gallery-section');
        closePanel();
        if (target) {
            e.preventDefault();
            setTimeout(function () {
                target.scrollIntoView({ behavior: 'smooth' });
            }, 350);
        }
    });
})();