/**
 * Noveba CF7 Logger — Bootstrap 5 input-group + Contact Form 7
 *
 * CF7 / wpautop wraps lines in <p>, so markup becomes:
 *   <div class="input-group"><p><span class="input-group-text">…</span><span class="wpcf7-form-control-wrap">…</span></p></div>
 * The <p> is block-level and becomes the only flex child of .input-group, so the
 * label and field stack vertically. Fix: make that <p> a horizontal flex row.
 *
 * Also keeps rules for the ideal markup without <p> (direct children).
 *
 * @see https://getbootstrap.com/docs/5.3/forms/input-group/
 */

/* --- Outer row (Bootstrap) --- */
.wpcf7 .input-group {
	display: flex;
	flex-wrap: nowrap;
	align-items: stretch;
	width: 100%;
}

/* --- wpautop: <p> must be the inner flex row, not a block wrapper --- */
.wpcf7 .input-group > p {
	display: flex;
	flex: 1 1 auto;
	flex-wrap: nowrap;
	align-items: stretch;
	width: 100%;
	min-width: 0;
	margin: 0;
	padding: 0;
}

/* Prefix: direct child OR inside wpautop <p> */
.wpcf7 .input-group > .input-group-text,
.wpcf7 .input-group > label.input-group-text,
.wpcf7 .input-group > p > .input-group-text,
.wpcf7 .input-group > p > label.input-group-text {
	flex: 0 0 auto;
}

/* CF7 wrap */
.wpcf7 .input-group > .wpcf7-form-control-wrap,
.wpcf7 .input-group > p > .wpcf7-form-control-wrap {
	flex: 1 1 0%;
	min-width: 0;
	width: auto !important;
	max-width: none;
	display: flex;
}

.wpcf7 .input-group > .wpcf7-form-control-wrap > .form-control,
.wpcf7 .input-group > .wpcf7-form-control-wrap > .form-select,
.wpcf7 .input-group > .wpcf7-form-control-wrap > textarea,
.wpcf7 .input-group > p > .wpcf7-form-control-wrap > .form-control,
.wpcf7 .input-group > p > .wpcf7-form-control-wrap > .form-select,
.wpcf7 .input-group > p > .wpcf7-form-control-wrap > textarea {
	flex: 1 1 auto;
	width: 100% !important;
	min-width: 0;
}

/* Optional: collapse <p> so Bootstrap border-radius between addons works.
   If unsupported, the flex-on-<p> rules above still fix stacking. */
@supports (display: contents) {
	.wpcf7 .input-group > p {
		display: contents;
	}
}

/* Validation tip: full width below the control */
.wpcf7 .input-group .wpcf7-not-valid-tip {
	flex: 0 0 100%;
	width: 100%;
}