@import 
	'../../mixins',
	'../../variables';


@if ( $mm_opt_iconbar )
{
	.mm-menu
	{
		--mm-iconbar-size: #{$mm_iconbarSize};
	}

	.mm-iconbar
	{
		color: $mm_dimmedTextColor;	//	IE11 fallback
		color: var( --mm-color-text-dimmed );

		border: 0 solid $mm_borderColor;
		border-color: var( --mm-color-border );
		border-right-width: 1px;

		text-align: center;

		overflow: hidden;
		box-sizing: border-box;

		width: $mm_iconbarSize; //	IE11 fallback
		width: var( --mm-iconbar-size );

		position: absolute;
		top: 0;
		left: 0;
		bottom: 0;
		z-index: 2;
	}

	.mm-menu_iconbar
	{
		.mm-panels,
		.mm-navbars_top,
		.mm-navbars_bottom
		{
			left: $mm_iconbarSize; //	IE11 fallback
			left: var( --mm-iconbar-size );
		}
	}

	.mm-iconbar__top,
	.mm-iconbar__bottom
	{
		width: inherit;
		position: absolute;

		> *
		{
			box-sizing: border-box;
			display: block;
			padding: ( $mm_btnSize / 4 ) 0;
		}
		a,
		a:hover
		{
			text-decoration: none;
		}
	}
	.mm-iconbar__top
	{
		top: 0;
	}
	.mm-iconbar__bottom
	{
		bottom: 0;
	}
}

@if ( $mm_opt_iconbar_tabs )
{
	.mm-iconbar__tab_selected
	{
		background: $mm_emphasizedBackgroundColor; //	IE11 fallback
		background: var( --mm-color-background-emphasis	); 
	}
}
