// == Buttons
// --------------------------------------------------
.btn {
	transition: border-color .15s ease-in-out;
}

.btn-group:not(.group-tag-btn) {
	@media (max-width: $screen-xs) {
		width: 100%;
	}
}

.btn-group > .btn {
	@media (max-width: $screen-xs) {
		border-radius: 4px;
		width: 100%;
	}
}

.btn-group > .btn + .btn {
	@media (max-width: $screen-xs) {
		margin-top: 10px;
	}
}

.btn-primary:focus {
	box-shadow: 0 1px 1px rgba(0, 0, 0, .075) inset, 0 0 8px rgba(56, 130, 156, .6);
}

.btn-default.active {
	@include gradient-vertical(darken($btn-default-bg, $btn-hover-level-start), darken($btn-default-bg, $btn-hover-level-end));
}

// Apply gradient backgrounds for all btn-variants
$btn-background-colors: (
  default:                                       $btn-default-bg,
  primary:                                       $btn-primary-bg,
  success:                                       $btn-success-bg,
  warning:                                       $btn-warning-bg,
  danger:                                        $btn-danger-bg
);

@each $variant, $bg-color in $btn-background-colors {
	.btn-#{$variant} {
		@include gradient-vertical($bg-color, darken($bg-color, $btn-level-end));
		box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1);

		&:hover {
			@include gradient-vertical(darken($bg-color, $btn-hover-level-start), darken($bg-color, $btn-hover-level-end));
		}
	}
}

.btn-go {
	@extend .btn-primary;
}

.btn-add,
.btn-save {
	@extend .btn-success;
}

.btn-edit {
	@extend .btn-default;
}

.btn-cancel,
.btn-delete,
.btn-remove {
	@include gradient-vertical($btn-default-bg, darken($btn-default-bg, $btn-level-end));
	border: 1px solid $btn-default-border;

	&:hover {
		@include gradient-vertical($btn-danger-bg, darken($btn-danger-bg, $btn-level-end));
		border: 1px solid $btn-danger-border;
	}
}

.btn-sm {
	@media (max-width: $screen-xs) {
		@include btn-base;
	}
}

.remove-btn {
	background-color: transparent;
	border: 0;
	color: $gray-light;
	padding: 0;

	&:hover {
		color: $gray-dark;
		cursor: pointer;
	}
}

.btn-icon {
	@include td-margin(left, 5px);
	background: none;
	border: 0;
	cursor: pointer;
	font-size: $font-size-small;
	padding: 0;
}

.btn-inline {
	@include td-margin(left, 5px);
}

.btn-link {
	border: 0;
	margin: 0;
	padding: 0;
}
