/* Carousel Filter Preservation - الحفاظ على الفلتر الأصلي مع الإصلاحات */

/* Preserve original carousel styling */
.hero .carousel-item::before {
  content: "" !important;
  background-color: var(--background-color) !important;
  opacity: 1 !important;
  z-index: 2 !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
}

/* Preserve color-mix support for modern browsers */
@supports (color: color-mix(in lab, red, red)) {
  .hero .carousel-item::before {
    background-color: color-mix(in srgb, var(--background-color), transparent 30%) !important;
  }
}

/* Ensure proper layering */
.hero .carousel-item {
  z-index: 1 !important;
}

.hero .carousel-item.active {
  z-index: 2 !important;
}

.hero .carousel-item img {
  z-index: 1 !important;
}

.hero .info {
  z-index: 3 !important;
  position: relative !important;
}

.hero .carousel-control-prev,
.hero .carousel-control-next {
  z-index: 4 !important;
}

/* RTL specific filter preservation */
html[dir="rtl"] .hero .carousel-item::before {
  content: "" !important;
  background-color: var(--background-color) !important;
  opacity: 1 !important;
  z-index: 2 !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
}

@supports (color: color-mix(in lab, red, red)) {
  html[dir="rtl"] .hero .carousel-item::before {
    background-color: color-mix(in srgb, var(--background-color), transparent 30%) !important;
  }
}