
.mega-top-menu{
	align-items:flex-end;
	box-sizing:border-box;
	display:flex;
	flex-direction:column;
	height:100%;
	opacity:1;
	pointer-events:none;
	position:fixed;
	top:0;
	transform:translateX(100%);
	width:100%;
	z-index:102
}
.rtl .mega-top-menu{
	transform:translateX(-100%)
}
.mega-top-menu.active{
	transform:translateX(0)
}
.mega-top-menu.animate{
	transition:transform .2s ease-out;
	transition-delay:.2s
}
.mega-top-menu.animate.no-delay{
	transition-delay:0s
}
.mega-top-menu .top-nav{
	align-items:flex-start;
	background:var(--mobile-surface-1);
	box-sizing:border-box;
	display:flex;
	flex-direction:row;
	justify-content:space-between;
	margin-inline-start:10px;
	padding:24px;
	pointer-events:auto;
	width:100%
}
.mega-top-menu .top-nav .home{
	display:block
}
.mega-top-menu .top-nav .nav-elem.text-icon{
	margin:0;
	padding:0
}
.mega-top-menu .nav-elem.home i.left-icon{
	--width:74px;
	--height:24px;
	height:var(--height);
	width:var(--width)
}
.mega-top-menu .menu{
	align-items:flex-start;
	background:var(--mobile-surface-1);
	display:flex;
	flex-direction:column;
	height:100%;
	overflow-y:scroll;
	pointer-events:auto;
	width:100%
}
.mega-top-menu .menu .nav-elem:nth-last-child(2){
	margin-top:auto
}
.mega-top-menu .menu .nav-elem{
	color:var(--mobile-text-primary);
	padding:16px 24px
}
.mega-top-menu .nav-elem.text-icon:active,.mega-top-menu .nav-elem.text-icon:hover{
	text-decoration:none
}
.mega-top-menu .nav-elem.active{
	background:var(--mobile-page-background);
	border-inline-start:4px solid var(--mobile-border-brand);
	padding-inline-start:20px
}
.mega-top-menu .nav-elem:not(.active):hover{
	background:var(--mobile-surface-2)
}
.mega-top-menu .nav-elem.button span.primary-text,.mega-top-menu .nav-elem.link span{
	font:var(--mobile-font-link-large-regular)
}
.mega-top-menu .menu .account-tablet{
	display:none
}
.mega-top-menu .menu .account-tablet .avatar,.mega-top-menu .menu .account-tablet .avatar div{
	border-radius:100%;
	height:var(--icon-size);
	width:var(--icon-size)
}
.mega-top-menu .menu .account-tablet .avatar div{
	text-align:center
}
.mega-top-menu .menu .account-tablet .avatar div span{
	color:#fff
}
.mega-top-menu .menu .account-tablet .avatar img{
	border-radius:100%;
	max-height:100%;
	width:auto
}
@media only screen and (min-width:769px){
.main-layout:not(.no-tablet-layout) .mega-top-menu,.rtl .main-layout:not(.no-tablet-layout) .mega-top-menu{
	border-inline-end:1px solid var(--mobile-border-strong);
	height:100% !important;
	opacity:1;
	position:relative;
	top:0 !important;
	transform:none;
	z-index:auto
}
.main-layout:not(.no-tablet-layout) .mega-top-menu .top-nav{
	justify-content:flex-start;
	margin-inline-start:0;
	width:100%
}
.main-layout:not(.no-tablet-layout) .mega-top-menu .top-nav .close{
	display:none
}
.mega-top-menu .menu .account-tablet{
	display:flex
}
.mega-top-menu{
	overflow:auto
}
}
