////
/// @group badges
////

/// A mixin for creating custom `badge` sizes.
/// @param {Map} $map - A map of `key: value` pairs. The keys and value types are listed below:
/// @example
/// border-width: {List | Number}, // Default: $badge-border-width
/// font-size: {Number | String | Null},
/// height: {Number | String | Null},
/// padding-x: {Number | String | Null},
/// padding-y: {Number | String}, // Default: 0
/// lexicon-icon-height: {Number | String | Null},
/// lexicon-icon-margin-top: {Number | String | Null},
/// lexicon-icon-width: {Number | String | Null},
/// @todo
/// - Update or Deprecate this mixin in favor of a `clay-badge-variant` mixin

@mixin clay-badge-size($map) {
	$border-width: setter(map-get($map, border-width), $badge-border-width);
	$font-size: map-get($map, font-size);
	$height: map-get($map, height);
	$padding-x: map-get($map, padding-x);
	$padding-y: setter(map-get($map, padding-y), 0);

	$lexicon-icon-height: setter(map-get($map, lexicon-icon-height), map-get($map, lexicon-icon-width));
	$lexicon-icon-margin-top: map-get($map, lexicon-icon-margin-top);
	$lexicon-icon-width: map-get($map, lexicon-icon-width);

	border-width: $border-width;
	font-size: $font-size;

	@if ($height) {
		line-height: $height - ($border-width * 2);
	}

	padding-bottom: $padding-y;
	padding-left: $padding-x;
	padding-right: $padding-x;
	padding-top: $padding-y;

	.inline-item {
		a,
		.btn-unstyled,
		.close {
			margin-top: $lexicon-icon-margin-top;

			.lexicon-icon {
				margin-top: 0;
			}
		}

		.lexicon-icon {
			height: $lexicon-icon-height;
			margin-top: $lexicon-icon-margin-top;
			width: $lexicon-icon-width;
		}
	}
}