/**
 * Fixed form labels + paired-field helpers.
 *
 * Fixed labels apply under #main (and .form-labels-fixed) system-wide —
 * labels stay above the control (no Materialize float-up).
 *
 * .form-field-pair — left stack + right stretch control (e.g. textarea) aligned
 * so tops and bottom underlines match at m+ breakpoints. Opt-in per section.
 */

/* ---- Fixed labels (no float-in-field) — #main site-wide ---- */

#main .input-field,
.form-labels-fixed .input-field {
	position: relative;
	margin-top: 0.75rem;
	margin-bottom: 0.75rem;
	padding-top: 1.35rem;
}

#main .input-field > label,
#main .input-field > label.active,
.form-labels-fixed .input-field > label,
.form-labels-fixed .input-field > label.active {
	position: absolute;
	top: 0;
	left: 0.75rem;
	width: auto;
	height: auto;
	font-size: 1rem !important;
	line-height: 1.25;
	transform: none !important;
	-webkit-transform: none !important;
	pointer-events: none;
}

#main .input-field > input[type='text'],
#main .input-field > input[type='number'],
#main .input-field > input[type='email'],
#main .input-field > input[type='tel'],
#main .input-field > input:not([type]),
#main .input-field > textarea.materialize-textarea,
.form-labels-fixed .input-field > input[type='text'],
.form-labels-fixed .input-field > input[type='number'],
.form-labels-fixed .input-field > input[type='email'],
.form-labels-fixed .input-field > input[type='tel'],
.form-labels-fixed .input-field > input:not([type]),
.form-labels-fixed .input-field > textarea.materialize-textarea {
	margin-top: 0;
	margin-bottom: 0;
}

#main .input-field > textarea.materialize-textarea,
.form-labels-fixed .input-field > textarea.materialize-textarea {
	padding-top: 0.35rem;
	padding-bottom: 0.5rem;
	box-sizing: border-box;
}

@media only screen and (max-width: 400px) {
	#main .input-field > label,
	#main .input-field > label.active,
	.form-labels-fixed .input-field > label,
	.form-labels-fixed .input-field > label.active {
		left: 1rem;
	}
}

/* ---- Paired stack + stretch (textarea / tall control) ---- */

@media only screen and (min-width: 601px) {
	.form-field-pair.row {
		display: flex;
		flex-wrap: wrap;
		align-items: stretch;
	}

	.form-field-pair.row::after {
		content: none;
		display: none;
	}

	.form-field-pair > [class*='col'] {
		float: none;
		display: flex;
		flex-direction: column;
	}

	.form-field-pair-stack > .row {
		display: flex;
		flex-direction: column;
		flex: 1 1 auto;
		margin-bottom: 0;
		height: 100%;
	}

	.form-field-pair-stack > .row::after {
		content: none;
		display: none;
	}

	.form-field-pair-stretch > .input-field.textarea,
	.form-field-pair-stretch > .input-field {
		display: flex;
		flex-direction: column;
		flex: 1 1 auto;
		height: 100%;
		margin-top: 0.75rem;
		margin-bottom: 0.75rem;
	}

	.form-field-pair-stretch > .input-field > textarea.materialize-textarea {
		flex: 1 1 auto;
		width: 100%;
		height: 100% !important;
		min-height: 4rem;
		resize: vertical;
	}
}