/* CA Pardot Relay: 1:1 restyle of the Pardot "Request a Demo" iframe form.
   Values copied from the Pardot layout template + form.css (2026-09-03). */

/* The iframe box was 100% x 350px with an 8px body margin; keep the same footprint. */
.ca-pardot-code .wpforms-container.ca-pardot-form {
	min-height: 350px;
	padding: 8px;
	box-sizing: border-box;
	margin: 0 0 12.09px;      /* the inline <iframe> left a 12.09px descender gap below it */
	max-width: none;
}
.ca-pardot-form form.wpforms-form {
	margin: 0 auto !important;
	max-width: 700px !important;
	box-sizing: border-box;
	padding: 6.5px;           /* form.form { padding: .5em } at 13px */
	color: #666;
	font: 100%/120% Tahoma, Arial, Helvetica, Verdana, sans-serif;
	font-size: 13px;
	line-height: 1.4em;       /* form.form p */
}
.ca-pardot-form .wpforms-field-container {
	display: block;
	font-size: 0;   /* kill inline-block whitespace gaps; the 3.63px gutter below is explicit */
}

/* Labels are removed in the iframe (placeholders only). */
.ca-pardot-form .wpforms-field-label,
.ca-pardot-form .wpforms-field-hidden,
.ca-pardot-form .wpforms-submit-spinner,
.ca-pardot-form .wpforms-conditional-hide { display: none !important; }

/* Field blocks: p.form-field */
.ca-pardot-form .wpforms-field {
	margin: 3px 0 !important;
	padding: 0 !important;
	width: calc(50% - 2.25px) !important;
	display: inline-block;
	vertical-align: top;
	box-sizing: border-box;
	clear: none;
}
.ca-pardot-form .wpforms-field.ca-full { width: 100% !important; }
/* inline-block whitespace gap between the paired fields in the iframe (Tahoma 13px space) */
.ca-pardot-form .wpforms-field.ca-first { margin-right: 3.63px !important; }

/* Inputs / selects */
.ca-pardot-form .wpforms-field input[type="text"],
.ca-pardot-form .wpforms-field input[type="email"],
.ca-pardot-form .wpforms-field input[type="tel"],
.ca-pardot-form .wpforms-field select {
	font-family: 'Work Sans', sans-serif;
	line-height: 1.5em;
	font-size: 12px;
	font-weight: 400;
	background-color: #f1f1f1;
	color: #666;
	border: none;
	border-radius: 0;
	width: 100%;
	max-width: none;
	height: 40px;
	min-height: 0;
	box-sizing: border-box;
	padding: 8px !important;
	margin: 0;
	box-shadow: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}
.ca-pardot-form .wpforms-field select {
	/* FontAwesome 4.7 chevron-down (\f078), 12px, #666, 8px from the right */
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1792 1792'%3E%3Cpath fill='%23666666' d='M1683 808l-742 741q-19 19-45 19t-45-19L109 808q-19-19-19-45.5t19-45.5l166-165q19-19 45-19t45 19l531 531 531-531q19-19 45-19t45 19l166 165q19 19 19 45.5t-19 45.5z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 8px center;
	background-size: 12px 12px;
	padding-right: 26px !important;
	cursor: pointer;
}
.ca-pardot-form .wpforms-field select option { margin: 0; padding: 0 .3em; color: #666; }
.ca-pardot-form .wpforms-field select option.placeholder { color: #666; }

/* Validation messages: form.form span.error / p.errors */
.ca-pardot-form label.wpforms-error,
.ca-pardot-form em.wpforms-error {
	display: block;
	margin: 2px .2em 0 !important;
	padding: 0 !important;
	color: red !important;
	font-size: 10px !important;
	font-family: 'Work Sans', sans-serif;
	font-weight: 600 !important;
	font-style: normal;
	line-height: 1.5em;
}
.ca-pardot-form .ca-errors-header,
.ca-pardot-form .wpforms-error-container {
	display: block;
	width: 98%;
	font-size: 10px !important;
	background: transparent !important;
	color: red !important;
	margin: 3px 0 2em !important;
	padding: 3px 2px;
	line-height: 1.4em;
}

/* Submit: p.submit + input[type=submit] */
.ca-pardot-form .wpforms-submit-container {
	margin: 20px 0 !important;
	padding: 0;
	width: 100% !important;
	text-align: center;
}
.ca-pardot-form button.wpforms-submit {
	font-family: 'Work Sans', sans-serif;
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.15em;
	color: #ffffff;
	background-color: #dd4f26;
	background-image: none;
	border: 2px solid #dd4f26;
	border-radius: 24px;
	line-height: 1.15;
	display: block;
	width: auto;
	height: auto;
	margin: 0 auto !important;
	padding: 14px 14px 13px !important;
	cursor: pointer;
	box-shadow: none;
	text-shadow: none;
	transition: background .4s, color .4s;
	-webkit-appearance: none;
	appearance: none;
}
.ca-pardot-form button.wpforms-submit:hover,
.ca-pardot-form button.wpforms-submit:focus {
	color: #dd4f26;
	background-color: #ffffff;
	border-color: #dd4f26;
}

/* Loader that replaces the button while the AJAX relay runs (.lds-facebook) */
.ca-pardot-form .lds-facebook {
	display: inline-block;
	position: relative;
	width: 40px;
	height: 40px;
	margin: 0 auto;
}
.ca-pardot-form .lds-facebook div {
	display: inline-block;
	position: absolute;
	left: 4px;
	width: 8px;
	background: #e45750;
	animation: ca-lds-facebook 1.2s cubic-bezier(0, 0.5, 0.5, 1) infinite;
}
.ca-pardot-form .lds-facebook div:nth-child(1) { left: 4px;  animation-delay: -0.24s; }
.ca-pardot-form .lds-facebook div:nth-child(2) { left: 16px; animation-delay: -0.12s; }
.ca-pardot-form .lds-facebook div:nth-child(3) { left: 28px; animation-delay: 0; }
@keyframes ca-lds-facebook {
	0%        { top: 4px;  height: 32px; }
	50%, 100% { top: 12px; height: 16px; }
}

/* Confirmation: mirrors the Pardot thank-you content rendered inside form.form
   (13px/120% Tahoma strut under an inline 100px image, then a centred h3). */
.ca-pardot-form .wpforms-confirmation-container-full,
.ca-pardot-form .wpforms-confirmation-container {
	margin: 0 auto;
	max-width: 700px;
	padding: 6.5px;
	box-sizing: border-box;
	background: transparent;
	border: 0;
	color: #666;
	font: 100%/120% Tahoma, Arial, Helvetica, Verdana, sans-serif;
	font-size: 13px;
	text-align: start;
}
.ca-pardot-form .wpforms-confirmation-container p { margin: 0; padding: 0; display: inline; }
/* Pardot's markup uses the generic .container class, which Divi styles
   (#main-content .container { padding-top: 58px; width: 80%; max-width: 1080px; margin: auto }). */
.ca-pardot-form .wpforms-confirmation-container .container,
.ca-pardot-form .wpforms-confirmation-container .vertical-center {
	display: block !important;
	position: static !important;
	text-align: start !important;
	margin: 0 !important;
	padding: 0 !important;
	width: auto !important;
	max-width: none !important;
	min-height: 0 !important;
}
.ca-pardot-form .wpforms-confirmation-container .container::before,
.ca-pardot-form .wpforms-confirmation-container .container::after { display: none !important; content: none !important; }
.ca-pardot-form .wpforms-confirmation-container img {
	display: inline;
	width: 100px;
	height: 100px;
	max-width: none;
	margin: 0;
	padding: 0;
	vertical-align: baseline;
	border: 0;
}
.ca-pardot-form .wpforms-confirmation-container h3 {
	font-family: 'Work Sans', sans-serif;
	font-size: 24px;
	font-weight: 700;
	line-height: 1.5em;
	color: #666;
	margin: 24px 0;
	padding: 0;
	text-align: center;
	letter-spacing: normal;
	text-transform: none;
}

/* Force fields to full width on mobile */
@media only screen and (max-width: 450px) {
	.ca-pardot-form .wpforms-field { width: 100% !important; }
}