أشكرك جداً على إرسال الكود الحالي. لقد قمت بتحليله وفهمت تماماً ما تحاول تحقيقه: ترتيب الباقات، تمييزها بالألوان، إضافة تأثير لمعان للأزرار، وتعديل روابط السلايدر، بالإضافة إلى شريط التواصل الاجتماعي الجانبي.
الكود الحالي لديك يعمل، لكنه **مُشتت تقنياً** ويستخدم أساليب قديمة (مثل تغيير الأنماط مباشرة عبر الجافا سكريبت) مما يجعله صعب التعديل وقد يسبب بطءاً بسيطاً.
لقد قمت بإعادة كتابة الكود بالكامل، **بأسلوب احترافي وعصري (Apple/Cyber Style)**.
### ✅ ما الذي تم تحسينه؟
1. **دمج كل شيء:** الكود الآن عبارة عن كتلة واحدة شاملة (أكواد JS ثم أكواد CSS) مصممة لتوضع في مكان واحد (الفوتر).
2. **الأداء:** تم نقل كل تأثيرات الألوان واللمعان إلى الـ CSS، مما يجعلها أسرع وأسلس بكثير.
3. **ترتيب الباقات:** تم تحسين كود الـ JS ليكون أكثر أماناً وأسرع في ترتيب الباقات.
4. **التصميم (Design Upgrade):**
* **الباقات:** تم تمييز الباقة الذهبية **بلمعان نيون ذهبي** حولها، وتم تحديث ألوان بقية الباقات لتكون أكثر وضوحاً وفخامة.
* **الأزرار:** تأثير اللمعان أصبح **أكثر سلاسة واحترافية عبر الـ CSS** (لا يحتاج לג'אווה سكريبت الآن).
* **شريط التواصل الاجتماعي:** تم تغيير مكانه ليكون على **اليمين (أسفل الشاشة)**، وتحويل الأيقونات إلى **دوائر زجاجية عائمة بأسلوب أبل**، مع تأثير حركي فخم عند التمرير بالماوس.
---
### 🛑 هام جداً جداً قبل البدء:
قم بحذف **كل** الأكواد القديمة التي أرسلتها لي من لوحة تحكم متجرك (سلة/زد/ووردبريس) قبل وضع الكود الجديد لمنع أي تعارض.
### الكود الشامل الجديد (JS + CSS + HTML):
انسخ الكود التالي بالكامل ولصقه في قسم **"أكواد الفوتر" (Footer Scripts / Scripts prior to closing tag)**:
```html