/* PERF-JQUERY-CAROUSELS: раскладка ванильных каруселей (js/es-carousel.js).
   Оформление стрелок/точек НЕ дублируем — модуль генерирует разметку с классами
   .flex-direction-nav / .flex-control-nav, которые уже оформлены темой (css/styles.css,
   themes/*/theme.css). Здесь только трек и его элементы.

   !important здесь вынужденный: контейнеры сохраняют классы .flexslider/.slides/.tabs_slider
   ради остального оформления темы, а тема раскладывает их в расчёте на FlexSlider
   (`html[xmlns] .slides{display:block}`, `.flexslider .slides>li:not(.visible){display:none}`,
   `.slides>li.visible{opacity:0}`, bootstrap `.col-md-*{float:left;width:…}`). Эти правила
   специфичнее простого класса, поэтому раскладку трека фиксируем жёстко. */

.es-carousel { position: relative; }

.es-carousel .es-carousel__track {
	display: flex !important;
	flex-wrap: nowrap !important;
	align-items: stretch;
	gap: var(--esc-gap, 0px);
	margin: 0;
	/* Собственный padding трека сдвигал бы точку прилипания scroll-snap: у блока «Вы смотрели»
	   тема даёт .rows_block padding-left, из-за чего трек стартовал со scrollLeft=10. */
	padding: 0 !important;
	list-style: none;
	/* Трек — сам себе окно прокрутки, поэтому его ширину задаёт контейнер. Тема же держала
	   у миниатюр фиксированные 256px в расчёте на обёртку .flex-viewport от FlexSlider
	   (css/styles.css:393), из-за чего окно прокрутки не совпадало бы с видимой областью. */
	width: auto !important;
	max-width: 100% !important;
	height: auto !important;
	overflow-x: auto !important;
	overflow-y: hidden !important;
	scroll-snap-type: x mandatory;
	overscroll-behavior-x: contain;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.es-carousel .es-carousel__track::-webkit-scrollbar { width: 0; height: 0; display: none; }
/* Псевдоэлементы темы (clearfix `.slides:after` и т.п.) во flex-контейнере становятся
   полноценными flex-элементами: перед первым слайдом появлялся лишний gap, из-за которого
   трек стартовал со scrollLeft=10 и не прилипал к началу. */
.es-carousel .es-carousel__track::before,
.es-carousel .es-carousel__track::after { content: none !important; display: none !important; }

.es-carousel .es-carousel__track > li {
	display: block !important;
	opacity: 1 !important;
	position: relative !important;
	float: none !important;
	flex: 0 0 auto !important;
	width: var(--esc-item-width, calc((100% - (var(--esc-visible, 1) - 1) * var(--esc-gap, 0px)) / var(--esc-visible, 1))) !important;
	max-width: none !important;
	scroll-snap-align: start;
	/* Расстояние между слайдами задаёт gap трека (itemMargin из конфига), поэтому собственные
	   отступы элементов снимаем — иначе тема добавляет их поверх (миниатюры: margin-right 10px). */
	margin: 0 !important;
}

/* Элементов меньше, чем помещается — навигация не нужна (FlexSlider её тоже прятал).
   Класс вешается на сам блок навигации, потому что он может жить вне карусели
   (controlsContainer: .thumbs_navigation, .tabs_slider_navigation.similar_nav и т.п.). */
.es-carousel__nav.is-hidden,
.es-carousel__dots.is-hidden { display: none; }