// ==========================================================================
// Question Container
// ==========================================================================

.#{$selector} {
	.ipt_uif_question {
		width: 100%;
		float: left;
		padding: 0;

		.ipt_uif_question_label,
		.ipt_uif_question_content {
			float: left;
			width: 100%;
			padding: 0;
		}

		> .ipt_uif_question_label {
			margin-bottom: 15px;
		}

		label.ipt_uif_question_title {
			font-weight: normal;
			font-size: (16 / 14) * 1em;
			display: block;
			color: $primary-text-color;
			margin: 0 0 5px 0;
			.ipt_uif_question_required {
				color: $primary-color;
				margin-left: 5px;
			}
		}
		label.ipt_uif_question_subtitle {
			font-weight: 300;
			font-size: ( 12 / 14 ) * 1em;
			color: $secondary-text-color;
			margin-top: -4px;
			font-style: italic;
			display: block;
		}
		.ipt_uif_question_content {
			color: $secondary-text-color;

			// Nested Questions
			.ipt_uif_question {
				label.ipt_uif_question_title {
					color: $secondary-text-color;
				}
				label.ipt_uif_question_subtitle {
					color: $disabled-color-text;
				}
			}
		}

		.ipt_uif_label_column {
			width: 100%;
			float: left;
			padding: 5px;

			&.column_random {
				width: auto;
				display: inline-block;
				float: none;
			}
		}

		&.ipt_uif_question_centered {
			text-align: center;
			.ipt_uif_question_label {
				text-align: center;
			}
			.ipt_uif_question_content {
				text-align: center;
				.input-field {
					text-align: left;
				}
			}
		}

		@media screen and ( min-width: $screen-lg-min ) {
			.ipt_uif_question_label {
				width: 30%;
				margin-bottom: 0;
			}
			.ipt_uif_question_content {
				width: 70%;
				padding-left: $grid-gutter-width;
			}
			.ipt_uif_label_column {
				text-align: left;
				&.column_2 {
					width: 50%;
				}
				&.column_3 {
					width: 33.33333333%;
				}
				&.column_4 {
					width: 25%;
				}
			}
			&.ipt_uif_question_full > .ipt_uif_question_content {
				width: 100%;
				padding: 0;
			}
			&.ipt_uif_question_vertical {
				> .ipt_uif_question_label {
					width: 100%;
					margin-bottom: 15px;
				}
				> .ipt_uif_question_content {
					width: 100%;
					padding-left: 0;
				}
			}
			&.ipt_uif_question_centered {
				.ipt_uif_question_label {
					width: 100%;
					text-align: center;
					margin-bottom: 15px;
				}
				.ipt_uif_question_content {
					width: 100%;
					padding-left: 0;
					text-align: center;
					.input-field {
						text-align: left;
					}
				}
				.ipt_uif_label_column {
					text-align: center;
				}
			}
		}
	}

	.ipt_uif_fancy_container {
		> .ipt_uif_question {
			border-bottom: 1px solid $divider-color;
			padding: 24px 0 0px;
			&:first-child {
				padding-top: 6px;
			}
		}
	}

	// Column Optimization
	.ipt_uif_column_third,
	.ipt_uif_column_forth {
		.ipt_uif_question {
			> .ipt_uif_question_label {
				width: 100%;
				margin-bottom: 15px;
			}
			> .ipt_uif_question_content {
				width: 100%;
				padding-left: 0;
			}
		}
	}

	// Vertical all qcontainers inside centered and vertical parent columns
	.column-vertical-heading,
	.column-centered-heading {
		.ipt_uif_question {
			.ipt_uif_question_label {
				width: 100%;
				margin-bottom: 15px;
			}
			.ipt_uif_question_content {
				width: 100%;
				padding-left: 0;
			}
		}
	}
	.column-centered-heading {
		.ipt_uif_question_label {
			width: 100%;
			text-align: center;
			margin-bottom: 15px;
		}
		.ipt_uif_question_content {
			width: 100%;
			padding-left: 0;
			text-align: center;
			.input-field {
				text-align: left;
			}
		}
		.ipt_uif_label_column {
			text-align: center;
		}
	}
}

// When placing inside widgets
.ipt_uif_widget_vertical {
	.#{$selector} {
		.ipt_uif_question {
			> .ipt_uif_question_label {
				width: 100%;
				margin-bottom: 15px;
			}
			> .ipt_uif_question_content {
				width: 100%;
				padding-left: 0;
			}
		}
		.ipt_uif_label_column {
			&.column_2,
			&.column_3,
			&.column_4 {
				width: 100%;
			}
		}
	}
}