/* ============================================
   GIRLS STYLE — ستايل البنات
   CSS موحّد نهائي v3 لقالب رائد (Raed) على سلة
   الهوية: وردي #F8C8DC | أسود #000 | بيج #F5E6DA
   ============================================ */

/* ===== الخلفية العامة ===== */
body.theme-raed {
  background-color: #FAF5F0 !important;
  color: #000000 !important;
}

body.theme-raed .app-inner {
  background-color: #FAF5F0 !important;
}

/* ===== الهيدر ===== */
body.theme-raed .main-nav,
body.theme-raed #mainnav,
body.theme-raed nav,
body.theme-raed .is-sticky-product-bar header {
  background-color: #FAF5F0 !important;
  border-bottom: 1px solid #F5E6DA !important;
}

/* ===== شريط الإعلانات العلوي ===== */
body.theme-raed .topnav-is-dark .top-navbar,
body.theme-raed .top-navbar {
  background-color: #000000 !important;
  color: #ffffff !important;
}

body.theme-raed .top-navbar a,
body.theme-raed .top-navbar span {
  color: rgba(255,255,255,0.7) !important;
}

body.theme-raed .top-navbar svg,
body.theme-raed .top-navbar [class*="icon"] {
  color: #ffffff !important;
  fill: currentColor !important;
  stroke: currentColor !important;
}

/* ===== أيقونات الهيدر + sallaicons ===== */
body.theme-raed header svg,
body.theme-raed .main-nav svg,
body.theme-raed #mainnav svg,
body.theme-raed header i,
body.theme-raed .main-nav i,
body.theme-raed #mainnav i,
body.theme-raed header [class*="icon"],
body.theme-raed .main-nav [class*="icon"],
body.theme-raed #mainnav [class*="icon"] {
  color: #000000 !important;
  fill: currentColor !important;
  stroke: currentColor !important;
  opacity: 1 !important;
}

body.theme-raed header button,
body.theme-raed header a,
body.theme-raed .main-nav button,
body.theme-raed .main-nav a {
  color: #000000 !important;
}

body.theme-raed salla-search,
body.theme-raed salla-user-menu,
body.theme-raed salla-cart-summary,
body.theme-raed salla-login-modal,
body.theme-raed salla-menu-icon,
body.theme-raed .s-icon,
body.theme-raed .icon {
  color: #000000 !important;
}

/* حماية خط sallaicons */
body.theme-raed [class^="sicon-"],
body.theme-raed [class*=" sicon-"],
body.theme-raed [class^="sicon-"]::before,
body.theme-raed [class*=" sicon-"]::before {
  font-family: "sallaicons" !important;
  font-style: normal !important;
  font-weight: normal !important;
  speak: never !important;
  -webkit-font-smoothing: antialiased !important;
}

body.theme-raed .store-header [class^="sicon-"],
body.theme-raed .store-header [class*=" sicon-"],
body.theme-raed .store-header svg {
  color: #000000 !important;
  opacity: 1 !important;
  visibility: visible !important;
}

body.theme-raed .store-header button,
body.theme-raed .store-header a {
  opacity: 1 !important;
  visibility: visible !important;
}

/* ===== عداد السلة ===== */
body.theme-raed .header__cart-count,
body.theme-raed [class*="cart-count"],
body.theme-raed [class*="cart"] .badge {
  background-color: #F8C8DC !important;
  color: #000000 !important;
  font-weight: 700 !important;
}

/* ============================================
   السلايدر الرئيسي — آمن بدون تعديل الهيكل
   ============================================ */

/* أوفرلاي فقط — بدون تغيير position لأي عنصر */
body.theme-raed .s-block--hero-slider .swiper-slide::after {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  background: linear-gradient(
    to top,
    rgba(0, 0, 0, 0.55) 0%,
    rgba(0, 0, 0, 0.25) 40%,
    rgba(0, 0, 0, 0.1) 70%,
    transparent 100%
  ) !important;
  z-index: 1 !important;
  pointer-events: none !important;
}

/* النص فوق الأوفرلاي — فقط العناصر النصية */
body.theme-raed .s-block--hero-slider .slide-content,
body.theme-raed .s-block--hero-slider .home-slider__content {
  position: relative !important;
  z-index: 2 !important;
}

body.theme-raed .s-block--hero-slider h2 {
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3) !important;
  color: #FFFFFF !important;
  font-family: 'Cairo', sans-serif !important;
  font-weight: 700 !important;
}

body.theme-raed .s-block--hero-slider p {
  text-shadow: 0 1px 8px rgba(0, 0, 0, 0.4) !important;
  color: #FFFFFF !important;
}

/* أزرار السلايدر */
body.theme-raed .home-slider__content .btn,
body.theme-raed .home-slider__content a[class*="btn"] {
  background-color: #F8C8DC !important;
  color: #000000 !important;
  border: none !important;
  border-radius: 50px !important;
  font-weight: 600 !important;
  padding: 12px 32px !important;
  position: relative !important;
  z-index: 2 !important;
}

/* أسهم التنقل */
body.theme-raed .s-block--hero-slider .swiper-button-next,
body.theme-raed .s-block--hero-slider .swiper-button-prev {
  z-index: 3 !important;
}

/* ============================================
   السلايدر على الجوال
   ============================================ */
@media (max-width: 768px) {
  body.theme-raed .s-block--hero-slider h2 {
    font-size: 18px !important;
    line-height: 1.5 !important;
    text-align: center !important;
  }

  body.theme-raed .s-block--hero-slider p {
    font-size: 12px !important;
    text-align: center !important;
  }

  body.theme-raed .s-product-card-entry {
    border-radius: 12px !important;
  }
}

/* ============================================
   بوكسات الأقسام — تدرج بيج ↔ وردي
   ============================================ */
body.theme-raed .s-block--categories-style-1 .cat-item,
body.theme-raed .s-block--categories .cat-item,
body.theme-raed .s-block--categories-style-1 .category-card,
body.theme-raed .s-block--categories .swiper-slide a {
  background: linear-gradient(135deg, #FAF5F0 0%, #FDF0F4 100%) !important;
  border: 1.5px solid #F5E6DA !important;
  border-radius: 16px !important;
  transition: all 0.35s ease !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03) !important;
}

/* هوفر: رفع + ظل + تدرج وردي أقوى */
body.theme-raed .s-block--categories-style-1 .cat-item:hover,
body.theme-raed .s-block--categories .cat-item:hover,
body.theme-raed .s-block--categories .swiper-slide a:hover {
  background: linear-gradient(135deg, #FDF0F4 0%, #F8C8DC40 100%) !important;
  border-color: #F8C8DC !important;
  transform: translateY(-6px) !important;
  box-shadow: 0 12px 30px rgba(248, 200, 220, 0.2) !important;
}

/* أيقونات الأقسام — وردي */
body.theme-raed .s-block--categories .cat-item .s-category-card-icon,
body.theme-raed .s-block--categories .cat-item svg,
body.theme-raed .s-block--categories .cat-item i {
  color: #D4829A !important;
}

/* أيقونات الأقسام عند الهوفر — أسود */
body.theme-raed .s-block--categories .cat-item:hover .s-category-card-icon,
body.theme-raed .s-block--categories .cat-item:hover svg,
body.theme-raed .s-block--categories .cat-item:hover i,
body.theme-raed .s-block--categories .swiper-slide a:hover svg,
body.theme-raed .s-block--categories .swiper-slide a:hover i {
  color: #000000 !important;
}

/* اسم القسم */
body.theme-raed .s-block--categories .cat-item span,
body.theme-raed .s-block--categories .cat-item p,
body.theme-raed .s-block--categories .cat-item .cat-name {
  color: #000000 !important;
  font-family: 'Cairo', sans-serif !important;
  font-weight: 600 !important;
}

body.theme-raed .s-block--categories .s-block__item {
  border-radius: 16px !important;
  overflow: hidden !important;
}

/* ============================================
   كروت المنتجات
   ============================================ */
body.theme-raed .s-product-card-entry,
body.theme-raed .s-block--products-slider .product-entry,
body.theme-raed .s-product-card,
body.theme-raed custom-salla-product-card {
  background: #FFFFFF !important;
  border: 1px solid #F5E6DA !important;
  border-radius: 16px !important;
  overflow: hidden !important;
  transition: all 0.35s ease !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04) !important;
}

/* هوفر كروت المنتجات */
body.theme-raed .s-product-card-entry:hover,
body.theme-raed .s-product-card:hover,
body.theme-raed custom-salla-product-card:hover {
  border-color: #F8C8DC !important;
  transform: translateY(-4px) !important;
  box-shadow: 0 12px 32px rgba(248, 200, 220, 0.2) !important;
}

/* تكبير صورة المنتج عند الهوفر */
body.theme-raed .s-product-card-image img {
  transition: transform 0.5s ease !important;
}

body.theme-raed .s-product-card-entry:hover .s-product-card-image img {
  transform: scale(1.05) !important;
}

body.theme-raed .s-product-card-image {
  border-radius: 16px 16px 0 0 !important;
  overflow: hidden !important;
}

/* اسم المنتج */
body.theme-raed .s-product-card-content-title,
body.theme-raed .s-product-card-content-title a {
  font-family: 'Cairo', sans-serif !important;
  font-weight: 600 !important;
  color: #000000 !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
}

/* السعر */
body.theme-raed .s-product-card-price {
  font-family: 'Poppins', sans-serif !important;
  font-weight: 700 !important;
  color: #000000 !important;
}

body.theme-raed .s-product-card-price del {
  color: #999999 !important;
  font-size: 12px !important;
}

body.theme-raed .s-product-card-discount-price {
  color: #D4436E !important;
  font-weight: 700 !important;
}

/* بادج الخصم */
body.theme-raed .s-product-card-entry .badge,
body.theme-raed .s-product-card-entry [class*="badge"] {
  background-color: #000000 !important;
  color: #ffffff !important;
  border-radius: 50px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
}

/* ============================================
   زر أضف للسلة — وردي
   ============================================ */
body.theme-raed .s-product-card-add-to-cart-btn,
body.theme-raed .btn--add-to-cart,
body.theme-raed custom-salla-product-card .s-product-card-add-to-cart-btn,
body.theme-raed custom-salla-product-card .btn--add-to-cart {
  background: #F8C8DC !important;
  color: #000000 !important;
  border: none !important;
  border-radius: 0 0 16px 16px !important;
  font-family: 'Cairo', sans-serif !important;
  font-weight: 600 !important;
  transition: all 0.3s ease !important;
}

body.theme-raed .s-product-card-add-to-cart-btn:hover,
body.theme-raed .btn--add-to-cart:hover {
  background: #E8A0B8 !important;
}

body.theme-raed .s-product-card-add-to-cart-btn i,
body.theme-raed .s-product-card-add-to-cart-btn svg,
body.theme-raed .btn--add-to-cart i,
body.theme-raed .btn--add-to-cart svg {
  color: #000000 !important;
}

/* ============================================
   أيقونة المفضلة (القلب)
   ============================================ */
body.theme-raed .s-product-card-wishlist-btn,
body.theme-raed .wishlist-btn,
body.theme-raed [class*="wishlist"] button {
  background: rgba(255, 255, 255, 0.85) !important;
  border: 1px solid #F5E6DA !important;
  border-radius: 50% !important;
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  min-height: 28px !important;
  max-width: 28px !important;
  max-height: 28px !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 1px 4px rgba(0,0,0,0.06) !important;
  position: absolute !important;
  top: 8px !important;
  right: auto !important;
  left: 8px !important;
  z-index: 5 !important;
}

body.theme-raed .s-product-card-wishlist-btn:hover,
body.theme-raed .wishlist-btn:hover {
  background: #FFF0F5 !important;
  transform: scale(1.05) !important;
}

body.theme-raed .s-product-card-wishlist-btn + .s-product-card-wishlist-btn,
body.theme-raed .wishlist-btn + .wishlist-btn {
  display: none !important;
}

body.theme-raed .s-product-card-wishlist-btn i,
body.theme-raed .s-product-card-wishlist-btn svg,
body.theme-raed .wishlist-btn i,
body.theme-raed .wishlist-btn svg {
  font-size: 13px !important;
  width: 13px !important;
  height: 13px !important;
  color: #D4829A !important;
}

/* ============================================
   بوكسات الميزات — دائرة وردية للأيقونة
   ============================================ */
body.theme-raed .s-block--features .feature-card,
body.theme-raed .s-block--features .s-block__item {
  background: #FAF5F0 !important;
  border: 1px solid #F5E6DA !important;
  border-radius: 16px !important;
  padding: 24px !important;
  text-align: center !important;
  transition: all 0.3s ease !important;
}

body.theme-raed .s-block--features .feature-card:hover,
body.theme-raed .s-block--features .s-block__item:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 8px 24px rgba(248, 200, 220, 0.15) !important;
  border-color: #F8C8DC !important;
}

/* دائرة وردية خلف الأيقونة */
body.theme-raed .s-block--features .feature-card .feature-icon,
body.theme-raed .s-block--features .s-block__item .feature-icon,
body.theme-raed .s-block--features .feature-card > div:first-child,
body.theme-raed .s-block--features .s-block__item > div:first-child {
  background: #F8C8DC !important;
  width: 64px !important;
  height: 64px !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 auto 12px !important;
}

body.theme-raed .s-block--features .feature-card svg,
body.theme-raed .s-block--features .s-block__item svg,
body.theme-raed .s-block--features .feature-card i,
body.theme-raed .s-block--features .s-block__item i {
  color: #8B3A62 !important;
  font-size: 24px !important;
  width: 24px !important;
  height: 24px !important;
}

/* عنوان الميزة */
body.theme-raed .s-block--features .feature-card h3,
body.theme-raed .s-block--features .s-block__item h3,
body.theme-raed .s-block--features .feature-card .feature-title {
  font-family: 'Cairo', sans-serif !important;
  font-weight: 700 !important;
  color: #000000 !important;
  font-size: 15px !important;
}

/* وصف الميزة */
body.theme-raed .s-block--features .feature-card p,
body.theme-raed .s-block--features .s-block__item p {
  color: #666666 !important;
  font-size: 13px !important;
}

/* ============================================
   عناوين الأقسام
   ============================================ */
body.theme-raed .s-block__title,
body.theme-raed .s-block--products-slider h2 {
  font-family: 'Cairo', sans-serif !important;
  font-weight: 700 !important;
  color: #000000 !important;
}

body.theme-raed .s-block--products-slider .s-block__more,
body.theme-raed .s-block--products-slider a[href*="products"] {
  color: #D4829A !important;
  font-family: 'Cairo', sans-serif !important;
  font-weight: 600 !important;
}

/* ============================================
   الأزرار الرئيسية
   ============================================ */
body.theme-raed .btn--primary,
body.theme-raed .s-button-primary,
body.theme-raed .s-button-element.s-button-primary,
body.theme-raed [class*="btn--primary"],
body.theme-raed salla-add-product-button .s-button-element {
  background-color: #000000 !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 50px !important;
  font-weight: 600 !important;
  transition: all 0.3s ease !important;
}

body.theme-raed .btn--primary:hover,
body.theme-raed .s-button-primary:hover {
  background-color: #222222 !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 20px rgba(0,0,0,0.15) !important;
}

body.theme-raed .btn--outline,
body.theme-raed .s-button-outline {
  background-color: transparent !important;
  color: #000000 !important;
  border: 2px solid #000000 !important;
  border-radius: 50px !important;
}

body.theme-raed .btn--outline:hover {
  background-color: #000000 !important;
  color: #ffffff !important;
}

/* ============================================
   القائمة
   ============================================ */
body.theme-raed salla-menu a {
  font-weight: 500 !important;
  transition: color 0.3s ease !important;
}

body.theme-raed salla-menu a:hover {
  color: #D4829A !important;
}

/* ============================================
   الفوتر
   ============================================ */
body.theme-raed .footer-is-dark footer,
body.theme-raed footer,
body.theme-raed .main-footer {
  background-color: #000000 !important;
  color: #ffffff !important;
}

body.theme-raed footer a {
  color: rgba(255,255,255,0.6) !important;
  transition: color 0.3s ease !important;
}

body.theme-raed footer a:hover {
  color: #F8C8DC !important;
}

/* ============================================
   حقول الإدخال
   ============================================ */
body.theme-raed input[type="text"],
body.theme-raed input[type="email"],
body.theme-raed input[type="tel"],
body.theme-raed input[type="password"],
body.theme-raed input[type="search"],
body.theme-raed textarea,
body.theme-raed select {
  border: 1px solid #F5E6DA !important;
  border-radius: 12px !important;
  background-color: #FFFFFF !important;
}

body.theme-raed input:focus,
body.theme-raed textarea:focus {
  border-color: #F8C8DC !important;
  box-shadow: 0 0 0 3px rgba(248, 200, 220, 0.3) !important;
  outline: none !important;
}

/* ============================================
   سكرول بار + أنيميشن
   ============================================ */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #FAF5F0; }
::-webkit-scrollbar-thumb { background: #F8C8DC; border-radius: 3px; }

@keyframes gsFadeUp {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

body.theme-raed .s-product-card-entry {
  animation: gsFadeUp 0.6s ease-out !important;
}