.nelio-forms-form .nelio-forms-field__value--checkbox,
.nelio-forms-form .nelio-forms-field__item-value--radio-group {
	appearance: none;
	background-color: #fff;
	border: 1px solid var(--nelio-forms-unfocused-field-border, #00f);
	color: currentcolor;
	font: inherit;
	height: 16px;
	margin: 0;
	margin-bottom: -1px;
	position: relative;
	width: 16px;

	&:focus {
		border-color: var(--nelio-forms-focused-field-border, #00f);
		outline: 2px solid var(--nelio-forms-outline, #00f);
		outline-offset: 1px;
	}

	&::before {
		background-color: var(--nelio-forms-accent-color, #00f);
		clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
		content: "";
		height: 12px;
		left: 50%;
		position: absolute;
		top: 50%;
		transform: translate(-50%, -50%) scale(0);
		transition: 120ms transform ease-in-out;
		width: 12px;
	}

	&:checked::before {
		transform: translate(-50%, -50%) scale(1);
	}
}

/* stylelint-disable-next-line */
.nelio-forms-form .nelio-forms-field__item-value--radio-group {
	border-radius: 100%;

	/* stylelint-disable-next-line */
	&::before {
		clip-path: none;
		border-radius: 100%;
		height: 10px;
		width: 10px;
	}
}