/* Vertical Menu CSS */


.vertical-layout-opened-false {

	.vertical-navigation {

		&:hover .vertical-menu-container {
			opacity: 1;
			visibility: visible;
			display: block; 
		}

		.vertical-menu-container {
			display: none;
			opacity: 0;
			visibility: hidden;
		}
	}
}

.vertical-layout-opened-true {

	.vertical-navigation {

		body:not(.home) &:hover .vertical-menu-container {
			opacity: 1;
			visibility: visible;
			display: block; 
		}

		.vertical-menu-container {
			display: block;
			opacity: 1;
			visibility: visible;

			body:not(.home) & {
				display: none;
				opacity: 0;
				visibility: hidden;
			}
			&.hidden { 
				display: none;
				opacity: 0;
				visibility: hidden;
			}
		}
	}
}

.vertical-navigation {
	&.header-navigation {
		display: block;
	}
	position: relative;
	height: 100%;
	width: 100%;

	.vertical-navigation-header {

		padding: 0 20px;
		display: flex;
		align-items: center;
		height: 100%;
		cursor: pointer;

		.base-svg-iconset {
			font-size: 22px;
			margin-right: 10px;
			vertical-align: middle;
		}
		
	}
	
	.vertical-menu-container {
		position: absolute;
		top: 100%;
		left: 0;
		width: 100%;
		min-width: max-content;
		background-color: var(--global-palette7);

		ul.menu {
			position: relative;
			list-style: none;
			margin: 0;
			border: 2px solid var(--global-palette1);
			border-top: none;
			display: block;
			flex-wrap: unset;
			width: 100%;
			& > li.menu-item {
				border-bottom: 1px solid var(--global-palette7);
				&:last-child {
				border-bottom: none; 
			}
		}
		.sub-menu {
			position: absolute;
			left: 100%;
			top: 0;
			opacity: 0;
			visibility: hidden;
			list-style: none;
			margin: 0;
			z-index: 99; 
			@media (max-width: 767px) {
				max-width: 100%;
				width: 100% !important;
				left: 0;
				top: 100%;

				&.open {
					opacity: 1;
					visibility: visible; 
				} 
			}
		}
		& > li:hover {
		& > .sub-menu {
			opacity: 1;
			visibility: visible;
			& > li:hover {
			& > .sub-menu {
				opacity: 1;
				visibility: visible; 
			}
			}
		}
		}
	}
	}
}
