/* =====================================
   SVG Optimization - تحسين صور SVG
   ===================================== */

/* تحسين صور SVG الأيقونات في الهوفر */
.hover-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 8px;
}

.hover-btn img {
  width: 28px !important;
  height: 28px !important;
  object-fit: contain;
  max-width: 100%;
  height: auto;
  display: block;
}

/* تحسين الأيقونات الصغيرة */
img[src*=".svg"] {
  display: block;
  max-width: 100%;
  height: auto;
}

/* أيقونات التبويبات */
.tab-icon {
  width: 25px !important;
  height: 25px !important;
  object-fit: contain;
  display: inline-block;
  margin-left: 8px;
}

/* أيقونات التبويبات الكبيرة */
.ant-tabs-tab-active .tab-icon,
.ant-tabs-tab:hover .tab-icon {
  width: 26px !important;
  height: 26px !important;
}

/* تحسين صور SVG في الأزرار */
button img[src*=".svg"],
.btn img[src*=".svg"],
.button img[src*=".svg"] {
  width: 18px !important;
  height: 18px !important;
  object-fit: contain;
  vertical-align: middle;
}

/* صور SVG في الروابط الاجتماعية */
a img[src*=".svg"] {
  width: 24px !important;
  height: 24px !important;
  object-fit: contain;
  transition: transform 0.3s ease;
}

a:hover img[src*=".svg"] {
  transform: scale(1.1);
}

/* صور SVG الكبيرة (مثل الإعلانات) */
img.quote-img[src*=".svg"],
img[alt*="quote"][src*=".svg"],
img[alt*="adv"][src*=".svg"] {
  width: auto !important;
  height: auto !important;
  max-width: 100% !important;
  object-fit: contain;
  display: block;
  margin: 20px auto;
}

/* محاذاة صور SVG في البطاقات */
.card-item img[src*=".svg"],
.vertical-card img[src*=".svg"],
.horizontal-card img[src*=".svg"] {
  object-fit: contain;
  max-width: 100%;
  height: auto;
}

/* صور SVG في div الهوفر */
.hover-layer img[src*=".svg"],
.hover-overlay img[src*=".svg"] {
  width: 32px !important;
  height: 32px !important;
  object-fit: contain;
}

/* تحسين الأيقونات في البطاقات الأفقية */
.horizontal-card .img img[src*=".svg"] {
  width: 100%;
  height: auto;
  max-height: 300px;
  object-fit: contain;
}

/* تحسين صور SVG في النص */
p img[src*=".svg"],
span img[src*=".svg"],
div img[src*=".svg"] {
  display: inline-block;
  vertical-align: middle;
  margin: 0 4px;
}

/* محاذاة صور SVG في المركز */
img[src*=".svg"][style*="object-fit"] {
  margin-left: auto;
  margin-right: auto;
  display: block;
}

/* تحسين التوافقية مع الأجهزة المختلفة */
@media (max-width: 768px) {
  .tab-icon {
    width: 22px !important;
    height: 22px !important;
  }
  
  .hover-btn img {
    width: 24px !important;
    height: 24px !important;
  }
  
  a img[src*=".svg"] {
    width: 20px !important;
    height: 20px !important;
  }
}

@media (max-width: 480px) {
  .tab-icon {
    width: 20px !important;
    height: 20px !important;
  }
  
  .hover-btn img {
    width: 20px !important;
    height: 20px !important;
  }
  
  a img[src*=".svg"] {
    width: 18px !important;
    height: 18px !important;
  }
}

/* إزالة التأثير السلبي من الألوان */
img[src*=".svg"] {
  filter: none;
  opacity: 1;
  transition: all 0.3s ease;
}

img[src*=".svg"]:hover {
  opacity: 0.85;
}

/* تحسين الأداء */
img[src*=".svg"] {
  will-change: transform;
  backface-visibility: hidden;
}

/* معالجة خاصة للأيقونات الملونة */
img.icon-colored[src*=".svg"] {
  filter: saturate(1.1);
}

/* معالجة الأيقونات في حالة التحميل */
img[src*=".svg"][loading="lazy"] {
  background-color: transparent;
  animation: fadeIn 0.3s ease-in;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

/* تحسين الأيقونات في Ant Design */
.ant-btn img[src*=".svg"],
.ant-menu img[src*=".svg"],
.ant-dropdown img[src*=".svg"] {
  width: 16px !important;
  height: 16px !important;
  object-fit: contain;
}

/* صور SVG في قائمة الملاحة */
nav img[src*=".svg"],
.navbar img[src*=".svg"],
.menu img[src*=".svg"] {
  width: 24px !important;
  height: 24px !important;
  object-fit: contain;
  vertical-align: middle;
}

/* تحسين الأيقونات في الفوتر */
footer img[src*=".svg"],
.footer img[src*=".svg"] {
  width: 28px !important;
  height: 28px !important;
  object-fit: contain;
  display: block;
  margin: 8px auto;
}

/* معالجة خاصة للأيقونات في العناوين */
h1 img[src*=".svg"],
h2 img[src*=".svg"],
h3 img[src*=".svg"],
h4 img[src*=".svg"],
h5 img[src*=".svg"],
h6 img[src*=".svg"] {
  width: 32px !important;
  height: 32px !important;
  object-fit: contain;
  margin-right: 8px;
  vertical-align: middle;
}

/* RTL Support - دعم العربية */
[dir="rtl"] h1 img[src*=".svg"],
[dir="rtl"] h2 img[src*=".svg"],
[dir="rtl"] h3 img[src*=".svg"],
[dir="rtl"] h4 img[src*=".svg"],
[dir="rtl"] h5 img[src*=".svg"],
[dir="rtl"] h6 img[src*=".svg"] {
  margin-right: 0;
  margin-left: 8px;
}

/* Dark mode support */
@media (prefers-color-scheme: dark) {
  img[src*=".svg"] {
    filter: brightness(0.9);
  }
  
  img[src*=".svg"]:hover {
    filter: brightness(1);
  }
}

/* تحسين الصور SVG المتحركة */
svg, img[src*=".svg"] {
  shape-rendering: crispEdges;
}

/* تحسين الأداء على الأجهزة الضعيفة */
@supports (will-change: transform) {
  img[src*=".svg"] {
    will-change: auto;
  }
}