/* ألوان خاصة بالصفحة الرئيسية */

/* تغيير لون الخلفية السوداء إلى لون أزرق غامق جذاب */
.hero-section {
    background: linear-gradient(135deg, #1e3a8a 0%, #3730a3 100%) !important;
}

/* تغيير لون الشاشة السوداء في صورة الهاتف */
.hero-product {
    filter: hue-rotate(200deg) saturate(1.2) brightness(1.1) !important;
}

/* تغيير لون الكرات العائمة إلى ألوان جذابة */
.floating-element {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    box-shadow: 0 4px 20px rgba(102, 126, 234, 0.4) !important;
}

.floating-element:nth-child(1) {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    box-shadow: 0 4px 20px rgba(102, 126, 234, 0.4) !important;
}

.floating-element:nth-child(2) {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    box-shadow: 0 4px 20px rgba(102, 126, 234, 0.4) !important;
}

.floating-element:nth-child(3) {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    box-shadow: 0 4px 20px rgba(102, 126, 234, 0.4) !important;
}

/* تغيير لون النص في القسم الرئيسي */
.hero-title {
    color: #ffffff !important;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3) !important;
}

.hero-subtitle {
    color: #e2e8f0 !important;
}

.hero-feature {
    color: #f1f5f9 !important;
}

.hero-feature i {
    background: rgba(255, 255, 255, 0.3) !important;
    color: #ffffff !important;
}

/* تغيير ألوان الأزرار */
.hero-btn-primary {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 4px 15px rgba(102, 126, 234, 0.3) !important;
}

.hero-btn-primary:hover {
    background: linear-gradient(135deg, #5a67d8 0%, #6b46c1 100%) !important;
    transform: translateY(-3px) !important;
    box-shadow: 0 8px 25px rgba(102, 126, 234, 0.4) !important;
}

.hero-btn-secondary {
    background: rgba(255, 255, 255, 0.2) !important;
    color: #ffffff !important;
    border: 2px solid rgba(255, 255, 255, 0.4) !important;
}

.hero-btn-secondary:hover {
    background: rgba(255, 255, 255, 0.3) !important;
    border-color: rgba(255, 255, 255, 0.6) !important;
}

/* تغيير لون شريط العروض العلوي */
.top-offer-bar {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
}

/* تغيير لون الهيدر */
.modern-header {
    background: rgba(255, 255, 255, 0.98) !important;
    border-bottom: 1px solid rgba(102, 126, 234, 0.2) !important;
}

.logo-icon {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
}

.nav-link:hover {
    color: #667eea !important;
}

.nav-link::after {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
}

.icon-btn:hover {
    background: rgba(102, 126, 234, 0.1) !important;
    color: #667eea !important;
}

.menu-toggle:hover {
    background: rgba(102, 126, 234, 0.1) !important;
    color: #667eea !important;
}

/* تغيير ألوان قسم المنتجات */
.latest-products-section {
    background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%) !important;
}

.section-title::after {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
}

.product-card::before {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
}

.product-category {
    color: #667eea !important;
}

.current-price {
    color: #667eea !important;
}

.btn-primary {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
}

.btn-primary:hover {
    box-shadow: 0 8px 25px rgba(102, 126, 234, 0.3) !important;
}

.btn-secondary {
    background: rgba(102, 126, 234, 0.1) !important;
    color: #667eea !important;
    border: 2px solid rgba(102, 126, 234, 0.2) !important;
}

.btn-secondary:hover {
    background: rgba(102, 126, 234, 0.2) !important;
}

/* تغيير لون قسم العروض الخاصة */
.special-offers {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
}

/* تأثيرات إضافية للكرات العائمة */
@keyframes float {
    0%, 100% {
        transform: translateY(0px) rotate(0deg) scale(1);
    }
    50% {
        transform: translateY(-20px) rotate(180deg) scale(1.1);
    }
}

.floating-element {
    animation: float 6s ease-in-out infinite !important;
}

.floating-element:nth-child(1) {
    animation-delay: 0s !important;
}

.floating-element:nth-child(2) {
    animation-delay: 2s !important;
}

.floating-element:nth-child(3) {
    animation-delay: 4s !important;
}

/* تأثير توهج للكرات العائمة */
.floating-element::before {
    content: '';
    position: absolute;
    top: -2px;
    left: -2px;
    right: -2px;
    bottom: -2px;
    background: inherit;
    border-radius: inherit;
    filter: blur(8px);
    opacity: 0.6;
    z-index: -1;
}

/* تحسين مظهر صورة الهاتف */
.hero-product {
    filter: drop-shadow(0 20px 40px rgba(102, 126, 234, 0.3)) !important;
}

/* تأثيرات إضافية للقسم الرئيسي */
.hero-section::before {
    background: radial-gradient(circle at 20% 50%, rgba(245, 158, 11, 0.1) 0%, transparent 50%),
                radial-gradient(circle at 80% 20%, rgba(16, 185, 129, 0.1) 0%, transparent 50%),
                radial-gradient(circle at 40% 80%, rgba(139, 92, 246, 0.1) 0%, transparent 50%) !important;
}