/* كود تنظيف الصور وإزالة أي طبقة تعتيم أو تظليل تلقائي في سلة */

.s-block-banners a::after,
.banner-item a::
.s-banner-block a::after,
.banner-wrapper::after,
.banner-entry::after,

.s-block-categories .category-item__image::after,
.category-item a::after {
    background: none !important;
    background-color: transparent !important;
    opacity: 0 !important;
}

/* إظهار الصور بكامل إضاءتها الأصلية ووضوحها */
.banner-item img, 
.category-item img, 
.product-card img, 
salla-product-card img {
    filter: brightness(100%) contrast(100%) !important;
    opacity: 1 !important;
}
/* =================================================== */
/* 1. ألوان الهيدر الأساسية (خلفية زيتوني وأيقونات بيضاء واضحة) */
/* =================================================== */

/* خلفية الشريط العلوي بالكامل */
header, .site-header, .s-header {
    background-color: #798A75 !important; 
}

/* تلوين نصوص وأيقونات الهيدر المباشرة بالأبيض لضمان أعلى درجة وضوح وقراءة */
.site-header a, .site-header span, .site-header i, .site-header svg, .salla-cart-icon {
    color: #FFFFFF !important;
    fill: #FFFFFF !important;
}


/* =================================================== */
/* 2. تعديل أسماء المنتجات والأسعار والتصنيفات إلى الزيتوني */
/* =================================================== */

/* إجبار أسماء المنتجات، الأسعار، العناوين والتصنيفات على اللون الزيتوني */
.product-title, 
.product-price, 
.product-card .product-title, 
.product-card .product-price,
.product-card__title, 
.product-card__price,
salla-product-card .product-title,
salla-product-card .product-price,
h1, h2, h3, h4, h5, h6,
.category-item h3, 
.category-item a, 
.category-item__title,
.s-block-categories .category-title {
    color: #5A6B56 !important;
}


/* =================================================== */
/* 3. باقي ألوان المتجر (الخلفية وبطاقات المنتجات والأزرار) */
/* =================================================== */

/* خلفية الموقع كاملة: اللون البيج الكريمي الدافئ */
html, body, .app-inner, .salla-theme_6, .store-wrapper, main {
    background-color: #F5F3ED !important; 
}

/* بطاقات المنتجات والأقسام: بيضاء ناصعة وبزوايا ناعمة */
.product-card, .s-block, .s-product-card, section, .s-card, .product-box {
    background-color: #FFFFFF !important; 
    border: none !important; 
    border-radius: 15px !important; 
    box-shadow: 0 4px 12px rgba(0,0,0,0.04) !important; 
}

/* زر "إضافة للسلة": أبيض بإطار زيتوني */
salla-button[type="add-to-cart"]::part(button),
.product-card .s-button-element,
.product-card .btn,
.btn--add-to-cart {
    background-color: #FFFFFF !important; 
    color: #798A75 !important; 
    border: 1px solid #798A75 !important; 
    border-radius: 10px !important;
    font-weight: bold !important;
}

salla-button[type="add-to-cart"]::part(button):hover,
.product-card .btn:hover {
    background-color: #798A75 !important;
    color: #FFFFFF !important;
}
/* =======================================================
   1. الهوية الأساسية للمتجر (متغيرات الألوان الزيتوني والبيج)
   ======================================================= */
:root {
    /* اللون الزيتوني الفاخر كعنصر رئيسي */
    --theme-primary: #596916 !important;
    --color-primary: #596916 !important;
    --main-color: #596916 !important;
    --brand-primary: #596916 !important;

    /* اللون البيج الفخم للخلفيات العامة */
    --theme-background: #F4F1EA !important;
    --background-color: #F4F1EA !important;
}

/* تطبيق خلفية البيج الناعمة على كامل صفحات المتجر */
html body {
    background-color: #F4F1EA !important;
}

/* =======================================================
   2. إبراز وتوضيح الأيقونات باللون الزيتوني (مهم جداً)
   ======================================================= */
/* استهداف جميع الأيقونات في الهيدر، البطاقات، والقوائم لتصبح باللون الزيتي */
html body i,
html body svg,
html body .s-icon,
html body .s-header-action-btn i,          /* أيقونات أعلى الصفحة (الحساب، البحث) */
html body .s-header-menu-icon,            /* أيقونة القائمة الجانبية */
html body .s-cart-icon i,                 /* أيقونة السلة */
html body .s-user-nav-trigger i,          /* أيقونة تسجيل الدخول */
html body .s-product-card-wishlist-btn i,  /* أيقونة المفضلة (القلب) داخل بطاقة المنتج */
html body .s-verify-icon,                 /* أيقونة توثيق المتجر */
html body footer i,                        /* أيقونات أسفل الموقع */
html body .s-nav-link i {
    color: #596916 !important;
    fill: #596916 !important; /* للأيقونات المصممة بصيغة SVG */
}

/* استثناء أيقونة الواتساب للمحافظة على لونها الأخضر الأصلي */
html body [class*="whatsapp"] i,
html body [class*="whatsapp"] svg,
html body .whatsapp-icon {
    color: #25D366 !important;
    fill: #25D366 !important;
}

/* =======================================================
   3. أزرار "إضافة للسلة" والأزرار الرئيسية باللون الزيتوني
   ======================================================= */
html body .s-product-card-button,
html body .s-product-card-btn,
html body s-product-card button,
html body .s-button-primary,
html body .product-card .s-button-primary,
html body .s-product-card-footer button,
html body [data-add-to-cart],
html body .s-cart-submit {
    background-color: #596916 !important;
    border-color: #596916 !important;
    color: #FFFFFF !important; /* لون النص داخل الزر أبيض ليكون واضحاً */
}

/* تأثير تفاعلي عند تمرير الماوس على الأزرار (درجة أغمق قليلاً) */
html body .s-product-card-button:hover,
html body .s-button-primary:hover,
html body [data-add-to-cart]:hover {
    background-color: #424F10 !important;
    border-color: #424F10 !important;
}

/* =======================================================
   4. تنسيق بطاقات المنتجات بالتناسق مع البيج
   ======================================================= */
/* جعل خلفية بطاقة المنتج بيضاء ناصعة لتبرز صور منتجاتك الفاخرة، مع إطار بيج ناعم */
html body .s-product-card,
html body .product-card,
html body .s-block,
html body .card {
    background-color: #FFFFFF !important;
    border: 1px solid #E3DEC9 !important; /* إطار ناعم متناسق مع البيج */
    border-radius: 12px !important;       /* زوايا منحنية بشكل أنيق */
}

/* أرقام الأسعار وعناوين المنتجات عند التمرير */
html body .s-product-card-price,
html body .product-price {
    color: #596916 !important; /* السعر باللون الزيتي */
    font-weight: bold !important;
}

html body .s-product-card-title a:hover {
    color: #424F10 !important;
}