//************************************************************************//
// Background-image property for adding multiple background images with
// gradients, or for stringing multiple gradients together.
//************************************************************************//

@mixin background-image($images...) {
	$webkit-images: ();
	$spec-images: ();

	@each $image in $images {
		$webkit-image: ();
		$spec-image: ();

		@if (type-of($image) == string) {
			$url-str: str-slice($image, 0, 3);
			$gradient-type: str-slice($image, 0, 6);

			@if $url-str == "url" {
				$webkit-image: $image;
				$spec-image: $image;
			} @else if $gradient-type == "linear" {
				$gradients: _linear-gradient-parser($image);
				$webkit-image: map-get($gradients, webkit-image);
				$spec-image: map-get($gradients, spec-image);
			} @else if $gradient-type == "radial" {
				$gradients: _radial-gradient-parser($image);
				$webkit-image: map-get($gradients, webkit-image);
				$spec-image: map-get($gradients, spec-image);
			}
		}

		$webkit-images: append($webkit-images, $webkit-image, comma);
		$spec-images: append($spec-images, $spec-image, comma);
	}

	background-image: $webkit-images;
	background-image: $spec-images;
}
