.fancy-check {}

.fancy-check__input {
    position: absolute;
	clip: rect(0,0,0,0);
	pointer-events: none;
}

.fancy-check__input:checked {}

.fancy-check__input:checked ~ .fancy-check__label {
	border-color: transparent;
	background-color: #fff;
	box-shadow:
		0 0 0 2px rgba(18,128,161,1),
		0 10px 10px -10px rgba(0, 0, 0, 0.2);
}

.fancy-check__input:checked ~ .fancy-check__label .fancy-check__label__icon {
	color: #1280a1;
}

.fancy-check__input:checked ~ .fancy-check__label .fancy-check__label__text {
	color: #292638;
}

.fancy-check__label {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 1rem;
	border: 1px solid #C2C9DE;
	background-color: #fff;
	border-radius: 5px;
	transition: border-color 300ms ease, background-color 300ms ease, box-shadow 300ms ease;
}

.fancy-check__label:hover {
	cursor: pointer;
	background-color: #fff;
	border-color: #C2C9DE;
	box-shadow:
		0 0 0 1px rgba(194, 201, 222, 1),
		0 5px 5px -5px rgba(0, 0, 0, 0.2);
}

.fancy-check__label:hover .fancy-check__label__icon {
	color: #A8B2BD;
}

.fancy-check__label:hover .fancy-check__label__text {
	color: #292638;
}

.fancy-check__label--xl {
	padding: 2rem;
}

.fancy-check__label--icon-inline {
	flex-direction: row;
}

.fancy-check__label--icon-inline .fancy-check__label__icon {
	margin-right: 0.5rem;
}

.fancy-check__label__icon {
	font-size: 28px;
	font-size: 1.75rem;
	color: #CED4DC;
	transition: color 300ms ease;
}

.fancy-check__label__icon--xl {
	font-size: 40px;
	font-size: 2.5rem;
}

.fancy-check__label__text {
	font-size: 18px;
	font-size: 1.125rem;
	color: #60737B;
	transition: color 300ms ease;
	line-height: 1.25;
}

.fancy-check__label__description {
	color: #83939D;
	text-align: center;
	font-size: 14px;
	font-size: 0.875rem;
}

.fancy-check-group {
	display: flex;
	gap: 1rem;
}

.fancy-check-group .fancy-check {
	flex-grow: 1;
}

.fancy-check-group.fancy-check-group--equal-width-items .fancy-check {
	flex: 1 0 0;
}

.fancy-check__label__icon__options {
	position: relative;
	display: block;
	height: 36px;
	width: 36px;
}

.fancy-check__label__icon__options__item {
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0;
	transition: opacity 300ms ease;
}

.fancy-check__label__icon__options__item[data-icon-for-state="unchecked"] {
	opacity: 1;
}
.fancy-check__label__icon__options__item[data-icon-for-state="checked"] {
	opacity: 0;
}

.fancy-check__input:hover ~ .fancy-check__label .fancy-check__label__icon__options__item[data-icon-for-state="unchecked"],
.fancy-check__input:checked ~ .fancy-check__label .fancy-check__label__icon__options__item[data-icon-for-state="unchecked"] {
	opacity: 0;
}

.fancy-check__input:hover ~ .fancy-check__label .fancy-check__label__icon__options__item[data-icon-for-state="checked"],
.fancy-check__input:checked ~ .fancy-check__label .fancy-check__label__icon__options__item[data-icon-for-state="checked"] {
	opacity: 1;
}