/**
 * _events.scss 2023-04-26 ts
 *
 * @copyright	2023 Thomas Schneider
 * @author		Thomas Schneider <thomas@inter-mundos.de>
 * @link        https://www.inter-mundos.de
 */

$callout-primary-color: $main-color;
$callout-danger-color: #cd5c5c;
$callout-warning-color: #fcd93c;
$callout-info-color: #32a5e3;
$callout-success-color: #66bb6a;

.callout
{
	border-left: solid darkgrey 4px;
	background-color: lightgrey;
	color: var(--bs-body-color);
	padding: 20px;
	margin: 15px 0;
	font-size: 0.9em;

	h1, h2, h3, h4, h5, h6
	{
		font-size: 1.1em;
		font-weight: bold;
		margin: 0 0 8px;
		padding: 0;
	}

	p
	{
		margin: 8px 0;
	}

	*:first-child
	{
		margin-top: 0;
	}

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

	&.callout-primary
	{
		border-left-color: $callout-primary-color;
		background-color: lighten($callout-primary-color, 30%);
		color: darken($callout-primary-color, 20%);

		a
		{
			color: darken($callout-primary-color, 20%);
			text-decoration: underline;

			&:hover
			{
				text-decoration: none;
			}
		}
	}

	&.callout-danger
	{
		border-left-color: $callout-danger-color;
		background-color: lighten($callout-danger-color, 30%);
		color: darken($callout-danger-color, 30%);

		a
		{
			color: darken($callout-danger-color, 30%);
			text-decoration: underline;

			&:hover
			{
				text-decoration: none;
			}
		}
	}

	&.callout-warning
	{
		border-left-color: $callout-warning-color;
		background-color: lighten($callout-warning-color, 30%);
		color: darken($callout-warning-color, 30%);

		a
		{
			color: darken($callout-warning-color, 30%);
			text-decoration: underline;

			&:hover
			{
				text-decoration: none;
			}
		}
	}

	&.callout-info
	{
		border-left-color: $callout-info-color;
		background-color: lighten($callout-info-color, 30%);
		color: darken($callout-info-color, 30%);

		a
		{
			color: darken($callout-info-color, 30%);
			text-decoration: underline;

			&:hover
			{
				text-decoration: none;
			}
		}
	}

	&.callout-success
	{
		border-left-color: $callout-success-color;
		background-color: lighten($callout-success-color, 30%);
		color: darken($callout-success-color, 30%);

		a
		{
			color: darken($callout-success-color, 30%);
			text-decoration: underline;

			&:hover
			{
				text-decoration: none;
			}
		}
	}
}