/*NOTE: This file is intended for programmers. Aspro technical support is not advised to work with him.*/

/* Examples (uncomment to use):*/

/* Expand site width */
/* body .wrapper { max-width: 1400px !important;  } */

/* Set site background image */
/* body {  background: url(image_source) top no-repeat; }

/* Hide compare button */
/* a.compare_item { display: none !important;  }*/

/* скрытие нет в наличии в блоке рекомедац */
.item-stock {
    display: none;
}
/* скрытие номера телефона */
.top-h-row .phones {
    display: none;
}
/* скрытие формы заказать звонок */
span.callback_btn_object.callback_btn_indetailpage.bold.button.big_btn.transparent.type_block {
    display: none;
}
/* Увеличел номер на кноаке показать номер */
#main .cl_display_phone.cl_cursorunset {
    font-size: initial;
}

/*кнопка отображения на карте*/
.sort_display div.map i{
	background:url('../images/sort_icons.png') no-repeat;
	background-position:-57px -41px;
	display:inline-block;height:13px;width:13px;line-height:20px;
}
.sort_display div{margin:0px 0px 0px 15px;}
/* кнопка забронировать */
.cl_sb_order {
    display: none;
}
.sort_display div.map.current i,.sort_display div.map:hover i {

    background-position: -57px -23px;;

}


.cl_reviews_forobject{
	display: inline;
	float: left;
	margin-right: 20px;
}
.cl_reviews_section{
	color: var(--v2-brand);
	float: left;
	margin-right: 3px;
}
#main .display_list ul.props_list{
	margin-bottom: 0px; 
}
#main ul.props_list li div.char_name::after{
	content: " ";
}
#main ul.props_list li::before{
	content: none;
}
#main ul.props_list li div.char_name,
#main ul.props_list li div.char_value
{
	display: inline; 
}
#main ul.props_list li div.char_name,
#main ul.props_list li .cl_prop_name_section
{
	font-weight: bold;
}

.callback_btn_indetailpage, .callback_btn_insectionpage{
	
} 
.cl_bannerheader_item{
	display: inline;
}

.cl_contact_block{
	text-align: center;
}
#main .bx_scu_scroller_container .missing{
	opacity: 1;
}

#main .cl_inmap_indetail{
	width:47%;
	float: left;
	position: relative;
	z-index: 100;
}

#main .cl_hide_temp{
	display: none;
}
#main .bx_item_detail_scu .hide_class.bx_item_section_name{
	display:none;
}
#main .cl_border{
	border: 1px solid black;
}
#main .cl_display_phone{
	cursor: pointer;
	/*font-size: 20px;
	color:#f27201;*/
}

#main .cl_display_phone.cl_cursorunset{
	cursor: unset;
	/*font-size: 20px;
	color:#f27201;*/
}
/*курсор ожидание*/
#main .cl_cursor_wait{
	cursor: wait;
}

.cl_reviews_click{
	font-size: 14px;
}

#id_sauni_price_block .cl_price_offer_in_detail{
	display: none;
}
#main .cl_hide{
	display: none;
}
#main  .offer_buy_block{
	display: none !important;
}
#main .cl_top_info_sauna{
	text-align: center;
	padding: 0px;
	border: none;
}
#main  .catalog_detail .cl_top_info_sauna .like_icons{
padding:0px;	
}
@media all and  (max-width: 570px){
	body .display_list .description_wrapp {
    	display: block;
	}
}


@media all and (max-width: 600px){
	#main .cl_inmap_indetail{
		width: 100%;
		float: none;
	}
}

@media all and (min-width: 650px){
    .sort_btn.block {
       
    }
}

.splide ul li::before {
    content: none;
}
.splide__slide img {
    width: 100%;
    height: auto;
    object-fit: cover;
}

.catalog_block .item_wrap:not(.touch):hover .hover_block, .catalog_block .item_wrap.hover .hover_block {
    opacity: 1;
    visibility: visible;
    max-height: 500px;
    display: none;
}

.reviews-navigation {
    margin: 0 0 20px 0;
}
/* mobile header icons: vertical-center + enlarge (menu + compare) */
@media all and (max-width: 767px) {
	#header ul.menu.adaptive li.menu_opener {
		transform: translateY(-21px) scale(1.4);
	}
	.basket_wrapp .header-compare-block {
		transform: translateY(-21px) scale(1.4);
	}
}

/* mobile catalog cards: title should span full card width, slightly bigger */
@media all and (max-width: 500px) {
	.catalog_block .item_info {
		width: 100% !important;
	}
	.catalog_block div.item-title,
	.catalog_block div.item-title a {
		font-size: 18px !important;
		line-height: 22px !important;
		text-align: center !important;
	}
}

/* mobile breadcrumb replacement: compact "back to parent section" pill */
.mobile_breadcrumb_back {
	display: none;
}
@media all and (max-width: 768px) {
	.mobile_breadcrumb_back {
		display: inline-flex;
		align-items: center;
		gap: 6px;
		margin: 12px 0 14px;
		padding: 7px 14px 7px 10px;
		border-radius: 20px;
		background: #fff4ea;
		border: 1px solid #f7d9bd;
		color: var(--v2-brand);
		font-size: 14px;
		font-weight: 500;
		line-height: 18px;
		text-decoration: none;
	}
	.mobile_breadcrumb_back:active {
		background: #fce8d6;
	}
	.mobile_breadcrumb_back_arrow {
		display: inline-block;
		width: 8px;
		height: 8px;
		border-left: 2px solid var(--v2-brand);
		border-bottom: 2px solid var(--v2-brand);
		transform: rotate(45deg);
		margin-right: 2px;
	}
}

/* Визуальное выделение платных пакетов размещения (без подписи названия тарифа).
   VIP — ровная рамка + заливка, Стандарт — только заливка (полосы слева нет).
   Наведение обозначается ТОЛЬКО тенью: цвет рамки при hover не меняется.

   Два правила темы Aspro требуют здесь !important, иначе ломают вид:
   1) .display_list .item_wrap:hover{border-color:#fff !important} — белит рамку при наведении;
   2) .display_list .list_item_wrapp + div .list_item_wrapp{border-top-width:0} — срезает
      верхнюю грань рамки, из-за чего верх и низ выглядели по-разному.
   Разные шаблоны вида (плитка/список) используют разные классы обёртки карточки. */
.catalog_item_wrapp.wc-tier-vip,
.list_item_wrapp.wc-tier-vip,
.catalog_item_wrapp.wc-tier-std,
.list_item_wrapp.wc-tier-std {
	transition: box-shadow ease-out 0.2s;
}
/* v2: рамка тоньше (1px вместо 2px) и скругление крупнее — под новый дизайн
   карточек. Решение заказчика сохранено: у VIP рамка И цвет, у Стандарта
   только цвет. Заливка заменена на более светлую (orange-50 из палитры
   макета) — прежний #fdf3ea рядом с белыми карточками выглядел грязным. */
.catalog_item_wrapp.wc-tier-vip,
.list_item_wrapp.wc-tier-vip {
	border: 1px solid var(--v2-brand) !important;
	border-radius: var(--v2-radius-xl);
	background: #fff7ed;
}
.catalog_item_wrapp.wc-tier-std,
.list_item_wrapp.wc-tier-std {
	border-left-width: 0 !important;
	background: #fffbf5;
}
.list_item_wrapp.wc-tier-vip .list_item,
.list_item_wrapp.wc-tier-std .list_item {
	background: transparent;
}
/* Наведение: рамка остаётся ровно того же цвета, отклик — только тень */
.catalog_item_wrapp.wc-tier-vip:hover,
.list_item_wrapp.wc-tier-vip:hover {
	border-color: var(--v2-brand) !important;
	box-shadow: 0 4px 16px rgb(249 115 22 / 0.20);
}
.catalog_item_wrapp.wc-tier-std:hover,
.list_item_wrapp.wc-tier-std:hover {
	box-shadow: 0 4px 16px rgb(249 115 22 / 0.14);
}

/* Фото анонсов в режиме «Список»: единый формат для всех карточек.
   Контейнер .thumb уже имеет фиксированный бокс (170×170 на десктопе), но у него
   overflow:visible, а у картинки нет object-fit — из-за этого вертикальные фото
   (например 373×768) рендерились как 170×350 и вылезали за пределы карточки.
   В плиточном виде обрезка сохранилась, в списочном — потерялась; возвращаем её. */
/* overflow:hidden здесь НЕ нужен: обрезку по контейнеру делает object-fit:cover,
   а hidden срезал стикеры «HIT»/«Рекомендуем» — они лежат внутри .thumb
   и намеренно вынесены за его край (top:-7px; left:-7px). */
.list_item_wrapp .thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

/* Подстраховка: активная вкладка видна и без JS (видимость задавалась только через .show()) */
.main-tabs-block__item.active {
	display: block;
}

/* Режим «Карта»: карта не заменяет список заведений, а показывается над ним.
   Оба блока видимы одновременно, порядок задаётся здесь: карта в разметке идёт
   после списка, поэтому поднимаем её через order (см. wcApplyTabState в js/custom.js). */
.main-tabs-block.wc-map-mode {
	display: flex;
	flex-direction: column;
}
.main-tabs-block.wc-map-mode .main-tabs-block__item.map {
	order: -1;
	margin-bottom: 25px;
}

/* Карточка подсвечивается, когда курсор наведён на её метку на карте.
   Тот же акцентный цвет, что и у выделения платных пакетов размещения. */
.list_item_wrapp.wc-map-hl {
	border-color: var(--v2-brand) !important;
	box-shadow: 0 4px 16px rgb(249 115 22 / 0.28);
	transition: box-shadow ease-out 0.2s;
}

/* Мобильная версия: карточка списка выводится по образцу плитки —
   широкое фото на всю ширину экрана, под ним заголовок, свойства
   и блок с ценой, кнопкой и отзывами (в плитке этого блока не было). */
@media (max-width: 767.98px) {
	.display_list .list_item {
		flex-wrap: wrap;
		/* в теме карточка растянута за края контейнера: padding 19px + margin -19px при
		   content-box. Справа свободно всего ~15px, поэтому вылет давал горизонтальную
		   прокрутку. На мобильных убираем растяжение — карточка по ширине контейнера,
		   padding остаётся внутри (border-box), поля слева и справа симметричны. */
		margin-left: 0 !important;
		margin-right: 0 !important;
		box-sizing: border-box;
		width: 100% !important;
		max-width: 100%;
	}
	.display_list .list_item .image_block {
		order: 1;
		width: 100%;
		max-width: 100%;
		/* у блока свой padding 19px поверх padding карточки — фото получалось уже заголовка */
		padding-left: 0 !important;
		padding-right: 0 !important;
		/* высота в теме фиксирована 170px — фото 200px вылезало и накрывало заголовок */
		height: 200px !important;
	}
	.display_list .list_item .adaptive_name {
		order: 2;
		/* ширина 341px + padding 19+19 при content-box давала 379px и горизонтальную
		   прокрутку страницы (~22px). Раньше не проявлялось: список на мобильных был скрыт. */
		box-sizing: border-box;
		width: 100%;
		/* было: вплотную к фото сверху и ~41px пустоты снизу.
		   Обнуляем разрозненные отступы темы и задаём единый симметричный зазор. */
		margin-top: 14px !important;
		margin-bottom: 14px !important;
	}
	.display_list .list_item .description_wrapp,
	.display_list .list_item .description_wrapp .description,
	.display_list .list_item .description_wrapp .props_list_wrapp {
		margin-top: 0 !important;
		padding-top: 0 !important;
	}
	/* переносы строк в разметке создают пустые анонимные строки (~17px каждая)
	   перед .description и внутри неё; flex-контейнер их убирает */
	.display_list .list_item .description_wrapp,
	.display_list .list_item .description_wrapp .description {
		display: flex;
		flex-direction: column;
	}
	/* блок торговых предложений у саун не заполнен (высота 0), но тянет margin-top:17px.
	   :empty не подходит — внутри есть пробельный текст, поэтому просто обнуляем. */
	.display_list .list_item .description_wrapp .description .sku_props {
		margin-top: 0 !important;
		margin-bottom: 0 !important;
	}
	.display_list .list_item .description_wrapp {
		order: 3;
	}
	.display_list .list_item .information_wrapp {
		order: 4;
	}
	/* .image_wrapper_block в теме зажат в max-width:170px — снимаем,
	   иначе ширина 100% у ссылки-обёртки считается от этих же 170px */
	.display_list .list_item .image_wrapper_block {
		width: 100%;
		max-width: 100%;
		height: 200px;
		line-height: normal;
	}
	.display_list .list_item .image_block .thumb {
		display: block;
		width: 100%;
		max-width: 100%;
		height: 200px;
		line-height: normal;
	}
	.display_list .list_item .image_block .thumb img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: center;
	}
}