[type="radio"],
span {
	vertical-align: top;
}

[type="radio"] + .label {
	font-size: var(--font-size-medium-small);
	color: var(--gray120);
	max-width: 65%;
	display: inline-block;
}

[type="radio"] {
	appearance: none;
	border: max(2px, 0.1em) solid var(--gray90);
	border-radius: 50%;
	width: 2.4rem;
	height: 2.4rem;
	transition: border 0.1s ease-in-out;
	margin-right: 1rem;
}

input[type="radio"].error {
	color: #c0392b; /* red text for unselected labels */
	border: max(2px, 0.1em) solid #c0392b;
	box-shadow: 0 0 0 max(4px, 0.2em) #ffafae;
}

[type="radio"]:checked {
	border: 0.6rem solid var(--borderActive);
}

[type="radio"]:hover {
	box-shadow: 0 0 0 max(4px, 0.2em) var(--gray30);
	cursor: pointer;
}

[type="radio"]:hover + span {
	cursor: pointer;
}
