@use 'exports' as *;

.radioField {
	@layer components {
		@include vars;
		@include component;
	}

	@layer mods {
		&.mod-S {
			@include S;
		}
	}
}

.radioField-input {
	@layer mods {
		&:focus-visible {
			@include focusVisible;
		}

		&:hover {
			@include hover;
		}

		&:active {
			@include active;
		}

		&[aria-invalid='true'] {
			@include invalid;

			&:hover {
				@include invalidHover;
			}

			&:active {
				@include invalidActive;
			}
		}

		&:disabled {
			&,
			&:hover {
				@include disabled;
			}
		}

		&:checked {
			@include checked;

			&:hover {
				@include checkedHover;
			}

			&:active {
				@include checkedActive;
			}

			&:disabled {
				@include checkedDisabled;
			}

			&[aria-invalid='true'] {
				@include checkedInvalid;

				&:hover {
					@include checkedInvalidHover;
				}

				&:active {
					@include checkedInvalidActive;
				}
			}
		}
	}
}