/* Add custom CSS styles below *//* ============================================================
   QADIS SOUL - تصميم بتباين عالي وروح للموقع
   ============================================================ */

/* 1. الألوان والخلفيات (كسر البياض القاتل) */
:root {
    --brand-color: #049da0 !important;       /* لون قادس */
    --brand-dark: #037d80 !important;
    --bg-page: #f4f6f8 !important;           /* رمادي فاتح جداً للخلفية */
    --bg-card: #ffffff !important;           /* أبيض ناصع للبطاقات */
    --text-main: #2c3e50 !important;
}

/* 2. تطبيق الخط (ArbFONTS-BR) */
body, h1, h2, h3, h4, p, a, button, span, div {
    font-family: 'ArbFONTS-BR', sans-serif !important;
}

/* تلوين خلفية الصفحة بالكامل */
body {
    background-color: var(--bg-page) !important;
    background-image: none !important;
}

/* ============================================================
   3. إبراز الهيدر (Header)
   ============================================================ */
.header-wrapper, header, .header-theme-bg-primary {
    background: #ffffff !important;
    /* ظل يفصل الهيدر عن باقي الصفحة */
    box-shadow: 0 4px 12px rgba(0,0,0,0.08) !important;
    /* خط سفلي بلون قادس */
    border-bottom: 3px solid var(--brand-color) !important;
    margin-bottom: 40px !important;
    padding-bottom: 10px !important;
    position: relative !important;
    z-index: 100 !important;
}

/* ============================================================
   4. البطاقات "البارزة" (Pop-up Cards)
   ============================================================ */
.product-item, .product-card, .s-product-card-entry {
    background: var(--bg-card) !important;
    border: 1px solid #e1e4e8 !important; /* إطار خفيف */
    border-radius: 16px !important;
    /* ظل يجعل البطاقة تطفو */
    box-shadow: 0 4px 6px rgba(0,0,0,0.02) !important;
    transition: all 0.3s ease !important;
    overflow: hidden !important;
    margin-bottom: 20px !important;
}

/* تأثير التحويم (Hover) */
.product-item:hover, .product-card:hover {
    transform: translateY(-8px) !important; /* حركة للأعلى */
    box-shadow: 0 15px 30px rgba(4, 157, 160, 0.15) !important; /* ظل ملون */
    border-color: var(--brand-color) !important;
}

/* تنسيق صور البطاقات */
.product-item img, .product-card-image {
    border-bottom: 3px solid var(--brand-color) !important; /* خط يفصل الصورة */
    height: 220px !important;
    width: 100% !important;
    object-fit: cover !important;
}

/* ============================================================
   5. أزرار التبرع (واضحة وجذابة)
   ============================================================ */
.btn-add-to-cart, .s-add-to-cart-button, .product-card-add-to-cart {
    background: linear-gradient(135deg, var(--brand-color), var(--brand-dark)) !important;
    color: #fff !important;
    border-radius: 8px !important;
    font-weight: bold !important;
    border: none !important;
    width: 90% !important;
    margin: 10px auto 15px !important;
    display: block !important;
    padding: 12px 0 !important;
    box-shadow: 0 4px 10px rgba(4, 157, 160, 0.2) !important;
}

/* نص الزر */
.btn-add-to-cart span, .s-add-to-cart-button span { display: none !important; }
.btn-add-to-cart::after, .s-add-to-cart-button::after {
    content: "ساهم الآن ✨" !important;
    font-size: 14px !important;
}

/* ============================================================
   6. إخفاء "شحن سريع" و "تسوق آمن" (المزايا التجارية)
   ============================================================ */
/* استهداف قوي لإخفاء الأيقونات التي ظهرت في الصور */
.features-section, 
.store-features, 
.s-store-features,
.feature-item,
.store-features__item {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* إخفاء عناصر أخرى مزعجة */
.product-footer-tax, .product-tax-text, .shipping-info, 
.product-status, .s-product-card-sale-badge, .cart-icon, 
.stock-pills, .product-price {
    display: none !important;
}

/* ============================================================
   7. الفوتر (قاعدة داكنة للصفحة)
   ============================================================ */
.footer-theme-bg-primary, footer, .s-footer {
    background: #263238 !important; /* لون داكن وفخم */
    color: #ffffff !important;
    margin-top: 60px !important;
    padding-top: 40px !important;
    border-top: 5px solid var(--brand-color) !important;
}