/* =========================================================
   SLEEK STYLE — ملف CSS موحّد

   مهم:
   1) ارفع صورة الخلفية في ملفات/صور متجر سلة.
   2) انسخ رابط الصورة العام.
   3) استبدل النص REPLACE_WITH_SALLA_IMAGE_URL في السطر التالي فقط.
   ========================================================= */

:root {
    --store-maroon: #7d0b0a;
    --store-maroon-dark: #4e0908;
    --store-ivory: #f8f2ec;
    --store-white: #ffffff;
    --store-gold: #f5a623;
    --store-text: #2b201d;
    --store-bg-image: url("REPLACE_WITH_SALLA_IMAGE_URL");
    --store-soft-overlay: linear-gradient(
        rgba(255, 252, 248, 0.02),
        rgba(255, 252, 248, 0.07)
    );
    --store-glass: rgba(255, 250, 246, 0.66);
    --store-glass-strong: rgba(255, 250, 246, 0.76);
    --store-border: rgba(125, 11, 10, 0.34);
    --store-shadow:
        0 18px 44px rgba(75, 25, 20, 0.17),
        0 2px 7px rgba(125, 11, 10, 0.10);
}

/* ===== Reset آمن ===== */
*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    min-height: 100vh;
    margin: 0;
    direction: rtl;
    overflow-x: hidden;
    color: var(--store-text);
    font-family: "IBM Plex Sans Arabic", Arial, sans-serif;
    background-color: var(--store-ivory) !important;
    background-image:
        var(--store-soft-overlay),
        var(--store-bg-image) !important;
    background-repeat: no-repeat !important;
    background-position: center top !important;
    background-size: cover !important;
    background-attachment: fixed !important;
}

/* ===== كشف الخلفية الرئيسية ===== */
#app,
.app-inner,
main,
#main-content,
.main-content,
.page-wrapper,
.store-page,
.s-block,
.s-blocks-wrapper,
.s-block__container {
    background-color: transparent !important;
    background-image: none !important;
}

/* ===== الهيدر بالكامل بنفس الخلفية ===== */
header,
#header,
.store-header,
.store-header .top-navbar,
.store-header .main-nav-container,
#mainnav,
#mainnav > .inner {
    background-color: var(--store-glass-strong) !important;
    background-image:
        linear-gradient(
            135deg,
            rgba(125, 11, 10, 0.26) 0%,
            rgba(125, 11, 10, 0.08) 18%,
            transparent 18.3%
        ),
        linear-gradient(
            315deg,
            rgba(40, 31, 28, 0.16) 0%,
            transparent 14%
        ),
        linear-gradient(
            rgba(255, 250, 246, 0.57),
            rgba(255, 250, 246, 0.64)
        ),
        var(--store-bg-image) !important;
    background-repeat: no-repeat !important;
    background-position: center top !important;
    background-size: cover !important;
    border-color: var(--store-border) !important;
    border-bottom: 2px solid rgba(125, 11, 10, 0.48) !important;
    box-shadow: 0 5px 20px rgba(75, 25, 20, 0.10) !important;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}

/* إزالة الألوان القديمة من طبقات الهيدر الداخلية */
.store-header .top-navbar > .container,
.store-header .top-navbar .header-buttons,
.store-header .top-navbar .header-search,
#mainnav > .inner,
#mainnav .container {
    background-color: transparent !important;
}

/* نصوص وأيقونات أعلى الهيدر بالعنابي */
.store-header .top-navbar,
.store-header .top-navbar a,
.store-header .top-navbar button,
.store-header .top-navbar span,
.store-header .top-navbar p,
.store-header .top-navbar label,
.store-header .top-navbar i,
.store-header .top-navbar [class*="sicon-"] {
    color: var(--store-maroon) !important;
    -webkit-text-fill-color: var(--store-maroon) !important;
}

/* التصنيفات الرئيسية في الهيدر */
#mainnav custom-main-menu .main-menu > li > a,
#mainnav custom-main-menu .main-menu > li > a > span,
#mainnav custom-main-menu .main-menu > li > a i {
    color: var(--store-maroon) !important;
    -webkit-text-fill-color: var(--store-maroon) !important;
}

/* أيقونات SVG في الهيدر */
.store-header svg,
.store-header svg path,
.store-header svg circle,
.store-header svg line,
.store-header svg polyline {
    color: var(--store-maroon) !important;
    stroke: currentColor !important;
}

/* مربع البحث */
.store-header input,
.store-header .search-input,
.store-header [data-testid="store-header-search"] {
    color: var(--store-maroon) !important;
    -webkit-text-fill-color: var(--store-maroon) !important;
    background-color: rgba(255, 255, 255, 0.62) !important;
    border: 1px solid var(--store-border) !important;
}

.store-header input::placeholder,
.store-header .search-input::placeholder {
    color: rgba(125, 11, 10, 0.72) !important;
    -webkit-text-fill-color: rgba(125, 11, 10, 0.72) !important;
}

/* زر اللغة والعملات */
.store-header salla-localization-modal,
.store-header salla-localization-modal button,
.store-header .btn--rounded-gray {
    color: var(--store-maroon) !important;
    -webkit-text-fill-color: var(--store-maroon) !important;
    background-color: rgba(255, 255, 255, 0.62) !important;
    border-color: var(--store-border) !important;
}

/* بوكس أيقونة العميل */
.store-header [data-testid="store-header-user-menu"] {
    width: 56px !important;
    height: 56px !important;
    min-width: 56px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
    color: var(--store-maroon) !important;
    background-color: rgba(255, 250, 246, 0.80) !important;
    background-image:
        radial-gradient(
            circle at 82% 16%,
            rgba(125, 11, 10, 0.24),
            transparent 55%
        ),
        linear-gradient(
            rgba(255, 250, 246, 0.45),
            rgba(255, 250, 246, 0.52)
        ),
        var(--store-bg-image) !important;
    background-size: cover !important;
    border: 1px solid rgba(125, 11, 10, 0.38) !important;
    border-radius: 50% !important;
    box-shadow: 0 7px 20px rgba(75, 25, 20, 0.16) !important;
}

.store-header [data-testid="store-header-user-menu"] button,
.store-header [data-testid="store-header-user-menu"] a,
.store-header [data-testid="store-header-user-menu"] [class*="trigger"],
.store-header [data-testid="store-header-user-menu"] [class*="avatar"] {
    background-color: transparent !important;
    background-image: none !important;
    border: 0 !important;
    box-shadow: none !important;
}

.store-header [data-testid="store-header-user-menu"] img {
    width: 42px !important;
    height: 42px !important;
    object-fit: contain !important;
    background-color: transparent !important;
    border-radius: 50% !important;
}

/* ===== فروع التصنيف ===== */
#mainnav custom-main-menu .sub-menu,
.main-nav-container custom-main-menu .sub-menu,
header custom-main-menu .sub-menu {
    overflow: hidden !important;
    color: var(--store-maroon) !important;
    background-color: var(--store-glass-strong) !important;
    background-image:
        linear-gradient(
            135deg,
            rgba(125, 11, 10, 0.18) 0%,
            transparent 24%
        ),
        linear-gradient(
            rgba(255, 250, 246, 0.72),
            rgba(255, 250, 246, 0.78)
        ),
        var(--store-bg-image) !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: cover !important;
    border: 1px solid var(--store-border) !important;
    border-radius: 16px !important;
    box-shadow: var(--store-shadow) !important;
}

#mainnav custom-main-menu .sub-menu ul,
#mainnav custom-main-menu .sub-menu li,
.main-nav-container custom-main-menu .sub-menu ul,
.main-nav-container custom-main-menu .sub-menu li {
    background-color: transparent !important;
    background-image: none !important;
}

#mainnav custom-main-menu .sub-menu *,
.main-nav-container custom-main-menu .sub-menu *,
header custom-main-menu .sub-menu * {
    color: var(--store-maroon) !important;
    -webkit-text-fill-color: var(--store-maroon) !important;
}

#mainnav custom-main-menu .sub-menu li > a {
    padding: 11px 15px !important;
    border-radius: 9px !important;
    transition: background-color 0.25s ease !important;
}

#mainnav custom-main-menu .sub-menu li > a:hover {
    background-color: rgba(125, 11, 10, 0.10) !important;
}

/* قائمة الجوال */
.mm-spn.mm-spn--light,
.mm-spn.mm-spn--light li,
.mm-spn.mm-spn--light li > a,
.mm-spn.mm-spn--light li > span,
#mobile-menu li > a,
#mobile-menu li > span {
    color: var(--store-maroon) !important;
    -webkit-text-fill-color: var(--store-maroon) !important;
}

/* ===== بوكسات أقسام المنتجات ===== */
salla-products-slider,
.s-block--products-slider,
.container--products-list,
.container--product-details,
.content--single-page {
    display: block;
    width: calc(100% - 32px);
    max-width: 1320px;
    margin: 25px auto !important;
    padding: 24px !important;
    background-color: var(--store-glass) !important;
    background-image:
        linear-gradient(
            135deg,
            rgba(125, 11, 10, 0.16) 0%,
            transparent 16%
        ),
        linear-gradient(
            315deg,
            rgba(40, 31, 28, 0.10) 0%,
            transparent 13%
        ),
        linear-gradient(
            rgba(255, 250, 246, 0.58),
            rgba(255, 250, 246, 0.67)
        ),
        var(--store-bg-image) !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: cover !important;
    border: 1px solid var(--store-border) !important;
    border-inline-start: 4px solid rgba(125, 11, 10, 0.62) !important;
    border-radius: 20px !important;
    box-shadow: var(--store-shadow) !important;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}

/* طبقات السلايدر الداخلية */
salla-products-slider > .container,
salla-products-slider .swiper,
salla-products-slider .swiper-wrapper,
salla-products-slider .swiper-slide,
salla-products-slider .s-slider-container,
salla-products-slider .s-products-slider-wrapper {
    background-color: transparent !important;
    background-image: none !important;
}

/* عناوين أقسام المنتجات وعرض الكل */
salla-products-slider .s-block__title,
salla-products-slider .s-block__title *,
salla-products-slider .s-slider-block__title,
salla-products-slider .s-slider-block__title *,
.s-block--products-slider .s-block__title,
.s-block--products-slider .s-block__title * {
    color: var(--store-maroon) !important;
    -webkit-text-fill-color: var(--store-maroon) !important;
}

/* كروت المنتجات */
salla-product-card,
.s-product-card-entry,
.product-entry {
    height: 100%;
    overflow: hidden;
    background-color: var(--store-white) !important;
    background-image: none !important;
    border: 1px solid rgba(125, 11, 10, 0.12) !important;
    border-radius: 16px !important;
    box-shadow: 0 9px 26px rgba(75, 25, 20, 0.13) !important;
    transition: transform 0.28s ease, box-shadow 0.28s ease;
}

salla-product-card:hover,
.s-product-card-entry:hover,
.product-entry:hover {
    transform: translateY(-4px);
    box-shadow: 0 15px 34px rgba(75, 25, 20, 0.18) !important;
}

.s-product-card-image,
.product-entry__image {
    background-color: #fbf8f5 !important;
}

.s-product-card-content,
.product-entry__content {
    background-color: var(--store-white) !important;
}

.s-product-card-content-title,
.s-product-card-content-title a,
.product-entry__title,
.product-entry__title a {
    color: var(--store-text) !important;
    -webkit-text-fill-color: var(--store-text) !important;
}

/* الأسعار — اللون والخط محفوظان */
.s-product-card-price,
.s-product-card-sale-price,
.product-price,
.sale-price,
.total-price,
[data-testid*="price"],
[data-testid*="price"] span {
    color: var(--store-maroon) !important;
    -webkit-text-fill-color: var(--store-maroon) !important;
    font-family:
        "29LT Bukra",
        "29LT Bukara",
        "IBM Plex Sans Arabic",
        sans-serif !important;
    font-size: 18px !important;
    font-weight: 600 !important;
}

/* أسهم سلايدر المنتجات */
salla-products-slider .s-slider-prev,
salla-products-slider .s-slider-next,
salla-products-slider .swiper-button-prev,
salla-products-slider .swiper-button-next {
    color: var(--store-maroon) !important;
    -webkit-text-fill-color: var(--store-maroon) !important;
    background-color: rgba(255, 255, 255, 0.70) !important;
    border: 1px solid var(--store-border) !important;
}

/* ===== قسم آراء العملاء ===== */
.s-block--testimonials,
salla-testimonials,
section[class*="testimonial"] {
    background-color: transparent !important;
    background-image: none !important;
}

/* عبارة آراء العملاء */
.s-block--testimonials .s-block__title,
.s-block--testimonials .s-block__title *,
.s-block--testimonials > h2,
salla-testimonials .s-block__title,
salla-testimonials .s-block__title * {
    color: var(--store-maroon) !important;
    -webkit-text-fill-color: var(--store-maroon) !important;
}

/* بطاقات آراء العملاء */
.s-block--testimonials .swiper-slide,
.s-block--testimonials .testimonial,
.s-block--testimonials .testimonials-item,
.s-block--testimonials [class*="testimonial-item"],
.s-block--testimonials [class*="testimonial__item"],
salla-testimonials .swiper-slide {
    overflow: hidden !important;
    opacity: 1 !important;
    filter: none !important;
    background-color: var(--store-glass-strong) !important;
    background-image:
        linear-gradient(
            135deg,
            rgba(125, 11, 10, 0.20) 0%,
            transparent 25%
        ),
        linear-gradient(
            315deg,
            rgba(40, 31, 28, 0.12) 0%,
            transparent 18%
        ),
        linear-gradient(
            rgba(255, 250, 246, 0.62),
            rgba(255, 250, 246, 0.70)
        ),
        var(--store-bg-image) !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: cover !important;
    border: 1px solid var(--store-border) !important;
    border-top: 3px solid rgba(125, 11, 10, 0.62) !important;
    border-radius: 18px !important;
    box-shadow: var(--store-shadow) !important;
}

/* إزالة الأبيض الصلب من طبقات كرت الرأي */
.s-block--testimonials .swiper-slide div,
.s-block--testimonials .swiper-slide article,
.s-block--testimonials .swiper-slide section,
.s-block--testimonials .swiper-slide figure,
.s-block--testimonials .swiper-slide blockquote,
salla-testimonials .swiper-slide div,
salla-testimonials .swiper-slide article {
    background-color: transparent !important;
    background-image: none !important;
}

/* نص الرأي واسم العميل */
.s-block--testimonials .swiper-slide h1,
.s-block--testimonials .swiper-slide h2,
.s-block--testimonials .swiper-slide h3,
.s-block--testimonials .swiper-slide h4,
.s-block--testimonials .swiper-slide h5,
.s-block--testimonials .swiper-slide p,
.s-block--testimonials .swiper-slide span,
.s-block--testimonials .swiper-slide strong,
.s-block--testimonials .swiper-slide a,
.s-block--testimonials .swiper-slide time,
salla-testimonials .swiper-slide h3,
salla-testimonials .swiper-slide p,
salla-testimonials .swiper-slide span,
salla-testimonials .swiper-slide strong {
    color: var(--store-maroon) !important;
    -webkit-text-fill-color: var(--store-maroon) !important;
}

/* النجوم وعلامات الاقتباس */
.s-block--testimonials [class*="star"],
.s-block--testimonials [class*="quote"],
.s-block--testimonials .sicon-star,
salla-testimonials [class*="star"],
salla-testimonials [class*="quote"] {
    color: var(--store-gold) !important;
    fill: var(--store-gold) !important;
    -webkit-text-fill-color: var(--store-gold) !important;
}

/* ===== الفوتر بنفس الخلفية ===== */
footer,
#footer,
.store-footer,
.store-footer__inner {
    color: var(--store-maroon) !important;
    background-color: var(--store-glass-strong) !important;
    background-image:
        linear-gradient(
            135deg,
            rgba(125, 11, 10, 0.27) 0%,
            rgba(125, 11, 10, 0.08) 20%,
            transparent 20.3%
        ),
        linear-gradient(
            315deg,
            rgba(40, 31, 28, 0.18) 0%,
            transparent 15%
        ),
        linear-gradient(
            rgba(255, 250, 246, 0.55),
            rgba(255, 250, 246, 0.63)
        ),
        var(--store-bg-image) !important;
    background-repeat: no-repeat !important;
    background-position: center bottom !important;
    background-size: cover !important;
    border-color: var(--store-border) !important;
    border-top: 2px solid rgba(125, 11, 10, 0.48) !important;
    box-shadow: 0 -5px 20px rgba(75, 25, 20, 0.10) !important;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}

footer,
footer a,
footer p,
footer span,
footer h1,
footer h2,
footer h3,
footer h4,
footer i,
.store-footer,
.store-footer a,
.store-footer p,
.store-footer span,
.store-footer h1,
.store-footer h2,
.store-footer h3,
.store-footer h4,
.store-footer i {
    color: var(--store-maroon) !important;
    -webkit-text-fill-color: var(--store-maroon) !important;
}

.store-footer svg,
.store-footer svg path,
footer svg,
footer svg path {
    color: var(--store-maroon) !important;
    fill: currentColor !important;
    stroke: currentColor !important;
}

/* ===== زر واتساب ===== */
#whatsapp-btn {
    position: fixed !important;
    left: 24px !important;
    bottom: 24px !important;
    z-index: 9998 !important;
    width: 58px !important;
    height: 58px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: var(--store-white) !important;
    background-color: var(--store-maroon) !important;
    border: 2px solid var(--store-white) !important;
    border-radius: 50% !important;
    box-shadow: 0 8px 24px rgba(75, 25, 20, 0.30) !important;
    text-decoration: none !important;
    transition: transform 0.25s ease, box-shadow 0.25s ease !important;
}

#whatsapp-btn:hover {
    transform: scale(1.07) !important;
    box-shadow: 0 12px 30px rgba(75, 25, 20, 0.40) !important;
}

#whatsapp-btn svg {
    width: 31px !important;
    height: 31px !important;
    color: var(--store-white) !important;
    fill: currentColor !important;
}

/* ===== شاشة البداية إن كانت موجودة ===== */
#splash {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--store-ivory);
    background-image:
        linear-gradient(
            rgba(255, 250, 246, 0.34),
            rgba(255, 250, 246, 0.42)
        ),
        var(--store-bg-image);
    background-position: center;
    background-size: cover;
    transition: opacity 0.8s ease, visibility 0.8s ease;
}

#splash.hidden {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

#store {
    min-height: 100vh;
    opacity: 0;
    transition: opacity 0.6s ease;
}

#store.visible {
    opacity: 1;
}

/* ===== الجوال ===== */
@media (max-width: 767px) {
    body {
        background-attachment: scroll !important;
        background-position: center top !important;
    }

    salla-products-slider,
    .s-block--products-slider,
    .container--products-list,
    .container--product-details,
    .content--single-page {
        width: calc(100% - 20px);
        margin: 14px auto !important;
        padding: 12px !important;
        border-radius: 14px !important;
    }

    salla-product-card,
    .s-product-card-entry,
    .product-entry {
        border-radius: 12px !important;
    }

    salla-product-card:hover,
    .s-product-card-entry:hover,
    .product-entry:hover {
        transform: none;
    }

    .store-header [data-testid="store-header-user-menu"] {
        width: 48px !important;
        height: 48px !important;
        min-width: 48px !important;
    }

    .store-header [data-testid="store-header-user-menu"] img {
        width: 36px !important;
        height: 36px !important;
    }

    #whatsapp-btn {
        left: 18px !important;
        bottom: 18px !important;
        width: 52px !important;
        height: 52px !important;
    }

    #whatsapp-btn svg {
        width: 28px !important;
        height: 28px !important;
    }
}
/* =========================================
   إزالة مربع قائمة التصنيفات الرئيسية
========================================= */

#mainnav,
.store-header .main-nav-container {
    position: relative !important;
    z-index: 9999 !important;
    overflow: visible !important;

    background-color: #faf6f3 !important;
    background-image: linear-gradient(
        110deg,
        rgba(125, 11, 10, 0.08) 0%,
        rgba(255, 250, 246, 0.97) 30%,
        rgba(255, 250, 246, 0.98) 70%,
        rgba(125, 11, 10, 0.06) 100%
    ) !important;

    border-radius: 0 !important;
    box-shadow: none !important;
}

/* إزالة خلفية وحدود المربع الداخلي */

#mainnav > .inner,
#mainnav > .inner > .container,
#mainnav .container,
#mainnav custom-main-menu,
#mainnav custom-main-menu > .main-menu,
#mainnav custom-main-menu .main-menu,
#mainnav salla-menu,
#mainnav salla-menu > .main-menu,
#mainnav nav.main-menu,
#mainnav [role="menubar"] {
    background-color: transparent !important;
    background-image: none !important;

    border: 0 !important;
    outline: 0 !important;
    border-radius: 0 !important;

    box-shadow: none !important;

    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
}

/* إزالة أي مساحة أو إطار زائد */

#mainnav custom-main-menu,
#mainnav salla-menu,
#mainnav .main-menu {
    width: auto !important;
    max-width: none !important;
    min-height: 0 !important;

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

    overflow: visible !important;
}

/* لون التصنيفات الرئيسية */

#mainnav .main-menu > li > a,
#mainnav .main-menu > li > a > span,
#mainnav .main-menu > li > a > i {
    color: #7d0b0a !important;
    -webkit-text-fill-color: #7d0b0a !important;

    background-color: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

/* تأثير بسيط عند مرور الماوس */

#mainnav .main-menu > li > a:hover {
    color: #4e0908 !important;
    -webkit-text-fill-color: #4e0908 !important;

    background-color: rgba(125, 11, 10, 0.05) !important;
    border-radius: 8px !important;
}

/* السماح للقائمة الفرعية بالظهور خارج الهيدر */

#mainnav .main-menu,
#mainnav .main-menu > li,
#mainnav custom-main-menu,
#mainnav salla-menu {
    overflow: visible !important;
}

/* القائمة الفرعية فقط */

#mainnav .main-menu > li > ul,
#mainnav .main-menu > li > .sub-menu,
#mainnav .main-menu > li > .submenu,
#mainnav .main-menu > li > .dropdown-menu,
#mainnav .main-menu > li > .menu-dropdown,
#mainnav .main-menu > li > .mega-menu,
#mainnav .main-menu > li > [role="menu"] {
    position: absolute !important;
    z-index: 10000 !important;

    color: #7d0b0a !important;

    background-color: rgba(255, 250, 246, 0.99) !important;
    background-image: none !important;

    border: 1px solid rgba(125, 11, 10, 0.25) !important;
    border-radius: 12px !important;

    box-shadow:
        0 14px 35px
        rgba(75, 25, 20, 0.18) !important;

    overflow-y: auto !important;
    max-height: calc(100vh - 180px) !important;
}

/* نص فروع التصنيف */

#mainnav .main-menu > li > ul *,
#mainnav .main-menu > li > .sub-menu *,
#mainnav .main-menu > li > .submenu *,
#mainnav .main-menu > li > .dropdown-menu *,
#mainnav .main-menu > li > .menu-dropdown *,
#mainnav .main-menu > li > .mega-menu *,
#mainnav .main-menu > li > [role="menu"] * {
    color: #7d0b0a !important;
    -webkit-text-fill-color: #7d0b0a !important;
}

/* وضع صور ومحتوى المتجر خلف القائمة */

main,
#main-content,
.main-content,
.s-block,
.s-blocks-wrapper,
salla-products-slider {
    position: relative;
    z-index: 1 !important;
}
/* ========================================
   توحيد الهيدر والفوتر وإزالة البوكس الكبير
======================================== */

:root {
    --sleek-maroon: #7d0b0a;
    --sleek-ivory: #faf6f3;
    --sleek-border: rgba(125, 11, 10, 0.22);
}

/* خلفية موحدة للهيدر والفوتر */

header,
#header,
.store-header,
#mainnav,
.store-header .main-nav-container,
footer,
#footer,
.store-footer,
.store-footer__inner {
    background-color: var(--sleek-ivory) !important;

    background-image: linear-gradient(
        110deg,
        rgba(125, 11, 10, 0.06) 0%,
        rgba(255, 250, 246, 0.98) 28%,
        rgba(255, 250, 246, 0.98) 72%,
        rgba(125, 11, 10, 0.06) 100%
    ) !important;

    border-radius: 0 !important;
    box-shadow: none !important;
}

/* خط بسيط يفصل الهيدر والفوتر */

header,
.store-header,
#mainnav {
    border-bottom:
        2px solid
        rgba(125, 11, 10, 0.35) !important;
}

footer,
#footer,
.store-footer {
    border-top:
        2px solid
        rgba(125, 11, 10, 0.35) !important;
}

/* إزالة الخلفيات من طبقات الهيدر الداخلية */

.store-header .top-navbar,
.store-header .top-navbar > .container,
.store-header .main-nav-container,
.store-header .main-nav-container > .container,
#mainnav > .inner,
#mainnav > .inner > .container,
#mainnav .container {
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* ========================================
   إزالة المربع الكبير حول التصنيفات
======================================== */

#mainnav custom-main-menu,
#mainnav custom-main-menu > *,
#mainnav custom-main-menu > .main-menu,
#mainnav salla-menu,
#mainnav salla-menu > *,
#mainnav salla-menu > .main-menu,
#mainnav nav.main-menu,
#mainnav .main-menu,
header custom-main-menu,
header custom-main-menu > *,
header salla-menu,
header salla-menu > * {
    background-color: transparent !important;
    background-image: none !important;

    border: 0 !important;
    outline: 0 !important;
    border-radius: 0 !important;

    box-shadow: none !important;

    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
}

/* تقليل ارتفاع ومساحة قائمة التصنيفات */

#mainnav custom-main-menu,
#mainnav salla-menu,
#mainnav .main-menu {
    min-height: 0 !important;
    height: auto !important;

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

    overflow: visible !important;
}

/* ترتيب التصنيفات دون بوكس */

#mainnav .main-menu {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
}

/* إزالة أي بوكس من كل تصنيف رئيسي */

#mainnav .main-menu > li {
    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;

    overflow: visible !important;
}

/* شكل أسماء التصنيفات */

#mainnav .main-menu > li > a {
    min-height: 52px !important;

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

    padding: 13px 12px !important;

    color: var(--sleek-maroon) !important;
    -webkit-text-fill-color:
        var(--sleek-maroon) !important;

    background: transparent !important;
    border: 0 !important;
    border-radius: 8px !important;
    box-shadow: none !important;

    line-height: 1.4 !important;
}

/* تأثير هادئ عند مرور العميل */

#mainnav .main-menu > li > a:hover {
    color: #4e0908 !important;
    -webkit-text-fill-color: #4e0908 !important;

    background-color:
        rgba(125, 11, 10, 0.05) !important;
}

/* ========================================
   القائمة الفرعية
======================================== */

header,
.store-header,
#mainnav,
#mainnav > .inner,
#mainnav .container,
#mainnav custom-main-menu,
#mainnav salla-menu,
#mainnav .main-menu,
#mainnav .main-menu > li {
    overflow: visible !important;
}

header,
.store-header,
#mainnav {
    position: relative !important;
    z-index: 9999 !important;
}

/* استعادة تصميم البوكس للقائمة الفرعية فقط */

#mainnav .main-menu > li > ul,
#mainnav .main-menu > li > .sub-menu,
#mainnav .main-menu > li > .submenu,
#mainnav .main-menu > li > .dropdown-menu,
#mainnav .main-menu > li > .menu-dropdown,
#mainnav .main-menu > li > .mega-menu,
#mainnav .main-menu > li > [role="menu"] {
    position: absolute !important;
    z-index: 10000 !important;

    min-width: 260px !important;
    max-height: calc(100vh - 180px) !important;

    overflow-x: hidden !important;
    overflow-y: auto !important;

    color: var(--sleek-maroon) !important;

    background-color:
        rgba(255, 250, 246, 0.99) !important;

    background-image: none !important;

    border:
        1px solid
        var(--sleek-border) !important;

    border-radius: 12px !important;

    box-shadow:
        0 14px 32px
        rgba(75, 25, 20, 0.16) !important;
}

/* لون فروع التصنيف */

#mainnav .main-menu > li > ul *,
#mainnav .main-menu > li > .sub-menu *,
#mainnav .main-menu > li > .submenu *,
#mainnav .main-menu > li > .dropdown-menu *,
#mainnav .main-menu > li > .menu-dropdown *,
#mainnav .main-menu > li > .mega-menu *,
#mainnav .main-menu > li > [role="menu"] * {
    color: var(--sleek-maroon) !important;

    -webkit-text-fill-color:
        var(--sleek-maroon) !important;
}

/* وضع الصور خلف كتالوج التصنيفات */

main,
#main-content,
.main-content,
.s-block,
.s-blocks-wrapper,
salla-products-slider {
    position: relative;
    z-index: 1 !important;
}

/* ========================================
   تنظيف طبقات الفوتر الداخلية
======================================== */

footer .container,
footer .footer-list,
footer [class*="footer-block"],
.store-footer .container,
.store-footer__inner {
    background-color: transparent !important;
    background-image: none !important;

    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* نصوص الفوتر */

footer :where(
    a,
    p,
    span,
    h1,
    h2,
    h3,
    h4,
    button,
    i
),
.store-footer :where(
    a,
    p,
    span,
    h1,
    h2,
    h3,
    h4,
    button,
    i
) {
    color: var(--sleek-maroon) !important;

    -webkit-text-fill-color:
        var(--sleek-maroon) !important;
}

/* الجوال */

@media (max-width: 767px) {
    #mainnav .main-menu {
        display: block !important;
    }

    #mainnav .main-menu > li > a {
        min-height: 46px !important;
        padding: 11px 14px !important;
    }

    #mainnav .main-menu > li > ul,
    #mainnav .main-menu > li > .sub-menu,
    #mainnav .main-menu > li > .submenu,
    #mainnav .main-menu > li > .dropdown-menu {
        position: relative !important;
        width: 100% !important;
        min-width: 0 !important;
    }
}