/*
	jQuery.mmenu buttonbars addon CSS
*/

@import "../inc/variables";


.mm-buttonbar
{
	border: 1px solid transparent;
	border-radius: $mm_padding / 2;
	text-align: center;
	line-height: $mm_buttonbarHeight;
	overflow: hidden;
	display: block;
	padding: 0;
	margin: 0;
	position: relative;
	
	@include mm_clearfix;

	> *
	{
		border-left: 1px solid transparent;
		box-sizing: border-box;
		display: block;
		width: 100%;
		height: 100%;
		float: left;

		@include mm_ellipsis;
	}
	> a
	{
		text-decoration: none;
	}
	> input
	{
		position: absolute;
		left: -1000px;
		top: -1000px;
	}
	> input:checked + label
	{
		border-color: transparent  !important;
	}
	
	> *:first-child,
	> input:first-child + *
	{
		border-left: none;
	}


	&.mm-buttonbar-2 > *
	{
		width: 50%;
	}
	&.mm-buttonbar-3 > *
	{
		width: 33.33%;
	}
	&.mm-buttonbar-4 > *
	{
		width: 25%;
	}
	&.mm-buttonbar-5 > *
	{
		width: 20%;
	}
}

.mm-header .mm-buttonbar
{
	margin-top: $mm_headerHeight - ( $mm_buttonbarHeight * 2 );
	margin-left: -( $mm_btnSize - $mm_padding );
	margin-right: -( $mm_btnSize - $mm_padding );
}

.mm-footer .mm-buttonbar
{
	border: none;
	border-radius: none;
	line-height: $mm_footerHeight;
	margin: ( -$mm_padding ) ( -$mm_padding ) 0 ( -( $mm_padding * 2 ) );
	
	> *
	{
		border-left: none;
	}
}

.mm-list > li > .mm-buttonbar
{
	margin: $mm_padding ( $mm_padding * 2 );
}


@include mm_colors_buttonbars;