.alert {
	@include clay-alert-variant($cadmin-alert);
}

.alert-heading {
	// Specified to prevent conflicts of changing $cadmin-headings-color

	color: inherit;
}

.alert-footer {
	@include clay-css($cadmin-alert-footer);
}

.alert-link,
.alert-link.btn-unstyled {
	@include clay-link($cadmin-alert-link);
}

.alert-indicator {
	@include clay-css($cadmin-alert-indicator);
	+ .lead {
		$lead: setter(map-get($cadmin-alert-indicator, lead), ());

		@include clay-css($lead);
	}
}

// Alert Dismissible

.alert-dismissible {
	@include clay-css($cadmin-alert-dismissible);
}

// Alert Fluid

.alert-fluid {
	@include clay-alert-variant($cadmin-alert-fluid);
}

// Alert Notifications

.alert-container,
&.alert-container {
	height: 0;
	position: relative;
}

.alert-notifications {
	.alert {
		@include clay-css($cadmin-alert-notification);

		@include media-breakpoint-down(sm, $cadmin-grid-breakpoints) {
			@include clay-css($cadmin-alert-notification-sm-down);
		}

		&:last-child {
			margin-bottom: 0;
		}
	}

	.alert-fluid {
		padding-bottom: 0;
		padding-top: 0;
	}
}

.alert-notifications-absolute {
	$breakpoint-down: map-get(
		$cadmin-alert-notifications-absolute,
		breakpoint-down
	);

	@include clay-css($cadmin-alert-notifications-absolute);

	@include clay-scale-component(null, $breakpoint-down) {
		$mobile: setter(
			map-get($cadmin-alert-notifications-absolute, mobile),
			()
		);

		@include clay-css($mobile);
	}
}

.alert-notifications-fixed {
	$breakpoint-down: map-get(
		$cadmin-alert-notifications-fixed,
		breakpoint-down
	);

	@include clay-css($cadmin-alert-notifications-fixed);

	@include clay-scale-component(null, $breakpoint-down) {
		$mobile: setter(map-get($cadmin-alert-notifications-fixed, mobile), ());

		@include clay-css($mobile);
	}
}

// Alert List

.alert-list {
	display: flex;
	flex-direction: column;
	margin-bottom: 0;
	padding-left: 0;

	.close {
		top: 50%;
		transform: translateY(-50%);
	}
}

// Alert in Modal

.modal-body {
	.alert {
		.close {
			right: $cadmin-modal-inner-padding;
		}
	}

	.alert-list {
		.alert-fluid:last-child {
			margin-bottom: math-sign($cadmin-alert-fluid-border-bottom-width);
		}
	}
}

// Alert Autofit Row

.autofit-row.alert-autofit-row {
	@include clay-autofit-row($cadmin-alert-autofit-row);
}

// Alert Feedback

.alert-feedback.alert {
	@include clay-css($cadmin-alert-feedback);

	.alert-autofit-row,
	.autofit-row {
		display: inline;
		margin-left: 0;
		margin-right: 0;

		> .autofit-col {
			display: inline;
			padding-left: 0;
			padding-right: 0.25em;

			> .autofit-section {
				display: inline;
			}
		}
	}

	.close {
		@include clay-close($cadmin-alert-feedback-close);
	}

	.lead {
		margin-right: 0;

		+ .component-text {
			margin-left: 0.25em;
		}
	}
}

// .alert-inline

.alert-inline.alert {
	@include clay-css($cadmin-alert-inline);

	&.alert-dismissible {
		$alert-dismissible: setter(
			map-get($cadmin-alert-inline, alert-dismissible),
			()
		);

		@include clay-css($alert-dismissible);

		&.alert-fluid {
			$alert-dismissible-alert-fluid: setter(
				map-get($cadmin-alert-inline, alert-dismissible-alert-fluid),
				()
			);

			@include clay-css($alert-dismissible-alert-fluid);

			> .container,
			> .container-fluid {
				$container-fluid: setter(
					map-get($alert-dismissible-alert-fluid, container-fluid),
					()
				);

				@include clay-css($container-fluid);

				> .alert-autofit-row {
					$alert-autofit-row: setter(
						map-get($container-fluid, alert-autofit-row),
						map-get($cadmin-alert-inline, alert-autofit-row),
						()
					);

					@include clay-css($alert-autofit-row);

					.btn-group {
						$btn-group: setter(
							map-get($alert-autofit-row, btn-group),
							()
						);

						@include clay-css($btn-group);
					}
				}
			}
		}
	}

	> .alert-autofit-row {
		$alert-autofit-row: setter(
			map-get($cadmin-alert-inline, alert-autofit-row),
			()
		);

		@include clay-css($alert-autofit-row);

		.btn-group {
			$btn-group: setter(map-get($alert-autofit-row, btn-group), ());

			@include clay-css($btn-group);
		}
	}

	.close {
		$close: setter(map-get($cadmin-alert-inline, close), ());

		@include clay-close($close);
	}
}

// Alert Autofit Stacked

.alert-autofit-stacked.alert {
	@include clay-css($cadmin-alert-autofit-stacked);

	> .alert-autofit-row {
		$alert-autofit-row: setter(
			map-get($cadmin-alert-autofit-stacked, alert-autofit-row),
			()
		);

		@include clay-css($alert-autofit-row);

		> .autofit-col {
			$autofit-col: setter(map-get($alert-autofit-row, autofit-col), ());

			@include clay-css($autofit-col);
		}

		.btn-group {
			$btn-group: setter(map-get($alert-autofit-row, btn-group), ());

			@include clay-css($btn-group);
		}
	}

	.close {
		$close: setter(map-get($cadmin-alert-autofit-stacked, close), ());

		@include clay-close($close);
	}
}

// Alert Autofit Stacked Sm Down

.alert-autofit-stacked-sm-down.alert {
	@include clay-css($cadmin-alert-autofit-stacked-sm-down);

	> .alert-autofit-row {
		$alert-autofit-row: setter(
			map-get($cadmin-alert-autofit-stacked-sm-down, alert-autofit-row),
			()
		);

		@include media-breakpoint-down(sm, $cadmin-grid-breakpoints) {
			@include clay-css($alert-autofit-row);
		}

		> .autofit-col {
			$autofit-col: setter(map-get($alert-autofit-row, autofit-col), ());

			@include media-breakpoint-down(sm, $cadmin-grid-breakpoints) {
				@include clay-css($autofit-col);
			}
		}

		.btn-group {
			$btn-group: setter(map-get($alert-autofit-row, btn-group), ());

			@include media-breakpoint-down(sm, $cadmin-grid-breakpoints) {
				@include clay-css($btn-group);
			}
		}
	}

	.close {
		$close: setter(
			map-get($cadmin-alert-autofit-stacked-sm-down, close),
			()
		);

		@include media-breakpoint-down(sm, $cadmin-grid-breakpoints) {
			@include clay-css($close);
		}
	}
}

// Alert Autofit Stacked Xs Down

.alert-autofit-stacked-xs-down.alert {
	@include clay-css($cadmin-alert-autofit-stacked-xs-down);

	> .alert-autofit-row {
		$alert-autofit-row: setter(
			map-get($cadmin-alert-autofit-stacked-xs-down, alert-autofit-row),
			()
		);

		@include media-breakpoint-down(xs, $cadmin-grid-breakpoints) {
			@include clay-css($alert-autofit-row);
		}

		> .autofit-col {
			$autofit-col: setter(map-get($alert-autofit-row, autofit-col), ());

			@include media-breakpoint-down(xs, $cadmin-grid-breakpoints) {
				@include clay-css($autofit-col);
			}
		}

		.btn-group {
			$btn-group: setter(map-get($alert-autofit-row, btn-group), ());

			@include media-breakpoint-down(xs, $cadmin-grid-breakpoints) {
				@include clay-css($btn-group);
			}
		}
	}

	.close {
		$close: setter(
			map-get($cadmin-alert-autofit-stacked-xs-down, close),
			()
		);

		@include media-breakpoint-down(xs, $cadmin-grid-breakpoints) {
			@include clay-css($close);
		}
	}
}

// Alert Indicator Start

.alert-indicator-start.alert {
	@include clay-css($cadmin-alert-indicator-start);

	&.alert-fluid {
		$alert-fluid: setter(
			map-get($cadmin-alert-indicator-start, alert-fluid),
			()
		);

		@include clay-css($alert-fluid);

		> .container,
		> .container-fluid {
			$container-fluid: setter(
				map-get($alert-fluid, container-fluid),
				()
			);

			@include clay-css($container-fluid);
		}
	}

	&.alert-feedback {
		$alert-feedback: setter(
			map-get($cadmin-alert-indicator-start, alert-feedback),
			()
		);

		@include clay-css($alert-feedback);
	}

	.alert-indicator {
		$alert-indicator: setter(
			map-get($cadmin-alert-indicator-start, alert-indicator),
			()
		);

		@include clay-css($alert-indicator);

		+ .lead {
			$lead: setter(map-get($alert-indicator, lead), ());

			@include clay-css($lead);
		}
	}

	.alert-autofit-row {
		$alert-autofit-row: setter(
			map-get($cadmin-alert-indicator-start, alert-autofit-row),
			()
		);

		@include clay-css($alert-autofit-row);

		.alert-indicator:only-child {
			$alert-indicator-only-child: setter(
				map-get($alert-autofit-row, alert-indicator-only-child),
				()
			);

			@include clay-css($alert-indicator-only-child);
		}
	}
}

// Alert Variants

@each $color, $value in $cadmin-alert-palette {
	@if not clay-is-map-unset($value) {
		$selector: if(
			starts-with($color, '.') or
				starts-with($color, '#') or
				starts-with($color, '%'),
			$color,
			str-insert($color, '.alert-', 1)
		);

		@if (starts-with($color, '%') or map-get($value, extend)) {
			#{$selector} {
				@include clay-alert-variant($value);
			}
		} @else if (starts-with($color, 'alert-')) {
			$placeholder: '%alert-#{$color}';

			#{$placeholder} {
				@include clay-alert-variant($value);
			}

			#{$selector} {
				@extend %alert-#{$color} !optional;
			}
		} @else {
			#{$selector} {
				@include clay-alert-variant($value);
			}
		}
	}
}