/* Общие стили слайдера */
.owl-carousel {
    position: relative;
}

/* Стилизация контейнера для элемента */
.owl-carousel .item {
    text-align: center; /* Центрирует содержимое элемента */
    display: flex;     /* Использует flexbox для центрирования содержимого */
    align-items: center; /* Центрирует содержимое по вертикали */
    justify-content: center; /* Центрирует содержимое по горизонтали */
}

/* Стилизация элементов в слайдере */
.owl-carousel .item img {
    width: 100%; /* Ширина изображения адаптируется под размер элемента */
    height: 100%; /* Высота автоматически подстраивается */
    display: block; /* Убирает нижний отступ под изображениями */
    object-fit: contain; /* Гарантирует, что изображение будет полностью видимым в контейнере */
}

/* Адаптивные стили для разных размеров экранов */
@media (max-width: 768px) {
    .owl-carousel .item img {
        max-height: 200px; /* Максимальная высота изображений на устройствах среднего размера */
    }
}

@media (max-width: 480px) {
    .owl-carousel .item img {
        max-height: 150px; /* Максимальная высота изображений на мобильных устройствах */
    }
}

/* Стили для навигационных стрелок */
.owl-nav {
    display: none; /* Стрелки скрыты по умолчанию и отображаются только при наведении на слайдер */
    position: absolute;
    top: 50%; /* Центрируем стрелки по вертикали */
    transform: translateY(-50%); /* Сдвигаем на половину высоты назад, чтобы центрировать */
    width: 100%;
    z-index: 1000; /* Убедитесь, что стрелки всегда находятся над другими элементами */
}

/* Отображение стрелок при наведении */
.owl-carousel:hover .owl-nav {
    display: block;
}

.owl-nav .owl-prev,
.owl-nav .owl-next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
/*  background-color: rgba(0, 0, 0, 0.5); /* Полупрозрачный черный фон для лучшей видимости */
  background-color: #051F7B; /* Синий фон стрелок */
  border-radius: 50%; /* Круглая форма стрелок */
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white; /* Цвет иконок */
  cursor: pointer; /* Курсор указывает на возможность клика */
  transition: background-color 0.3s, transform 0.3s; /* Плавные переходы для анимации */
}

/* Расположение стрелок */
.owl-nav .owl-prev {
    left: -10px; /* Смещение слева от начала слайдера */
}

.owl-nav .owl-next {
    right: -10px; /* Смещение справа от края слайдера */
}

/* Стиль иконок стрелок */
.bi-chevron-left, .bi-chevron-right {
  font-size: 24px;
/*  color: #000; /* Цвет иконок */
    color: white;
}