// Button variants
//
// Easily pump out default styles, as well as :hover, :focus, :active,
// and disabled options for all buttons

.button-variant(@background, @border, @color) {
	@hover-background: darken(@background, 7.5%);
	@hover-border: darken(@border, 10%);
	@active-background: darken(@background, 10%);
	@active-border: darken(@border, 12.5%);

	color: @color;
	background: @background;
	border-color: @border;
	box-shadow: @btn-box-shadow;

	&:hover {
		color: @color;
		background: @hover-background;
		border-color: @hover-border;
	};

	&:focus,
	&.focus {
		box-shadow: @btn-box-shadow, 0 0 0 @btn-focus-width fade(@border, 50%);
	}

	// Disabled comes first so active can properly restyle
	&.disabled,
	&:disabled {
		color: @color;
		background-color: @background;
		border-color: @border;
	}

	&:not(:disabled):not(.disabled):active,
	&:not(:disabled):not(.disabled).active,
	.show > &.dropdown-toggle {
		color: @color;
		background-color: @active-background;
		border-color: @active-border;

		&:focus {
			box-shadow: @btn-active-box-shadow, 0 0 0 @input-btn-focus-width fade(@border, 50%);
		}
	}
}

.button-outline-variant(@color, @color-hover) {
	@active-background: @color;
	@active-border: @color;

	color: @color;
	background-color: transparent;
	background-image: none;
	border-color: @color;

	&:hover {
		color: @color-hover;
		background-color: @active-background;
		border-color: @active-border;
	}

	&:focus,
	&.focus {
		box-shadow: 0 0 0 @btn-focus-width fade(@color, 50%);
	}

	&.disabled,
	&:disabled {
		color: @color;
		background-color: transparent;
	}

	&:not(:disabled):not(.disabled):active,
	&:not(:disabled):not(.disabled).active,
	.show > &.dropdown-toggle {
		color: @active-background;
		background-color: @active-background;
		border-color: @active-border;

		&:focus {
			box-shadow: @btn-active-box-shadow, 0 0 0 @btn-focus-width fade(@color, 50%);
		}
	}
}

// Button sizes
.button-size(@padding-y, @padding-x, @font-size, @line-height, @border-radius) {
	padding: @padding-y @padding-x;
	font-size: @font-size;
	line-height: @line-height;
	border-radius: @border-radius;
}