@import "../../../../src/style/abstracts/all";
:local(.button) {
	cursor: pointer;
	text-align: center;
	min-width: 42px;
	height: 34px;
	border: 1px solid rgba(0, 0, 0, .07);
	font-size: 14px;
	font-family: $normal-font;
	font-weight: bold;
	color: $primary-color;
	line-height: 32px;
	display: inline-block;
	padding: 0 6px;
	text-transform: uppercase;
	@include border-radius(2px);
	&[disabled] {
		cursor: not-allowed;
	}
}

:local(.formWrapper){
	display: inline-block;
	vertical-align: bottom;
}

:local(.icon){
	font-size: 14pt!important;
	vertical-align: middle;
}

:local(.buttonTypeFlat) {
	@include transition(all .2s);

	&:not([disabled]):hover {
		background-color: bright-gray($dark-color);
		color: #FFFFFF;
	}
	&:not([disabled]):active {
		background-color: bright-color($primary-color);
	}
	&[disabled] {
		color: rgba(0, 0, 0, 0.26);
		background-color: transparent;
	}
}

:local(.buttonTypeRaised) {
	&:not([disabled]) {
		@include raised(2);
		@include transition(box-shadow .4s cubic-bezier(.25, .8, .25, 1), background-color .4s cubic-bezier(.25, .8, .25, 1));
		&:hover{
			color: #FFFFFF;
		}
	}
	&:not([disabled]):active {
		@include raised(3);
		background-color: bright-color($primary-color);
	}
	&[disabled] {
		color: rgba(0, 0, 0, 0.26);
	}
}

:local(.buttonTypeMinimal)[disabled] {
	background: none;
	border: none;
	color: rgba(0, 0, 0, 0.26);
}

:local(.buttonTypeMinimal):not([disabled]) {
	background: none;
	border: none;
	color: $primary-color;
	&:local(.buttonThemeDefault),
	&:local(.buttonThemeDefault):visited,
	&:local(.buttonThemePrimary),
	&:local(.buttonThemePrimary):visited,
	&:local(.buttonThemeInfo),
	&:local(.buttonThemeInfo):visited,
	&:local(.buttonThemeSuccess),
	&:local(.buttonThemeSuccess):visited,
	&:local(.buttonThemeWarning),
	&:local(.buttonThemeWarning):visited,
	&:local(.buttonThemeDanger),
	&:local(.buttonThemeDanger):visited{
		background: none;
		border: none;
		&:hover {
			background-color: bright-gray($dark-color);
		}
	}
	&:local(.buttonThemeDefault),
	&:local(.buttonThemeDefault):visited {
		color: $default-text-color;
		&:active {
			background-color: bright-gray-active($dark-color);
		}
	}
	&:local(.buttonThemePrimary),
	&:local(.buttonThemePrimary):visited {
		color: $primary-color;
		&:active {
			background-color: bright-color($primary-color);
		}
	}
	&:local(.buttonThemeInfo),
	&:local(.buttonThemeInfo):visited {
		color: $info-color;
		&:active {
			background-color: bright-color($info-color);
		}
	}
	&:local(.buttonThemeSuccess),
	&:local(.buttonThemeSuccess):visited {
		color: $success-color;
		&:active {
			background-color: bright-color($success-color);
		}
	}
	&:local(.buttonThemeWarning),
	&:local(.buttonThemeWarning):visited {
		color: $warning-color;
		&:active {
			background-color: bright-color($warning-color);
		}
	}
	&:local(.buttonThemeDanger),
	&:local(.buttonThemeDanger):visited {
		color: $danger-color;
		&:active {
			background-color: bright-color($danger-color);
		}
	}
}

:local(.buttonThemeDefault):not([disabled]),
:local(.buttonThemeDefault):not([disabled]):visited {
	background-color: $default-color;
	color: #333;
	border: 1px solid border-color($default-color);
	@include transition(all .2s);
	&:hover {
		background-color: $default-hover-color;
		color: #333;
	}
	&:active {
		background-color: $default-active-color;
		color: #333;
	}
	&:local(.buttonTypeFlat) {
		&:active {
			background-color: $default-active-color;
			color: #333;
		}
	}
}

:local(.buttonThemePrimary):not([disabled]),
:local(.buttonThemePrimary):not([disabled]):visited {
	background-color: $primary-color;
	color: #FFFFFF;
	@include transition(all .2s);
	&:hover {
		background-color: hover-color($primary-color);
	}
	&:active {
		background-color: active-color($primary-color);
	}
	&:local(.buttonTypeFlat) {
		&:active {
			background-color: active-color($primary-color);
		}
	}
}

:local(.buttonThemeInfo):not([disabled]),
:local(.buttonThemeInfo):not([disabled]):visited {
	background-color: $info-color;
	color: #FFFFFF;
	@include transition(all .2s);
	&:hover {
		background-color: hover-color($info-color);
	}
	&:active {
		background-color: active-color($info-color);
	}
	&:local(.buttonTypeFlat) {
		&:active {
			background-color: active-color($info-color);
		}
	}
}

:local(.buttonThemeSuccess):not([disabled]),
:local(.buttonThemeSuccess):not([disabled]):visited {
	background-color: $success-color;
	color: #FFFFFF;
	@include transition(all .2s);
	&:hover {
		background-color: hover-color($success-color);
	}
	&:active {
		background-color: active-color($success-color);
	}
	&:local(.buttonTypeFlat) {
		&:active {
			background-color: active-color($success-color);
		}
	}
}

:local(.buttonThemeWarning):not([disabled]),
:local(.buttonThemeWarning):not([disabled]):visited {
	background-color: $warning-color;
	color: #FFFFFF;
	@include transition(all .2s);
	&:hover {
		background-color: hover-color($warning-color);
	}
	&:active {
		background-color: active-color($warning-color);
	}
	&:local(.buttonTypeFlat) {
		&:active {
			background-color: active-color($warning-color);
		}
	}
}

:local(.buttonThemeDanger):not([disabled]),
:local(.buttonThemeDanger):not([disabled]):visited {
	background-color: $danger-color;
	color: #FFFFFF;
	@include transition(all .2s);
	&:hover {
		background-color: hover-color($danger-color);
	}
	&:active {
		background-color: active-color($danger-color);
	}
	&:local(.buttonTypeFlat) {
		&:active {
			background-color: active-color($danger-color);
		}
	}
}