.navbar-area .nav-container .responsive-mobile-menu .navbar-toggler .menu-toggle-icon i {
  color: rgb(255, 255, 255);
}

.navbar-area .nav-container .responsive-mobile-menu .navbar-toggler .menu-toggle-icon .menu-icon-close {
  color: rgb(255, 255, 255);
}

.navbar-area .nav-container .responsive-mobile-menu .navbar-toggler .navbar-toggler-icon {
  color: rgb(255, 255, 255);
}

.navbar-area .nav-container .responsive-mobile-menu {
  background-color: rgb(26, 26, 26);
}
/* تحويل المتجر للوضع الليلي تلقائياً بناءً على إعدادات جهاز المستخدم */
@media (prefers-color-scheme: dark) {
    /* 1. الخلفية العامة والنصوص */
    body, .section-bg-2, .footer-area, .featured-area, .collection-area, .store-area {
        background-color: #121212 !important;
        color: #e0e0e0 !important;
    }

    /* 2. القائمة العلوية (Navbar) */
    .nav-container, #multi_tenancy_menu, .responsive-mobile-menu {
        background-color: #1a1a1a !important;
        border-bottom: 1px solid #333;
    }

    /* 3. الروابط والأيقونات */
    .nav-link, .navbar-nav a, .menu-icon-open, .menu-toggle-icon i {
        color: #ffffff !important;
    }

    /* 4. البطاقات والعناصر الفرعية */
    .single-featured, .single-collection, .single-product-item, .footer-widget {
        background-color: #1e1e1e !important;
        color: #ffffff !important;
    }

    /* 5. العناوين */
    h1, h2, h3, h4, h5, h6, .title {
        color: #ffffff !important;
    }

    /* 6. تحسين رؤية الصور والظلال */
    img {
        opacity: 0.9; /* تقليل سطوع الصور قليلاً لراحة العين */
    }
    
    .section-title .subtitle {
        color: #c0c0c0 !important;
    }
}