/* Add custom Js styles below */ 
/**
 * ═══════════════════════════════════════════════════════════════════════
 * 
 *                   كود إضافة فروع كسوة الخيالة
 *                   Branch Locations Section Code
 * 
 * ═══════════════════════════════════════════════════════════════════════
 * 
 * الوظيفة:
 * - إضافة معلومات الفروع الأربعة للموقع
 * - عرض العناوين وأرقام الجوال والخرائط
 * - تصميم متجاوب (2 أعمدة على الديسكتوب، عمود واحد على الموبايل)
 * 
 * المميزات:
 * ✓ حقن تلقائي في .content-entry
 * ✓ يعمل فقط في صفحة الفروع
 * ✓ تصميم بألوان الموقع (#eddbc1)
 * ✓ خرائط تفاعلية من Google Maps
 * ✓ إصلاح عرض الأرقام في RTL
 * 
 * الاستخدام:
 * <script src="branches-auto-inject.js"></script>
 * 
 * ═══════════════════════════════════════════════════════════════════════
 */

(function() {
  'use strict';

  // التحقق من الصفحة الصحيحة
  const currentUrl = window.location.href;
  const targetUrl = '/فروع-كسوة-الخيالة/page-1000240616';
  
  if (!currentUrl.includes(targetUrl) && 
      !currentUrl.includes('%D9%81%D8%B1%D9%88%D8%B9-%D9%83%D8%B3%D9%88%D8%A9-%D8%A7%D9%84%D8%AE%D9%8A%D8%A7%D9%84%D8%A9/page-1000240616')) {
    return; // الصفحة مش صحيحة
  }

  // بيانات الفروع
  const branches = [
    {
      id: 1,
      title: 'فرع الخبر الرئيسي',
      address: 'الخبر الشمالية الشارع العاشر تقاطع شارع الملك سعود مقابل ستارباكس',
      phone: '+966 53 499 9621',
      mapType: 'iframe',
      mapSrc: 'https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d7154.410779813666!2d50.218021932693254!3d26.287440895009915!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x3e49e830de15f657%3A0xab568e25e27ad881!2z2YPYs9mI2Kkg2KfZhNiu2YrYp9mE2Kkg2YTZhNiu2YrYp9i32Kkg2KfZhNix2KzYp9mE2YrYqSDYp9mE2K7YqNix!5e0!3m2!1sen!2sus!4v1768051990285!5m2!1sen!2sus'
    },
    {
      id: 2,
      title: 'فرع الدمام الفيصلية',
      address: 'شارع ابو بكر الصديق مقابل بنك الراجحي',
      phone: '053 666 4919',
      mapType: 'iframe',
      mapSrc: 'https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d446.7779454332858!2d50.054117!3d26.383964!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x3e49fd0044bbd8bb%3A0x6797f835fff1b6a!2z2YPYs9mI2Kkg2KfZhNiu2YrYp9mE2Ycg2YTZhNiu2YrYp9i32Kkg2KfZhNix2KzYp9mE2YrZhyDYp9mE2YHZiti12YTZitmH!5e0!3m2!1sen!2sus!4v1768052033390!5m2!1sen!2sus'
    },
    {
      id: 3,
      title: 'فرع الريان',
      address: 'حي المريكبات بعمارة عيادة رام للأسنان',
      phone: '055 589 7423',
      mapType: 'image',
      mapSrc: 'https://img.imgdd.com/68004710-b09e-47e3-9008-50b9ecf471bb.png'
    },
    {
      id: 4,
      title: 'فرع العزيزية',
      address: 'شارع الملك خالد قبل دوار البيرق بجوار الرواق الشعبي',
      phone: '0539655503',
      mapType: 'image',
      mapSrc: 'https://img.imgdd.com/68004710-b09e-47e3-9008-50b9ecf471bb.png'
    }
  ];

  // إضافة الأنماط
  function addStyles() {
    if (document.getElementById('branches-styles')) return;
    
    const style = document.createElement('style');
    style.id = 'branches-styles';
    style.textContent = `
      #branches-auto-container {
        max-width: 1200px;
        margin: 40px auto;
        padding: 0 20px;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 24px;
      }

      .branch-card {
        background: #fff;
        border-radius: 12px;
        padding: 24px;
        border: 2px solid #eddbc1;
        box-shadow: 0 2px 8px rgba(237, 219, 193, 0.3);
        transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
      }

      .branch-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 4px 16px rgba(237, 219, 193, 0.5);
        border-color: #d4b896;
      }

      .branch-title {
        color: #2c3e50;
        font-size: 22px;
        font-weight: bold;
        margin: 0 0 16px 0;
        padding-bottom: 12px;
        border-bottom: 3px solid #eddbc1;
      }

      .branch-address,
      .branch-phone {
        color: #555;
        font-size: 15px;
        line-height: 1.6;
        margin: 12px 0;
      }

      /* إصلاح عرض الأرقام في RTL */
      .branch-phone a,
      .phone-number {
        color: #c9a577;
        text-decoration: none;
        font-weight: 600;
        transition: color 0.3s ease;
        direction: ltr;
        display: inline-block;
        unicode-bidi: embed;
      }

      .branch-phone a:hover {
        color: #a88959;
        text-decoration: underline;
      }

      .branch-map {
        margin-top: 20px;
        border-radius: 8px;
        overflow: hidden;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
      }

      .branch-map iframe,
      .branch-map-image {
        width: 100%;
        height: 300px;
        display: block;
        object-fit: cover;
      }

      /* Tablet - عمود واحد */
      @media (max-width: 992px) {
        #branches-auto-container {
          grid-template-columns: 1fr;
          gap: 24px;
        }

        .branch-map iframe,
        .branch-map-image {
          height: 280px;
        }
      }

      /* Mobile */
      @media (max-width: 768px) {
        #branches-auto-container {
          padding: 0 16px;
        }

        .branch-card {
          padding: 16px;
        }

        .branch-title {
          font-size: 20px;
        }

        .branch-address,
        .branch-phone {
          font-size: 14px;
        }

        .branch-map iframe,
        .branch-map-image {
          height: 300px;
        }
      }

      @media (max-width: 480px) {
        .branch-map iframe,
        .branch-map-image {
          height: 250px;
        }
      }
    `;
    document.head.appendChild(style);
  }

  // إنشاء بطاقة الفرع
  function createBranchCard(branch) {
    const card = document.createElement('div');
    card.className = 'branch-card';
    card.setAttribute('data-branch-id', branch.id);

    const title = document.createElement('h3');
    title.className = 'branch-title';
    title.textContent = branch.title;

    const address = document.createElement('p');
    address.className = 'branch-address';
    address.innerHTML = `<strong>العنوان:</strong> ${branch.address}`;

    const phone = document.createElement('p');
    phone.className = 'branch-phone';
    // استخدام span مع dir="ltr" لضمان عرض الرقم بشكل صحيح
    phone.innerHTML = `<strong>جوال:</strong> <a href="tel:${branch.phone.replace(/\s/g, '')}" dir="ltr">${branch.phone}</a>`;

    const mapContainer = document.createElement('div');
    mapContainer.className = 'branch-map';

    if (branch.mapType === 'iframe') {
      const iframe = document.createElement('iframe');
      iframe.src = branch.mapSrc;
      iframe.width = '600';
      iframe.height = '450';
      iframe.style.border = '0';
      iframe.allowFullscreen = true;
      iframe.loading = 'lazy';
      iframe.referrerPolicy = 'no-referrer-when-downgrade';
      mapContainer.appendChild(iframe);
    } else {
      const img = document.createElement('img');
      img.src = branch.mapSrc;
      img.alt = `خريطة ${branch.title}`;
      img.className = 'branch-map-image';
      img.loading = 'lazy';
      mapContainer.appendChild(img);
    }

    card.appendChild(title);
    card.appendChild(address);
    card.appendChild(phone);
    card.appendChild(mapContainer);

    return card;
  }

  // البحث عن المكان المناسب للحقن
  function findInjectionPoint() {
    // البحث عن .content-entry أولاً
    const contentEntry = document.querySelector('.content-entry');
    if (contentEntry) return contentEntry;

    // إذا لم يوجد، البحث عن عناصر بديلة
    const selectors = [
      '.s-block',
      '.page-content',
      'main',
      '.container',
      'article',
      '#content'
    ];

    for (const selector of selectors) {
      const element = document.querySelector(selector);
      if (element) return element;
    }

    return document.body;
  }

  // حقن المحتوى
  function injectBranches() {
    // إضافة الأنماط
    addStyles();

    // إنشاء الحاوية
    const container = document.createElement('div');
    container.id = 'branches-auto-container';

    // إضافة الفروع
    branches.forEach(branch => {
      container.appendChild(createBranchCard(branch));
    });

    // البحث عن المكان المناسب
    const injectionPoint = findInjectionPoint();
    
    // حقن المحتوى كأول عنصر
    if (injectionPoint.firstChild) {
      injectionPoint.insertBefore(container, injectionPoint.firstChild);
    } else {
      injectionPoint.appendChild(container);
    }
  }

  // التهيئة
  function init() {
    if (document.readyState === 'loading') {
      document.addEventListener('DOMContentLoaded', injectBranches);
    } else {
      injectBranches();
    }
  }

  // تشغيل السكريبت
  init();

})();


/**
 * ═══════════════════════════════════════════════════════════════════════
 * 
 *                         نهاية كود الفروع
 *                         End of Branches Code
 * 
 * ═══════════════════════════════════════════════════════════════════════
 * 
 * للدعم أو الاستفسارات:
 * - راجع ملف README.md للتعليمات الكاملة
 * - تأكد من وجود .content-entry في الصفحة
 * - الكود يعمل تلقائياً عند تحميل الصفحة
 * 
 * التحديثات:
 * - إصلاح عرض الأرقام في المواقع العربية RTL
 * - إضافة dir="ltr" لأرقام الهاتف
 * - استخدام unicode-bidi للتوافق الأفضل
 * 
 * آخر تحديث: يناير 2026
 * 
 * ═══════════════════════════════════════════════════════════════════════
 */








/*==================================================
    إضافة عنصر "فروع كسوة الخيالة" إلى القائمة الرئيسية
    - يتم إضافة العنصر بعد "الإكسسوارات الرجالية"
    - يدعم نسخة الموبايل والكمبيوتر
    - تاريخ الإضافة: 2026
==================================================*/

document.addEventListener('DOMContentLoaded', function() {
    
    // ========== إعدادات العنصر الجديد ==========
    const branchURL = 'https://alkhialh.com.sa/%D9%81%D8%B1%D9%88%D8%B9-%D9%83%D8%B3%D9%88%D8%A9-%D8%A7%D9%84%D8%AE%D9%8A%D8%A7%D9%84%D8%A9/page-1000240616';
    const branchText = 'فروع كسوة الخيالة';
    const branchId = 'branches-page';
    
    // ========== HTML نسخة الموبايل ==========
    const mobileHTML = `
        <li class="lg:hidden text-sm font-bold" id="${branchId}-mobile">
            <a class="text-gray-500 !flex items-center gap-x-2" target="_self" href="${branchURL}" aria-label="${branchText}">
                <span>${branchText}</span>
            </a>
        </li>
    `;
    
    // ========== HTML نسخة الكمبيوتر ==========
    const desktopHTML = `
        <li class="!hidden lg:!block root-level lg:!inline-block" id="${branchId}-desktop">
            <a target="_self" href="${branchURL}" aria-label="${branchText}">
                <span>${branchText}</span>
            </a>
        </li>
    `;
    
    // ========== إضافة نسخة الكمبيوتر ==========
    const desktopAccessoriesElement = document.querySelector('li[id="627905974"].root-level');
    
    if (desktopAccessoriesElement) {
        desktopAccessoriesElement.insertAdjacentHTML('afterend', desktopHTML);
    }
    
    // ========== إضافة نسخة الموبايل ==========
    const mobileAccessoriesElement = document.querySelector('li[id="\\"627905974\\""].lg\\:hidden');
    
    if (mobileAccessoriesElement) {
        mobileAccessoriesElement.insertAdjacentHTML('afterend', mobileHTML);
    }
    
});

/*==================================================
    نهاية كود إضافة فروع كسوة الخيالة
==================================================*/