/* aside[inert] > *{
	opacity: 0.0;
} */
/*************************************************************************************************************/
/***** WINDOW & DRAWER ***************************************************************************************/
/*************************************************************************************************************/
aside[data-type="window"],
aside[data-type="modal"]{
	z-index: var(--z-top);
}
aside[data-type="drawer"]{
	z-index: var(--z-header-behind);
}

@media(max-width:1024px){
	aside[data-type="window"][aria-role="menu"]#navigation-menu{
		z-index: var(--z-header-behind);
	}
}
aside[data-type="modal"],
aside[data-type="window"],
aside[data-type="drawer"]{
	position: fixed;
	inset: 0;
	transform: translateX(101%);
	display: flex;
}
aside[data-type="modal"] .backdrop,
aside[data-type="window"] .backdrop,
aside[data-type="drawer"] .backdrop{
	position: fixed;
	inset: 0;
	background-color: var(--color-black-50);
}

aside[data-type="modal"],
aside[data-type="modal"] .backdrop,
aside[data-type="window"],
aside[data-type="window"] .backdrop,
aside[data-type="drawer"],
aside[data-type="drawer"] .backdrop{
	opacity: 0;
	pointer-events: none;
	transition: var(--trans);
}
aside[data-type="modal"],
aside[data-type="window"],
aside[data-type="drawer"]{
	/* --height-header: var(--height-header-main, 60px);
	--height-footer: var(--height-header-main, 60px); */
	position: fixed;
	top:0;
	right: 0;

	width: 100%;
	height: 100%;
	min-height:100vh;
	min-height:100svh;
	opacity: 1;
	opacity: 0;
	transition: none;
	transform: translateY(101%);
	/* transition: var(--trans); */
}

aside[data-type="modal"].open,
aside[data-type="modal"].open .backdrop,
aside[data-type="window"].open,
aside[data-type="window"].open .backdrop,
aside[data-type="drawer"].open,
aside[data-type="drawer"].open .backdrop{
	opacity: 1;
	pointer-events: all;
	transform: translateY(0%);
}

aside[data-type="modal"] .window__content,
aside[data-type="window"] .window__content,
aside[data-type="drawer"] .window__content{
	width: 100%;
	background-color: var(--color-background);
	display: flex;
	flex-direction: column;
	overflow: auto;
	z-index: 1;
}
aside[data-type="modal"] .window__header,
aside[data-type="modal"] .window__footer,
aside[data-type="window"] .window__header,
aside[data-type="window"] .window__footer,
aside[data-type="drawer"] .window__header,
aside[data-type="drawer"] .window__footer{
	position: sticky;
	z-index: 1;
	flex-grow: 0;
}

aside[data-type="modal"] .window__header,
aside[data-type="window"] .window__header,
aside[data-type="drawer"] .window__header{
	width: 100%;
	height: var(--height-header-main);
	top: 0;
	display: flex;
	justify-content: space-between;
	align-items: center;
	/* border-bottom: var(--border); */
}
aside[data-type="modal"] .window__body,
aside[data-type="window"] .window__body,
aside[data-type="drawer"] .window__body{
	flex-grow: 1;
	padding-block: var(--padding-container-inline);
	padding-inline: var(--padding-container-inline);
}

aside[data-type="window"] .window__footer:not(:empty){
	height: 80px;
	bottom:0;
	align-items: center;
}


/*************************************************************************************************************/
/***** NAVIGATION MENU ***************************************************************************************/
/*************************************************************************************************************/
/****************************/
/* Window - Navigation Menu */
/****************************/
@media(max-width:1024px){
	#site-header #navigation-icon svg,
	#site-header #navigation-icon svg rect{
		transition: var(--trans);
		transform-origin: center;
	}
	aside[data-type="window"]#navigation-menu.open ~ #site-header .header-icon:not(#header-burger){
		opacity: 0;
		pointer-events: none;
	}
	aside[data-type="window"]#navigation-menu.open ~ #site-header #navigation-icon svg{
		height: 22px;
	}
	aside[data-type="window"]#navigation-menu.open ~ #site-header #navigation-icon svg rect{
		width: 22px;
	}
	aside[data-type="window"]#navigation-menu.open ~ #site-header #navigation-icon svg rect:first-child {
		transform: rotate(45deg) translate(0px, 4px);
	}
	aside[data-type="window"]#navigation-menu.open ~ #site-header #navigation-icon svg rect:last-child {
		transform: rotate(-45deg) translate(0px, -4px);
	}

	aside#navigation-menu{
		position: fixed;
		z-index: 3000;
		z-index: var(--z-header-front);
		top:0;
		right: 0;
		width: 100%;
		height: 100%;
		min-height:100vh;
		min-height:100svh;
		transition: none;
		transform: translateX(101%);
		pointer-events: none;
	}
	aside#navigation-menu.open,
	aside#navigation-menu.open a,
	aside#navigation-menu.open .window__close{
		pointer-events: all;
	}
	aside#navigation-menu .window__header,
	aside#navigation-menu .window__body,
	aside#navigation-menu .window__footer,
	aside#navigation-menu .window__content{
		background-color: var(--color-background);
		background-color: var(--color-accent);
		color: var(--color-white);
	}
	aside#navigation-menu .window__content{
		width: 100%;
		height: 100%;
		display: flex;
		flex-direction: column;
		gap: 0;
		overflow: auto;
		z-index: 1;
	}

	aside#navigation-menu .window__header,
	aside#navigation-menu .window__footer{
		flex-grow: 0;
		flex-shrink: 0;
	}
	aside#navigation-menu .window__body{
		flex-grow: 1;
	}
	aside#navigation-menu .window__header,
	aside#navigation-menu .window__body,
	aside#navigation-menu .window__footer{
		padding-inline: var(--padding-container-inline);
	}

	/* Aside Navigation - Header */
	aside#navigation-menu .window__header{
		height: var(--height-header);
		height: var(--height-header--sticky);
		display: flex;
		justify-content: space-between;
		/* justify-content: center; */
		align-items: center;
		position: sticky;
		top: 0;
		z-index: 1;
		pointer-events: none;
	}
	aside#navigation-menu .window__header .logo,
	aside#navigation-menu .window__header .logo img,
	aside#navigation-menu .window__header .logo svg{
		display: flex;
		width: auto;
		height: var(--height-logo--sticky);
	}
	/* aside#navigation-menu .window__close{
		position: absolute;
		right: 20px;
	} */
	aside#navigation-menu .window__close button{
		display: flex;
	}
	/* Aside Navigation - Footer */
	aside[data-type="window"]#navigation-menu .window__footer:not(:empty){
		height: auto;
	}
	aside#navigation-menu .window__footer{
		display: flex;
		justify-content: center;
		gap: var(--gap-300);
		padding-block: var(--gap-500);
		padding-top: var(--gap-300);
	}
	aside#navigation-menu .window__footer a{
		--padding-button: 14px 16px;
		width: 100%;
	}
	

	/* Aside Navigation - Body */
	aside#navigation-menu .window__body{
		display: flex;
		align-items: center;
	}
	aside#navigation-menu .window__body .navigation-menu-navs{
		display: flex;
		flex-direction: column;
		gap: var(--gap-700);
		align-items: center;
	}
	
	/* Group - Gaps Between Items */
	aside#navigation-menu .window__body nav ul{
		display: flex;
		flex-direction: column;
		gap: var(--gutter-200);
	}
	aside#navigation-menu .window__body nav ul li.menu-item.menu-item-cta{
		display: none;
	}

	/* Menu */
	aside#navigation-menu nav ul li.menu-item > a{
		--fs-h2: 30px;
		width: 100%;
		display: flex;
		justify-content: center;
		font-family: var(--ff-heading);
		font-size: var(--fs-h2);
		letter-spacing: var(--ls-300);
		text-transform: uppercase;
	}

	/* Secondary Menu */
	aside#navigation-menu nav#secondary_menu__mobile ul{
		gap: var(--gap-500);
		flex-direction: row;
	}
	aside#navigation-menu nav#secondary_menu__mobile ul li.menu-item a{
		/* font-family: var(--ff-text); */
		font-size: var(--fs-h6);
		letter-spacing: 0;
		text-transform: none;
	}


	aside#navigation-menu [data-widget="language-switcher"],
	aside#navigation-menu [data-widget="social"] .social-media{
		justify-content: center;
	}

	/* Language Switcher */
	aside#navigation-menu [data-widget="language-switcher"]{
		margin-top: var(--gap-500);
	}
	aside#navigation-menu [data-widget="language-switcher"] .options{
		gap: var(--gap);
	}
	aside#navigation-menu [data-widget="language-switcher"],
	aside#navigation-menu [data-widget="language-switcher"] span,
	aside#navigation-menu [data-widget="language-switcher"] a{
		/* font-size: var(--fs-text); */
		color: var(--color-white);
	}

	aside#navigation-menu [data-widget="language-switcher"] svg path{
		fill: var(--color-white);
	}
}

/*************************************************************************************************************/
/***** MODALS ************************************************************************************************/
/*************************************************************************************************************/
aside[data-type="modal"]{
	align-items: center;
	justify-content: center;
	transform: translateY(0);
}
aside[data-type="modal"] .window__content{
	width: 100%;
	max-width: var(--col-6);
	height: 100%;
}
aside[data-type="modal"] .window__header{
	padding-block: var(--gap-300);
	padding-inline: var(--padding-container-inline);
}

aside[data-type="modal"] .window__header .logo svg{
	width: auto;
	height: var(--height-header-logo);
}

aside[data-type="modal"] .window__header button{
	width: var(--size-100, 24px);
	height: var(--size-100, 24px);
	display: flex;
	justify-content: center;
	align-items: center;
	margin-left: auto;
}
aside[data-type="modal"] .window__body{
	padding-block: var(--gap-600);
	padding-bottom: var(--gap-global);
	padding-inline: var(--gap-600);
	display: flex;
	flex-direction: column;
	gap: var(--gap-600);
}
aside[data-type="modal"] .window__body header{
	display: flex;
	flex-direction: column;
	gap: var(--gap-200);
	text-align: center;
}

@media(min-width: 1025px){
	aside[data-type="modal"] .window__content{
		height: auto;
	}
	aside[data-type="modal"] .window__header{
		padding-block: var(--gap-600);
		padding-inline: var(--gap-600);
		height: auto;
		border-bottom: 0;
	}
}

/**************************************************************************************************************/
/***** BAR CTA [Mobile] ***************************************************************************************/
/**************************************************************************************************************/

@media(max-width: 767px){
	body.menu-is-open aside[data-type="bar"]#bar-cta{
		transform: translateY(100%);
	}

	aside[data-type="bar"]#bar-cta{
		position: sticky;
		bottom: 0;
		padding-block: var(--gap);
		padding-inline: var(--padding-container-inline);

		background-color: var(--color-accent);
		z-index: var(--z-header-behind);
		transition: var(--trans);
	}
	aside[data-type="bar"]#bar-cta .item__actions{
		justify-content: center;
		gap: var(--gap-300);
		flex-wrap: nowrap;
	}
	aside[data-type="bar"]#bar-cta .item__actions a{
		width: 100%;
		--padding-button: 14px 16px;
	}
}
@media(max-width: 320px){
	aside[data-type="bar"]#bar-cta .item__actions a{
		width: auto;
	}
}

/**************************************************************************************************************/
/***** SOCIAL ASIDE *******************************************************************************************/
/**************************************************************************************************************/
aside[data-widget="aside-social"]{
	--width: 20px;
	--right: 0px;
	position: absolute;
	top: 55%;
	transform: translateY(-50%);
	right: var(--right);
	width: var(--width);
}

aside[data-widget="aside-social"] [data-widget="social"] .social-media{
	flex-direction: column;
}
aside[data-widget="aside-social"] [data-widget="social"] label{
	display: flex;
	align-items: center;
	writing-mode: vertical-lr;
}

/**************************************************************************************************************/
/***** NOT SUPPORTING *****************************************************************************************/
/**************************************************************************************************************/
/* NOT Supports Clamp */
@supports (not (width: clamp(1px, 1px, 1px))) {
	aside[data-type="drawer"] .window__content{
		height: 60vh;
		min-height: 400px;
		max-height: 600px;
	}
}