@import "./themes/admin-menu-theme";

$screen-sm: 640px;
$screen-sm2: 712px;
$screen-md: 768px;
$screen-md2: 850px;
$screen-md3: 870px;
$screen-lg: 1024px;
$screen-xl: 1280px;
$screen-2xl: 1536px;

@mixin screen-max($max) {
	@media screen and (max-width: $max - 1) {
		@content
	}
}

%size-full {
	width: 100%;
	height: 100%;
}

%unselectable {
	user-select: none;
}

%box-shadow-lg {
	box-shadow: 0 1px 20px rgb(0 0 0 / 25%)
}

%box-shadow-md {
	box-shadow: 0 6px 8px -4px rgb(0 0 0 / 25%);
}

%flex-center-all {
	display: flex;
	justify-content: center;
	align-items: center;
}

%flex-center-all-row {
	@extend %flex-center-all;

	flex-flow: row nowrap;
}

%default-transition {
	transition: all 0.2s ease-out;
}

%default-border {
	border: 1px solid $border-color;
}

%pill {
	border-radius: 999px;
}

%pointer {
	cursor: pointer;
}

@mixin size($val) {
	width: #{$val}px;
	height: #{$val}px;
}

.ub-positive-color {
	color: $positive;
}

.ub-negative-color {
	color: $negative;
}

%ub-negative-color {
	color: $negative;
}

.ub-positive-bg {
	background-color: $positive !important;
}

.ub-negative-bg {
	background-color: $negative !important;
}

.ub-strip-anchor {
	text-decoration: none !important;

	&:hover {
		color: inherit !important;
		text-decoration: none !important;
	}
}

.ub-pointer {
	@extend %pointer;
}

%ub-click {
	@extend %default-transition;

	&:active {
		transform: scale(0.95);
	}
}

.strip-anchor-styles {
	text-decoration: none;
	color: inherit;
	background-color: transparent;
	border: 0;
	margin: 0;
	padding: 0;
	font: inherit;
	line-height: inherit;

	&:hover {
		text-decoration: none;
		color: inherit;
		background-color: transparent;
		border: 0;
	}

	&:active, &:focus {
		outline: none;
		border: 0;
	}
}