////
/// @group utilities
////

/// A mixin to help trigger the "mobile" view in most Clay CSS components. The Base Theme is set to `false`. The Atlas Theme is set to `true` and the breakpoint is `media-breakpoint-down(sm)` or `max-width: 767px`. You can change the breakpoint by modifying the global variable `$scaling-breakpoint-down`.
/// @param {Bool} $scale[$enable-scaling-components] - Enables or disables this mixin

@mixin clay-scale-component($scale: null, $breakpoint-down: null) {
	$breakpoint-down: setter(
		$breakpoint-down,
		if(
			variable-exists(scaling-breakpoint-down),
			$scaling-breakpoint-down,
			if(
				variable-exists(cadmin-scaling-breakpoint-down),
				$cadmin-scaling-breakpoint-down,
				sm
			)
		)
	);

	$scale: setter(
		$scale,
		if(
			variable-exists(enable-scaling-components),
			$enable-scaling-components,
			if(
				variable-exists(cadmin-enable-scaling-components),
				$cadmin-enable-scaling-components,
				true
			)
		)
	);

	@if ($scale) {
		@include media-breakpoint-down($breakpoint-down) {
			@content;
		}
	}
}