@import '../../../../../../src/styles/variables.scss';
.choice-button-zone {
	margin-right: 15px;
	border-radius: 8px;
	background: #fff;
	display: inline-block;
	text-align: center;
	min-width: 107px;
	min-height: 83px;
	padding: 8px 0 16px;
	.button-description {
		margin-top: 8px;
		font-weight: 700;
		font-size: 14px;
		line-height: 16px;
	}
	button {
		margin: 0 auto;
	}
	&:focus {
		outline: $outline-color;
		outline-style: solid;
		outline-offset: 0.15rem;
	}
	&:active {
		outline: transparent;
	}

	&:hover {
		&.is-answer-YES {
			background: $d-success;
			color: $d-success-text;
		}
		&.is-answer-MAYBE {
			background: $d-warning;
			color: $d-warning-text;
		}
		&.is-answer-NO {
			background: $d-error;
			color: $d-error-text;
		}
	}
	&.is-active {
		&.is-answer-YES {
			background: $d-success;
			color: $d-success-text;
		}
		&.is-answer-MAYBE {
			background: $d-warning;
			color: $d-warning-text;
		}
		&.is-answer-NO {
			background: $d-error;
			color: $d-error-text;
		}
	}
	.icon-deco {
		padding: 20px;
		border: solid 1px grey;
		background-position: center;
	}
}