/* Нав бар*/


/* техническая разметка

.nav_catalog .nav_scroll	{border:1px solid green;}
.nav_catalog .nav_content	{border:1px solid red;}
.nav_catalog .content_item	{border:1px solid green;}*/

.modal_catalog{
    max-width: 1370px;
    margin: 0 auto;
}

.nav_catalog.container{
    margin: 0 auto;
}

.nav_catalog{
    padding: 0px;
	margin: 0px;
	height: 80vh;
}

.nav_catalog_header{
    display: flex;
    align-items: baseline;
    justify-content: flex-start;
    padding-top: 40px;
    padding-bottom: 16px;
    padding-left: 18px;
}

.nav_scroll {
	min-width: 312px;
}
.nav_headline{
	 color: var(--color-prime);
}

.nav_catalog img.icon {
    margin-right: 0;
    margin-bottom: 0;
    width: 18px;
}

.nav_catalog a.popup-close {
    color: black;
	font-size:24px;
	padding: 3px 15px;
	position:absolute;
	right:0;
}

.nav_catalog a.popup-close:hover {
    color: var(--color-prime);
}


.nav_catalog .nav_scroll .nav_item_link {
	text-decoration: none;
	color: inherit;
	display: block;
}

.nav_catalog .nav_scroll .nav_item{
    cursor: pointer;
	padding: 22px 18px;
}

.nav_catalog .nav_scroll .nav_item:last-child{
	margin-bottom: 20px;
}   


.nav_catalog .nav_scroll .nav_item:hover{
  background-color: var(--color-prime);
}

@media(min-width: 600px){
	.nav_catalog_header:hover{background-color: var(--color-prime);}
	.nav_catalog_header:hover .nav_headline{color: #ffffff;}
}

.nav_content__columns .content_item a:hover{
  color: #2aae44;
}

.nav_catalog .sub_cat{
    margin-top: 32px;
}

.nav_catalog_body, 
.nav_content__columns{
	display: flex; 
	flex-wrap: wrap; 
}


.nav_catalog_body {
	height: 100%;
}


.nav_catalog .nav_content{
	flex: 1;
}

.nav_catalog .nav_scroll, 
.nav_catalog .nav_content{
	height: 100%;
}

.nav_content__column{
	margin-right: 50px;
	display: flex;
   flex-wrap: wrap;
	flex: 1;
}

.nav_catalog .nav_scroll {
	overflow-y: auto;
	position: relative;
}

/* Индикатор прокрутки внизу */
.nav_scroll_indicator {
	position: sticky;
	bottom: 0;
	left: 0;
	right: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 12px 0;
	cursor: pointer;
	opacity: 0;
	transition: opacity 0.3s ease;
	z-index: 10;
}

.nav_scroll_indicator:hover svg {
	transform: scale(1.1);
	transition: transform 0.2s ease;
}

.nav_scroll_indicator.show {
	opacity: 1;
}

.nav_scroll_indicator svg {
	width: 36px;
	height: 36px;
	filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.2));
}
.nav_scroll_indicator_fill {
	fill: var(--color-prime);
	animation: bounce-down 2s infinite;
}

@keyframes bounce-down {
	0%, 100% {
		transform: translateY(0);
	}
	50% {
		transform: translateY(5px);
	}
}

.nav_catalog .nav_content a.popup-close {
    margin-top: -9px;
}

.nav_catalog .content_item{
	margin-bottom: 20px;
	width: 50%;
	/* min-width: max-content; */
   text-transform: uppercase;
   display: flex;
   align-items: center;
}
	
.nav_catalog .nav_content{
    margin: 6px 30px;
	position:relative;
	margin-right:0;
	overflow-y: auto;
}

.nav_catalog .nav_scroll {
	border-right: 1px solid color-mix(in srgb, var(--color-prime) 33%, transparent);
}


.icon_container{
    width: 75px;
}

.nav_catalog .icon_container img {
    max-width: 55px;
    max-height: 65px;
}



@media (max-width: 1367px) {
	.nav_catalog .nav_scroll {
			border-right: unset;}

}




@media (max-width: 1024px) {  

		.modal_catalog {
			border-radius:unset!important;}


		.nav_catalog.container  {
			max-width: 100%!important;}

		.nav_content__column {
			flex-direction: column;
		}
		

		.nav_catalog_body {
			flex-wrap: nowrap;}
			
		.nav_catalog {
			height: 100vh;
		}	
			
		.arcticmodal-container_i2.container_modal_catalog{
			padding:unset!important;
		}  


        .nav_catalog .nav_scroll .nav_item {
            cursor: pointer;
        }
			
        .nav_catalog .nav_scroll .nav_item {
            cursor: pointer;
            padding: 18px 18px;
        }


		.nav_catalog .content_item{
	       word-break: break-all;}

     
        .container_modal_catalog a.popup-close {
            position: absolute;
            margin-top: unset;
            right: 15px;
        }

        .sub_cat h3.title{
            display: flex;
            flex-direction: column-reverse;
        }
        .sub_cat h3.title img{
            margin-bottom: 15px;
        }
        .sub_cat h3.title a{
            display: block;
            margin-bottom: 30px;
			word-break: break-all;
        }
        
        .nav_catalog .nav_scroll, .nav_catalog .nav_content {
            height: unset; 
        }
	
}



@media (max-width: 600px) {
	
	.nav_catalog { 
			overflow-y:auto;
			}		

	.nav_catalog .nav_scroll{
		border-bottom: 1px solid #dfdfdf;
		padding-bottom: 10px;
	}

	.nav_catalog .sub_cat {
		margin-top: 15px;
  }
	.nav_catalog .nav_content__column {
		margin-right: 0px;
	}

	.nav_catalog .popup-close{ 
			top:27px;
			right:8px!important;
			}	
	
	.nav_catalog .nav_content{ 
			margin: 6px 15px;
			position: unset;
			}		
			
	.nav_catalog .nav_content .title{ 
			display:none;
			}				
			
	
	.nav_catalog .nav_catalog_body{ 
			display:block;
			position:relative;
			}
		
	.nav_catalog .nav_scroll .nav_item {
            padding: 5px 18px;
			}		

	.nav_catalog .content_item .icon_container{ 
			width: unset;
			}

	.nav_catalog .content_item { 
			width: 100%;
			/* text-transform:unset; */
			min-width: auto;
			word-break: break-word;
			}

	.nav_catalog .content_item .icon_container img{ 
			max-width:25px;
			margin-right:10px;
			}

	.nav_catalog .nav_scroll .nav_item:last-child{
	       margin-bottom: 5px;
		   }
		   
		.nav_scroll_indicator {
			padding: 5px 0;
		}
		   

		   
	.nav_catalog  .nav_catalog_header{ 
			padding-top:20px;
			}
	
}




/* скролл */


.nav_catalog .nav_scroll::-webkit-scrollbar {
  width: 5px;
  background-color: #f9f9fd;
}

.nav_catalog .nav_scroll::-webkit-scrollbar-thumb {
  background-color: #d5d5d5;;
}

.nav_catalog .nav_scroll::-webkit-scrollbar-track {
  background-color: #f9f9fd;
}
















