#mainnav > div > div > div > div.flex.items-center.justify-end.my-2\.5 salla-cart-summary a p b {
    color: #ffffff !important;
}


:root {
  --circle-size: 80px;      /* حجم الدائرة بالكامل */
  --ring-size: 8px;          /* سماكة حلقة RGB */
  --blur: 8px;
  --speed: 3.5s;
}

/* الغلاف الأساسي حول الشعار */
.logo-rgb-wrap {
  position: relative;
  width: var(--circle-size);
  height: var(--circle-size);
  border-radius: 100%;
  background: #000;          /* خلفية سوداء */
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: visible;
}

/* الشعار */
.logo-rgb-wrap img {
  height: calc(var(--circle-size) - 45px); 
  width: auto;
  z-index: 5;
  object-fit: contain;
}

/* الحلقة RGB */
.logo-rgb-wrap::before {
  content: "";
  position: absolute;
  inset: calc(-0 * var(--ring-size));
  border-radius: 50%;
  background: conic-gradient(
      #00f,
      #7f00ff,
      #ff0080,
      #00f
  );
  padding: var(--ring-size);
  -webkit-mask: radial-gradient(
      farthest-side,
      transparent calc(95% - var(--ring-size)),
      black calc(100% - var(--ring-size))
  );
  filter: blur(var(--blur));
  animation: spin var(--speed) linear infinite;
  z-index: 1;
}

/* حركة الدوران */
@keyframes spin {
  to { transform: rotate(360deg); }
}





/* الأيقونات الثلاثة */
#main-content section.s-block.s-block--features.container > div > div:nth-child(1) > div,
#main-content section.s-block.s-block--features.container > div > div:nth-child(2) > div,
#main-content section.s-block.s-block--features.container > div > div:nth-child(3) > div {
    width: 70px;
    height: 70px;
    position: relative;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background: #000; /* قلب الدائرة */
}

/* الحلقة المتدرجة */
#main-content section.s-block.s-block--features.container > div > div:nth-child(1) > div::before,
#main-content section.s-block.s-block--features.container > div > div:nth-child(2) > div::before,
#main-content section.s-block.s-block--features.container > div > div:nth-child(3) > div::before {
    content: "";
    position: absolute;
    inset: -3px;
    border-radius: 50%;
    background: conic-gradient(
        #0066ff,   /* أزرق */
        #7f00ff,   /* بنفسجي */
        #ff1493,   /* وردي */
        #0066ff
    );
    animation: spin 6s linear infinite;
    z-index: 1;
}

/* قلب الدائرة يغطي الحلقة */
#main-content section.s-block.s-block--features.container > div > div:nth-child(1) > div::after,
#main-content section.s-block.s-block--features.container > div > div:nth-child(2) > div::after,
#main-content section.s-block.s-block--features.container > div > div:nth-child(3) > div::after {
    content: "";
    position: absolute;
    inset: 8px;
    border-radius: 100%;
    background: #000;
    z-index: 2;
}

/* الأيقونة نفسها */
#main-content section.s-block.s-block--features.container svg,
#main-content section.s-block.s-block--features.container i {
    color: #fff !important;
    fill: #fff !important;
    width: 40px;
    height: 40px;
    z-index: 3;
    position: relative;
}

/* حركة الدوران */
@keyframes spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}









#mainnav {
    background: linear-gradient(120deg, #000000, #001a33, #000000);
    background-size: 300% 300%;
    animation: navBlueMove 10s ease infinite;
}

@keyframes navBlueMove {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}










i.header-btn__icon.icon.sicon-shopping-bag::before {
    background: linear-gradient(135deg, #007bff, #8a2be2, #ff69b4) !important;
    -webkit-background-clip: text !important;
    color: transparent !important;
}











#mainnav > div > div > div > div.flex.items-center.justify-end.my-2\.5 > salla-cart-summary > a > p > b > i {
    color: #ffffff !important;
}





#\31 498909573 > a > span {
    background: linear-gradient(90deg, #00aaff, #7b00ff, #ff3bbf);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: bold;
}
#\31 888540816 > a > span,
#\31 994638775 > a > span {
    background: linear-gradient(90deg, #00aaff, #7b00ff, #ff3bbf);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: bold;
}
/* السهم الصغير لكل الأقسام */
#\31 888540816 > a::after,
#\31 994638775 > a::after,
#\31 498909573 > a::after { 
    background: linear-gradient(90deg, #00aaff, #7b00ff, #ff3bbf) !important;
}






/* واتساب – أخضر */
#contact-slot a[href*="wa.me"] svg path,
#contact-slot a[href*="whatsapp"] svg path,
salla-social a[href*="wa.me"] svg path,
salla-social a[href*="whatsapp"] svg path {
    fill: #25D366 !important;
}

/* يوتيوب – أحمر */
#contact-slot a[href*="youtube"] svg path,
salla-social a[href*="youtube"] svg path,
#contact-slot a[href*="youtu"] svg path,
salla-social a[href*="youtu"] svg path {
    fill: #FF0000 !important;
}

/* تيك توك – الألوان الرسمية */
#contact-slot a[href*="tiktok"] svg path,
salla-social a[href*="tiktok"] svg path {
    fill: #ffffff !important; /* الأبيض */
    stroke: none !important;
}

/* تأثير لون تيك توك (وردي + فيروزي) */
#contact-slot a[href*="tiktok"] svg,
salla-social a[href*="tiktok"] svg {
    filter:
        drop-shadow(2px 2px 0px #25F4EE)
        drop-shadow(-2px -2px 0px #FE2C55);
}





#mainnav,
#mainnav * {
    box-shadow: none !important;
    filter: none !important;
}





/* خلفية main-content – اختر الشدة اللي تناسبك */

/* 1) أسود خفيف (الافتراضي) */
#main-content {
    background: rgba(0, 0, 0, 0.90) !important;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}

/* 2) أسود أغلب (غامق) */
/*
#main-content {
    background: rgba(0, 0, 0, 0.95) !important;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}
*/

/* 3) أسود أخف */
 /*
#main-content {
    background: rgba(0, 0, 0, 0.80) !important;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}






ج/* خلفية الفوتر: أزرق غامق → أسود */
#app > div.app-inner.flex.flex-col.min-h-full > footer {
    background: linear-gradient(135deg, #001d3d, #000000) !important;
    background-size: 200% 200%;
    animation: footerGradient 10s ease infinite;
}

/* حركة التدرج */
@keyframes footerGradient {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}
footer.store-footer {
    background: linear-gradient(135deg, #001a33, #000000) !important;
    background-size: 200% 200%;
    animation: footerBlueBlack 1s ease infinite;
    color: #fff !important;
}




#app > div.app-inner.flex.flex-col.min-h-full {
    background: linear-gradient(160deg, #000000 0%, #001a33 50%, #003366 100%) !important;
}










#main-content {
    background: radial-gradient(circle at 30% 20%, #2d2d2d 0%, #1a1a1a 60%, #111 100%) !important;
}












#main-content > section.s-block.s-block--testimonials.s-block--custom-testimonials.container.overflow-hidden > div > div > h1 {
    color: #ffffff !important;
}







/* label */
#main-content > div > div > div > div.mb-4.sm\:mb-6.flex.justify-between.items-center > div > div > label {
    color: #ffffff !important;
}

/* عنوان الصفحة */
#page-main-title {
    color: #ffffff !important;
}

/* رابط مسار التنقل (breadcrumb) */
#main-content > div > nav > salla-breadcrumb > ol > li:nth-child(1) > a {
    color: #ffffff !important;
}






/* كل عناصر الـ breadcrumb تكون باللون الأبيض */
#main-content nav salla-breadcrumb * {
    color: #ffffff !important;
    fill: #ffffff !important; /* للأيقونات SVG */
}





#product-119211298 > div.main-content.md\:sticky.md\:overflow-hidden.top-24.w-full.md\:w-2\/4.md\:pb-16 > h1 {
    color: #ffffff !important;
}







#product-119211298 > div.main-content.md\:sticky.md\:overflow-hidden.top-24.w-full.md\:w-2\/4.md\:pb-16 
    > div.flex.whitespace-nowrap.gap-4.items-center 
    > div.gap-4.flex > h2 {
    color: #ffffff !important;
}





/* أقوى قاعدة CSS — ضعها في آخر ملف custom CSS */
#s-products-slider-05aliukc7,
#s-products-slider-05aliukc7 * {
  color: unset !important;
  background: none !important;
  -webkit-background-clip: unset !important;
  -webkit-text-fill-color: unset !important;
}













.s-slider-block__title-right h2 {
    background: linear-gradient(90deg, #00aaff, #7b00ff, #ff3bbf);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}