// Unicode
@function unicode($str, $times: 1){
	$result: unquote("\\") + $str;
	@for $i from 1 to $times {
		$result: $result + unquote("\\") + $str;
	}
	@return unquote("\"") + $result + unquote("\"");
}

// Font Awesome
@mixin fas { font-family: $font-awesome; font-weight: 900; }
@mixin far { font-family: $font-awesome; font-weight: 400; }
@mixin fab { font-family: $font-awesome-brands; }

// Grid
@mixin grid { 
	display: -ms-grid; 
	display: grid; 

	&:before, &:after {
		content: none;
	}
}
@mixin grid-gap($gap) { grid-gap: $gap; }
@mixin grid-template-columns($column) { -ms-grid-columns: $column; grid-template-columns: $column; }
@mixin grid-repeat-columns($column) { -ms-grid-columns: (1fr)[$column]; grid-template-columns: repeat($column, 1fr); }

// Flex
@mixin flexbox { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; }
@mixin flex($flex) { -webkit-flex: $flex; flex: $flex; }
@mixin align-items($pos) { -webkit-align-items: $pos; align-items: $pos; }
@mixin justify-content($pos) { -webkit-justify-content: $pos; justify-content: $pos; }
@mixin flex-flow($flow) { -ms-flex-flow: $flow; flex-flow: $flow; }
@mixin flex-wrap($wrap) { -ms-flex-wrap: $wrap; flex-wrap: $wrap; }
@mixin flex-direction($direction) { -ms-flex-direction: $direction; flex-direction: $direction; }

// Column
@mixin column-count($count) { -webkit-column-count: $count; column-count: $count; }
@mixin column-gap($gap) { -webkit-column-gap: $gap; column-gap: $gap; }
@mixin column-break-avoid { -webkit-column-break-inside: avoid; -moz-column-break-inside: avoid; -moz-page-break-inside: avoid; page-break-inside: avoid; break-inside: avoid-column; }

// Transitions & Transform
@mixin transition($transition) { -webkit-transition: $transition; -o-transition: $transition; transition: $transition; }
@mixin transform($transform) { -webkit-transform: $transform; transform: $transform; }

// Placeholder
@mixin optional-at-root($sel) {
	@at-root #{if(not &, $sel, selector-append(&, $sel))} { @content; }
}
@mixin placeholder {
	@include optional-at-root('::-webkit-input-placeholder') { @content; }
	@include optional-at-root('::-moz-placeholder') 		 { @content; }
	@include optional-at-root(':-ms-input-placeholder') 	 { @content; }
}