/* Add custom CSS styles below */ 
/* =========================================
   هوية متجر مورف ستور - Morph Store
   الألوان: أزرق وأبيض (Gaming Vibe)
=========================================
*/

:root {
    --theme-primary: #0052cc !important; /* الأزرق الأساسي للمتجر */
    --theme-primary-dark: #003d99 !important; /* أزرق غامق للمؤثرات */
    --theme-secondary: #ffffff !important; /* الأبيض النقي */
    --background-light: #f4f6fa !important; /* خلفية المتجر المريحة */
    --text-dark: #1a202c !important;
    --border-radius: 12px !important;
    --transition-fast: all 0.3s ease !important;
}

/* تعديل الخلفية العامة للمتجر */
body {
    background-color: var(--background-light) !important;
    color: var(--text-dark) !important;
}

/* تنسيق الهيدر (الشريط العلوي) */
.main-header-bar {
    background-color: var(--theme-secondary) !important;
    border-bottom: 2px solid #e2e8f0 !important;
    box-shadow: 0 4px 6px -1px rgba(0, 82, 204, 0.05) !important;
}

/* أزرار التنقل والقائمة العلوية */
.main-menu .nav-link {
    color: var(--text-dark) !important;
    font-weight: 600 !important;
    transition: var(--transition-fast);
}

.main-menu .nav-link:hover {
    color: var(--theme-primary) !important;
    background-color: rgba(0, 82, 204, 0.05) !important;
    border-radius: 8px;
}

/* تخصيص كروت المنتجات (Product Cards) للقسمين */
.product-card {
    background: var(--theme-secondary) !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: var(--border-radius) !important;
    overflow: hidden !important;
    transition: var(--transition-fast) !important;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.05) !important;
}

/* تأثير تحريك الكرت عند مرور الماوس */
.product-card:hover {
    transform: translateY(-8px) !important;
    border-color: var(--theme-primary) !important;
    box-shadow: 0 20px 25px -5px rgba(0, 82, 204, 0.15) !important;
}

/* زر الشراء وإضافة للسلة */
.btn-add-to-cart, .s-product-card-button {
    background-color: var(--theme-primary) !important;
    color: var(--theme-secondary) !important;
    border-radius: 8px !important;
    font-weight: bold !important;
    transition: var(--transition-fast) !important;
}

.btn-add-to-cart:hover, .s-product-card-button:hover {
    background-color: var(--theme-primary-dark) !important;
    box-shadow: 0 4px 12px rgba(0, 82, 204, 0.3) !important;
}

/* أسعار المنتجات */
.product-price {
    color: var(--theme-primary) !important;
    font-weight: bold !important;
    font-size: 1.2rem !important;
}

/* --------------------------------------------------
   لمسة مخصصة لأقسام الألعاب (كود موبايل & كلاش اوف كلانس)
   تلوين الشارات وعناوين الأقسام لتمييزها
----------------------------------------------------- */

/* عناوين الأقسام الرئيسية في الصفحة الرئيسية */
.section-title, .store-section .title {
    color: var(--theme-primary) !important;
    border-right: 4px solid var(--theme-primary) !important;
    padding-right: 10px !important;
    font-size: 1.5rem !important;
    font-weight: 700 !important;
}

/* شارات المنتجات (مثل: متوفر، تخفيض، شحن فوري) */
.product-badge, .s-product-card-promotion {
    background: linear-gradient(135deg, var(--theme-primary), #00d2ff) !important;
    color: var(--theme-secondary) !important;
    font-weight: 600 !important;
    border-radius: 20px !important;
    padding: 4px 12px !important;
}

/* تخصيص الفوتر (أسفل الصفحة) ليناسب الهوية الزرقاء */
.main-footer {
    background-color: var(--theme-primary) !important;
    color: var(--theme-secondary) !important;
}

.main-footer a, .main-footer p {
    color: rgba(255, 255, 255, 0.9) !important;
}

.main-footer a:hover {
    color: #00d2ff !important;
}