/*
 * The WPForms quote form in the design (WPForms' own styling is off). Field anatomy, inputs, selects, groups, choices
 * and buttons reuse the theme's form classes (set in inc/wpforms.php and wpforms.js); this file covers WPForms' own
 * wrappers: pages, progress, page buttons, errors, the photo uploader and the honeypot.
 */

.casa-wpforms { display: block; }
.casa-wpforms .wpforms-form { display: grid; gap: 0; margin: 0; }
.casa-wpforms .wpforms-hidden,
.casa-wpforms .wpforms-error-noscript { display: none; }

/* Progress: the design's three-part bar and "Step n of 3: <title>" (wpforms.js), not WPForms' own text and bar. */
.casa-wpforms .wpforms-page-indicator { margin: 0; }
.casa-wpforms .wpforms-page-indicator:focus { outline: none; }
.casa-wpforms .wpforms-page-indicator > :not(.casa-progress-bar):not(.casa-progress-label) { display: none; }
.casa-wpforms .wpforms-page-indicator { font-size: 0; }
.casa-wpforms .wpforms-page-indicator .casa-progress-label { font-size: var(--size-15); }

/* Pages: fields 28 apart, as .casa-fields. */
.casa-wpforms .wpforms-field-container { display: block; }
.casa-wpforms .wpforms-page { display: grid; gap: var(--size-28); min-width: 0; }
.casa-wpforms .wpforms-page[style*="display: none"],
.casa-wpforms .wpforms-page[style*="display:none"] { display: none; }
.casa-wpforms .wpforms-field { min-width: 0; margin: 0; padding: 0; }
.casa-wpforms .wpforms-field[style*="display: none"],
.casa-wpforms .wpforms-field[style*="display:none"] { display: none; }
.casa-wpforms .wpforms-field-pagebreak:empty { display: none; }
.casa-wpforms .casa-wpf-heading .casa-form-h { margin: 0; }
.casa-wpforms .casa-wpf-heading .casa-form-intro { margin: var(--size-12) 0 0; }

/* Field anatomy: label, hint, error, then the input (WPForms writes the error after the input). */
.casa-wpforms .casa-field { display: grid; gap: var(--size-8); }
.casa-wpforms .casa-field > .wpforms-field-label { order: 1; }
.casa-wpforms .casa-field > .wpforms-field-description { order: 2; }
.casa-wpforms .casa-field > label.wpforms-error,
.casa-wpforms .casa-field > em.wpforms-error { order: 3; }
.casa-wpforms .casa-field > * { order: 4; }
.casa-wpforms .wpforms-field-label { display: block; margin: 0; }
.casa-wpforms .wpforms-field-description { margin: 0; }
.casa-wpforms .casa-input--narrow { max-width: var(--size-280); }
.casa-wpforms .casa-input--medium { max-width: var(--size-360); }
.casa-wpforms textarea.casa-input { min-height: var(--size-140); resize: vertical; }
.casa-wpforms .wpforms-field-textarea textarea.wpforms-field-small { min-height: var(--size-96); }

/* Errors: the design's error message and the red input underline. */
.casa-wpforms label.wpforms-error,
.casa-wpforms em.wpforms-error {
	display: flex;
	margin: 0;
	font: var(--font-weight-semibold) var(--size-14) / var(--size-21) var(--font-sans);
	font-style: normal;
	color: var(--color-error);
}
.casa-wpforms .casa-input.wpforms-error { border-bottom-color: var(--color-error); background: var(--color-error-soft); }
.casa-wpforms .wpforms-error-container,
.casa-wpforms .wpforms-error-container-full { margin: 0 0 var(--size-24); padding: var(--size-16) var(--size-20); border-radius: var(--radius-12); background: var(--color-error-soft); color: var(--color-error); font-weight: var(--font-weight-semibold); }
.casa-wpforms .casa-errsum { margin: 0; }

/* Groups (cards): WPForms' section divider is the legend. */
.casa-wpforms .casa-wpf-cond { display: grid; gap: var(--size-24); }
.casa-wpforms .casa-wpf-cond:not(:has(> .casa-wpf-legend:not([style*="none"]))) { display: none; }
.casa-wpforms .casa-wpf-legend h3 { margin: 0; padding: 0; border: 0; font: var(--font-weight-regular) var(--size-19) / var(--size-26) var(--font-display); color: var(--color-text); }
.casa-wpforms .casa-pair > .wpforms-field { width: auto; float: none; margin: 0; }

/* Contact method: the design's pill choices. */
.casa-wpforms .wpforms-field-radio fieldset { margin: 0; padding: 0; border: 0; min-width: 0; display: grid; gap: var(--size-8); }
.casa-wpforms .wpforms-field-radio legend { padding: 0; }
.casa-wpforms .wpforms-field-radio ul { display: flex; flex-wrap: wrap; gap: var(--size-12); margin: 0; padding: 0; list-style: none; order: 4; }
.casa-wpforms .wpforms-field-radio li { position: relative; margin: 0; padding: 0; }
.casa-wpforms .wpforms-field-radio li input { position: absolute; opacity: 0; width: var(--size-1); height: var(--size-1); }
.casa-wpforms .wpforms-field-radio li label {
	display: inline-flex;
	align-items: center;
	min-height: var(--size-52);
	padding: 0 var(--size-24);
	border-radius: var(--radius-8);
	background: var(--color-bg);
	font: var(--font-weight-semibold) var(--size-15) / var(--size-22) var(--font-sans);
	color: var(--color-text);
	cursor: pointer;
}
.casa-wpforms .wpforms-field-radio li label:hover { background: var(--color-linen-hover); }
.casa-wpforms .wpforms-field-radio li:has(input:checked) label { background: var(--color-primary); color: var(--color-white); }
.casa-wpforms .wpforms-field-radio li:has(input:focus-visible) label { outline: var(--focus-width) solid var(--color-focus); outline-offset: var(--focus-offset); }

/* Photographs: WPForms' modern uploader as the design's drop area, with a "Choose photographs" button (wpforms.js). */
.casa-wpforms .wpforms-field-file-upload .wpforms-uploader {
	display: grid;
	justify-items: start;
	gap: var(--size-12);
	padding: var(--size-32);
	border: 0;
	border-radius: var(--radius-12);
	background: var(--color-card);
	text-align: left;
	cursor: pointer;
}
.casa-wpforms .wpforms-field-file-upload .wpforms-uploader .dz-message { display: grid; justify-items: start; gap: var(--size-12); width: 100%; margin: 0; text-align: left; }
.casa-wpforms .wpforms-field-file-upload .wpforms-uploader .dz-message .modern-title { text-align: left; }
.casa-wpforms .wpforms-field-file-upload .wpforms-uploader.dz-clickable { justify-content: start; justify-items: start; text-align: left; }
.casa-wpforms .wpforms-field-file-upload .wpforms-uploader .dz-preview { margin: 0; width: 100%; max-width: var(--size-360); text-align: left; }
.casa-wpforms .wpforms-field-file-upload .wpforms-uploader .dz-message > svg,
.casa-wpforms .wpforms-field-file-upload .wpforms-uploader .modern-hint { display: none; }
.casa-wpforms .wpforms-field-file-upload .wpforms-uploader .modern-title { font: inherit; }
.casa-wpforms .dz-preview { display: inline-grid; gap: var(--size-6); margin: var(--size-12) var(--size-12) 0 0; font-size: var(--size-14); }
.casa-wpforms .dz-preview img { width: var(--size-140); height: auto; border-radius: var(--radius-8); }
.casa-wpforms .dz-remove { color: var(--color-primary); font-weight: var(--font-weight-semibold); }

/* Privacy and reassurance before the button. */
.casa-wpforms .casa-wpf-privacy > div { display: grid; gap: var(--size-16); }

/* Navigation: Back as a link on the left, Continue / Skip / Send on the right. */
.casa-wpforms .wpforms-field-pagebreak > div,
.casa-wpforms .wpforms-submit-container {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-end;
	gap: var(--size-12);
	margin: var(--size-12) 0 0;
	padding: 0;
}
.casa-wpforms .wpforms-page-prev { margin-right: auto; order: -1; }
.casa-wpforms .casa-btn { border: 0; cursor: pointer; }
.casa-wpforms .wpforms-submit-container .wpforms-submit-spinner { display: none; }
.casa-wpforms .wpforms-submit-container.casa-wpf-submit-moved { margin: 0; }
.casa-wpforms .wpforms-submit-container.casa-wpf-submit-moved:not(:has(button:not([type="hidden"]))) { display: none; }

/* Phones: full-width buttons, Back underneath, as the design's form. */
@media (max-width: 767px) {
	.casa-wpforms .wpforms-field-pagebreak > div { flex-direction: column; align-items: stretch; }
	.casa-wpforms .wpforms-field-pagebreak .casa-btn { width: 100%; }
	.casa-wpforms .wpforms-page-prev { order: 1; margin-right: 0; align-self: flex-start; }
}