.carousel-container {max-width: 500px;margin: 0 auto;position: relative;touch-action: pan-y;}
.main-carousel {position: relative;height: 400px;border-radius: 5px;overflow: hidden;cursor: grab;user-select: none;}
.carousel-item {position: absolute;width: 100%;height: 100%;transition: opacity 0.3s ease;border-radius: 5px;user-select: none;display: block;margin: auto;display: none;}
.carousel-item.active {display: block;}
.carousel-item img {width: 100%;height: 100%;border-radius: 5px;pointer-events: none;}
.carousel-item video {width: 100%;height: 100%;border-radius: 5px;}
.thumbnails-container {display: flex;gap: 5px;margin-top: 20px;overflow-x: auto;padding-bottom: 10px;-webkit-overflow-scrolling: touch;justify-content: center;}
.thumbnail-item {flex: 0 0 60px;height: 60px;cursor: pointer;border: 2px solid transparent;border-radius: 5px;overflow: hidden;transition: border-color 0.2s;}
.thumbnail-item.active {border-color: #ffc107;padding: 2px;}
.thumbnail-item img {width: 100%;height: 100%;}
.video-thumbnail {position: relative;}
.video-thumbnail::after {content: '▶';position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);color: white;font-size: 20px;text-shadow: 0 0 5px rgba(0,0,0,0.5);}
@media (max-width: 450px) {.main-carousel {height: 280px;}}
/* تأكد من أن الروابط قابلة للنقر */
.carousel-image-link {display: block;width: 100%;height: 100%;cursor: pointer;}
.carousel-image-link img { width: 100%; height: 100%;}
/* تأكد من أن الفيديوهات لا تتداخل */
.video-container {width: 100%;height: 100%;}