/* Add custom CSS styles below */ 
/* ==========================================================
   BOX Z — النسخة المعتمدة
   مطابقة للون شريط الإعلانات العلوي
   اللون الأساسي: #DA909F
========================================================== */

/* ==========================================================
   أسعار المنتجات
========================================================== */

.price,
.s-product-card-price,
.s-product-card-sale-price,
.s-product-card-regular-price,
salla-money,
salla-money .s-money-amount {
    color: #DA909F !important;
    opacity: 1 !important;
    font-weight: 700 !important;
}

/* ==========================================================
   أزرار إضافة للسلة وتحميل المزيد
========================================================== */

.s-product-card-add-button,
.s-product-card-add-button .s-button-element,
salla-add-product-button .s-button-element,
salla-button .s-button-element,
salla-infinite-scroll button,
salla-infinite-scroll .s-button-element,
.s-infinite-scroll-btn,
.infinite-scroll button {
    background-color: #DA909F !important;
    border-color: #DA909F !important;
    color: #FFFFFF !important;
    opacity: 1 !important;
    font-weight: 700 !important;
    transition:
        background-color 0.15s ease,
        border-color 0.15s ease,
        transform 0.1s ease !important;
}

/* النصوص والأيقونات داخل الأزرار */
.s-product-card-add-button *,
salla-add-product-button .s-button-element *,
salla-button .s-button-element *,
salla-infinite-scroll button *,
salla-infinite-scroll .s-button-element *,
.s-infinite-scroll-btn *,
.infinite-scroll button * {
    color: #FFFFFF !important;
    opacity: 1 !important;
}

/* عند لمس أو ضغط الأزرار يصبح اللون أخف قليلًا */
.s-product-card-add-button:active,
.s-product-card-add-button .s-button-element:active,
salla-add-product-button .s-button-element:active,
salla-button .s-button-element:active,
salla-infinite-scroll button:active,
salla-infinite-scroll .s-button-element:active,
.s-infinite-scroll-btn:active,
.infinite-scroll button:active {
    background-color: #E6AAB6 !important;
    border-color: #E6AAB6 !important;
    transform: scale(0.98) !important;
}

/* ==========================================================
   قلب المفضلة
   يبقى في مكانه الحالي
   خلفيته شفافة والقلب محدد باللون
========================================================== */

.s-product-card-wishlist-btn,
.s-product-card-wishlist-button,
.s-product-card [class*="wishlist"],
.s-product-card [class*="favorite"] {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    opacity: 1 !important;
}

/* إزالة أي خلفية بيضاء من داخل زر القلب */
.s-product-card-wishlist-btn *,
.s-product-card-wishlist-button *,
.s-product-card [class*="wishlist"] *,
.s-product-card [class*="favorite"] * {
    background: transparent !important;
    background-color: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
}

/* لون حدود القلب مع بقاء داخله شفافًا */
.s-product-card-wishlist-btn svg,
.s-product-card-wishlist-button svg,
.s-product-card [class*="wishlist"] svg,
.s-product-card [class*="favorite"] svg,
.s-product-card-wishlist-btn i,
.s-product-card-wishlist-button i {
    color: #DA909F !important;
    stroke: #DA909F !important;
    fill: transparent !important;
    opacity: 1 !important;
    filter: none !important;
}

/* عند إضافة المنتج للمفضلة يمتلئ القلب بنفس اللون */
.s-product-card-wishlist-btn.active svg,
.s-product-card-wishlist-button.active svg,
.s-product-card-wishlist-btn.added svg,
.s-product-card-wishlist-button.added svg,
.s-product-card-wishlist-btn.is-added svg,
.s-product-card-wishlist-button.is-added svg,
.s-product-card-wishlist-btn[aria-pressed="true"] svg,
.s-product-card-wishlist-button[aria-pressed="true"] svg {
    color: #DA909F !important;
    stroke: #DA909F !important;
    fill: #DA909F !important;
}inite-scroll .s
}