/*
 * Inquiry form presentation (Fluent Forms). Owner: Worker E (v0.4.0).
 * Styled by Fluent's generic classes (and the coordinator's .studio-pair containers), so field
 * changes in the form definition keep working. Scope: .studio-inquiry-form-wrap, the wrapper
 * printed by [studio_inquiry_form]. The form sits on the paper canvas: no raised card.
 *
 * Desktop and tablet (600 px and up): first name + email, then date + venue, side by side.
 * Phone: one column. Controls 52 px, 16 px text, persistent labels, charcoal focus (Everbound palette).
 */
.studio-inquiry-form-wrap {
	--f-ink: var(--ink, #252320);
	--f-muted: var(--muted, #665B54);
	--f-accent: var(--accent, #252320);
	--f-accent-deep: var(--accent-deep, #45403A);
	--f-field: var(--paper, #FEFCF7);
	--f-border: #8C8279;          /* 3.7:1 against the field, 3.4:1 against the canvas */
	--f-error: #9A2A1C;           /* 7.6:1 on the field */
	--f-gap: clamp(1rem, .7rem + 1vw, 1.5rem);
	margin: 0;
	max-width: 46rem;
	font-family: var(--sans, sans-serif);
	color: var(--f-ink);
}
.studio-inquiry-form-wrap .fluentform,
.studio-inquiry-form-wrap .fluentform * { box-sizing: border-box; }
.studio-inquiry-form-wrap .fluentform fieldset { min-width: 0; }

/* Groups and the paired rows */
.studio-inquiry-form-wrap .fluentform .ff-el-group { margin: 0 0 1.5rem; }
.studio-inquiry-form-wrap .fluentform .ff-t-container {
	display: flex;
	align-items: flex-start;
	gap: var(--f-gap);
	margin: 0;
}
.studio-inquiry-form-wrap .fluentform .ff-t-container .ff-t-cell {
	display: block;
	flex: 1 1 0;
	min-width: 0;
	padding: 0;
}
/* Fluent wraps the name field in its own one-cell container inside the first column. */
.studio-inquiry-form-wrap .fluentform .ff-t-cell .ff-name-field-wrapper .ff-t-container { display: block; }
.studio-inquiry-form-wrap .fluentform .ff-t-cell .ff-name-field-wrapper .ff-t-cell { flex: none; }
.studio-inquiry-form-wrap .fluentform .ff-name-field-wrapper { margin: 0; }

/* Labels: always visible, never placeholder-only */
.studio-inquiry-form-wrap .fluentform .ff-el-input--label { margin: 0 0 .5rem; padding: 0; }
.studio-inquiry-form-wrap .fluentform .ff-el-input--label label {
	display: inline;
	margin: 0;
	font-family: var(--sans, sans-serif);
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.4;
	letter-spacing: .005em;
	color: var(--f-ink);
}
.studio-inquiry-form-wrap .fluentform .ff-el-input--label.ff-el-is-required.asterisk-right label::after {
	content: " *";
	margin-left: 2px;
	color: var(--f-accent);
}

/* Controls */
.studio-inquiry-form-wrap .fluentform .ff-el-form-control {
	display: block;
	width: 100%;
	min-height: 52px;
	margin: 0;
	padding: .8125rem 1rem;
	background: var(--f-field);
	border: 1px solid var(--f-border);
	border-radius: 0;
	box-shadow: none;
	font-family: var(--sans, sans-serif);
	font-size: 1rem;
	line-height: 1.5;
	color: var(--f-ink);
	transition: border-color .15s ease, box-shadow .15s ease;
}
.studio-inquiry-form-wrap .fluentform textarea.ff-el-form-control { min-height: 9.5rem; resize: vertical; }
.studio-inquiry-form-wrap .fluentform .ff-el-form-control::placeholder { color: #6E655D; opacity: 1; } /* 5.6:1 on the field */
.studio-inquiry-form-wrap .fluentform .ff-el-form-control:hover { border-color: var(--f-ink); }
.studio-inquiry-form-wrap .fluentform .ff-el-form-control:focus,
.studio-inquiry-form-wrap .fluentform .ff-el-form-control:focus-visible {
	outline: 2px solid var(--f-accent);
	outline-offset: 2px;
	border-color: var(--f-accent);
	box-shadow: none;
	background: #fff;
}

/* Help text */
.studio-inquiry-form-wrap .fluentform .ff-el-help-message {
	margin-top: .5rem;
	font-size: .9375rem;
	font-style: normal;
	line-height: 1.45;
	color: var(--f-muted);
}

/* Errors: clear border, readable message with a rule, never colour alone */
.studio-inquiry-form-wrap .fluentform .ff-el-is-error .ff-el-input--label label { color: var(--f-error); }
.studio-inquiry-form-wrap .fluentform .ff-el-is-error .ff-el-form-control {
	border-color: var(--f-error);
	box-shadow: inset 0 0 0 1px var(--f-error);
	background: #FFFCFB;
}
.studio-inquiry-form-wrap .fluentform .ff-el-is-error .ff-el-form-control:focus { outline-color: var(--f-error); }
.studio-inquiry-form-wrap .fluentform .ff-el-is-error .text-danger,
.studio-inquiry-form-wrap .fluentform .error.text-danger {
	display: block;
	margin-top: .5rem;
	padding-left: .75rem;
	border-left: 2px solid var(--f-error);
	font-size: 1rem;
	font-weight: 500;
	line-height: 1.45;
	color: var(--f-error);
}
.studio-inquiry-form-wrap .ff-errors-in-stack {
	margin-top: 1rem;
	color: var(--f-error);
	font-size: 1rem;
}
.studio-inquiry-form-wrap .ff-errors-in-stack:empty { display: none; }
.studio-inquiry-form-wrap .ff-errors-in-stack .error {
	padding: .75rem 1rem;
	border-left: 3px solid var(--f-error);
	background: #FBF1EE;
	overflow-wrap: anywhere;
}

/* Submit */
.studio-inquiry-form-wrap .fluentform .ff_submit_btn_wrapper { margin: 2rem 0 0; }
.studio-inquiry-form-wrap .fluentform .ff-btn-submit,
.studio-inquiry-form-wrap .fluentform button.ff-btn-submit.ff_btn_style {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 56px;
	padding: 0 2.25rem !important;
	background: var(--f-accent) !important;
	color: #FFFDFA !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	font-family: var(--sans, sans-serif) !important;
	font-size: .875rem !important;
	font-weight: 600 !important;
	letter-spacing: .12em !important;
	text-transform: uppercase;
	line-height: 1.2 !important;
	cursor: pointer;
	transition: background-color .2s ease;
}
.studio-inquiry-form-wrap .fluentform .ff-btn-submit:hover,
.studio-inquiry-form-wrap .fluentform .ff-btn-submit:focus { opacity: 1 !important; }
.studio-inquiry-form-wrap .fluentform .ff-btn-submit:hover { background: var(--f-accent-deep) !important; }
.studio-inquiry-form-wrap .fluentform .ff-btn-submit:focus-visible { outline: 2px solid var(--f-ink) !important; outline-offset: 3px; }
.studio-inquiry-form-wrap .fluentform .ff-btn-submit[disabled],
.studio-inquiry-form-wrap .fluentform .ff-working .ff-btn-submit { opacity: .7 !important; cursor: progress; }

/* Success view: replaces the form on the same canvas, introduced by a champagne rule. Long names
   and email addresses wrap inside their line instead of overflowing or forming a narrow column. */
.studio-inquiry-form-wrap .ff-message-success {
	margin: 0;
	padding: 1.75rem 0 0;
	background: none;
	border: 0;
	border-top: 2px solid var(--champagne, #B49A6A); /* decorative rule, Everbound champagne accent */
	box-shadow: none;
	font-size: var(--wp--preset--font-size--medium, 1.0625rem);
	line-height: 1.6;
	color: var(--f-ink);
	overflow-wrap: anywhere;
}
.studio-inquiry-form-wrap .ff-message-success:focus { outline: 2px solid var(--f-accent); outline-offset: 3px; }
.studio-inquiry-form-wrap .ff-message-success .studio-success-title,
.studio-inquiry-form-wrap .ff-message-success h2,
.studio-inquiry-form-wrap .ff-message-success h3 {
	max-width: 15em;
	margin: 0 0 1.25rem;
	font-family: var(--serif, serif);
	font-size: clamp(2rem, 1.55rem + 1.8vw, 3rem);
	font-weight: 500;
	line-height: 1.1;
	color: var(--f-ink);
	overflow-wrap: break-word;
	scroll-margin-top: calc(var(--studio-header-offset, 96px) + 1rem);
}
.studio-inquiry-form-wrap .ff-message-success .studio-success-title:focus { outline: none; }
.studio-inquiry-form-wrap .ff-message-success .studio-success-title:focus-visible { outline: 2px solid var(--f-accent); outline-offset: 4px; }
.studio-inquiry-form-wrap .ff-message-success p { margin: 0 0 1rem; max-width: 36rem; }
.studio-inquiry-form-wrap .ff-message-success p:last-child { margin-bottom: 0; }
.studio-inquiry-form-wrap .ff-message-success a { color: var(--f-accent); font-weight: 600; }

/* Field groups and errors land below the pinned header when the browser scrolls to them. */
.studio-inquiry-form-wrap .fluentform .ff-el-group { scroll-margin-top: calc(var(--studio-header-offset, 96px) + 1rem); }

@media (max-width: 599.98px) {
	.studio-inquiry-form-wrap .fluentform .ff-t-container { display: block; }
	.studio-inquiry-form-wrap .fluentform .ff-btn-submit { width: 100%; }
	.studio-inquiry-form-wrap .fluentform .ff-el-group { margin-bottom: 1.25rem; }
}
