/**
 * menu_header_double
 * @version	1.0
 * @release	01-04-2021
 * @author	msolowski Marcin Sołowski
 * @website	http://msolowski.pl
 */

.menu_header
{
	--menu_header_font_family:		var(--root_font_family);
	--menu_header_font_size:		var(--global_font_size_p);
	--menu_header_font_weight:		500;
	--menu_header_color:			var(--root_color_white);
	--menu_header_background_color:	var(--root_color_lead);
	--menu_header_border_color:		var(--root_color_lead);
	--menu_header_border_width:		0;
	--menu_header_border_radius:	0;
	--menu_header_transition:		var(--global_transition);
	--menu_header_line_height:		1;

	/**********************************************************************************/

	font-size: 16px;
	font-weight: 500;
	display: flex;
	align-items: flex-end;
	flex-wrap: wrap;
/*	text-transform: uppercase;
	font-weight: bold; */
}

/**********************************************************************************/

.menu_header a
{
	color: var(--root_color_dark); /* dziedzicza po tym wszystkie a nizszych poziomow */
	display: inline-flex;
}

.menu_header ul.menu.double
{
	display: flex;
	list-style: none;
	margin-right: var(--global_size_40);
}

.menu_header > ul:last-child,
.menu_header > div > ul:last-child
{
	margin-right: 0 !important;
}

.menu_header ul.menu.double > li
{
	--min_menu_header_double_li: 15;
	--max_menu_header_double_li: 20;
	--menu_header_double_li:
		clamp(calc(var(--min_menu_header_double_li) * 1px),
		calc((((-1 * var(--global_scm_var)) * ((var(--max_menu_header_double_li) - var(--min_menu_header_double_li)) / (var(--global_sc_var) - var(--global_scm_var))) + var(--min_menu_header_double_li)) * 1px)
		+ ((var(--max_menu_header_double_li) - var(--min_menu_header_double_li)) / (var(--global_sc_var) - var(--global_scm_var)) * 100vw)),
		calc(var(--max_menu_header_double_li) * 1px));
	position: relative;
/*	border-right: 1px solid transparent; */ /* potrzebne gdy musza wystapic odstepy miedzy elementami li w postaci kresek pionowych */
	transition: var(--global_transition);
}

.menu_header ul.menu.double > li.menu-item-has-children
{
/*	padding-right: var(--menu_header_double_li); */
}

.menu_header ul.menu.double > li:last-child
{
	margin-right: 0;
}

.menu_header ul.menu.double > li::before
{
/*	content: '';
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: var(--root_color_lead);
	transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
	z-index: 1;
	opacity: 0; */
}

.menu_header ul.menu.double > li::after /* potrzebne gdy musza wystapic odstepy miedzy elementami li w postaci kresek pionowych */
{
/*	content: '';
	display: block;
	position: absolute;
	height: 50%;
	top: 25%;
	left: 100%;
	width: 1px;
	background-color: var(--root_color_dark); */
}

.menu_header ul.menu.double > li:last-of-type::after
{
/*	width: 0; */
}

.menu_header ul.menu.double > li:hover
{
/*	background-color: var(--root_color_dark);
	box-shadow: var(--global_shadow); */
}

.menu_header ul.menu.double > li.menu-item-has-children:hover
{
/*	box-shadow: 3px calc(var(--global_shadow_blur) * -1) var(--global_shadow_blur) 0 rgba(0, 0, 0, 0.09); */
}

.menu_header ul.menu.double > li:hover::before
{
/*	opacity: 1; */
}

/**********************************************************************************/

.menu_header ul.menu.double > li.current-menu-item,
.menu_header ul.menu.double > li.current-menu-ancestor
{
/*	box-shadow: var(--global_shadow); */
}

.menu_header ul.menu.double > li.current-menu-item
{
/*	pointer-events: none; */
}

.menu_header ul.menu.double > li.menu-item-has-children::after
{
/*	font-family: 'msolowski';
	content: '\e90b';
	color: var(--root_color_black);
	transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
	font-size: 0.5em;
	margin-left: 10px; */
}

.menu_header ul.menu.double > li.menu-item-has-children.current-menu-item::after,
.menu_header ul.menu.double > li.menu-item-has-children.current-menu-ancestor::after
{
/*	color: var(--root_color_lead); */
}

.menu_header ul.menu.double > li.menu-item-has-children:hover::after
{
/*	color: var(--global_color_custom); */
/*	color: var(--root_color_lead);
	transform: rotate(180deg); */
}

.menu_header ul.menu.double > li.current-menu-item > a,
.menu_header ul.menu.double > li.current-menu-ancestor > a
{
/*	color: var(--root_color_lead); */
}

.menu_header ul.menu.double > li.current-menu-item > a::after,
.menu_header ul.menu.double > li.current-menu-ancestor > a::after
{
/*	left: 0;
	width: 100%;
	opacity: 1; */
}

/**********************************************************************************/

.menu_header ul.menu.double > li > a
{
	padding-top: calc(var(--menu_header_double_li) * 0.75);
	padding-bottom: calc(var(--menu_header_double_li) * 0.75);
	padding-left: var(--menu_header_double_li);
	padding-right: var(--menu_header_double_li);
	position: relative;
	z-index: 2;
	align-items: center;
}

.menu_header ul.menu.double > li.menu-item-has-children > a
{
/*	padding-right: 0; */
/*	pointer-events: none; */
}

.menu_header ul.menu.double > li.menu-item-has-children > a::after
{
	font-family: 'msolowski';
	content: '\e900';
	transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
	font-size: 0.4em;
	margin-left: var(--global_size_10);
/*	z-index: 2; */
}

.menu_header ul.menu.double > li.menu-item-has-children:hover > a::after
{
/*	color: var(--global_color_custom); */
	transform: rotate(180deg);
}

.menu_header ul.menu.double > li > a::after
{
/*	content: '';
	display: block;
	position: absolute;
	width: 0;
	height: 2px;
	bottom: calc(100% + 6px);
	left: 50%;
	background-color: var(--global_color_custom);
	opacity: 1;
	transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1); */
}

.menu_header ul.menu.double > li:hover > a
{
	color: var(--root_color_lead);
}

.menu_header ul.menu.double > li:hover > a::after
{
/*	left: 0;
	width: 100%;
	opacity: 1; */
}

.menu_header ul.menu.double > li:active > a
{
/*	transform: scale(0.95, 0.95); */
}

/**********************************************************************************/ /* 2 poziom */

.menu_header ul.menu.double > li > ul.sub-menu
{
	position: absolute;
	display: block;
	top: 100%;
	left: 0;
	list-style: none;
	opacity: 0;
	visibility: hidden;
	padding: 20px 0 20px 0;
	transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
	background-color: var(--root_color_white);
	width: max-content;
	max-width: max-content;
	box-shadow: 0px 14px 23px rgba(0, 0, 0, 0.06);
}

.menu_header ul.menu.double > li:hover > ul.sub-menu
{
	opacity: 1;
	visibility: visible;
}

.menu_header ul.menu.double > li > ul.sub-menu > li
{
	position: relative;
/*	border-bottom: 1px solid transparent; */ /* potrzebne gdy musza wystapic odstepy miedzy elementami li w postaci kresek poziomych */
	transition: var(--global_transition);
}

.menu_header ul.menu.double > li > ul.sub-menu > li + li
{
/*	margin-top: 30px; */
}

.menu_header ul.menu.double > li > ul.sub-menu > li:last-child
{
/*	border-bottom: 0; */
}

.menu_header ul.menu.double > li > ul.sub-menu > li::before
{
/*	font-family: 'msolowski';
	content: '\e903';
	color: var(--global_color_custom);
	font-weight: bold;
	margin-right: 6px; */
}

.menu_header ul.menu.double > li > ul.sub-menu > li::after /* potrzebne gdy musza wystapic odstepy miedzy elementami li w postaci kresek poziomych */
{
/*	content: '';
	display: block;
	position: absolute;
	width: 50%;	
	height: 1px;
	top: 100%;
	left: 25%;
	background-color: var(--root_color_dark); */
}

.menu_header ul.menu.double > li > ul.sub-menu > li:last-child::after
{
/*	width: 0; */
}

.menu_header ul.menu.double > li > ul.sub-menu > li:hover
{
	background-color: var(--root_color_light);
}

/**********************************************************************************/

.menu_header ul.menu.double > li > ul.sub-menu > li.current-menu-item > a
{
	color: var(--root_color_lead);
}

.menu_header ul.menu.double > li > ul.sub-menu > li.current-menu-item
{
/*	pointer-events: none; */
}

/**********************************************************************************/

.menu_header ul.menu.double > li > ul.sub-menu > li > a
{
	padding-top: calc(var(--menu_header_double_li) * 0.7);
	padding-bottom: calc(var(--menu_header_double_li) * 0.7);
	padding-left: calc(var(--menu_header_double_li) * 2.4);
	padding-right: calc(var(--menu_header_double_li) * 2.4);
	position: relative;
	display: flex;
}

.menu_header ul.menu.double > li > ul.sub-menu > li > a::after
{
/*	content: '';
	display: block;
	position: absolute;
	width: 0;
	height: 2px;
	bottom: 0;
	left: 50%;
	background-color: var(--global_color_custom);
	opacity: 1;
	transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1); */
}

.menu_header ul.menu.double > li > ul.sub-menu > li > a:hover
{
	color: var(--root_color_lead);
}

.menu_header ul.menu.double > li > ul.sub-menu > li > a:hover::after
{
/*	left: 0;
	width: 100%;
	opacity: 1; */
}

.menu_header ul.menu.double > li > ul.sub-menu > li > a:active
{
/*	transform: scale(0.95, 0.95); */
}

/**********************************************************************************/ /* 3 poziom i kolejne */

.menu_header ul.menu.double > li > ul.sub-menu li > ul.sub-menu /* zablokowane wyswietlanie nizszych poziomow, aby niepotrzebnie nie generowac kolejnego menu */
{
	display: none
}

/**********************************************************************************/

@media screen and (max-width: 1680px)
{
}

@media screen and (max-width: 1600px)
{
}

@media screen and (max-width: 1440px)
{
}

@media screen and (max-width: 1366px)
{
}

@media screen and (max-width: 1300px)
{
}

@media screen and (max-width: 1200px)
{
}

@media screen and (max-width: 1024px)
{
	.menu_header
	{
		display: none;
	}
}

@media screen and (max-width: 800px)
{
}

@media screen and (max-width: 640px)
{
}

@media screen and (max-width: 480px)
{
}

@media screen and (max-width: 360px)
{
}