////
/// @group customForms
////

/// A mixin to help create `custom-control-input` variants.
/// @param {Map} $map - A map of `key: value` pairs. The keys and value types are listed below:
/// @example
/// $var: (
///     enabled: {Bool}, // Set to false to prevent mixin styles from being output. Default: true
///     custom-control-label: ( // N/A
///         before: (), // Pseudo element that contains the checkbox/radio
///         after: (), // Pseudo element that contains the checkbox/radio icon
///     ),
///     hover: ( // N/A
///         custom-control-label: ( // N/A
///             before: (),
///             after: (),
///         ),
///     ),
///     focus: ( // N/A
///         custom-control-label: ( // N/A
///             before: (),
///             after: (),
///         ),
///     ),
///     active: ( // N/A
///         custom-control-label: ( // N/A
///             before: (),
///             after: (),
///         ),
///     ),
///     disabled: (
///         // &:disabled
///         custom-control-label: (
///             // &:disabled ~ .custom-control-label
///             before: (),
///             after: (),
///         ),
///     ),
///     checked: ( // N/A
///         custom-control-label: ( // N/A
///             before: (),
///             after: (),
///         ),
///         hover: ( // N/A
///             custom-control-label: ( // N/A
///                 before: (),
///                 after: (),
///             ),
///         ),
///         focus: ( // N/A
///             custom-control-label: ( // N/A
///                 before: (),
///                 after: (),
///             ),
///         ),
///         active: ( // N/A
///             custom-control-label: ( // N/A
///                 before: (),
///                 after: (),
///             ),
///         ),
///         disabled: ( // N/A
///             custom-control-label: ( // N/A
///                 before: (),
///                 after: (),
///             ),
///         ),
///     ),
///     indeterminate: ( // N/A
///         custom-control-label: ( // N/A
///             before: (),
///             after: (),
///         ),
///         hover: ( // N/A
///             custom-control-label: ( // N/A
///                 before: (),
///                 after: (),
///             ),
///         ),
///         focus: ( // N/A
///             custom-control-label: ( // N/A
///                 before: (),
///                 after: (),
///             ),
///         ),
///         active: ( // N/A
///             custom-control-label: ( // N/A
///                 before: (),
///                 after: (),
///             ),
///         ),
///         disabled: ( // N/A
///             custom-control-label: ( // N/A
///                 before: (),
///                 after: (),
///             ),
///         ),
///     ),
/// );

@mixin clay-custom-control-input-variant($map) {
	@if (type-of($map) == 'map') {
		$enabled: setter(map-get($map, enabled), true);

		@if ($enabled) {
			@include clay-css($map);

			~ .custom-control-label::before {
				@include clay-css(
					map-deep-get($map, custom-control-label, before)
				);
			}

			~ .custom-control-label::after {
				@include clay-css(
					map-deep-get($map, custom-control-label, after)
				);
			}

			~ .card {
				@include clay-card-variant(map-deep-get($map, card));
			}

			&:hover {
				~ .custom-control-label::before {
					@include clay-css(
						map-deep-get($map, hover, custom-control-label, before)
					);
				}

				~ .custom-control-label::after {
					@include clay-css(
						map-deep-get($map, hover, custom-control-label, after)
					);
				}

				~ .card {
					@include clay-card-variant(map-deep-get($map, hover, card));
				}
			}

			&:focus {
				~ .custom-control-label::before {
					@include clay-css(
						map-deep-get($map, focus, custom-control-label, before)
					);
				}

				~ .custom-control-label::after {
					@include clay-css(
						map-deep-get($map, focus, custom-control-label, after)
					);
				}

				~ .card {
					@include clay-card-variant(map-deep-get($map, focus, card));
				}
			}

			&:active {
				~ .custom-control-label::before {
					@include clay-css(
						map-deep-get($map, active, custom-control-label, before)
					);
				}

				~ .custom-control-label::after {
					@include clay-css(
						map-deep-get($map, active, custom-control-label, after)
					);
				}

				~ .card {
					@include clay-card-variant(
						map-deep-get($map, active, card)
					);
				}
			}

			// Use [disabled] and :disabled to work around https://github.com/twbs/bootstrap/issues/28247

			&[disabled],
			&:disabled {
				@include clay-css(map-deep-get($map, disabled));

				~ .custom-control-label {
					@include clay-css(
						map-deep-get($map, disabled, custom-control-label)
					);
				}

				~ .custom-control-label::before {
					@include clay-css(
						map-deep-get(
							$map,
							disabled,
							custom-control-label,
							before
						)
					);
				}

				~ .custom-control-label::after {
					@include clay-css(
						map-deep-get(
							$map,
							disabled,
							custom-control-label,
							after
						)
					);
				}

				~ .card {
					@include clay-card-variant(
						map-deep-get($map, disabled, card)
					);
				}
			}

			&:checked {
				~ .custom-control-label::before {
					@include clay-css(
						map-deep-get(
							$map,
							checked,
							custom-control-label,
							before
						)
					);
				}

				~ .custom-control-label::after {
					@include clay-css(
						map-deep-get($map, checked, custom-control-label, after)
					);
				}

				~ .card {
					@include clay-card-variant(
						map-deep-get($map, checked, card)
					);
				}
			}

			&[readonly] {
				@include clay-css(map-deep-get($map, readonly));

				~ .custom-control-label {
					@include clay-css(
						map-deep-get($map, readonly, custom-control-label)
					);
				}

				~ .custom-control-label::before {
					@include clay-css(
						map-deep-get(
							$map,
							readonly,
							custom-control-label,
							before
						)
					);
				}

				~ .custom-control-label::after {
					@include clay-css(
						map-deep-get(
							$map,
							readonly,
							custom-control-label,
							after
						)
					);
				}

				~ .card {
					@include clay-card-variant(
						map-deep-get($map, readonly, card)
					);
				}
			}

			&[readonly][disabled] {
				@include clay-css(map-deep-get($map, readonly, disabled));

				~ .custom-control-label {
					@include clay-css(
						map-deep-get(
							$map,
							readonly,
							disabled,
							custom-control-label
						)
					);
				}

				~ .custom-control-label::before {
					@include clay-css(
						map-deep-get(
							$map,
							readonly,
							disabled,
							custom-control-label,
							before
						)
					);
				}

				~ .custom-control-label::after {
					@include clay-css(
						map-deep-get(
							$map,
							readonly,
							disabled,
							custom-control-label,
							after
						)
					);
				}

				~ .card {
					@include clay-card-variant(
						map-deep-get($map, readonly, disabled, card)
					);
				}
			}

			&:checked {
				~ .custom-control-label::before {
					@include clay-css(
						map-deep-get(
							$map,
							checked,
							custom-control-label,
							before
						)
					);
				}

				~ .custom-control-label::after {
					@include clay-css(
						map-deep-get($map, checked, custom-control-label, after)
					);
				}

				~ .card {
					@include clay-card-variant(
						map-deep-get($map, checked, card)
					);
				}
			}

			&:checked:hover {
				~ .custom-control-label::before {
					@include clay-css(
						map-deep-get(
							$map,
							checked,
							hover,
							custom-control-label,
							before
						)
					);
				}

				~ .custom-control-label::after {
					@include clay-css(
						map-deep-get(
							$map,
							checked,
							hover,
							custom-control-label,
							after
						)
					);
				}

				~ .card {
					@include clay-card-variant(
						map-deep-get($map, checked, hover, card)
					);
				}
			}

			&:checked:focus {
				~ .custom-control-label::before {
					@include clay-css(
						map-deep-get(
							$map,
							checked,
							focus,
							custom-control-label,
							before
						)
					);
				}

				~ .custom-control-label::after {
					@include clay-css(
						map-deep-get(
							$map,
							checked,
							focus,
							custom-control-label,
							after
						)
					);
				}

				~ .card {
					@include clay-card-variant(
						map-deep-get($map, checked, focus, card)
					);
				}
			}

			&:checked:active {
				~ .custom-control-label::before {
					@include clay-css(
						map-deep-get(
							$map,
							checked,
							active,
							custom-control-label,
							before
						)
					);
				}

				~ .custom-control-label::after {
					@include clay-css(
						map-deep-get(
							$map,
							checked,
							active,
							custom-control-label,
							after
						)
					);
				}

				~ .card {
					@include clay-card-variant(
						map-deep-get($map, checked, active, card)
					);
				}
			}

			&:checked[disabled],
			&:checked:disabled {
				~ .custom-control-label::before {
					@include clay-css(
						map-deep-get(
							$map,
							checked,
							disabled,
							custom-control-label,
							before
						)
					);
				}

				~ .custom-control-label::after {
					@include clay-css(
						map-deep-get(
							$map,
							checked,
							disabled,
							custom-control-label,
							after
						)
					);
				}

				~ .card {
					@include clay-card-variant(
						map-deep-get($map, checked, disabled, card)
					);
				}
			}

			&:checked[readonly] {
				~ .custom-control-label::before {
					@include clay-css(
						map-deep-get(
							$map,
							checked,
							readonly,
							custom-control-label,
							before
						)
					);
				}

				~ .custom-control-label::after {
					@include clay-css(
						map-deep-get(
							$map,
							checked,
							readonly,
							custom-control-label,
							after
						)
					);
				}

				~ .card {
					@include clay-card-variant(
						map-deep-get($map, checked, readonly, card)
					);
				}
			}

			&:checked[readonly][disabled] {
				~ .custom-control-label::before {
					@include clay-css(
						map-deep-get(
							$map,
							checked,
							readonly,
							disabled,
							custom-control-label,
							before
						)
					);
				}

				~ .custom-control-label::after {
					@include clay-css(
						map-deep-get(
							$map,
							checked,
							readonly,
							disabled,
							custom-control-label,
							after
						)
					);
				}

				~ .card {
					@include clay-card-variant(
						map-deep-get($map, checked, readonly, disabled, card)
					);
				}
			}

			&:indeterminate {
				~ .custom-control-label::before {
					@include clay-css(
						map-deep-get(
							$map,
							indeterminate,
							custom-control-label,
							before
						)
					);
				}

				~ .custom-control-label::after {
					@include clay-css(
						map-deep-get(
							$map,
							indeterminate,
							custom-control-label,
							after
						)
					);
				}

				~ .card {
					@include clay-card-variant(
						map-deep-get($map, indeterminate, card)
					);
				}
			}

			&:indeterminate:hover {
				~ .custom-control-label::before {
					@include clay-css(
						map-deep-get(
							$map,
							indeterminate,
							hover,
							custom-control-label,
							before
						)
					);
				}

				~ .custom-control-label::after {
					@include clay-css(
						map-deep-get(
							$map,
							indeterminate,
							hover,
							custom-control-label,
							after
						)
					);
				}

				~ .card {
					@include clay-card-variant(
						map-deep-get($map, indeterminate, hover, card)
					);
				}
			}

			&:indeterminate:focus {
				~ .custom-control-label::before {
					@include clay-css(
						map-deep-get(
							$map,
							indeterminate,
							focus,
							custom-control-label,
							before
						)
					);
				}

				~ .custom-control-label::after {
					@include clay-css(
						map-deep-get(
							$map,
							indeterminate,
							focus,
							custom-control-label,
							after
						)
					);
				}

				~ .card {
					@include clay-card-variant(
						map-deep-get($map, indeterminate, focus, card)
					);
				}
			}

			&:indeterminate:active {
				~ .custom-control-label::before {
					@include clay-css(
						map-deep-get(
							$map,
							indeterminate,
							active,
							custom-control-label,
							before
						)
					);
				}

				~ .custom-control-label::after {
					@include clay-css(
						map-deep-get(
							$map,
							indeterminate,
							active,
							custom-control-label,
							after
						)
					);
				}

				~ .card {
					@include clay-card-variant(
						map-deep-get($map, indeterminate, active, card)
					);
				}
			}

			&:indeterminate[disabled],
			&:indeterminate:disabled {
				~ .custom-control-label::before {
					@include clay-css(
						map-deep-get(
							$map,
							indeterminate,
							disabled,
							custom-control-label,
							before
						)
					);
				}

				~ .custom-control-label::after {
					@include clay-css(
						map-deep-get(
							$map,
							indeterminate,
							disabled,
							custom-control-label,
							after
						)
					);
				}

				~ .card {
					@include clay-card-variant(
						map-deep-get($map, indeterminate, disabled, card)
					);
				}
			}

			&:indeterminate[readonly] {
				~ .custom-control-label::before {
					@include clay-css(
						map-deep-get(
							$map,
							indeterminate,
							readonly,
							custom-control-label,
							before
						)
					);
				}

				~ .custom-control-label::after {
					@include clay-css(
						map-deep-get(
							$map,
							indeterminate,
							readonly,
							custom-control-label,
							after
						)
					);
				}

				~ .card {
					@include clay-card-variant(
						map-deep-get($map, indeterminate, readonly, card)
					);
				}
			}

			&:indeterminate[readonly][disabled] {
				~ .custom-control-label::before {
					@include clay-css(
						map-deep-get(
							$map,
							indeterminate,
							readonly,
							disabled,
							custom-control-label,
							before
						)
					);
				}

				~ .custom-control-label::after {
					@include clay-css(
						map-deep-get(
							$map,
							indeterminate,
							readonly,
							disabled,
							custom-control-label,
							after
						)
					);
				}

				~ .card {
					@include clay-card-variant(
						map-deep-get(
							$map,
							indeterminate,
							readonly,
							disabled,
							card
						)
					);
				}
			}
		}
	}
}

/// A mixin to help create `custom-control` variants. This is used by `custom-checkbox` and `custom-radio`.
/// @param {Map} $map - A map of `key: value` pairs. The keys and value types are listed below:
/// @example
/// $var: (
///     enabled: {Bool}, // Set to false to prevent mixin styles from being output. Default: true
///     label: (
///         // .your-variant-name label
///     ),
///     custom-control-label: (
///         before: (), // Pseudo element that contains the checkbox/radio
///         after: (), // Pseudo element that contains the checkbox/radio icon
///     ),
///     custom-control-label-text: (
///         // .your-variant-name .custom-control-label-text
///         small: (
///             // .your-variant-name .custom-control-label-text small,
///             // .your-variant-name .custom-control-label-text .small
///         ),
///     ),
///     custom-control-input: (
///         // The map `custom-control-input` is passed to the `clay-custom-control-input-variant` mixin.
///         // .your-variant-name .custom-control-input
///         enabled: {Bool}, // Set to false to prevent mixin styles from being output. Default: true
///         custom-control-label: ( // N/A
///             before: (),
///             after: (),
///         ),
///         hover: ( // N/A
///             custom-control-label: ( // N/A
///                 before: (),
///                 after: (),
///             ),
///         ),
///         focus: ( // N/A
///             custom-control-label: ( // N/A
///                 before: (),
///                 after: (),
///             ),
///         ),
///         active: ( // N/A
///             custom-control-label: ( // N/A
///                 before: (),
///                 after: (),
///             ),
///         ),
///         disabled: (
///             // &:disabled
///             custom-control-label: (
///                 // &:disabled ~ .custom-control-label
///                 before: (),
///                 after: (),
///             ),
///         ),
///         checked: ( // N/A
///             custom-control-label: ( // N/A
///                 before: (),
///                 after: (),
///             ),
///             hover: ( // N/A
///                 custom-control-label: ( // N/A
///                     before: (),
///                     after: (),
///                 ),
///             ),
///             focus: ( // N/A
///                 custom-control-label: ( // N/A
///                     before: (),
///                     after: (),
///                 ),
///             ),
///             active: ( // N/A
///                 custom-control-label: ( // N/A
///                     before: (),
///                     after: (),
///                 ),
///             ),
///             disabled: ( // N/A
///                 custom-control-label: ( // N/A
///                     before: (),
///                     after: (),
///                 ),
///             ),
///         ),
///         indeterminate: ( // N/A
///             custom-control-label: ( // N/A
///                 before: (),
///                 after: (),
///             ),
///             hover: ( // N/A
///                 custom-control-label: ( // N/A
///                     before: (),
///                     after: (),
///                 ),
///             ),
///             focus: ( // N/A
///                 custom-control-label: ( // N/A
///                     before: (),
///                     after: (),
///                 ),
///             ),
///             active: ( // N/A
///                 custom-control-label: ( // N/A
///                     before: (),
///                     after: (),
///                 ),
///             ),
///             disabled: ( // N/A
///                 custom-control-label: ( // N/A
///                     before: (),
///                     after: (),
///                 ),
///             ),
///         ),
///     ),
/// );

@mixin clay-custom-control-variant($map) {
	@if (type-of($map) == 'map') {
		$enabled: setter(map-get($map, enabled), true);

		@include clay-css($map);

		@if ($enabled) {
			label {
				@include clay-css(map-deep-get($map, label));
			}

			.custom-control-label {
				@include clay-css(map-deep-get($map, custom-control-label));

				&::before {
					@include clay-css(
						map-deep-get($map, custom-control-label, before)
					);
				}

				&::after {
					@include clay-css(
						map-deep-get($map, custom-control-label, after)
					);
				}
			}

			.custom-control-label-text {
				@include clay-css(
					map-deep-get($map, custom-control-label-text)
				);

				small,
				.small {
					@include clay-css(
						map-deep-get($map, custom-control-label-text, small)
					);
				}
			}

			.custom-control-input {
				@include clay-custom-control-input-variant(
					map-deep-get($map, custom-control-input)
				);
			}
		}
	}
}
