/**
 * File: _setup.scss
 * Type: SASS module
 * Author: Chris Humboldt
 */

// Font face
// ---------------------------------------------------------------------------------------
@font-face {
	font-family: 'buttonplate';
	src:url('#{$font-face-buttonplate}/icomoon.eot?c4hmew');
	src:url('#{$font-face-buttonplate}/icomoon.eot?#iefixc4hmew') format('embedded-opentype'),
		url('#{$font-face-buttonplate}/icomoon.woff?c4hmew') format('woff'),
		url('#{$font-face-buttonplate}/icomoon.ttf?c4hmew') format('truetype'),
		url('#{$font-face-buttonplate}/icomoon.svg?c4hmew#icomoon') format('svg');
	font-weight: normal;
	font-style: normal;
}

// Button setup
// ---------------------------------------------------------------------------------------
@mixin button-setup($font: true) {
	@include position(relative);
	@include display(inline-block);
	@include text-align(center);
	@include text-colour(lighten(#000, 40%));
	@include text-decoration(none);
	@include vertical-align(middle);
	@include border-no();
	@include background-colour($grey-light);
	outline: none;
	-webkit-appearance: none;

	&:visited {
		@include text-colour(lighten(#000, 40%));
	}
	.buttonplate-no-touch &:hover {
		@include cursor(pointer);
		@include background-colour($grey-x-light);
	}
	&:active {
		@include drop-shadow-inset(fade-out(#000, 0.85), 5px, 2px, 0px);
		text-shadow: fade-out($white, 0.75) 0px 1px 0;
		@include background-colour($grey-light);
	}

	.arrow {
		@include display(inline-block);
		@include height(10px);
		@include width(12px);
		@include text-line-height(10px);
		speak: none;
		font-family: 'buttonplate';
		font-style: normal;
		font-weight: normal;
		font-variant: normal;
		text-transform: none;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;

		&:before {
			content: "\f107";
		}
	}

	-webkit-transition: border 0.2s ease-out, background 0.2s ease-out;
	-moz-transition: border 0.2s ease-out, background 0.2s ease-out;
	-ms-transition: border 0.2s ease-out, background 0.2s ease-out;
	-o-transition: border 0.2s ease-out, background 0.2s ease-out;
	transition: border 0.2s ease-out, background 0.2s ease-out;

	@include drop-down();
}
