:root {
	--form-control-color: var(--main-primary-color);
	--form-control-disabled: #959495;
}

.radio-container {
	display: grid;
	grid-template-columns: 1.8rem auto;
}

input[type="radio"] {
	appearance: none;
	align-self: end;
	font: inherit;
	width: 1.15em;
	height: 1.15em;
	border: 0.0625rem solid var(--main-primary-color);
	border-radius: 50%;
	transform: translateY(-0.075em);
	display: grid;
	place-content: center;
}

input[type="radio"]::before {
	content: "";
	width: 0.65em;
	height: 0.65em;
	clip-path: circle();
	transform: scale(0);
	transform-origin: bottom left;
	transition: 120ms transform ease-in-out;
	box-shadow: inset 1em 1em var(--form-control-color);
}

input[type="radio"]:checked::before {
	transform: scale(1);
}

input[type="radio"]:focus {
	outline: none;
}

input[type="radio"]:disabled {
	--form-control-color: var(--form-control-disabled);
	color: var(--form-control-disabled);
	cursor: not-allowed;
}