/// Output a new message state (i.e. theme) which supports one or more types of messages.
/// @param {String} $opts - the name of the state e.g. 'success'
/// @param {List} $opts - a map of options for the state
/// @param {List} $types - the types of message the state supports e.g. ('alert', 'notice', 'action')
/// @example - Output a Pikachu (lemon/slate) state for notice and alert messages.
///     // Outputs CSS for a custom message state called "pikachu"
///     // Outputs a modifier class `o-message--pikachu`
///     @include oMessageAddState(
///     	$name: 'pikachu', // the custom state is named "pikachu"
///     	$opts: (
///     	    'background-color': 'slate', // slate message
///     	    'foreground-color': 'white', // white text
///     	    'highlight-color': 'lemon', // lemon highlights with `o-message__content-highlight-color` and a lemon button
///     	    'button-type': 'primary', // a primary button`o-message__content-highlight` highlight copy
///     	    'icon': 'user', // show a 'user' o-icons icon if used as an alert
///     ), $types: ('notice', 'alert')); // this state should work with notice and alert message types
/// @access public
@mixin oMessageAddState($name, $opts, $types) {
	// If no options are given assume we are adding a default state.
	// @see _brand.scss for configuration by name.
	$opts: if($opts, $opts, $name);
	.o-message.o-message--#{$name} {
		@include _oMessageState($name, $opts, $types);
	}
}

/// Output a new message state (i.e. theme) which supports one or more types of messages.
/// @param {String} $opts - the name of the state e.g. 'success'
/// @param {List} $opts - a map of options for the state
/// @param {List} $types - the types of message the state supports e.g. ('alert', 'notice', 'action')
/// @access private
@mixin _oMessageState($name, $opts, $types) {
	$error-message: 'Cannot add o-message state "#{$name}"';
	// get foreground colour
	$foreground-color-arg: _oMessageGet('foreground-color', $from: $opts);
	$foreground-color: if(
		type-of($foreground-color-arg) == 'string',
		oPrivateFoundationGet($foreground-color-arg),
		$foreground-color-arg
	);
	// get highlight colour
	$highlight-color-arg: _oMessageGet('highlight-color', $from: $opts);
	$highlight-color: if(
		type-of($highlight-color-arg) == 'string',
		oPrivateFoundationGet($highlight-color-arg),
		$highlight-color-arg
	);
	// get background colour
	$background-color-arg: _oMessageGet('background-color', $from: $opts);
	$background-color: if(
		type-of($background-color-arg) == 'string',
		oPrivateFoundationGet($background-color-arg),
		$background-color-arg
	);

	// Confirm minimum foreground contrast ratio.
	@if $foreground-color {
		$foreground-contrast: oPrivateColorsGetContrastRatio(
			$foreground-color,
			$background-color
		);
		@if ($foreground-contrast < 4.5) {
			@error ('#{$error-message}: The foreground colour ' +
			'"#{$foreground-color-arg}" and background colour ' +
			'"#{$background-color-arg}" do not pass WCAG AA contrast checks.');
		}
	}

	// Confirm minimum highlight contrast ratio.
	@if $highlight-color {
		$highlight-contrast: oPrivateColorsGetContrastRatio(
			$highlight-color,
			$background-color
		);
		@if ($highlight-contrast < 4.5) {
			@error ('#{$error-message}: The highlight colour ' +
			'"#{$highlight-color-arg}" and background colour ' +
			'"#{$background-color-arg}" do not pass WCAG AA contrast checks.');
		}
	}

	// set default foreground and background colour
	color: $foreground-color;
	background-color: $background-color;
	text-align: _oMessageGet('align', $from: $opts);

	// when centred with a close button match the right and left padding
	.o-message__container {
		justify-content: _oMessageGet('align', $from: $opts);
	}

	&:not([data-o-message-close='false']) .o-message__container {
		@if _oMessageGet('align', $from: $opts) == 'center' {
			padding-left: $_o-message-close-inline-spacing;
		}
	}

	// class to set the highlight colour
	.o-message__content-highlight-color {
		color: $highlight-color;
	}

	// content links
	.o-message__content-main a,
	.o-message__content-additional a {
		@include oPrivateTypographyLink();
		@include oPrivateTypographyLinkThemeOverride(
			$theme: (
				'base': $foreground-color,
				'hover': $foreground-color,
				'context': $background-color,
			)
		);
		font-family: oPrivateFoundationGet('o3-type-body-base-font-family');
		font-size: oPrivateFoundationGet('o3-type-body-base-font-size');
		font-weight: oPrivateFoundationGet('o3-type-body-base-font-weight');
		line-height: oPrivateFoundationGet('o3-type-body-base-line-height');
	}

	// action button
	.o-message__actions__primary {
		$button-type: _oMessageGet('button-type', $from: $opts);
		$button-type: if($button-type, $button-type, 'secondary');
		$button-color: if($highlight-color, $highlight-color, $foreground-color);
		@include oPrivateButtonsContentWithThemeOverride(
			$opts: (
				'type': $button-type,
			),
			$theme-override: (
				'color': $button-color,
				'context': $background-color,
			)
		);
		margin-top: -2px;
	}

	// action link
	.o-message__actions__secondary {
		@include oPrivateTypographyLink();
		@include oPrivateTypographyLinkThemeOverride(
			$theme: (
				'base': $foreground-color,
				'hover': $foreground-color,
				'context': $background-color,
			)
		);
		font-family: oPrivateFoundationGet('o3-type-body-base-font-family');
		font-size: oPrivateFoundationGet('o3-type-body-base-font-size');
		font-weight: oPrivateFoundationGet('o3-type-body-base-font-weight');
		line-height: oPrivateFoundationGet('o3-type-body-base-line-height');
	}

	// state icon, only for alert messages
	$state-icon: _oMessageGet('icon', $from: $opts);
	$supports-alert-type: index($types, 'alert');
	@if ($supports-alert-type and not $state-icon) {
		@error '#{$error-message}: To support the "alert" type include an "icon". ' +
			'If an alert with icon is not needed update the "types" argument.';
	}

	@if $supports-alert-type and $state-icon {
		&.o-message--alert .o-message__container:before {
			@include oPrivateIconsContent(
				$state-icon,
				$foreground-color,
				$_o-message-alert-icon-size
			);
			vertical-align: middle;
		}
	}

	.o-message__close {
		@include oPrivateIconsContent(
			'cross',
			$foreground-color,
			$_o-message-close-icon-size
		);
	}
}