/* إعادة ضبط شاملة لثيم رايد - الهوية الملكية الكاملة
   الألوان: العنابي (var(--color-primary-dark)) والذهبي (var(--color-primary-dark))
*/
/* 1. ضبط المتغيرات الأساسية للمنصة بالكامل */
:root {
    --color-primary: #00b48d!important;
    --color-primary-dark: #00a98b !important;
    --color-primary-reverse: #61f9d8 !important;
    --main-color: var(--color-primary) !important;
    --secondary-color: #61f9d8 !important;
}

/* 2. قسم الهيدر والقائمة العلوية (Header Section) */
div#mainnav {
    background-color: var(--color-primary) !important;
    border-bottom: 0px solid var(--color-primary-dark) !important;
}

header, .main-nav-container, .top-header {
    border-bottom: 1px solid var(--color-primary-dark) !important;
}

.main-menu li.root-level > a, .main-menu li > a {
    /* color: #fff !important; */
    font-weight: bold !important;
}

.main-menu li.root-level > a:hover {
    color: var(--color-primary-reverse) !important;
}

/* أيقونات المستخدم والسلة في الهيدر */
i.header-btn__icon.sicon-user-circle, i.header-btn__icon.sicon-shopping-bag, .header-btn__icon {
    background-color: var(--color-primary) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 8px !important;
}

.s-cart-summary-count {
    background-color: var(--color-primary-reverse) !important;
    color: var(--color-primary) !important;
}

/* 3. العناوين (Titles Style) */
.s-block__title h2, .s-slider-block__title h2, .s-block-header h2, h2.text-lg, .title-main {
    background: linear-gradient(90deg, var(--color-primary) 0%, var(--color-primary-dark) 100%) !important;
    color: #ffffff !important;
    padding: 12px 25px !important;
    border-radius: 5px 25px !important;
    border-right: 4px solid var(--color-primary) !important;
    display: inline-block !important;
}

 
.s-block--features .grid {
    background: linear-gradient(135deg, var(--color-primary-dark) 0%, var(--color-primary-dark) 100%) !important;
    border-radius: 3rem !important;
    border: 1px solid var(--color-primary-dark) !important;
    border-right: 10px solid var(--color-primary-dark) !important;
    padding: 25px 15px !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.2) !important;
    
}

.s-block--features__item {
    background-color: transparent !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    flex: 1 !important;
}

.s-block--features__item h2 {
    color: #ffffff !important;
    font-weight: bold !important;
    font-size: 1rem !important;
    /* تصغير حجم الخط ليتناسب مع الأيقونات الصغير */
    margin-top: 10px !important;
    width: 100% !important;
}

.s-block--features__item p {
    /* display: none !important; */
}
.s-block--features__item p {
    color: #6b7280;
    color: rgb(255 255 255);
}
/* 5. بطاقة المنتج والأزرار */
.s-product-card-promotion-title {
    background: #c62828 !important;
    color: #fff;
}

.s-button-element {
    background-color: var(--color-primary-dark) !important;
    color: #ffffff !important;
    border: 1px solid var(--color-primary-dark) !important;
}

/* 6. المفوتر (Footer Section) */
footer.store-footer {
    background-color: #000 !important;
}

.store-footer__inner {
    background-color: var(--color-primary-dark) !important;
    padding-inline: 30px !important; border-top: 5px solid var(--color-primary-dark) !important;
}

.store-footer h3, .store-footer .footer-title, .store-footer a, .store-footer p, .store-footer span, .store-footer .contact-item {
    color: #ffffff !important;
}

.social-link {
    background-color: #ffffff !important;
    color: var(--color-primary-dark) !important;
    border-radius: 8px !important;
}

/* 7. سكرول بار */
::-webkit-scrollbar-thumb {
    background: var(--color-primary-dark) !important;
}

/* تنسيقات الجوال */
@media (max-width: 768px) {
    .s-block--features .grid {
        flex-wrap: wrap !important;
        /* السماح بالنزول لسطر جديد فقط في الجوال لضمان الوضوح */
        justify-content: center !important;
    }

    .s-block--features__item {
        min-width: 30% !important;
        /* توزيع العناصر بجانب بعضها حتى في الجوال */
    }

    .store-footer__inner * {
        text-align: center !important;
        justify-content: center !important;
    }
}
 

/* تنسيق زر "أضف للسلة" أو الأزرار العريضة */
.s-button-wide {
    width: 100%;
    border-radius: 15px;
}

/* 1. ربط الحركة بالشعار */
.navbar-brand {
    animation: heartbeat 2.5s ease-in-out infinite both;
}

/* 2. تفاصيل حركة التكبير والتصغير (النبض) */
@keyframes heartbeat {
    0% {
        transform: scale(1);
        transform-origin: center center;
        animation-timing-function: ease-out;
    }

    10% {
        transform: scale(0.91);
        animation-timing-function: ease-in;
    }

    17% {
        transform: scale(0.98);
        animation-timing-function: ease-out;
    }

    33% {
        transform: scale(0.87);
        animation-timing-function: ease-in;
    }

    45% {
        transform: scale(1);
        animation-timing-function: ease-out;
    }
}

/* 3. ضبط حجم الشعار على الجوال لضمان ظهور الحركة بوضوح */
@media only screen and (max-width: 700px) {
    .navbar-brand {
        width: 20vw;
    }
}

/* 1. تأثير اللمعان للأزرار (أهدأ وأوضح) */
.s-button-wide {
    position: relative;
    overflow: hidden;
}

.s-button-wide::after {
    content: "";
    background: linear-gradient( 90deg, transparent 0%, rgba(255, 255, 255, 0.6) 50%, transparent 100% );
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    /* سرعة الحركة 3 ثواني لتكون واضحة للعين */
    animation: smooth-shine 3s infinite;
}

/* 2. تأثير اللمعان للعناوين (الخلفيات الملونة للعنوان) */
.s-blocktitle h2, .s-slider-blocktitle h2 {
    position: relative;
    overflow: hidden;
}

.s-blocktitle h2::after, .s-slider-blocktitle h2::after {
    content: "";
    background: linear-gradient( 90deg, transparent 0%, rgba(255, 255, 255, 0.3) 50%, transparent 100% );
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    animation: smooth-shine 4s infinite;
    /* أبطأ قليلاً للعناوين */
}

/* الحركة الموحدة */
@keyframes smooth-shine {
    0% {
        left: -100%;
    }

    30% {
        left: 100%;
    }

    100% {
        left: 100%;
    }
}

/* --- إلصاق البنرات بالهيدر تماماً --- */
/.s-product-card-content-footer .s-product-card-price {
    color: #ffffff !important;
    font-weight: 900 !important;
    text-shadow: 0 0 8px rgba(210, 174, 96, 0.3);
    position: relative;
}

.s-product-card-content-footer .s-product-card-price::after {
    content: '🌙';
    font-size: 10px;
    position: absolute;
    top: -10px;
    right: -15px;
    opacity: 0.6;
}

/* 1. إعداد حاوية شريط الإعلانات */
.salla-announcement {
    background-color: var(--color-primary-dark) !important;
    /* العنابي الملكي */
    height: 45px !important;
    overflow: hidden !important;
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    border-bottom: 2px solid var(--color-primary-dark) !important;
    /* خط ذهبي */
}

.s-user-menu-login-btn svg {
    fill: #ffffff !important ;
    height: 1.25rem;
    width: 1.25rem;
}

button, input:where([type=button]), input:where([type=reset]), input:where([type=submit]) {
    background-color: var(--color-primary) !important ;
    background-image: none;
}

.max-w-sm.leading-6.mb-6 {
    color: #fff;
}
.s-product-availability-wrap .s-button-primary .s-button-text, .s-product-availability-wrap .s-button-solid.s-button-primary .s-button-text, salla-add-product-button[product-status=out-and-notify] .s-button-primary .s-button-text, salla-add-product-button[product-status=out-and-notify] .s-button-solid.s-button-primary .s-button-text {
  
    color: rgb(254 254 254);
}.s-user-menu-trigger {
   
    background-color: rgb(255 255 255 / 0%);
    
}

 
i.sicon-menu.text-primary.text-2xl {  color: #fff !important