form-checkbox .form-field-content
{
	display: flex;
	gap: 12px;
}
form-checkbox .checkbox svg
{
	width: 24px;
	height: 24px;
   position: absolute;
   pointer-events: none;
   cursor: pointer;
   display: none;
}
form-checkbox .checkbox svg rect
{
   fill: var(--color-accent-1)
}
form-checkbox .checkbox svg path
{
   fill: var(--color-background-input)
}
form-checkbox .checkbox input
{
	width: 24px;
	height: 24px;
	padding: 0;
	margin: 0;
	background: var(--color-background-input, #F2F2F2);
	border: unset;
	outline: none;
	border-radius: 0;
	appearance: none;
   cursor: pointer;
}


form-checkbox .checkbox svg:has(+ input:checked)
{
   display: block;
}
form-checkbox .checkbox input:checked
{
   background-color: transparent;
}