body {
    --tw-bg-opacity: 1;
     background-color:#001F3F

}

H2 , H3 , H1 , P , A , .text-gray-800{
COLOR:WHITE!IMPORTANT

}
/* استبدال البنر الحالي بـ GIF */
.s-block--fixed-banner .banner-fixed-banner {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    background-image: url("https://s15.gifyu.com/images/buO3m.gif") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: cover !important;
    overflow: hidden !important;
}

/* إخفاء صورة البنر الأصلية */
.s-block--fixed-banner .banner-fixed-banner img {
    opacity: 0 !important;
    visibility: hidden !important;
    width: 100% !important;
    display: block !important;
}

/* إزالة أي مسافات أو خلفية من الصورة */
.s-block--fixed-banner .banner-fixed-banner picture {
    display: block !important;
    width: 100% !important;
}

/* الجوال */
@media (max-width: 768px) {
    .s-block--fixed-banner .banner-fixed-banner {
        background-size: cover !important;
        background-position: center center !important;
    }
}
.s-product-card-entry .s-product-card-wishlist-btn {
     DISPLAY: NONE;
}
.s-slider-block__title {
    display: grid !important;
    grid-template-columns: 1fr auto 1fr !important;
    align-items: center !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    min-height: 50px !important;
}

/* العنوان في المنتصف */
.s-slider-block__title-right {
    grid-column: 2 !important;
    grid-row: 1 !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
}

.s-slider-block__title-right h2 {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 18px !important;
    margin: 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
    text-align: center !important;
}

/* الخط يمين ويسار */
.s-slider-block__title-right h2::before,
.s-slider-block__title-right h2::after {
    content: "" !important;
    display: block !important;
    width: 45px !important;
    height: 1px !important;
    background: #d5d5d5 !important;
}

/* عرض الكل والأسهم */
.s-slider-block__title-left {
    grid-column: 3 !important;
    grid-row: 1 !important;
    justify-self: end !important;
    display: flex !important;
    align-items: center !important;
    margin: 0 !important;
}
/* =====================================
   كروت المنتجات - منتجين فقط
===================================== */

@media (max-width: 768px) {

    .s-block--best-offers .swiper-slide {
        width: calc(50% - 5px) !important;
        min-width: calc(50% - 5px) !important;
        max-width: calc(50% - 5px) !important;
        flex: 0 0 calc(50% - 5px) !important;
    }

    .s-block--best-offers .s-product-card {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
    }

    .s-block--best-offers .swiper-wrapper {
        gap: 10px !important;
    }
}
/* البنر الثابت بعرض الشاشة بالكامل */
.s-block--fixed-banner {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* إلغاء حدود الـ Container */
.s-block--fixed-banner > .container {
    width: 100vw !important;
    max-width: 100vw !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
}

/* البنر */
.s-block--fixed-banner .banner--fixed {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 0 !important;
}

/* الصورة */
.s-block--fixed-banner .banner--fixed picture,
.s-block--fixed-banner .banner--fixed img {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
}

/* منع أي فراغ أو حدود */
.s-block--fixed-banner .banner--fixed img {
    height: auto !important;
    object-fit: cover !important;
}
/* ======
@media (max-width: 768px) {
    .s-block--fixed-banner > .container {
        width: 100vw !important;
        max-width: 100vw !important;
        margin-left: calc(50% - 50vw) !important;
        margin-right: calc(50% - 50vw) !important;
        padding: 0 !important;
    }

    .s-block--fixed-banner .banner--fixed {
        width: 100vw !important;
    }

    .s-block--fixed-banner .banner--fixed img {
        width: 100vw !important;
    }
}===================================
   MODERN PRODUCT CARDS - SALLA
   تصميم بطاقات المنتجات
   ========================================= */

/* الحاوية الرئيسية للمنتجات */
.s-block--fixed-products .products-list,
.s-block--fixed-products .s-products-list {
    gap: 16px !important;
}

/* بطاقة المنتج */
.s-product-card-entry {
    background: #ffffff !important;
    border: none !important;
    border-radius: 24px !important;
    padding: 12px !important;
    overflow: hidden !important;
    box-shadow: 0 3px 15px rgba(0, 0, 0, 0.035) !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
}

/* تأثير عند تمرير الماوس */
.s-product-card-entry:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.08) !important;
}

/* =========================================
   صورة المنتج
   ========================================= */

.s-product-card-entry .s-product-card-image {
    position: relative !important;
    width: 100% !important;
    aspect-ratio: 1 / 1 !important;
    border-radius: 18px !important;
    overflow: hidden !important;
    background: #f7f7f7 !important;
}

/* صورة المنتج نفسها */
.s-product-card-entry .s-product-card-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    transition: transform 0.4s ease !important;
}

/* تكبير الصورة عند المرور */
.s-product-card-entry:hover
.s-product-card-image img {
    transform: scale(1.03) !important;
}

/* =========================================
   محتوى البطاقة
   ========================================= */

.s-product-card-entry .s-product-card-content {
    padding: 14px 4px 4px !important;
    text-align: right !important;
}

/* اسم المنتج */
.s-product-card-entry .s-product-card-content-title {
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.8 !important;
    color: #222222 !important;
    margin-bottom: 6px !important;
}

/* وصف المنتج */
.s-product-card-entry .s-product-card-content-sub {
    color: #888888 !important;
    font-size: 12px !important;
    line-height: 1.7 !important;
}

/* =========================================
   السعر
   ========================================= */

.s-product-card-entry .s-product-card-price {
    font-size: 18px !important;
    font-weight: 700 !important;
    color: #222222 !important;
    margin-top: 10px !important;
}

/* =========================================
   زر أضف إلى السلة
   ========================================= */

.s-product-card-entry .s-product-card-content-footer {
    margin-top: 14px !important;
}

/* زر الإضافة */
.s-product-card-entry .s-button-element {
    border-radius: 30px !important;
    min-height: 46px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    transition: all 0.3s ease !important;
}

/* =========================================
   زر الإضافة إلى السلة
   ========================================= */

.s-product-card-entry .s-product-card-add-to-cart {
    background: #222323 !important;
    color: #ffffff !important;
    border: 1px solid #222323 !important;
    border-radius: 30px !important;
    width: 100% !important;
    min-height: 46px !important;
}

/* تأثير الزر */
.s-product-card-entry .s-product-card-add-to-cart:hover {
    background: #000000 !important;
    transform: translateY(-1px) !important;
}

/* =========================================
   زر المفضلة
   ========================================= */

.s-product-card-entry .s-product-card-wishlist-btn {
    background: rgba(255, 255, 255, 0.9) !important;
    border-radius: 50% !important;
    width: 38px !important;
    height: 38px !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06) !important;
}

/* =========================================
   تصميم الجوال
   ========================================= */

@media (max-width: 768px) {

    /* المسافات بين البطاقات */
    .s-product-card-entry {
        border-radius: 18px !important;
        padding: 8px !important;
    }

    /* الصور */
    .s-product-card-entry .s-product-card-image {
        border-radius: 14px !important;
        aspect-ratio: 1 / 1 !important;
    }

    /* محتوى المنتج */
    .s-product-card-entry .s-product-card-content {
        padding: 10px 3px 3px !important;
    }

    /* اسم المنتج */
    .s-product-card-entry .s-product-card-content-title {
        font-size: 13px !important;
        line-height: 1.7 !important;
    }

    /* السعر */
    .s-product-card-entry .s-product-card-price {
        font-size: 15px !important;
    }

    /* الأزرار */
    .s-product-card-entry .s-button-element {
        min-height: 40px !important;
        font-size: 11px !important;
    }

    /* المسافة بين البطاقات */
    .s-block--fixed-products .products-list {
        gap: 10px !important;
    }
}/* =========================================
   HEADER - تحسين شامل
   ========================================= */

:root {
    --header-bg: #ffffff;
    --header-text: #222222;
    --header-muted: #777777;
    --header-border: #eeeeee;
    --header-accent: #b79a62;
    --header-hover: #9d814d;
    --header-shadow: 0 3px 18px rgba(0, 0, 0, 0.06);
}


/* =========================================
   الهيدر الرئيسي
   ========================================= */

header,
#mainnav,
.main-navbar,
.top-navbar {
    background: var(--header-bg) !important;
    color: var(--header-text);
}

header {
    position: relative;
    z-index: 100;
    box-shadow: var(--header-shadow);
}


/* الحاوية الداخلية */

#mainnav .container,
.main-navbar .container,
.top-navbar .container {
    max-width: 1400px;
    margin: auto;
}


/* =========================================
   الهيدر العلوي
   ========================================= */

.top-navbar {
    min-height: 38px;
    border-bottom: 1px solid var(--header-border);
    background: #fafafa !important;
}

.top-navbar .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.top-navbar a {
    color: var(--header-muted) !important;
    font-size: 13px;
    text-decoration: none;
    transition: all .25s ease;
}

.top-navbar a:hover {
    color: var(--header-accent) !important;
}


/* =========================================
   الهيدر الرئيسي
   ========================================= */

#mainnav {
    min-height: 76px;
    background: #fff !important;
    border-bottom: 1px solid var(--header-border);
}

#mainnav .inner {
    min-height: 76px;
    display: flex;
    align-items: center;
}


/* =========================================
   الشعار
   ========================================= */

#mainnav a[data-testid="store-header-logo"],
#mainnav .navbar-brand {
    display: flex;
    align-items: center;
    transition: transform .25s ease;
}

#mainnav a[data-testid="store-header-logo"]:hover,
#mainnav .navbar-brand:hover {
    transform: scale(1.03);
}


/* =========================================
   القائمة الأفقية
   ========================================= */

#mainnav nav,
#mainnav .main-menu,
#mainnav .navbar-nav {
    display: flex;
    align-items: center;
    gap: 6px;
}

#mainnav nav a,
#mainnav .main-menu a,
#mainnav .navbar-nav > li > a {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;

    padding: 12px 15px;

    color: #333 !important;
    font-size: 14px;
    font-weight: 500;

    text-decoration: none;
    border-radius: 8px;

    transition:
        color .25s ease,
        background .25s ease,
        transform .25s ease;
}


/* تأثير المرور */

#mainnav nav a:hover,
#mainnav .main-menu a:hover,
#mainnav .navbar-nav > li > a:hover {
    color: var(--header-accent) !important;
    background: rgba(183, 154, 98, 0.07);
}


/* الخط أسفل العنصر */

#mainnav nav a::after,
#mainnav .main-menu a::after,
#mainnav .navbar-nav > li > a::after {
    content: "";
    position: absolute;

    bottom: 4px;
    right: 50%;

    width: 0;
    height: 2px;

    background: var(--header-accent);
    border-radius: 10px;

    transform: translateX(50%);
    transition: width .25s ease;
}

#mainnav nav a:hover::after,
#mainnav .main-menu a:hover::after,
#mainnav .navbar-nav > li > a:hover::after {
    width: 28px;
}


/* =========================================
   أيقونات الهيدر
   ========================================= */

#mainnav button,
#mainnav a {
    -webkit-tap-highlight-color: transparent;
}


/* جميع أزرار الأيقونات */

#mainnav button,
#mainnav .icon,
#mainnav .btn {
    transition: all .25s ease;
}


/* شكل أيقونات المستخدم والسلة والقائمة */

#mainnav .header-btn,
#mainnav .store-header-user-menu,
#mainnav .cart-summary,
#mainnav [data-testid="store-header-cart"],
#mainnav [data-testid="store-header-user-menu"] {
    display: flex;
    align-items: center;
    justify-content: center;
}


 
 
 

/* =========================================
   زر القائمة Menu
   ========================================= */

#mainnav .mobile-menu-btn,
#mainnav [data-testid="store-header-menu"] {
    width: 44px;
    height: 44px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #faf8f3;
    border: 0;

    transition: all .25s ease;
}

#mainnav .mobile-menu-btn:hover,
#mainnav [data-testid="store-header-menu"]:hover {
    background: #f3ede2;
}


/* =========================================
   الأزرار الجانبية - ترتيب أفضل
   ========================================= */

#mainnav .flex.items-center {
    gap: 10px;
}


/* =========================================
   فاصل أنيق بين عناصر الهيدر
   ========================================= */

#mainnav .header-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}


/* =========================================
   تحسين الخط
   ========================================= */

#mainnav,
#mainnav a,
#mainnav button {
    font-family:
        "IBM Plex Sans Arabic",
        "Tajawal",
        "Cairo",
        Arial,
        sans-serif;
}


/* =========================================
   الهيدر عند التمرير
   ========================================= */

header {
    transition: box-shadow .3s ease;
}


/* =========================================
   Breadcrumb
   ========================================= */

.s-breadcrumb-wrapper {
    background: #fafafa;
    border-bottom: 1px solid #f0f0f0;
}

.s-breadcrumb-wrapper a {
    color: #777 !important;
    transition: color .2s ease;
}

.s-breadcrumb-wrapper a:hover {
    color: var(--header-accent) !important;
}


/* =========================================
   الجوال
   ========================================= */

@media (max-width: 768px) {

    #mainnav {
        min-height: 64px;
    }

    #mainnav .inner {
        min-height: 64px;
    }

    #mainnav nav,
    #mainnav .main-menu,
    #mainnav .navbar-nav {
        display: none;
    }

    #mainnav .s-cart-summary-wrapper > a,
    #mainnav [data-testid="store-header-cart"] > a,
    #mainnav [data-testid="store-header-user-menu"],
    #mainnav .store-header-user-menu,
    #mainnav .mobile-menu-btn,
    #mainnav [data-testid="store-header-menu"] {
        width: 40px;
        height: 40px;
    }

    #mainnav svg {
        width: 19px;
        height: 19px;
    }

    .top-navbar {
        display: none;
    }
}


/* =========================================
   شاشات الكمبيوتر الكبيرة
   ========================================= */

@media (min-width: 1024px) {

    #mainnav .inner {
        padding-left: 25px;
        padding-right: 25px;
    }

    #mainnav nav a,
    #mainnav .main-menu a,
    #mainnav .navbar-nav > li > a {
        padding: 13px 17px;
    }
}


/* =========================================
   لمسة فاخرة للون الذهبي
   ========================================= */

#mainnav a:hover,
#mainnav button:hover {
    --icon-color: var(--header-accent);
}


/* =========================================
   إزالة الحدود غير الضرورية
   ========================================= */

#mainnav hr {
    border-color: #eeeeee;
}


/* =========================================
   تحسين مظهر البحث إن وجد
   ========================================= */

#mainnav input[type="search"],
#mainnav input[type="text"] {
    height: 42px;

    border: 1px solid #e8e3da;
    border-radius: 22px;

    background: #faf9f7;

    padding: 0 16px;

    transition: all .25s ease;
}

#mainnav input[type="search"]:focus,
#mainnav input[type="text"]:focus {
    outline: none;

    border-color: var(--header-accent);

    background: #fff;

    box-shadow: 0 0 0 3px rgba(183, 154, 98, .10);
}

/* =========================================
   إصلاح تداخل أيقونة المستخدم مع الشعار
   ========================================= */

/* الحاوية الرئيسية للهيدر */
#mainnav .inner {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 30px !important;
}

/* الشعار */
#mainnav a[data-testid="store-header-logo"],
#mainnav .navbar-brand {
    flex: 0 0 auto !important;
    position: relative;
    z-index: 2;
    margin-left: 20px !important;
    margin-right: 20px !important;
}

/* منطقة الأيقونات */
#mainnav .header-actions,
#mainnav .flex.items-center {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    flex: 0 0 auto !important;
    position: relative;
    z-index: 3;
}

/* أيقونة المستخدم */
#mainnav [data-testid="store-header-user-menu"],
#mainnav .store-header-user-menu {
    flex: 0 0 44px !important;
    width: 44px !important;
    height: 44px !important;
    margin: 0 !important;
    position: relative;
}

/* السلة */
#mainnav [data-testid="store-header-cart"],
#mainnav .s-cart-summary-wrapper {
    flex: 0 0 44px !important;
    width: 44px !important;
    margin: 0 !important;
}

/* زر القائمة */
#mainnav [data-testid="store-header-menu"],
#mainnav .mobile-menu-btn {
    flex: 0 0 44px !important;
    width: 44px !important;
    margin: 0 !important;
}

/* منع الشعار من الانكماش */
#mainnav img,
#mainnav .navbar-brand img {
    max-width: 180px;
    flex-shrink: 0 !important;
}

/* مسافة إضافية بين الشعار والأيقونات */
#mainnav .inner > * {
    flex-shrink: 0;
}


/* =========================================
   الكمبيوتر
   ========================================= */

@media (min-width: 1024px) {

    #mainnav .inner {
        padding-left: 30px !important;
        padding-right: 30px !important;
        gap: 40px !important;
    }

    #mainnav a[data-testid="store-header-logo"],
    #mainnav .navbar-brand {
        margin-left: 30px !important;
        margin-right: 30px !important;
    }
}


/* =========================================
   الجوال
   ========================================= */

@media (max-width: 768px) {

    #mainnav .inner {
        gap: 12px !important;
        padding-left: 12px !important;
        padding-right: 12px !important;
    }

    #mainnav a[data-testid="store-header-logo"],
    #mainnav .navbar-brand {
        margin-left: 5px !important;
        margin-right: 5px !important;
    }

    #mainnav .header-actions,
    #mainnav .flex.items-center {
        gap: 6px !important;
    }

    #mainnav [data-testid="store-header-user-menu"],
    #mainnav .store-header-user-menu,
    #mainnav [data-testid="store-header-cart"],
    #mainnav .s-cart-summary-wrapper {
        width: 40px !important;
        flex-basis: 40px !important;
    }
}
/* =========================================
   توسيط الشعار
   ========================================= */

header[data-testid="store-header"]
[data-testid="store-header-logo"] {

    position: absolute !important;

    left: 50% !important;
    right: auto !important;
    top: 50% !important;

    transform: translate(-50%, -50%) !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 140px !important;
    height: 76px !important;

    margin: 0 !important;
    padding: 0 !important;

    z-index: 50 !important;
}

/* حجم صورة الشعار */
header[data-testid="store-header"]
[data-testid="store-header-logo"] img {

    display: block !important;

    width: 130px !important;
    height: 70px !important;

    max-width: none !important;
    max-height: none !important;

    object-fit: contain !important;
}

/* =========================================
   تحسين زر القائمة
   ========================================= */

header[data-testid="store-header"]
[data-testid="store-header-logo"] ~ custom-main-menu {

    margin-right: 0 !important;
}

/* =========================================
   تصميم الجوال
   ========================================= */

@media (max-width: 768px) {

    header[data-testid="store-header"]
    .main-nav-container {

        height: 84px !important;
    }

    header[data-testid="store-header"]
    [data-testid="store-header-logo"] {

        width: 130px !important;
        height: 70px !important;

        left: 50% !important;
        right: auto !important;
        top: 50% !important;

        transform: translate(-50%, -50%) !important;
    }

    header[data-testid="store-header"]
    [data-testid="store-header-logo"] img {

        width: 120px !important;
        height: 65px !important;
    }
}

/* الشاشات الصغيرة */
@media (max-width: 400px) {

    header[data-testid="store-header"]
    [data-testid="store-header-logo"] img {

        width: 110px !important;
        height: 60px !important;
    }
}/* =========================================
   تنسيق بنرات الأقسام - سلة
   عرض صورتين بجانب بعض على الجوال
   ========================================= */

/* الحاوية الرئيسية للبنرات */
[data-testid="store-home-square-banners"] {
    width: 100% !important;
    padding: 0 10px !important;
}

/* شبكة البنرات */
[data-testid="store-home-square-banners"] > div {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
}

/* كل بنر */
[data-testid="store-home-square-banners"] .banner-entry {
    width: 100% !important;
    min-width: 0 !important;
    height: 180px !important;
    border-radius: 12px !important;
    overflow: hidden !important;
}

/* صورة البنر */
[data-testid="store-home-square-banners"] .banner-entry {
    background-size: cover !important;
    background-position: center !important;
}

/* تنسيق النص داخل البنر */
[data-testid="store-home-square-banners"] .banner-entry h3 {
    font-size: 14px !important;
    line-height: 1.6 !important;
    text-align: center !important;
}

[data-testid="store-home-square-banners"] .banner-entry p {
    font-size: 11px !important;
    line-height: 1.6 !important;
    text-align: center !important;
}

/* =========================================
   الشاشات الصغيرة جدًا
   ========================================= */

@media (max-width: 480px) {

    [data-testid="store-home-square-banners"] {
        padding: 0 8px !important;
    }

    [data-testid="store-home-square-banners"] > div {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
    }

    [data-testid="store-home-square-banners"] .banner-entry {
        height: 150px !important;
        border-radius: 10px !important;
    }

    [data-testid="store-home-square-banners"] .banner-entry h3 {
        font-size: 12px !important;
    }

    [data-testid="store-home-square-banners"] .banner-entry p {
        font-size: 10px !important;
    }
}

/* =====================================================
   MODERN BOXED HEADER - SALLA
   ===================================================== */

/* الحاوية الخارجية للهيدر */
.store-header {
    position: relative !important;
    z-index: 100 !important;
    background: transparent !important;
}

 

/* الحاوية الداخلية */
.store-header .main-nav-container > .container {
    width: 100% !important;
    max-width: none !important;

    height: 100% !important;

    padding: 0 !important;
    margin: 0 !important;
}

/* الصف الرئيسي */
.store-header .main-nav-container .flex.items-center.justify-between {
    height: 100% !important;
    width: 100% !important;
}


/* =====================================================
   LOGO
   ===================================================== */

.navbar-brand {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    height: 100% !important;

    margin: 0 !important;
    padding: 0 !important;
}

.navbar-brand img {
    width: auto !important;
    max-width: 82px !important;
    max-height: 44px !important;

    object-fit: contain !important;
}


/* =====================================================
   HEADER ICON GROUP
   ===================================================== */

.store-header .flex.items-center.justify-end {
    display: flex !important;
    align-items: center !important;

    gap: 8px !important;
}


/* =====================================================
   USER ICON
   ===================================================== */

.salla-user-menu {
    display: flex !important;
    align-items: center !important;
}

.salla-user-menu .user-menu-login-btn {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;

    padding: 0 !important;
    margin: 0 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 11px !important;

    background: #f8f8f8 !important;

    border: 1px solid #eeeeee !important;

    box-shadow: none !important;

    transition: all .2s ease !important;
}

.salla-user-menu .user-menu-login-btn svg {
    width: 18px !important;
    height: 18px !important;
}
#mainnav {
    min-height: 76px;
    background: #d9a22f !important;
    border-bottom: 1px solid var(--header-border);
}
.s-product-card-entry {
    background: #d9a22f !important
 }
.store-footer__inner {
    
    background-color: rgb(0 31 63);
  
}
.s-button-primary-outline {
    fill: var(--color-primary);
    color: WHITE;
    BACKGROUND: var(--color-primary);
}

.s-product-card-content-title a {

    COLOR: var(--color-primary)!IMPORTANT;
}
/* =========================================
   FIX HEADER ICONS OVERLAP - SALLA
   ========================================= */

/* الحاوية الرئيسية */
header[data-testid="store-header"] .main-nav-container {
    position: relative !important;
    z-index: 100 !important;
}

/* صف الهيدر */
header[data-testid="store-header"]
.main-nav-container > .container {
    position: relative !important;
}

/* منع أي flex عام من التسبب بالتداخل */
header[data-testid="store-header"]
.main-nav-container
.flex.items-center.justify-between {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    position: relative !important;
    min-height: 68px !important;
}

/* =========================================
   مجموعة الأيقونات
   ========================================= */

header[data-testid="store-header"]
.salla-user-menu,
header[data-testid="store-header"]
.s-cart-summary-wrapper {
    position: relative !important;
    flex: 0 0 auto !important;
}

/* ترتيب مجموعة الأيقونات */
header[data-testid="store-header"]
.flex.items-center.justify-end {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 10px !important;
    flex-shrink: 0 !important;
    position: relative !important;
    z-index: 60 !important;
}

/* =========================================
   أيقونة المستخدم
   ========================================= */

header[data-testid="store-header"]
.salla-user-menu .user-menu-login-btn {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    max-width: 40px !important;

    padding: 0 !important;
    margin: 0 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    position: relative !important;
    border-radius: 50% !important;
    box-sizing: border-box !important;
}
 

 

/* إخفاء إجمالي السلة إذا كان هو سبب ظهور $0 والتداخل */
header[data-testid="store-header"]
.s-cart-summary-total {
    display: none !important;
}

/* =========================================
   منع النصوص من الدخول على الأيقونات
   ========================================= */

header[data-testid="store-header"]
.s-cart-summary-wrapper > a > * {
    flex-shrink: 0 !important;
}

/* =========================================
   الشعار يبقى في المنتصف
   ========================================= */

header[data-testid="store-header"]
[data-testid="store-header-logo"] {
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;

    transform: translate(-50%, -50%) !important;

    z-index: 50 !important;

    margin: 0 !important;
    padding: 0 !important;

    pointer-events: auto !important;
}

/* =========================================
   منع تداخل العناصر العامة
   ========================================= */

header[data-testid="store-header"] .header-actions,
header[data-testid="store-header"] .flex.items-center {
    box-sizing: border-box !important;
}

/* لا تجعل العناصر العامة بعرض الأيقونات */
header[data-testid="store-header"]
.header-actions > *,
header[data-testid="store-header"]
.flex.items-center.justify-end > * {
    flex: 0 0 auto !important;
}

/* =========================================
   الجوال
   ========================================= */

 #mainnav button  , .header-btn__icon.icon{
     BACKGROUND: WHITE;
}

#mainnav nav a, #mainnav .main-menu a, #mainnav .navbar-nav > li > a {
   
    font-size: 18px;
   
 }