#app > div.app-inner.flex.flex-col.min-h-full {
  background: linear-gradient(to left, #3e2c27, #b89f8a, #e8ddd3);
}

#mainnav {
  background: linear-gradient(to right, #3e2c27, #b89f8a, #e8ddd3);
}

/* 🔵 كود صورة البروفايل المخصصة مع تحديد دائري */
#trigger-slot > div {
  background: url('https://i.ibb.co/hxLFg253/Chat-GPT-Image-23-2025-09-44-46.png') no-repeat center center / cover;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  overflow: hidden;
  border: 2px solid #d0b49f; /* لون التحديد */
  box-shadow: 0 0 6px rgba(0,0,0,0.1); /* ظل ناعم */
}

/* 🔵 إخفاء صورة البروفايل الأصلية (img داخل العنصر) */
#trigger-slot > div img {
  display: none !important;
}


/* 🛒 كود صورة السلة داخل #s-cart-icon مع تنسيق دائري */
#s-cart-icon {
  background: url('https://i.ibb.co/Gf6rKBjx/Chat-GPT-Image-23-2025-10-38-34.png') no-repeat center center / cover;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: 2px solid #d0b49f;
  box-shadow: 0 0 6px rgba(0,0,0,0.1);
  overflow: hidden;
  position: relative;
  background-color: transparent;
}

/* 🛒 إخفاء الأيقونة الأصلية داخل السلة */
#s-cart-icon > i {
  display: none !important;
}

/* 🎨 تغيير لون رقم المنتجات داخل السلة إلى الأبيض */
#mainnav > div > div > div > div.flex.items-center.justify-end > salla-cart-summary > a > p > b {
  color: white !important;
}


/* 1️⃣ الحاوية الأساسية للـ navbar */
#mainnav > div > div > div {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 72px; /* اضبط حسب ارتفاع الشريط */
}

/* 2️⃣ الشعار في النص + حركة دوران + تموضع + وهج */
#mainnav .navbar-brand {
  position: absolute !important;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 10;
}

/* 3️⃣ صورة الشعار تدور */
#mainnav .navbar-brand img {
  animation: rotateLogo 4s infinite ease-in-out;
  transform-origin: center;
  display: block;
  position: relative;
  z-index: 2;
}

/* 4️⃣ وهج خلف الشعار */
#mainnav .navbar-brand::before {
  content: "";
  position: absolute;
  top: -10px;
  left: -10px;
  width: calc(100% + 20px);
  height: calc(100% + 20px);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,0.5) 0%, transparent 70%);
  animation: glowPulse 4s infinite ease-in-out;
  z-index: 1;
}

/* 5️⃣ محاذاة أيقونات السلة والبروفايل */
#mainnav .flex.items-center.justify-end {
  display: flex;
  align-items: center;
  gap: 16px;
}

#mainnav .flex.items-center.justify-end > * {
  transform: translateY(5px); /* نزّل الأيقونات شوي */
}

@keyframes rotateLogo {
  0%   { transform: rotateY(0deg); }
  50%  { transform: rotateY(180deg); }
  100% { transform: rotateY(0deg); }
}

@keyframes glowPulse {
  0%, 100% { opacity: 0.3; }
  50%      { opacity: 0.8; }
}

/* ✅ الحاويتين بالقريد */
section:nth-child(5) > div,
section:nth-child(6) > div {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)) !important;
  gap: 10px !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

/* ✅ تنسيق العناصر */
section:nth-child(5) > div > a,
section:nth-child(6) > div > a {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  box-sizing: border-box !important;
}

/* ✅ الصور */
section:nth-child(5) > div > a img,
section:nth-child(6) > div > a img {
  width: 100% !important;
  height: auto !important;
}

/* 🌀 الحركة من اليمين */
@keyframes fadeInRight {
  0% {
    opacity: 0;
    transform: translateX(80px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}

/* 🌀 الحركة من اليسار */
@keyframes fadeInLeft {
  0% {
    opacity: 0;
    transform: translateX(-80px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}

/* ✨ نطبّقها على جميع العناصر بالتناوب في كل قائمة */
section > div > a:nth-child(odd) {
  animation: fadeInRight 0.8s ease forwards;
}

section > div > a:nth-child(even) {
  animation: fadeInLeft 0.8s ease forwards;
}

section.s-block--custom-testimonials h1 {
  font-size: 0 !important;
  position: relative;
}

/* ✅ النص + الخلفية + الوميض في عنصر واحد */
section.s-block--custom-testimonials h1::before {
  content: "من القلب للقلب";
  font-size: 22px;
  font-weight: bold;
  color: #fff;
  padding: 12px 24px;
  border-radius: 12px;
  display: inline-block;
  text-align: center;
  position: relative;
  background: linear-gradient(
    90deg,
    #5c3a1c 0%,
    #7b4f27 25%,
    #fff 50%,
    #7b4f27 75%,
    #5c3a1c 100%
  );
  background-size: 200% auto;
  animation: lightSweep 2.5s infinite linear;
  border: 2px solid #d4af37;
  box-shadow: 0 0 10px rgba(212, 175, 55, 0.4);
  overflow: hidden;
}

/* ✨ الوميض يمشي داخل النص فقط */
@keyframes lightSweep {
  0% {
    background-position: 200% 0;
  }
  100% {
    background-position: 0 0;
  }
}

.s-reviews-testimonial__text p {
  color: #fff !important;
}

.s-reviews-testimonial__info h2 {
  display: inline-block;
  background: #fff;
  color: #000 !important;
  padding: 6px 14px;
  border-radius: 10px;
  font-weight: bold;
  border: 2px solid #d4af37;
  box-shadow: 0 0 15px rgba(212, 175, 55, 0.7);
  animation: goldPulse 2s infinite;
}

/* ✨ حركة نبض وإشعاع ذهبي */
@keyframes goldPulse {
  0% { box-shadow: 0 0 10px rgba(212, 175, 55, 0.5); }
  50% { box-shadow: 0 0 25px rgba(212, 175, 55, 0.9); }
  100% { box-shadow: 0 0 10px rgba(212, 175, 55, 0.5); }
}

.s-reviews-swiper-slide .s-reviews-testimonial {
  background: linear-gradient(135deg, #333, #555) !important; /* رمادي متدرج غامق */
  border-radius: 24px !important; /* تأكيد استدارة الحواف */
  padding: 20px;
  position: relative;
  animation: swingCard 3s infinite ease-in-out;
  box-shadow: 0 0 25px rgba(255,255,255,0.3);
}
.s-reviews-swiper-slide .s-reviews-testimonial {
  border: 2px solid #d4af37; /* حد ذهبي ثابت */
}



footer {
  background: linear-gradient(to left, #3e2c27, #b89f8a, #e8ddd3) !important;
}

#app .store-footer__inner {
  background: linear-gradient(135deg, #5a5a5a, #b0b0b0) !important; /* رمادي داكن بتدرج واضح */
  border-radius: 20px !important;
  border: 2px solid #d4af37 !important;
  padding: 30px;
  max-width: 900px;
  margin: 40px auto;
  color: white !important;                /* النصوص بيضاء */
  text-align: center !important;          /* توسيط النصوص */
}

#custom-credit {
  font-weight: bold;
  color: black;
  text-align: center;
  text-shadow: 0 0 8px white;
  animation: pulseText 2s infinite;
  margin-top: 10px;
}

@keyframes pulseText {
  0%, 100% { text-shadow: 0 0 8px white; }
  50% { text-shadow: 0 0 16px white; }
}



@media (max-width: 768px) {
  #mobile-menu > ul {
    background: linear-gradient(to left, #3e2c27, #b89f8a, #e8ddd3) !important;
  }
}

/* هذا الكود يزيل الخلفية البيضاء ويجعلها شفافة */
.banner, 
.banner * {
  background-color: transparent !important;
  background-image: none !important;
}



/* نحذف الخلفية البيضا من رابط القسم نفسه */
.slide--cat-entry {
  background: transparent !important;
  box-shadow: none !important;
  border: none !important;
}


/* نكسر توزيع الكرت الثابت */
.swiper-slide.slide--one-sixth {
  width: auto !important;
  flex: 0 0 auto !important;
  margin-left: -2px !important;
  margin-right: -2px !important;
  transform: scale(1) !important;
}

section.s-block--categories {
  margin-top: -20px !important;
}

#main-links-1 > div.s-slider-block__title {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 0 !important;
}

#main-links-1 > div.s-slider-block__title > div.s-slider-block__title-right {
  text-align: center !important;
  width: 100% !important;
  margin: 0 auto !important;
}

#main-links-1 .s-slider-container {
  margin-top: -20px !important;
}

.slide--cat-entry img {
  border: 2px solid rgba(218, 165, 32, 0.4) !important; /* ذهبي شفاف */
  border-radius: 50% !important;
  padding: 3px;
  box-sizing: border-box;
}

.slide--cat-entry img:hover {
  box-shadow: 0 0 6px rgba(218, 165, 32, 0.4);
}

.slide--cat-entry {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.slide--cat-entry:hover {
  transform: scale(1.15);
  box-shadow: 0 0 8px rgba(218, 165, 32, 0.3);
}

#main-links-1 .s-slider-block__title-right h2 {
  background: linear-gradient(to bottom, #000000, #d39e00); /* تدرج من الأسود للذهبي */
  padding: 8px 20px;
  border-radius: 50px;
  box-shadow: 0 0 8px rgba(218, 165, 32, 0.3);
  display: inline-block;
  font-weight: bold;
  font-size: 20px;
  text-align: center;
  margin: 0 auto;
  color: white; /* النص أبيض */
  transform: translateX(-10px);
}

/* ✅ تصغير كروت المنتجات المتحركة فقط */
#slider-with-bg-3 .s-products-slider-card.swiper-slide {
  width: 35% !important;
  margin-inline: 0.5% !important;
  min-height: 320px !important;
}

/* ✅ تصغير الخط داخل كروت المنتجات المتحركة */
#slider-with-bg-3 .s-products-slider-card.swiper-slide * {
  font-size: 10px !important;
  line-height: 1.3 !important;
  word-break: break-word !important;
}

/* ✅ إزالة الخلفية من كرت المنتج لكل الأقسام */
.s-product-card-entry {
  background: none !important;
  background-color: transparent !important;
  box-shadow: none !important;
}

/* ✅ صورة المنتج بدون خلفية */
.s-product-card-image {
  background: none !important;
  background-color: transparent !important;
}

/* ✅ لوحة المعلومات (اسم المنتج + السعر + الزر) */
.s-product-card-content {
  background-color: #f5f1e9 !important; /* سكري */
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
  padding: 10px;
  border: none !important;
}

/* ✅ توسيط النصوص */
.s-product-card-content-title,
.s-product-card-content-sub {
  text-align: center !important;
}

/* ✅ زر "أضف للسلة" أو "نفذ المنتج" */
.s-button-btn,
.s-button-wide,
button.s-button-btn {
  background: linear-gradient(to bottom, #000000, #DAA520) !important;
  color: #fff !important;
  font-size: 14px !important;
  padding: 8px 16px !important;
  border-radius: 8px !important;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: auto;
  width: 80%;
}
/* تصغير عرض الكرت في كل السلايدرات */
.s-products-slider-card.swiper-slide {
  width: 35% !important;
  margin-inline: 0.5% !important;
  min-height: 320px !important;
}

/* تصغير الخط في كل النصوص داخل الكروت */
.s-products-slider-card.swiper-slide * {
  font-size: 10px !important;
  line-height: 1.3 !important;
  word-break: break-word !important;
}

.s-button-btn {
  background: linear-gradient(to bottom, #000000, #DAA520) !important;
  color: #fff !important;
  font-size: 12px !important;
  padding: 6px 12px !important;
  border-radius: 8px !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 6px !important; /* مسافة بين الأيقونة والنص */
  width: fit-content !important;
  margin: auto !important;
}