/* =========================================
   تخصيص كامل لمتجر وشاح - WISHAH
   يشمل: الهيدر، الأزرار، الألوان العامة، والفوتر
   ========================================= */

:root {
    --primary-brown: #4d362d;    /* البني الغامق الأساسي */
    --secondary-brown: #3d2a23;  /* بني أغمق للتفاصيل */
    --accent-beige: #c9ae91;     /* البيج الذهبي للهوية */
    --light-bg: #f5efe6;         /* بيج فاتح جداً للخلفيات */
    --white: #ffffff;
}

/* 1. التنسيق العام للمتجر */
body {
    background-color: var(--light-bg) !important;
    color: var(--primary-brown) !important;
}

/* 2. تخصيص أعلى المتجر (Header) */
.main-header {
    background-color: var(--primary-brown) !important;
}



/* تخصيص أيقونات الحساب والسلة في الأعلى */
.header-buttons a, .header-buttons span, .cart-icon {
    color: var(--accent-beige) !important;
}

.cart-badge {
    background-color: var(--accent-beige) !important;
    color: var(--primary-brown) !important;
}

/* 3. تخصيص القائمة العلوية (Navbar) */
.nav-menu {
    background-color: var(--light-bg) !important;
    border-bottom: 1px solid rgba(201, 174, 145, 0.3) !important;
}

.nav-menu a {
    color: var(--primary-brown) !important;
    font-weight: 600 !important;
}

.nav-menu a:hover {
    color: var(--accent-beige) !important;
}

/* 4. تخصيص الأزرار والمنتجات */
.btn-primary, .s-button-primary {
    background-color: var(--primary-brown) !important;
    border-color: var(--primary-brown) !important;
    color: var(--white) !important;
    border-radius: 8px !important;
    transition: 0.3s ease;
}

.btn-primary:hover {
    background-color: var(--accent-beige) !important;
    color: var(--primary-brown) !important;
}

.product-main-price {
    color: var(--primary-brown) !important;
    font-weight: bold !important;
}

/* كود تصحيح خلفية ونصوص الفوتر لمتجر وشاح */

/* 1. توحيد خلفية الفوتر مع القسم الذي فوقه */
.main-footer {
    background-color: #f3f5f6 !important; /* نفس درجة اللون الفاتح في الصورة */
    color: #4d362d !important; /* تحويل النص للون البني */
    padding-top: 50px;
    padding-bottom: 30px;
}

/* 2. تحويل جميع العناوين والنصوص والروابط للون البني */
.main-footer h4, 
.main-footer .footer-title,
.main-footer p,
.main-footer span,
.main-footer li,
.main-footer a {
    color: #4d362d !important; /* اللون البني الأساسي للهوية */
}

/* 3. تنسيق أيقونات التواصل الاجتماعي لتكون بنية */
.footer-social-icons a {
    background-color: transparent !important;
    color: #4d362d !important;
    border: 1px solid #4d362d !important; /* إطار بني حول الأيقونات */
    border-radius: 50%;
    width: 35px;
    height: 35px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 5px;
}

/* 4. تعديل شريط الحقوق السفلي (صنع بإتقان) */
.sub-footer {
    background-color: #4d362d !important; /* خلفية بنية للشريط السفلي الصغير فقط */
}

.sub-footer p, 
.sub-footer span, 
.sub-footer a {
    color: #ffffff !important; /* نص أبيض داخل الشريط البني السفلي للتباين */
}

/* 5. إزالة أي شفافية قد تؤثر على وضوح النص */
.main-footer .store-description {
    opacity: 1 !important;
    color: #4d362d !important;
}