div.uwt-alert
{
	padding: .9375rem;
	box-shadow: 4px 4px 10px rgba(0,0,0,0.3);

	&:not(.uwt-visible)
	{
		opacity: 0;
		visibility: hidden;
	}
	
	&> div.uwt-title
	{
		font-weight: 300;
		font-size: 24px;
		margin-bottom: 16px;
	}
	
	.AlertColor(@color)
	{
		border: solid 1px shade(@color, 40%);
		background-color: tint(@color, 75%);
		color: shade(@color, 20%);
		&> div.uwt-badge
		{
			background-color: tint(@color, 50%);
			color: shade(@color, 50%);
		}
	}
	.AlertColor2(@textColor, @backgroundColor, @borderColor)
	{
		border: solid 1px @borderColor;
		background-color: @backgroundColor;
		color: @textColor;
	}
	
	&.uwt-color-primary
	{
		// .AlertColor(@ThemeColorPrimary);
		//.AlertColor2(#ffffff, #1c75c7, #0c55a7);
	}
	
	&.uwt-color-info
	{
		// .AlertColor(@ThemeColorPrimary);
		//.AlertColor2(#ffffff, #49b6d6, #3789a1);
	}
	&.uwt-collapsible
	{
		padding: 8px;
	}
	&> div.uwt-icon
	{
		padding: 12px;
		&::before
		{
			font-family: "Font Awesome 6 Pro";
			font-size: 32pt;
			font-weight: 100;
		}
	}
	&:not(.uwt-collapsed)
	{
		&> div.uwt-icon::before
		{
			content: "\f0a8";
		}
	}

	&.uwt-color-danger
	{
		//.AlertColor2(#4d1b1a, #ffcecd, #ffcecd);
		&.uwt-collapsed
		{
			&> div.uwt-icon::before
			{
				content: "\f321";
			}
		}
	}
	&.uwt-color-warning
	{
		//.AlertColor2(#4d1b1a, #ffcecd, #ffcecd);
		&.uwt-collapsed
		{
			&> div.uwt-icon::before
			{
				content: "\f071";
			}
		}
	}
	&.uwt-color-info
	{
		&.uwt-collapsed
		{
			&> div.uwt-icon::before
			{
				content: "\f05a";
			}
		}
	}
	&:not(.uwt-disabled)
	{
		&.uwt-color-success
		{
			.AlertColor2(#ffffff, #00acac, #008181);
		}
		&.uwt-color-danger
		{
			.AlertColor(@ThemeColorDanger);
		}
		&.uwt-color-warning
		{
			.AlertColor(@ThemeColorWarning);
		}
		&.uwt-color-info
		{
			.AlertColor(@ThemeColorInfo);
		}
	}

	&.uwt-disabled
	{
		color: #999;
		background: #ccc;
		border-color: #999;
	}
}