mixin default-transition
	transition all transition-speed ease

mixin horizontal
	display flex
	flex-direction row

mixin horizontal-wrap
	display flex
	flex-flow row wrap

mixin vertical
	display flex
	flex-direction column

mixin vertical-wrap
	display flex
	flex-flow column wrap

mixin ui-element
	border 1px solid ui-border-color
	background ui-background
	border-radius 3px
	default-transition
	:hover
		border-color ui-hover-border-color
		// background ui-hover-background
		// box-shadow outline-shadow-medium

mixin ui-disabled
	background-color ui-disabled-color
	cursor not-allowed

mixin clip-long-text
	overflow hidden
	white-space nowrap
	text-overflow ellipsis

mixin bg-dark-up
	background-color transparent
	:hover
		background-color rgba(0, 0, 0, 0.015)

mixin light-up
	filter brightness(0.4) saturate(1)
	:hover
		filter brightness(1) saturate(1.3)

mixin saturate-up
	filter saturate(1)
	:hover
		filter saturate(1.3)

mixin saturate-up
	filter saturate(1)
	:hover
		filter saturate(1.3)

mixin scale-up
	transform scale(1)
	:hover
		transform scale(1.06)

mixin shadow-up
	box-shadow shadow-light
	:hover
		box-shadow shadow-medium

mixin outline-shadow-up
	box-shadow outline-shadow-light
	:hover
		box-shadow outline-shadow-medium