/* Add custom CSS styles below */ 
/* =========================================================
   TAIWAAN STORE — MASTER CSS
   نسخة موحدة ونظيفة
   ========================================================= */

:root,
html {
    /* ألوان الهوية */
    --taiwaan-maroon: #4A0705;
    --taiwaan-red: #D61F26;
    --taiwaan-red-dark: #B8181E;
    --taiwaan-white: #FFFFFF;
    --taiwaan-text: #181818;

    /* اللون الأساسي للعناصر التفاعلية */
    --theme-primary-color: #D61F26 !important;
    --color-primary: #D61F26 !important;
    --color-primary-dark: #B8181E !important;
    --color-primary-light: #E64B50 !important;
    --color-primary-reverse: #FFFFFF !important;
}


/* =========================================================
   1. الهيدر الرئيسي — عنابي
   ========================================================= */

header.store-header,
header.store-header #mainnav,
header.store-header .main-nav-container,
header.store-header .header-inner {
    background-color: #4A0705 !important;
}

header.store-header,
header.store-header #mainnav {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
}


/* أيقونات ونصوص الهيدر فقط */
header.store-header .mburger,
header.store-header .mburger i,
header.store-header .mburger p,
header.store-header .header-btn,
header.store-header .header-btn i,
header.store-header .language-btn,
header.store-header .language-btn span,
header.store-header .s-cart-summary-wrapper,
header.store-header .s-cart-summary-wrapper i {
    color: #FFFFFF !important;
}

header.store-header .s-cart-summary-wrapper svg {
    fill: #FFFFFF !important;
    color: #FFFFFF !important;
}

/* عداد السلة */
header.store-header .s-cart-summary-count {
    background-color: #D61F26 !important;
    color: #FFFFFF !important;
}


/* =========================================================
   2. الشريط الإعلاني المتحرك
   ========================================================= */

.s-block.s-block--notification-bar {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    background-color: #FF0000 !important;
    color: #FFFFFF !important;
}

.s-block--notification-bar .marquee,
.s-block--notification-bar .marquee__track,
.s-block--notification-bar .marquee__text {
    color: #FFFFFF !important;
}


/* =========================================================
   3. القائمة الجانبية — أبيض
   العنصر الحقيقي عندك هو #mobile-menu
   ========================================================= */

#mobile-menu {
    --menu-bg: #FFFFFF !important;
    background-color: #FFFFFF !important;
    color: #181818 !important;
}

#mobile-menu,
#mobile-menu > ul,
#mobile-menu .main-menu,
#mobile-menu ul,
#mobile-menu li {
    background-color: #FFFFFF !important;
}

#mobile-menu a,
#mobile-menu span,
#mobile-menu p,
#mobile-menu button,
#mobile-menu .menu_title,
#mobile-menu .font-primary {
    color: #181818 !important;
}

#mobile-menu li {
    border-color: #EEEEEE !important;
}

#mobile-menu .close-mobile-menu,
#mobile-menu .sicon-cancel,
#mobile-menu i {
    color: #181818 !important;
}


/* =========================================================
   4. اللون الأحمر الموحد لعناصر المتجر
   إضافة للسلة + شراء + العناصر Primary
   ========================================================= */

.bg-primary,
.s-button-primary,
.btn-primary {
    background-color: #D61F26 !important;
    border-color: #D61F26 !important;
    color: #FFFFFF !important;
}

.border-primary {
    border-color: #D61F26 !important;
}

.text-primary {
    color: #D61F26 !important;
}

.s-button-primary:hover,
.btn-primary:hover {
    background-color: #B8181E !important;
    border-color: #B8181E !important;
    color: #FFFFFF !important;
}


/* أزرار إضافة المنتج */
salla-add-product-button .s-button-primary,
.product-form .s-button-primary,
.sticky-product-bar .s-button-primary {
    background-color: #D61F26 !important;
    border-color: #D61F26 !important;
    color: #FFFFFF !important;
}


/* =========================================================
   5. قائمة الحساب
   مهم: لا نلون كل عناصر الهيدر بالأبيض
   حتى لا تختفي هذه القائمة مثل السابق
   ========================================================= */

.store-header .dropdown-menu,
.store-header .user-menu,
.store-header .account-menu {
    background-color: #FFFFFF !important;
    color: #181818 !important;
}

.store-header .dropdown-menu a,
.store-header .dropdown-menu span,
.store-header .dropdown-menu p,
.store-header .user-menu a,
.store-header .user-menu span,
.store-header .account-menu a,
.store-header .account-menu span {
    color: #181818 !important;
}


/* =========================================================
   6. الفوتر — عنابي كامل
   ========================================================= */

footer,
.store-footer,
.footer-top,
.footer-middle,
.footer-bottom {
    background-color: #4A0705 !important;
    color: #FFFFFF !important;
}


/* عناوين الفوتر */
.footer-middle .footer-title,
.footer-middle .s-contacts-title {
    color: #FFFFFF !important;
}


/* وصف المتجر */
.footer-middle .footer-description,
.footer-middle .footer-description p,
.footer-middle > div > p {
    color: #FFFFFF !important;
}


/* روابط تهمك — ظاهرة دائمًا */
.footer-middle .menu-list .footer-list {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.footer-middle .menu-list .footer-list > a {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    color: #FFFFFF !important;
}

.footer-middle .menu-list .footer-list > a:hover {
    color: #FFB3B3 !important;
}


/* خدمة العملاء */
.footer-middle .s-contacts-title,
.footer-middle .s-contacts-item,
.footer-middle .s-contacts-item span {
    color: #FFFFFF !important;
}

.footer-middle .s-contacts-icon {
    background-color: rgba(255,255,255,.14) !important;
    color: #FFFFFF !important;
}

.footer-middle .s-contacts-icon svg {
    fill: #FFFFFF !important;
}


/* بيانات الضريبة */
.footer-middle .vat-num p,
.footer-middle .vat-num span {
    color: #FFFFFF !important;
}


/* الحقوق والتوثيق */
.footer-bottom,
.footer-bottom .copyrights,
.footer-bottom .copyrights p,
.footer-bottom .copyrights a,
.footer-bottom .sbc-certificate,
.footer-bottom .sbc-certificate p {
    color: #FFFFFF !important;
}


/* خطوط الفوتر */
.footer-middle,
.footer-bottom {
    border-color: rgba(255,255,255,.22) !important;
}


/* وسائل الدفع */
.footer-bottom li[class*="pay-"] {
    background-color: #FFFFFF !important;
}


/* حقول الاشتراك في الفوتر */
footer input {
    background-color: #FFFFFF !important;
    color: #181818 !important;
}

footer button[type="submit"] {
    background-color: #D61F26 !important;
    border-color: #D61F26 !important;
    color: #FFFFFF !important;
}


/* =========================================================
   7. حماية من الفراغ الأفقي
   ========================================================= */

html,
body {
    overflow-x: hidden !important;
}


/* =========================================================
   TAIWAAN — ACCOUNT DROPDOWN SAFE FIX
   تنسيق قائمة الحساب فقط بدون إجبارها على الظهور
   ========================================================= */

/* القائمة */
.s-user-menu-dropdown-list {
    background: #FFFFFF !important;
    color: #181818 !important;

    min-width: 260px !important;
    padding: 8px !important;
    margin: 0 !important;

    border: 1px solid #EEEEEE !important;
    border-radius: 12px !important;

    box-shadow: 0 12px 35px rgba(0, 0, 0, 0.12) !important;

    z-index: 99999 !important;
}


/* كل خيار */
.s-user-menu-dropdown-item {
    display: block !important;

    background: transparent !important;
    border-bottom: 1px solid #F0F0F0 !important;
}

.s-user-menu-dropdown-item:last-child {
    border-bottom: 0 !important;
}


/* رابط الخيار */
.s-user-menu-dropdown-item-link {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;

    width: 100% !important;
    padding: 11px 12px !important;

    color: #181818 !important;
    background: transparent !important;

    border-radius: 8px !important;
}


/* اسم الخيار */
.s-user-menu-dropdown-item-title {
    display: inline-block !important;

    color: #181818 !important;
    font-weight: 500 !important;
}


/* الأيقونات */
.s-user-menu-dropdown-item-prefix,
.s-user-menu-dropdown-item-prefix svg {
    color: #4A0705 !important;
    fill: #4A0705 !important;
}

.s-user-menu-dropdown-item-prefix svg {
    width: 19px !important;
    height: 19px !important;
}


/* Hover مرتب */
.s-user-menu-dropdown-item-link:hover {
    background: #F8F3F3 !important;
    color: #4A0705 !important;
}

.s-user-menu-dropdown-item-link:hover
.s-user-menu-dropdown-item-title {
    color: #4A0705 !important;
}


/* تسجيل الخروج */
.s-user-menu-dropdown-item-logout
.s-user-menu-dropdown-item-link,
.s-user-menu-dropdown-item-logout
.s-user-menu-dropdown-item-title {
    color: #D61F26 !important;
}

.s-user-menu-dropdown-item-logout
.s-user-menu-dropdown-item-prefix,
.s-user-menu-dropdown-item-logout
.s-user-menu-dropdown-item-prefix svg {
    color: #D61F26 !important;
    fill: #D61F26 !important;
}


/* =========================================================
   TAIWAAN — FOOTER FULL WIDTH FIX
   توسيع الفوتر فقط بدون تغيير محتواه
   ========================================================= */

/* الفوتر يمتد بعرض الشاشة بالكامل */
footer,
.store-footer {
    width: 100vw !important;
    max-width: none !important;

    position: relative !important;
    left: 50% !important;
    right: 50% !important;

    margin-left: -50vw !important;
    margin-right: -50vw !important;

    background-color: #4A0705 !important;
}


/* المحافظة على ترتيب محتوى الفوتر */
footer .footer-middle,
footer .footer-bottom,
.store-footer .footer-middle,
.store-footer .footer-bottom {
    width: 100% !important;
    box-sizing: border-box !important;
    background-color: #4A0705 !important;
}


/* منع أي فراغ أبيض جانبي */
footer,
footer *,
.store-footer,
.store-footer * {
    box-sizing: border-box !important;
}


/* عنوان تسوق حسب موترك فقط */
h2.w-full.da-cp {
    width: 100% !important;
    text-align: center !important;
    color: #D61F26 !important;
    font-weight: 800 !important;
}