/*
 * Consultation call picker (booking hours): Time zone, Day and Time drop-downs.
 * The labels and selects use the host form's own classes (.awpc-form-label and
 * its select styles), so this file only handles layout and the helper lines.
 */
.awpc-booking {
	display: flex;
	flex-direction: column;
	gap: 14px;
	width: 100%;
	min-width: 0;
	flex: 1 1 100%;
}

.awpc-bk-field {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.awpc-booking select {
	width: 100%;
	max-width: 100%;
}

.awpc-booking select:disabled {
	opacity: .6;
	cursor: not-allowed;
}

/* Day + Time side by side; they stack when the column is too narrow. */
.awpc-bk-when {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

.awpc-bk-when .awpc-bk-field {
	flex: 1 1 150px;
}

.awpc-bk-when .awpc-bk-field:first-child {
	flex-grow: 1.3;
}

/* Calculator sidebar: tighter spacing, like its own fields. */
.awpc-booking--calc {
	gap: .6rem;
}

.awpc-booking--calc .awpc-bk-when {
	gap: .5rem;
}

.awpc-booking--calc .awpc-bk-when .awpc-bk-field {
	flex-basis: 120px;
}

.awpc-bk-help {
	margin: -4px 0 0;
	font-size: .78rem;
	color: var(--awpc-muted, #5d6675);
}

.awpc-bk-msg {
	margin: 0;
	font-size: .82rem;
	color: var(--awpc-muted, #5d6675);
}

.awpc-bk-msg:empty {
	display: none;
}

.awpc-bk-msg.is-error {
	color: #b3261e;
	font-weight: 600;
}

.awpc-booking--calc .awpc-bk-help {
	margin: 0;
}