/* تخصيص هوية متجر رايد الفاخرة */
:root {
    --luxury-teal: #062121;    /* أخضر مزرق عميق */
    --classic-gold: #dcb32a;   /* الذهبي العتيق المطلوب */
    --misty-rose: #dcc5bd;     /* وردي ضبابي ناعم */
}

/* 1. الهيدر والقائمة العلوية */
header.main-header, .site-header, .top-header {
    background-color: var(--luxury-teal) !important;
    border-bottom: 2px solid var(--classic-gold) !important;
}

/* الأيقونات والروابط ونصوص الهيدر */
header a, header i, header span, .header-icon, .main-menu-link {
    color: var(--classic-gold) !important;
}

/* 2. الأزرار (إضافة للسلة وإتمام الطلب) */
.btn-primary, 
.s-button-primary, 
.add-to-cart-btn, 
.product-add-button,
[data-main-button] {
    background-color: var(--classic-gold) !important;
    color: var(--luxury-teal) !important;
    border: none !important;
    font-weight: bold !important;
    border-radius: 4px !important;
    transition: 0.4s ease;
}

/* تأثير عند تمرير الماوس على الأزرار */
.btn-primary:hover, 
.s-button-primary:hover {
    background-color: var(--misty-rose) !important;
    color: var(--luxury-teal) !important;
    box-shadow: 0 4px 12px rgba(220, 179, 42, 0.3);
}

/* 3. أسعار المنتجات */
.product-price, .price, .s-product-card-price {
    color: var(--luxury-teal) !important;
    font-weight: 900 !important;
}

/* 4. شريط الإعلانات العلوي */
.announcement-bar {
    background-color: var(--classic-gold) !important;
    color: var(--luxury-teal) !important;
}

/* 5. الفوتر (تذييل الصفحة) */
footer.main-footer, .site-footer {
    background-color: var(--luxury-teal) !important;
    border-top: 4px solid var(--classic-gold) !important;
}

footer h1, footer h2, footer h3, footer h4, footer a, footer p {
    color: var(--classic-gold) !important;
}

/* 6. وسم "جديد" أو "تخفيض" بالوردي */
.product-label, .badge--new, .s-badge-primary {
    background-color: var(--misty-rose) !important;
    color: var(--luxury-teal) !important;
}

/* 7. أيقونة السلة (الرقم الصغير) */
.cart-badge, .s-cart-summary-count {
    background-color: var(--misty-rose) !important;
    color: var(--luxury-teal) !important;
}