/*
 * Repair booking form.
 *
 * Lifted verbatim out of the Elementor HTML widget on page 16590, where it was
 * ~280 lines of <style> shipped inside the page content on every render. As a real
 * stylesheet it is cached, minified by LiteSpeed with everything else, and shared by
 * every brand site instead of being copied into each one.
 *
 * Selectors are unchanged so the form looks identical to the one it replaces.
 */

.custom-submit-form {
	padding: 5px 15px;
}

#crmWebToEntityForm {
	background-color: #fff;
	padding: 30px;
	border-radius: 8px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, .05);
	max-width: 900px;
	margin: 20px auto;
	box-sizing: border-box;
	color: #333;
	border-top: 5px solid #C12C26;
}

#crmWebToEntityForm * {
	box-sizing: border-box;
}

.zcwf_title {
	font-size: 24px;
	font-weight: 600;
	margin-bottom: 25px;
	color: #111;
	font-family: Arial, sans-serif;
}

.form-section-title {
	font-size: 16px;
	font-weight: 600;
	color: #000;
	margin-top: 25px;
	margin-bottom: 15px;
	border-bottom: 1px solid #e0e0e0;
	padding-bottom: 8px;
	width: 100%;
}

/* Rows and columns. col-N is "N across on a wide screen"; each still collapses
   on its own min-width, which is what makes the form usable on a phone. */
.form-row {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	margin-bottom: 15px;
}

.form-row .col-4 { flex: 1; min-width: 140px; }
.form-row .col-3 { flex: 1; min-width: 150px; }
.form-row .col-2 { flex: 1; min-width: 200px; }
.form-row .col-1 { width: 100%; }

.form-group {
	display: flex;
	flex-direction: column;
	width: 100%;
}

#crmWebToEntityForm ::placeholder { color: #888; opacity: 1; }
#crmWebToEntityForm :-ms-input-placeholder { color: #888; }
#crmWebToEntityForm ::-ms-input-placeholder { color: #888; }

.form-group select.zcwf_col_fld_slt option[value=''] { color: #888; }
.form-group select.zcwf_col_fld_slt option { color: #000; }

.form-group label {
	font-size: 13px;
	font-weight: 600;
	color: #333;
	margin-bottom: 6px;
	font-family: Arial, sans-serif;
}

.form-group input[type='text'],
.form-group input[type='email'],
.form-group input[type='tel'],
.form-group textarea,
.form-group select.zcwf_col_fld_slt {
	width: 100%;
	padding: 10px 12px;
	border: 1px solid #d0d5dd;
	border-radius: 6px;
	font-size: 14px;
	transition: all .2s ease;
	background-color: #fff;
}

.form-group input:focus,
.form-group textarea:focus,
.form-group select:focus {
	outline: none;
	border-color: #C12C26;
	box-shadow: 0 0 0 3px rgba(193, 44, 38, .12);
}

.form-group textarea {
	resize: vertical;
	min-height: 90px;
}

/* The honeypot. Positioned off-screen rather than display:none, because some bots
   skip hidden inputs and this one is meant to be filled in. */
.lix-hp {
	position: absolute !important;
	left: -9999px !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.zcwf_button_row {
	margin-top: 25px;
	display: flex;
	gap: 12px;
	align-items: center;
}

.zcwf_button {
	padding: 11px 26px;
	border-radius: 6px;
	border: 1px solid #C12C26;
	background: #C12C26;
	color: #fff;
	font-size: 15px;
	font-weight: 600;
	cursor: pointer;
	line-height: 1.2;
}

.zcwf_button[type='reset'] {
	background: #fff;
	color: #C12C26;
}

.zcwf_button:disabled {
	opacity: .6;
	cursor: default;
}

.lix-form-error {
	display: none;
	margin-top: 16px;
	padding: 12px 14px;
	border-radius: 6px;
	background: #fdecea;
	border: 1px solid #f3b6b2;
	color: #8c211c;
	font-size: 14px;
}

#thankYouMessageWrapper {
	display: none;
}

/* Ticket 09 -- wizard indicator, wait spinner, reference reveal. */

.lix-wizard-step {
	display: inline-block;
	margin-bottom: 18px;
	padding: 6px 14px;
	border-radius: 999px;
	background: #f4f1ea;
	color: #6e3609;
	font-size: 13px;
	font-weight: 600;
	font-family: Arial, sans-serif;
}

.lix-spinner {
	width: 32px;
	height: 32px;
	margin: 18px 0;
	border: 3px solid #e0e0e0;
	border-top-color: #C12C26;
	border-radius: 50%;
	animation: lix-spin 0.8s linear infinite;
}

@keyframes lix-spin {
	to { transform: rotate(360deg); }
}

.lix-wait-fallback {
	color: #6e3609;
	font-size: 13px;
}

.lix-reference-code {
	font-size: 32px;
	font-weight: 700;
	letter-spacing: .04em;
	color: #C12C26;
	font-family: Arial, sans-serif;
	margin: 4px 0 16px;
}

.lix-reference-summary {
	margin-bottom: 16px;
	font-size: 14px;
}

.lix-reference-summary ul {
	margin: 6px 0 0;
	padding-left: 20px;
}

