// ----
// libsass (v3.2.4)
// ----

@import "bourbon/bourbon";
$neutral-light: #eee;
$primary: blue;
$secondary: green;

/* Functional styling * These styles are required for noUiSlider to function.
 * You don't need to change these rules to apply your design.
 */
.noUi-target,
.noUi-target * {
-webkit-touch-callout: none;
-webkit-user-select: none;
-ms-touch-action: none;
-ms-user-select: none;
-moz-user-select: none;
-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.noUi-target {
	direction: ltr;
}
.noUi-base {
	width: 100%;
	height: 100%;
	position: relative;
}
.noUi-origin {
	position: absolute;
	right: 0;
	top: 0;
	left: 0;
	bottom: 0;
}
.noUi-handle {
	position: absolute;
	z-index: 1;
}
.noUi-stacking .noUi-handle {
	z-index: 10;
}
.noUi-stacking + .noUi-origin {
	*z-index: -1;
}
.noUi-state-tap .noUi-origin {
	@include transition(left 0.3s, top 0.3s);
}
.noUi-state-drag * {
	cursor: inherit !important;
}

.noUi-base {
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}

/* Slider size and handle placement */
.noUi-horizontal {
	height: 10px;

	.noUi-handle {
		top: -3px;
		left: -8px;
	}
}
.noUi-vertical {
	width: 10px;

	.noUi-handle {
		top: -8px;
		left: -3px;
	}
}

/* Styling */
.noUi-background {
	background: darken($neutral-light, 5%);
}
.noUi-connect {
	background: $secondary;
}
.noUi-origin {
	border-radius: 2px;
}

/* Handles and cursors */
.noUi-handle {
	@include size(16px);
	margin-bottom: 15px;
	background: $primary;
	border-radius: 80% 0 55% 50% / 55% 0 80% 50%;

	.tooltip span {
		position: absolute;
	}

	&.noUi-handle-lower {
		@include transform(rotate(45deg));

		.tooltip {
			@include transform(rotate(-45deg));

			span {
				top: 17px;
				right: 0;
			}
		}
	}

	&.noUi-handle-upper {
		@include transform(rotate(-135deg));

		.tooltip {
			span {
				top: 5px;
				left: 0;
			}
			@include transform(rotate(135deg));
		}
	}

	&.noUi-active {
		background: lighten($primary, 5%);
	}
}

/* Disabled state */
[disabled].noUi-connect,
[disabled] .noUi-connect {
	background: #B8B8B8;
}
[disabled] .noUi-handle {
	cursor: not-allowed;
}