/* ************************************************************************************* */
/* *********************** CATALOG CARD ************************************************ */
/* ************************************************************************************* */
.catalog-card2{
	height:352px;
	border:1px solid #CECFD2;
	display:flex;
	flex-direction:column;
	justify-content:flex-start;
	position:relative;
	overflow:hidden;
}
.catalog-card2 .catalog-product-articul{
	position:absolute;
	top:10px;
	left:10px;
	font-size:12px;
}
.catalog-card2 .catalog-img{
	width:calc(100% - 48px);
	height:220px;
	margin:24px 24px 0;
	background-size:contain;
	/*background-position: top;*/
	padding:0;
}
.catalog-card2 .catalog-info-container{
	transition:all .5s ease-in-out;
	width:100%;
	height:auto;	
	position:absolute;
	/*top:247px;/*285px;*/
	bottom:-12px;

}
.catalog-card2 .catalog-info{
	background-color:#f1f3f2;
	border-top:1px solid #f1f3f2;
	/*position:absolute;*/
	position:relative;
	/*top:0;
	bottom:auto;*/
	margin:0;
	flex-direction:column;
	align-items:flex-start;
	justify-content:flex-start;
	padding:12px 24px;
	/*transition:all 0.3s ease-in-out;*/
}
.catalog-card2:hover .catalog-info-container{
	transition:all .5s ease-in-out;
	height:auto;
	bottom:0;
	/*height:352px;
	top:0;*/
}
.catalog-card2:hover .catalog-info{
	border-top:1px solid #CECFD2;
	padding:12px 24px;
	/*top:unset;
	bottom:0;*/
}

.catalog.catalog-add .catalog-card2:hover .catalog-info{
	margin-bottom:unset;
	padding:12px 24px 0;
}
.catalog-card2 .catalog-info .checkbox{
	opacity:1;
	visibility:visible;
	position:relative;
	left:unset;
	top:unset;
	bottom:unset;
	
}
.catalog-card2 .catalog-info:hover .checkbox{
	left:unset;
}

.catalog-card2 .catalog-name{
	transition:all 0.5s ease-in-out;
	max-height:90px;/*48px;*/
	/*display: block;*/
	display: -webkit-box;
	-webkit-box-orient: vertical;
	line-clamp: 4;
	-webkit-line-clamp: 4;
	/*align-items: flex-end;*/
	overflow: hidden;
	margin-bottom:16px;
	/*transition:all 0.3s ease-in-out;*/
	border:none;
}

.catalog-card2:hover .catalog-name{
	max-height:190px;
	transform:unset;
	height:auto;
	line-clamp:unset;
	-webkit-line-clamp:unset;
	overflow:unset;
	color:#318959;
}
.catalog-card2 .catalog-name::after{
	display:none;
}

.catalog-card2 .checkbox{
	display:flex;
	justify-content:flex-start;
	align-items:center;
	padding:0;
}
.catalog-card2 .checkbox-ico{
	width:16px;
	height:16px;
	margin-right:8px;
	position:relative;
	top:unset;
	left:unset;
}


@media only screen and (max-width: 640px) {
	.catalog-card2{
		height:auto;
	}
	.catalog-card2 .catalog-info-container{
		height:auto;
		position:relative;
		top:unset !important;
	}	
	.catalog-card2 .catalog-info{
		position:relative;
		border-top:1px solid #f1f3f2 !important;
	}
	.catalog-card2 .catalog-name{
		transform:unset;
		height:auto;
		line-clamp:unset;
		-webkit-line-clamp:unset;
		overflow:unset;	
	}
}

/* ********************************************************************** */
/* ******************* CATALOG DETAIL PAGE ****************************** */
/* ********************************************************************** */
.product-head{
	/*padding-bottom:16px;*/
}
.product-head .page-title{
	font-size:30px;
	line-height:31.5px;
	margin-bottom:0;
	max-width:660px;
}
.product-title-wrap{
	display:flex;
	flex-wrap: wrap;
	justify-content:space-between;
	align-items:stretch;
	height:100%;
}
.product-head-title{
	width:50%;
	margin-bottom:24px;
}
.product-head-left{
	display:flex;
	flex-direction:column;
	justify-content:space-between;
	align-items:flex-start;
}
.product-head-img{
	display:flex;
	justify-content:flex-end;
	align-items:center;
	width:50%;
	position:relative;
	max-width:660px;
	top:unset;
	margin-bottom:-67px;
}
#main_variant{
	width:50%;
	position:relative;
	bottom:unset;
	display:flex;
	justify-content:space-between;
	align-items:center;
}
.product-head-articul{
	font-size:14px;
	line-height:16.1px;
	color:#616369;
	margin-bottom:8px;
}
.product-head-buttons .primary-btn{
	margin-right:40px;
	font-size:18px;
	line-height:24px;
	padding:10px 40px 13px 36px;
}
.product-head-buttons .primary-btn span{
	display: inline-block;
	position:relative;
	padding-left:24px;
	height:24px;
}
.product-head-buttons .primary-btn::after{
	content: none;
}
.product-head-buttons .primary-btn span::after{
	content: '';
    position: absolute;
    top: 12px;
    left: 0px;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    min-width: 24px;
    width: 24px;
    height: 24px;
    background-repeat: no-repeat;
    background-position: center;
    -webkit-background-size: contain;
    background-size: contain;
    background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9 18L15 12L9 6' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
    -webkit-transition: .3s ease-in-out;
    -o-transition: .3s ease-in-out;
    transition: .3s ease-in-out;	
}

.primary-btn:hover span::after {
	-webkit-transform: translate(-4px, -50%);
	-ms-transform: translate(-4px, -50%);
	transform: translate(-4px, -50%)
}

@media only screen and (max-width: 1150px) {
	.product-head-buttons{
		display:flex;
		flex-direction:column;
		align-items:start;
		gap: 10px;
	}
	.product-head-buttons .primary-btn{
		margin:0 0 34px 0;
		width:100%;
	}
}

@media only screen and (max-width: 768px) {
	.product-head-wrap{
		padding-bottom:0 !important;
	}
	.product-head-title, .product-head-img, #main_variant{
		width:100%;
	}
	.product-head-img{
		margin-bottom:0;
		justify-content:center;
		align-items:center;		
	}
	.product-head .page-title{
		font-size:22px;
		line-height:23.1px;
		margin-bottom:24px;
	}
	.product-head-buttons .primary-btn{
		font-size:16px;
	}
}

/* ********************************************************************** */
/* ********************* CONFIGURATOR *********************************** */
/* ********************************************************************** */
body{position:relative;letter-spacing: 0em;}
html.noscroll,body.noscroll{overflow-y: hidden !important; overflow: hidden !important; height: calc(100vh + 100px); -webkit-touch-callout: none; /*-webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;*/ overflow: auto;}
body>.overlay{z-index:10000}
#configurator_demo_page{min-height:3000px;width:100%;}
#configurator{display:none;position:absolute;z-index:10001;min-height:100px;left:0; right:0;top:0;bottom:0;background:rgba(0, 0, 0, 0.5);}
#configurator.active{display:flex;align-items:center;}
.config_main{max-width:100%;/*border:1px solid #000;margin:100px auto;*/padding:0;}
.config_wrapper{position:relative;display:flex;justify-content:space-between;background-color:#F1F3F2;min-height:768px;max-height:100vh;width:100%;max-width:1344px;margin:auto;}
.config_workspace{position:relative;padding:32px 14px 5px 48px;width:100%;height:100vh;max-height:993px;/*calc(100vh - 100px);*/display:flex;flex-direction:column;}
.btn_config_close{position:absolute;top:14px;right:14px;opacity:0.5;transition:all 0.3s ease-in-out;}
.btn_config_close:hover{opacity:1;}

.config_title{font-size:48px;line-height:1.15;font-weight:700;}
.config_nav{margin:24px 0; color:rgba(0,0,0,0.4);display:flex;align-items:center;}
.config_nav>span{display:inline-block;width:32px;height:1px;background:#000;opacity:0.24;margin:0 12px;}
.btn_config_step{color:#318959; text-decoration:none;border-bottom:1px dashed #318959;}
.btn_config_step.active{color:rgba(0,0,0,0.4);border-bottom:none;}
.btn_config_step.disable{opacity:0.24;cursor:default;}
/*.config_step3{display:none;}*/

.config_steps{
    /*height:calc(100% - 120px);*/
    flex-grow:100;
    overflow-y:scroll;padding:0 10px 0 0;
    scrollbar-width: thin;
    scrollbar-color: #cecfd2 #F1F3F2;

}
.config_steps::-webkit-scrollbar {height: 6px;width: 6px;}
.config_steps::-webkit-scrollbar-track {background: #F1F3F2;/* С†РІРµС‚ РґРѕСЂРѕР¶РєРё */}
.config_steps::-webkit-scrollbar-thumb {background-color: #cecfd2;/* С†РІРµС‚ РїР»Р°С€РєРё */ border-radius: 6px;/* Р·Р°РєСЂСѓРіР»РµРЅРёСЏ РїР»Р°С€РєРё */border: 3px solid #cecfd2;  /* padding РІРѕРєСЂСѓРі РїР»Р°С€РєРё */}


.config_filter{display:none;height:43px;min-height:43px;margin:0 0 8px;padding:0 0 4px;justify-content:flex-start;gap:4px;width:100%;overflow-x:scroll;	scrollbar-width: thin;scrollbar-color:#cecfd2 #F1F3F2;}
.config_filter>a{padding:5px 16px 6px;border:1px solid #CECFD2;border-radius:6px;display:flex;align-items:center;color:#000;background:rgba(255,255,255,1);}
.config_filter>a.active{background:rgba(255,255,255,0.25);}
.config_filter>a>span{display:none;width:16px;height:16px;color:#fff;background:#318959;border-radius:50%;font-size:12px;text-align:center;}
.config_filter>a>span.active{display:flex;justify-content:center;align-items:center;margin-left:4px;}
.config_filter::-webkit-scrollbar {height: 6px;width: 6px;}
.config_filter::-webkit-scrollbar-track {background: #F1F3F2;/* С†РІРµС‚ РґРѕСЂРѕР¶РєРё */}
.config_filter::-webkit-scrollbar-thumb {background-color: #cecfd2;/* С†РІРµС‚ РїР»Р°С€РєРё */ border-radius: 6px;/* Р·Р°РєСЂСѓРіР»РµРЅРёСЏ РїР»Р°С€РєРё */border: 3px solid #cecfd2;  /* padding РІРѕРєСЂСѓРі РїР»Р°С€РєРё */}
.step_main .config_filter {display:flex;}
.step_accessories #filter_accs{display:flex;}


.config_item{background-color:#FFF;border-radius:10px;position:relative;margin:0 0 12px;display:flex;justify-content:space-between;width:100%;box-sizing: border-box;border:2px solid #fff;}
.config_item_count_mobile{display:none;}
.config_item .input-block{max-width:466px;}
.config_item .input-block select{background-color:#fff;}
.config_item_btns{display:flex;}
.config_item.inkit{border:2px solid #318959}
.inkit_label{display:none}
.config_item.inkit .inkit_label{display:block; position:absolute;bottom:-2px;right:-2px;background-color:#318959;color:#FFF;padding:12px 40px;border-radius:10px 0px 10px 0px;z-index:2;}
.btn_add_to_kit{height:49px;padding:12px 32px;display:flex;justify-content:center;align-items:center;border:1px solid #318959;color:#318959;margin-left:24px;white-space:nowrap;}
.btn_del_from_kit{width:49px; height:49px; display:none;border:1px solid #CECFD2;margin-left:24px;}
.config_item.inkit .btn_add_to_kit{display:none;}
.config_item.inkit .btn_del_from_kit{display:flex;justify-content:center;align-items:center;}
@media (min-width: 768px) {
	.config_item_content{padding:14px 24px 14px 22px;position:relative;z-index:2;min-height: 240px;}
}
@media (max-width: 767px) {
	.config_item_content{padding:14px 24px 14px 22px;position:relative;z-index:2;min-height: auto;}
}
.config_item_title, .config_item_content h2{font-size:32px;line-height:1.15;margin-bottom:24px;}
.config_item_content h2.nomargin{margin:0;}
.config_item_photo{width:264px;min-width:264px;padding:6px 6px 6px 8px;position:relative;z-index:1;}
.config_item_photo>span>img{max-height:220px;}
.config_item_photo>span{position:relative;display:block;}
.config_item_photo>span>span{display:none;position:absolute;top:0;left:0;right:0;bottom:0;cursor:pointer;z-index:1;}

.config_item .number{display:flex;justify-content:space-between;align-items:center;padding:12px 24px;}
.config_item .number .number-minus, .config_item .number .number-plus{position:unset;top:unset;left:unset;right:unset;transform:unset;display:block;background-image:unset;pointer-events:all;z-index:unset;width:24px;height:24px;}
.config_item .number input{padding:0;width:45px;text-align:center;color:#000;}

.config_item_list .config_item_content{display:flex;flex-direction:column; justify-content: space-between;}
.config_item_list .config_item_photo{padding-bottom:38px;}
.config_item_list .config_item_content{padding-bottom:24px;}

/*.config_item .modal_select option{display:block;min-height:48px;height:48px;padding:20px;font-size:18px;}*/

.config_main.step_result .config_item.deleted{opacity:0.25;}
.config_result{width:342px;min-width:342px;max-height:100vh;background-color:#FFF;padding:0;display:flex;flex-direction:column;justify-content:space-between;}
.config_result_body{padding:24px 12px 0 24px;min-width:294px;max-height:calc(100vh - 64px);display:flex;flex-direction:column;justify-content:space-between;}
.config_result_title{padding-right:12px;font-size:32px;font-weight:700;line-height:1.15;margin-bottom:8px;}
.config_result_list{padding:0 12px 0 0;/*height:100%;*/flex-grow:100;overflow-y:auto;scrollbar-width: thin;scrollbar-color:#cecfd2 #F1F3F2;}
.config_result_list::-webkit-scrollbar {height: 6px;width: 6px;}
.config_result_list::-webkit-scrollbar-track {background: #F1F3F2;/* С†РІРµС‚ РґРѕСЂРѕР¶РєРё */}
.config_result_list::-webkit-scrollbar-thumb {background-color: #cecfd2;/* С†РІРµС‚ РїР»Р°С€РєРё */ border-radius: 6px;/* Р·Р°РєСЂСѓРіР»РµРЅРёСЏ РїР»Р°С€РєРё */border: 3px solid #cecfd2;  /* padding РІРѕРєСЂСѓРі РїР»Р°С€РєРё */}
.btn_config_result_body_close,.btn_config_item_close{display:none;position:relative;z-index:100;}
.list_result_item {padding:16px 0;}
.list_result_item h3{font-size:16px;font-weight:bold;line-height:1.15;}
.list_result_item>div{display:flex;justify-content:space-between;font-size:16px;line-height:1.25;margin-top:12px;}
.number-minus.disable, .number-plus.disable{opacity:0.25; cursor:default;}
.btn_config_result_step{display:block; width:100%;background:#FFDF36;padding:21px 24px;text-align:center;color:#000;font-size:18px;line-height:1.15;}
.btn_config_result_step.disable{opacity:0.25; cursor:default;}

#configurator .overlay{/*visibility:visible;opacity:0.6;*/position:absolute;}
.configurator_popup{display:none;position:absolute;z-index:100;width:100%;height:200px;max-width:767px;margin:auto;left:0; right:0;top:0;bottom:0;}
.configurator_popup.active{display:block}
.config_popup_wrapper{background:#fff;padding:24px 32px 32px;/*border:1px solid */}
.btn_config_popup_close{position:absolute;top:16px;right:16px;width:24px;height:24px;}
.config_popup_title{font-weight:bold;font-size:32px;margin-bottom:16px;line-height:1.15;}
.config_popup_text{font-size:18px;margin-bottom:24px;}
.config_popup_navigation{display:flex;justify-content:space-between;}
#configurator_popup2 .config_popup_navigation{width:200px;margin:0 auto;}
.btn_config_popup_primary{display:inline-block;font-size:18px;padding:12px 24px;background:#318959;border:1px solid #318959;color:#fff;}
.btn_config_popup_default{display:inline-block;font-size:18px;padding:12px 24px;background:#fff;border:1px solid #318959;color:#318959;}
.btn_config_show_result{display:none;}

/* было для 768 */
.config_item.active{position:absolute;z-index:100;left:16px;right:16px;bottom:0;width:auto;top: 20px; overflow: hidden;}
.config_item.active .input-block {margin-right:0px;}
.config_item.active .config_item_content{display: none; width:100%;}
.config_item.active .config_item_photo{width:100%;}
.config_item.active .btn_config_item_close{display:flex;justify-content:center;align-items:center;position:absolute;right:12px;top:12px;width:24px;height:24px;border-radius:50%;background:#ECECEC;}
.config_item.active .config_item_photo>span>img {width:100%;max-height: unset;}
.config_item.active .config_item_content h2{padding-right:24px;}
.config_item.active .config_item_photo>span>span{opacity:0;}
.config_item.active .config_item_count_mobile {display: none;}
/* было для 768 */



@media only screen and (max-width: 768px) {
    .btn_config_result_body_close {display:flex;justify-content:center;align-items:center;position:absolute;right:12px;top:12px;width:24px;height:24px;border-radius:50%;background:#ECECEC;}
    html.noscroll,body.noscroll{height: 100vh;}
    #configurator{top:0;height:100vh;margin:unset;}
    .config_wrapper{flex-direction:column;height:100%;min-height:100%;}
    .config_workspace{padding:16px 6px 0 16px;height:calc(100% - 68px);max-height:unset;}

    .config_title{font-size:24px;}
    .config_nav{margin:12px 0 0;border-bottom:1px solid rgba(0, 0, 0, 0.16);}
    .config_nav>span{display:none;}

    .config_steps{height:calc(100% - 100px);overflow-y:scroll;padding:16px 10px 24px 0;}

    .btn_config_step{padding-bottom:12px;margin-bottom:-1px;border-bottom:2px solid rgba(0,0,0,0);}
    .btn_config_step:not(last-child){margin-right:16px;}
    .btn_config_step.active{border-bottom:2px solid rgba(0,0,0,1);color:rgba(0,0,0,1);}

    .config_filter{margin:16px 0 0;padding:0 0 4px;}

    .config_item{flex-wrap:wrap;}
    .config_item_content{width:calc(100% - 112px);padding:14px 14px 16px 14px;}
    .config_item .input-block {margin-right:-112px;}
    .config_item .input-block select{height:44px;border-radius:8px;font-size:16px;}
    .config_item_count{display:none;}
    .config_item_count_mobile{display:block;width:100%;padding:0 14px 14px;}
    .config_item_title, .config_item_content h2{font-size:18px;margin-bottom:16px;}
    .config_item_photo{width:112px;min-width:112px;padding:6px 6px 12px 8px;}
    .config_item_photo>img{width:96px;height:auto;}
    .btn_config_number{border-radius:8px;height:44px;}
    .btn_add_to_kit {border-radius:8px;margin-left:12px;padding:12px;width:100%;line-height:18px;height:44px;}
    .btn_del_from_kit{border-radius:8px;margin-left:12px;width:44px;height:44px;}

    .config_item.inkit .inkit_label{padding:12px 24px;}


    /*.config_item_list{height:100%;}*/

    .config_result{width:100%;position:relative;z-index:21;}
    .config_result_body{position:absolute;z-index:1;bottom:-100vh;left:0;right:0;height:auto;max-height:100vh;background:#fff;border-radius:10px 10px 0 0;padding:16px 6px 64px 16px;transition:all 0.5s ease-in-out;}

    .config_result_title{font-size:18px;}
    .config_result_nav{display:flex;padding:111px 16px 8px;margin-top:-111px;/*background: linear-gradient(0deg, white 64px, rgba(255, 255, 255, 0) 100%);*/pointer-events: none;}
    .btn_config_result_step{font-size:16px;padding:19px 5px;border-radius:8px;pointer-events:all;}
    .btn_config_show_result{width:56px;min-width:56px;height:56px;display:flex;justify-content:center;align-items:center;position:relative;border-radius:8px;background:#F1F1F1;margin-right:12px;pointer-events:all;}
    .btn_config_show_result>span{position:absolute;top:27px;left:27px;width:18px;height:18px;display:flex;justify-content:center;align-items:center;background:#318959;color:#fff;font-size:12px;line-height:12px;border:2px solid #F1F1F1;border-radius:50%;font-weight:400;}
    .btn_config_show_result.disable{opacity:0.25;cursor: default;}

    .config_item_photo>span>span{display:flex;justify-content:center;align-items:center;opacity:0.2;}

    .config_item .number{padding:12px;width:114px;min-width:114px;}
    .config_item .number .number-minus, .config_item .number .number-plus{min-width:20px;width:20px;height:20px;}
    .config_item .number input{padding:0;width:25px;margin:0 10px;text-align:center;}

    .config_result.active .config_result_body{display:block;bottom:0;}
    .config_result.active .config_result_nav{position:absolute;z-index:2;bottom:0;left:0;right:0;height:auto;}
    .config_result.active .btn_config_show_result{display:none;}
    .config_result_list{overflow-y:scroll;height:100%;max-height:calc(100vh - 180px);padding:0 10px 60px 0;}

    .configurator_popup{height:auto;bottom:-50%;left:0;right:0;top:unset;margin:0;display:block;transition:all 0.5s ease-in-out;}
    .configurator_popup.active{bottom:0}
    .config_popup_wrapper{border-radius:10px 10px 0 0;border:none;}
    .config_popup_title{font-size:18px;}
    .config_popup_navigation{flex-wrap:wrap;}
    .btn_config_popup_primary, .btn_config_popup_default{font-size:14px;width:100%;border-radius:8px;padding:12px;text-align:center;}
    .btn_config_popup_primary{margin-bottom:12px;}
}

/*demo page*/
.configurator_demo {
    padding:100px 0;
}

.configurator_demo p{
    margin:20px 0;
}
/* END CONFIGURATOR ***************************************************** */


.config_filter {max-width: 940px;}

.help-tip
{
    text-align: center;
    background-color: #FFF;
    border: 1px solid #CCC;
    border-radius: 5px;
    width: 24px;
    height: 24px;
    font-size: 14px;
    line-height: 24px;
    cursor: help;
    display: inline-block;
    position: absolute;
    margin-left: 10px;
}

.help-tip:before{
    content:'?';
    font-weight: bold;
    color:#999;
}

.help-tip:hover p{
    display:block;
    transform-origin: 100% 0%;
    left: -6px;
    margin-bottom: ;
    -webkit-animation: fadeIn 0.3s ease-in-out;
    animation: fadeIn 0.3s ease-in-out;
    margin-top: 6px;

}

.help-tip p{    /* Всплывающая подсказка */
    display: none;
    text-align: left;
    background-color: #FDFDFD;
    padding: 20px;
    width: 300px;
    position: absolute;
    border-radius: 3px;
    box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
    right: -4px;
    color: #000;
    font-size: 13px;
    line-height: 1.4;
    border: 1px solid #CECFD2;
}

.help-tip p:before{ /* Указатель всплывающей подсказки */
    position: absolute;
    content: '';
    width:0;
    height: 0;
    border:6px solid transparent;
    border-bottom-color:#CECFD2;
    left:10px;
    top:-12px;
}

.help-tip p:after{ /* Не позволить исчезнуть всплывающей подсказке */
    width:100%;
    height:40px;
    content:'';
    position: absolute;
    top:-40px;
    left:0;
}

/* Анимация CSS */

@-webkit-keyframes fadeIn {
    0% {
        opacity:0;
        transform: scale(0.6);
    }

    100% {
        opacity:100%;
        transform: scale(1);
    }
}
@keyframes fadeIn {
    0% { opacity:0; }
    100% { opacity:100%; }
}

@media all and (max-width: 767px)
{
    .help-tip {display: none!important;}
}

.catalog_number {cursor: pointer;}
.number-pluss, .number-minuss {cursor: pointer;}

