/* Add custom CSS styles below */ 
/* 🚀 تحسين الحركات والانتقالات في ثيم سيليا */

/* ✅ احترام إعدادات المستخدم (تقليل الحركات لو مفعل prefers-reduced-motion) */
@media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* ✅ تأثير تكبير ناعم عند تمرير الماوس على البطاقات والمنتجات */
.product-card:hover,
.card:hover {
  transform: scale(1.03);
  transition: transform 0.3s ease;
}

/* ✅ تأثير تكبير ناعم للصور داخل المنتجات */
.product-card img,
.card img {
  transition: transform 0.4s ease;
}
.product-card img:hover,
.card img:hover {
  transform: scale(1.05);
}

/* ✅ تحريك الأزرار بشكل سلس باستخدام translate */
.button,
.btn {
  transition: transform 0.3s ease, background-color 0.3s ease;
}
.button:hover,
.btn:hover {
  transform: translateY(-3px);
}

/* ✅ السلايدر: تحسين الانتقال باستخدام transform بدلاً من left/right */
.slider-track {
  transition: transform 0.5s ease-in-out;
  will-change: transform;
}

/* ✅ تحسين الأداء بإخبار المتصفح أن العناصر ممكن تتحرك */
.product-card,
.card,
.slider-track,
.button,
.btn {
  will-change: transform;
}