.store-footer__bottom span p {
  color: #000!important;
}
.store-footer__bottom {
  align-items: center;
  justify-content: center;
  background-color: #fff !important;
  padding-top: 1rem;
  padding-bottom: 1rem;
  text-align: center;
}
.store-footer__inner {
  display: grid;
  grid-gap: 2rem;
  gap: 2rem;
  padding-top: 2rem;
  padding-bottom: 2rem;
  padding-left: 1rem;
  padding-right: 1rem;
  background-color: #f6efe6;
}
.smt-app-whatsapp .sm-button.sm-button-circle:not(.sm-small), .smt-app-whatsapp .sm-button.sm-button-circle:not(.sm-small) a:not(.powered-link) {
    height: 40px;
    width: 41px;
}
#whatsapp-container {
  position: fixed; /* العنصر ثابت في مكانه */
  bottom: 100px; /* تحديد المسافة من أسفل الصفحة */
  right: 30px; /* تحديد المسافة من الجهة اليمنى */
  z-index: 10; /* التأكد من أن العنصر يظهر فوق باقي المحتوى */
  display: flex;
  flex-direction: column;
  align-items: center; /* محاذاة الأيقونة والنص في المنتصف */
  justify-content: center;
  transition: all 0.3s ease; /* إضافة تأثيرات سلاسة عند تغيير الخصائص */
}
.rounded
.smt-app-whatsapp .sm-button.sm-button-circle:not(.sm-small), .smt-app-whatsapp .sm-button.sm-button-circle:not(.sm-small) a:not(.powered-link) {
  height: 60px;
  width: 60px;
  display: none; 
}
.smt-app-end_of_trial .smt-wrapper {
  width: auto;
  height: auto;
  display: none;
}

.sicon-whatsapp2::before {
  content: "\e917";
  transform: scale(1.3);
  animation: pulse 1.5s infinite;
  transition: transform 2.3s ease;
}
.walax-fixed-bottom img.widget_image {
  width: 150px;
  height: auto;
  margin-top: 205px;
}
.walax-fixed-bottom img.widget_image {
  width: 161px;
  height: auto;
  margin-top: 115px;
  margin-RIGHT: 21PX;
}

/* CSS لتحسين Cumulative Layout Shift (CLS) */

/* 1. تحديد أبعاد الصور لمنع الإزاحة */
/* هذا الكود يستهدف جميع الصور ويضمن أنها لا تسبب إزاحة في التخطيط */
img {
  display: block; /* يمنع المشاكل المتعلقة بالعناصر السطرية */
  max-width: 100%; /* يضمن أن الصور لا تتجاوز عرض الحاوية */
  height: auto; /* يحافظ على نسبة العرض إلى الارتفاع */
  /* إذا كان القالب لا يحدد أبعاد الصور بشكل صريح، يمكن استخدام aspect-ratio */
  /* مثال: aspect-ratio: 16 / 9; */
  /* أو تحديد أبعاد افتراضية إذا كانت جميع الصور لها نفس النسبة تقريباً */
  /* مثال: aspect-ratio: 1 / 1; */
}

/* 2. تحسين تحميل الخطوط (اختياري - قد يتطلب تعديل القالب مباشرة) */
/* إذا كانت الخطوط تسبب إزاحة، يمكن استخدام font-display: swap; */
/* @font-face {
  font-family: 'YourFontName';
  src: url('your-font.woff2') format('woff2');
  font-display: swap; /* يضمن عرض النص باستخدام خط احتياطي حتى يتم تحميل الخط الأصلي */
}

/* 3. التعامل مع العناصر التي يتم تحميلها ديناميكياً (مثل الإعلانات أو النوافذ المنبثقة) */
/* إذا كانت هناك عناصر تظهر فجأة وتسبب إزاحة، يجب حجز مساحة لها مسبقاً */
/* مثال: */
/* .ad-container {
  min-height: 250px; /* حجز مساحة كافية للإعلان */
  /* display: flex; */
  /* align-items: center; */
  /* justify-content: center; */
/* } */

/* 4. تحسين صور الخلفية (إذا كانت تستخدم في عناصر مهمة) */
/* .hero-section {
  background-image: url('path/to/image.webp');
  background-size: cover;
  background-position: center;
  min-height: 400px; /* تحديد ارتفاع أدنى لحجز المساحة */
}