//*********
//* c-btn *
//*********
.c-btn{
	background: $backgroundBtn;
	border-radius: $borderRadiusSmall;
	border: $borderBtn;
	color: $colorBtn;
	cursor: pointer;
	display: inline-block;
	font-size: $fontSizeBtn;
	font-weight: $fontWeightBtn;
	line-height: $lineHeightBtn;
	margin: 0;
	padding: $paddingBtn;
	position: relative;
	text-align: center;
	text-decoration: none;
	text-transform: $textTransformBtn;
	vertical-align: middle;
	@include mTransition($mTransition);

	& + .c-btn{
		margin-left: $spaceLarge
	}

	&:hover,
	&:focus{
		background: $backgroundHoverBtn;
		border: $borderHoverBtn;
		color: $colorHoverBtn;
	}

	&:active{
		background: $backgroundActiveBtn;
		border: $borderActiveBtn;
		color: $colorActiveBtn;
	}
}

.c-btn--secondary{
	background: $backgroundSecondaryBtn;
	border: $borderSecondaryBtn;
	color: $colorSecondaryBtn;

	&:hover,
	&:focus{
		background: $backgroundHoverSecondaryBtn;
		border: $borderHoverSecondaryBtn;
		color: $colorHoverSecondaryBtn;
	}

	&:active{
		background: $backgroundActiveSecondaryBtn;
		border: $borderActiveSecondaryBtn;
		color: $colorActiveSecondaryBtn;
	}
}

.c-btn--disabled{
	background: $backgroundDisabledBtn;
	border: $borderDisabledBtn;
	color: $colorDisabledBtn;
	cursor: default;

	&:hover,
	&:focus{
		background: $backgroundHoverDisabledBtn;
		border: $borderHoverDisabledBtn;
		color: $colorHoverDisabledBtn;
	}

	&:active{
		background: $backgroundActiveDisabledBtn;
		border: $borderActiveDisabledBtn;
		color: $colorActiveDisabledBtn;
	}
}

.c-btn--onlyIcon{
	height: $heightOnlyIconBtn;
	line-height: $lineHeightOnlyIconBtn;
	padding: 0;
	text-align: center;
	width: $widthOnlyIconBtn;
}

.c-btn--block{
	display: block;
	padding-left: 5px;
	padding-right: 5px;
	text-align: center;
	width: 100%;

	& + .c-btn--block{
		margin-left: 0;
		margin-top: $spaceLarge;
	}
}

.c-btn--small{
	font-size: $fontSizeSmallBtn;
	line-height: $lineHeightSmallBtn;
	padding: $paddingSmallBtn;

	& + .c-btn--small{
		margin-left: $spaceMedium
	}
}

// .c-btn--clear,
// .c-btn--clear-secondary{
// 	background: none;
// 	border: none;
// 	color: $colorPrimary;
// 	font-weight: normal;
// 	padding: 0;
// 	text-decoration: underline;

// 	&:hover,
// 	&:active,
// 	&:focus{
// 		background: none;
// 		border: none;
// 		color: $colorPrimaryDark;
// 		text-decoration: none;
// 		@include box-shadow(none);
// 	}

// 	&.c-btn--disabled{
// 		color: $paletteGreyNormal;
// 		text-decoration: none;
// 	}
// }

// .c-btn--clear-secondary{
// 	color: $colorSecondary;

// 	&:hover,
// 	&:active,
// 	&:focus{
// 		color: $colorSecondaryDark
// 	}

// 	&.c-btn--disabled{
// 		color: $paletteGreyNormal
// 	}
// }