#quiz .quiz_recipe_container{
	padding:0;
	margin:0;
}

#quiz .right_side{
	padding:32px 30px;
	display:flex;
	width:100%;
	flex-direction:column;
	color:#3a4850;
	background-color:#f7f8f9;
	border-radius:12px;
}

#quiz .right_title{
	font:700 16px/21px Graphik,sans-serif;
	color:#3a4850;
}

#quiz .description{
	margin:6px 0 20px 0;
	min-height:60px;
	font:400 14px/20px Graphik,Arial,sans-serif;
}

#quiz .main_table{
	display:flex;
	width:100%;
	flex-direction:row;
	margin-bottom:20px;
}

#quiz .column{
	display:flex;
	flex-direction:column;
	flex:1;
	background-color:#fff;
	cursor:pointer;
}

#quiz .column.column_labels{
	cursor:default;
	flex:0 0 150px;
}

#quiz .cell{
	padding:14.5px 14px;
	min-height:65px;
	font:700 14px/17px Graphik,sans-serif;
	text-align:left;
	color:#3a4850;
	border:1px solid #dedede;
	display:inline-flex;
	align-items:center;
	box-sizing:border-box;
	position:relative;
}

#quiz .cell:has(select){
	padding:0;
}

#quiz .cell.header{
	font:700 14px/17px Graphik,sans-serif;
	color:#3a4850;
	background-color:#f4f9ff;
	gap:3px;
}

#quiz .cell.row_label{
	background-color:#f4f9ff;
}

#quiz .column:first-child .cell:first-child{
	border-radius:4px 0 0 0;
}

#quiz .column:first-child .cell:last-child{
	border-radius:0 0 0 4px;
}

#quiz .column:last-child .cell:first-child{
	border-radius:0 4px 0 0;
}

#quiz .column:last-child .cell:last-child{
	border-radius:0 0 4px 0;
}

#quiz .legend_active{
	z-index:10;
	margin:-1px;
	border:1px solid #2196f3 !important;
	box-shadow:0 3px 7px 0 #00000024;
}

#quiz .disabled_field{
	opacity:0.5;
	cursor:not-allowed;
	background-color:#f5f5f5;
}

#quiz .disabled_field select{
	cursor:not-allowed;
}

#quiz .quiz_recipe_container select{
	width:100%;
	padding:18px 12px;
	border:none;
	background:transparent;
	font:700 14px/17px Graphik,sans-serif;
	color:#3a4850;
	cursor:pointer;
	-webkit-appearance:none;
	-moz-appearance:none;
	appearance:none;
	background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="8" viewBox="0 0 12 8"><polyline points="1,1 6,6 11,1" fill="none" stroke="%233a4850" stroke-width="1.5" stroke-linecap="round"/></svg>');
	background-repeat:no-repeat;
	background-position:right 8px center;
	background-size:12px;
	padding-right:24px;
	transition:background-position 0.3s ease;
}

#quiz .quiz_recipe_container select:focus{
	outline:none;
	background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="8" viewBox="0 0 12 8" transform="rotate(180)"><polyline points="1,1 6,6 11,1" fill="none" stroke="%233a4850" stroke-width="1.5" stroke-linecap="round"/></svg>');
}

#quiz .quiz_recipe_container select:disabled{
	opacity:0.5;
	cursor:not-allowed;
}

#quiz .hidden{
	display:none !important;
}

#quiz .pd_switch{
	display:flex;
	align-items:center;
	padding:10px 0;
	margin-bottom:10px;
}

#quiz .pd_switch input[type="checkbox"]{
	margin:0;
	margin-right:8px;
	cursor:pointer;
	width:18px;
	height:18px;
}

#quiz .pd_switch label{
	font:400 14px/20px Graphik,sans-serif;
	color:#3a4850;
	cursor:pointer;
	margin:0;
	display:flex;
	align-items:center;
	gap:3px;
}

#quiz .pd_row{
	display:flex;
	flex-direction:row;
	gap:15px;
	margin-bottom:20px;
}

#quiz .pd_container,
#quiz .double_pd,
#quiz .near_pd{
	display:flex;
	flex-direction:row;
	background-color:#fff;
	border:1px solid #dedede;
	border-radius:4px;
	overflow:hidden;
	cursor:pointer;
}

#quiz .pd_container{
	min-width:200px;
}

#quiz .double_pd{
	min-width:400px;
}

#quiz .near_pd{
	flex:1;
	min-width:200px;
}

#quiz .first_cell{
	padding:15.5px 14.5px;
	flex-shrink:0;
	min-width:100px;
	font:700 14px/17px Graphik,sans-serif;
	color:#3a4850;
	background-color:#f4f9ff;
	border-right:1px solid #dedede;
	display:inline-flex;
	align-items:center;
	box-sizing:border-box;
	gap:3px;
}

#quiz .pd_container .cell,
#quiz .double_pd .cell,
#quiz .near_pd .cell{
	padding:0;
	flex:1;
	min-height:48px;
	font:700 14px/17px Graphik,sans-serif;
	color:#3a4850;
	border:none;
	display:inline-flex;
	align-items:center;
	box-sizing:border-box;
	flex-direction:column;
	justify-content:center;
}

#quiz .cell.single{
	width:50%;
	position:relative;
}

#quiz .upper_label{
	display:block;
	font:400 11px/17px Graphik,sans-serif;
	color:#89959c;
	width:100%;
	height:0;
	margin-left:15px;
}

#quiz .error_highlight{
	background-color:#fff7ee !important;
	border:1px solid #d34e15 !important;
}

#quiz .inline_warning{
	background-color:#fff7ee;
	border:1px solid #d34e15;
	border-radius:4px;
	padding:15px 20px;
	margin:20px 0;
}

#quiz .inline_warning p{
	font:400 14px/20px Graphik,sans-serif;
	color:#3a4850;
	margin:0;
}

#quiz .inline_warning a{
	color:#d34e15;
	text-decoration:none;
	font-weight:700;
	display:inline-block;
	white-space:nowrap;
}

#quiz .inline_warning a:hover{
	text-decoration:underline;
}

#quiz .form_buttons{
	display:flex;
	gap:15px;
	align-items:center;
	margin-top:20px;
}

#quiz .btn_apply{
	padding:12px 24px;
	background:#40b7f2;
	color:white;
	border:0;
	border-radius:5px;
	font:700 14px/17px Graphik,sans-serif;
	cursor:pointer;
	transition:background 0.2s ease;
}

#quiz .btn_apply:hover{
	background:#3aa0d9;
}

#quiz .btn_skip{
	padding:12px 24px;
	color:#3a4850;
	text-decoration:none;
	font:400 14px/17px Graphik,sans-serif;
	transition:opacity 0.2s ease;
}

#quiz .btn_skip:hover{
	opacity:0.7;
}

@media screen and (max-width:834px){
	#quiz .right_side{
		padding:15px 10px;
		width:100%;
	}

	#quiz .cell{
		padding:12px 8px;
		font-size:12px;
	}

	#quiz .cell:has(select){
		padding:0;
	}

	#quiz .description{
		font-size:13px;
	}

	#quiz .pd_row{
		flex-direction:column;
	}

	#quiz .pd_container,
	#quiz .double_pd,
	#quiz .near_pd{
		width:100%;
		min-width:auto;
	}
}

@media screen and (max-width:480px){
	#quiz .right_side{
		padding:10px 5px;
	}

	#quiz .column.column_labels{
		flex:0 0 50px;
	}

	#quiz .cell{
		padding:8px 5px;
		font-size:11px;
		min-height:53px;
	}

	#quiz .cell:has(select){
		padding:0;
	}

	#quiz .first_cell{
		font-size:12px;
		min-width:80px;
		padding:8px 6px;
	}

	#quiz .quiz_recipe_container select{
		font-size:11px;
		padding:14px 8px;
	}

	#quiz .cell.single{
		width:100%;
	}

	#quiz .description{
		font-size:12px;
	}

	#quiz .inline_warning p{
		font-size:12px;
		line-height:18px;
	}

	#quiz .form_buttons{
		flex-direction:column;
		align-items:stretch;
	}
}
