/*
 * WPForms theme — matches the Decoresmart static form design
 * (.contact-form tokens from site.css), tightened per client request:
 * compact row spacing, shorter Message textarea, navy button with a
 * deep-violet hover (#34104f).
 *
 * Scoped to the product-page quote module and the contact page form
 * column. Two-column rows come from the WPForms Pro Layout field
 * (preset 50-50); this sheet skins the fields and owns the geometry.
 */

.dec-quote-module .wpforms-container,
.contact-main .wpforms-container {
	--dec-wpf-gap: 18px;
	--dec-wpf-cols-gap: 15px;
}

.dec-quote-module .wpforms-container form,
.contact-main .wpforms-container form {
	display: grid;
	gap: var(--dec-wpf-gap);
}

/* WPForms gives every field its own vertical padding — zero it so row
 * spacing comes only from the grid gap above. */
.dec-quote-module .wpforms-container .wpforms-field,
.contact-main .wpforms-container .wpforms-field {
	padding: 0;
	margin: 0;
}

/* ── Layout field geometry (shared by product + contact forms) ── */

/* The Layout field renders an internal row heading — the design has none. */
.dec-quote-module .wpforms-field-layout > .wpforms-field-label,
.contact-main .wpforms-field-layout > .wpforms-field-label {
	display: none;
}

.dec-quote-module .wpforms-field-layout-columns,
.contact-main .wpforms-field-layout-columns {
	display: flex;
	flex-wrap: wrap;
	gap: var(--dec-wpf-cols-gap);
}

.dec-quote-module .wpforms-layout-column,
.contact-main .wpforms-layout-column {
	flex: 1 1 0;
	min-width: 0;
}

/* ── Fields ── */

.dec-quote-module .wpforms-field-label,
.contact-main .wpforms-field-label {
	display: block;
	color: #223e6c;
	font-size: 16px;
	font-weight: 600;
	margin: 0 0 9px;
	padding: 0;
}

.dec-quote-module .wpforms-field-label .wpforms-required-label,
.contact-main .wpforms-field-label .wpforms-required-label {
	color: #df3345;
}

.dec-quote-module .wpforms-field input,
.contact-main .wpforms-field input {
	width: 100%;
	border: 1px solid #99a0aa;
	border-radius: 3px;
	background: #fff;
	padding: 15px 20px;
	color: var(--ink, #19161b);
	font: 16px Manrope, sans-serif;
	outline: none;
	box-shadow: none;
	height: 60px;
	min-height: 0;
}

/* Message: fixed compact height (~2 text lines + padding). */
.dec-quote-module .wpforms-field textarea,
.contact-main .wpforms-field textarea {
	width: 100%;
	border: 1px solid #99a0aa;
	border-radius: 3px;
	background: #fff;
	padding: 15px 20px;
	color: var(--ink, #19161b);
	font: 16px Manrope, sans-serif;
	outline: none;
	box-shadow: none;
	height: 110px;
	min-height: 110px;
	resize: vertical;
}

.dec-quote-module .wpforms-field input:focus,
.dec-quote-module .wpforms-field textarea:focus,
.contact-main .wpforms-field input:focus,
.contact-main .wpforms-field textarea:focus {
	border-color: var(--violet, #522078);
	box-shadow: 0 0 0 3px rgba(82, 32, 120, 0.09);
}

.dec-quote-module input::placeholder,
.dec-quote-module textarea::placeholder,
.contact-main input::placeholder,
.contact-main textarea::placeholder {
	color: #8d9198;
}

.dec-quote-module .wpforms-error input,
.dec-quote-module .wpforms-error textarea,
.contact-main .wpforms-error input,
.contact-main .wpforms-error textarea {
	border-color: #df3345;
}

/* ── Submit: mirrors .contact-form button; hover = #34104f ── */
.dec-quote-module .wpforms-submit,
.contact-main .wpforms-submit {
	width: 100%;
	height: 59px;
	border: 0;
	border-radius: 3px;
	background: #223e6c;
	color: #fff;
	font: 700 15px/1 Manrope, sans-serif;
	text-transform: uppercase;
	letter-spacing: 0.02em;
	cursor: pointer;
	padding: 0 20px;
	box-shadow: none;
	text-shadow: none;
	transition: background 0.2s ease;
}

.dec-quote-module .wpforms-submit:hover,
.contact-main .wpforms-submit:hover,
.dec-quote-module .wpforms-submit:focus,
.contact-main .wpforms-submit:focus {
	background: #34104f;
	box-shadow: none;
}

/* Confirmation message */
.dec-quote-module .wpforms-confirmation-scroll,
.dec-quote-module .wpforms-confirmation-container-full,
.contact-main .wpforms-confirmation-scroll,
.contact-main .wpforms-confirmation-container-full {
	color: #223e6c;
	font-size: 16px;
}

@media (max-width: 600px) {
	.dec-quote-module .wpforms-field-layout-columns,
	.contact-main .wpforms-field-layout-columns {
		flex-direction: column;
	}
}