// --- Mixins ---

// box-sizing
.box-sizing(@value) {
	-webkit-box-sizing: @arguments;
	-moz-box-sizing: @arguments;
	-ms-box-sizing: @arguments;
	-o-box-sizing: @arguments;
	box-sizing: @arguments;
}

// user select
.user-select(@value) {
	-webkit-user-select: @value;
	-khtml-user-select: @value;
	-moz-user-select: @value;
	-ms-user-select: @value;
	user-select: @value;
}

// Transition
.transition(@value) {
	-webkit-transition: @value;
	-moz-transition: @value;
	-o-transition: @value;
	transition: @value;
}

// Transform
.transform(@value) {
	-webkit-transform: @value;
	-moz-transform: @value;
	-ms-transform: @value;
	-o-transform: @value;
	transform: @value;
}

// animation
.animation(@value) {
	-webkit-animation: @value;
	-moz-animation: @value;
	-o-animation: @value;
	animation: @value;
}

// appearance
.ie-remove-select-style() {
	&::-ms-expand {
		display: none;
	}
}

.remove-button-style() {
	border: none;
	cursor: pointer;
	background-color: transparent; // Remove button style for Safari
}

// clear fix for use on :before or :after pseudo elements
.clearfix() {
	display: table;
	clear: both;
	content: "";
}

// hides text by pushing it out of bounds (accessibility etc.)
.hidetext() {
	overflow: hidden;
	white-space: nowrap;
	text-indent: 101%;
}

// takes rem values and generates pixel-based fallback values for oldIE
// based on base size for desk-top devices
.font-size-rem(@value) {
	@unitlessValue: unit(@value);
	@unitlessRootFontSize: unit(@rootFontSize);
	font-size: round(16px * (@unitlessRootFontSize/100) * @unitlessValue); // can't rely on LESS's percent value computation
	font-size: ~"@{unitlessValue}rem";
}

// - Helpers

// triangle icon
.triangle(@_, @color, @size) {
	border-width: @size;
	border-style: solid;
	width: 0;
	height: 0;
}

.triangle(up, @color, @size) {
	border-color: transparent transparent @color transparent;
}

.triangle(right, @color, @size) {
	border-color: transparent transparent transparent @color;
}

.triangle(down, @color, @size) {
	border-color: @color transparent transparent transparent;
}

.triangle(left, @color, @size) {
	border-color: transparent @color transparent transparent;
}
