/* ==========================================================================
   Elegance Car – WPForms styling (all forms)
   Loaded on every page by functions.php (child theme).
   Single source for form styling: do not copy these rules into
   Elementor templates or Additional CSS.

   The font is NOT set here: forms inherit the Body font from
   Elementor > Site Settings > Typography (Montserrat).
   Colours and sizes come from WPForms' own style settings where possible.
   ========================================================================== */

:root {
	--ec-orange: #ED4B11;
}

/* 1. Radio buttons (all forms)
   Orange ring, white gap, orange centre dot, drawn in one layer so the dot
   is always centred. WPForms' own dot (::after) is switched off. */
.wpforms-container-full .wpforms-form input[type="radio"]:checked::before {
	background: radial-gradient(circle closest-side, var(--ec-orange) 0 2.8px, #fff 3.2px);
	box-shadow: inset 0 0 0 2px var(--ec-orange);
}

.wpforms-container-full .wpforms-form input[type="radio"]:checked::after {
	display: none;
}

/* 2. Checkboxes (all forms)
   Orange box with a thin white tick that breaks slightly out of the top right. */
.wpforms-container-full .wpforms-form input[type="checkbox"]:checked::before {
	background-color: var(--ec-orange);
	box-shadow: 0 0 0 1px var(--ec-orange);
}

.wpforms-container-full .wpforms-form input[type="checkbox"]:checked::after {
	top: -9px;
	left: -2px;
	width: 22px;
	height: 22px;
	border: 0;
	transform: none;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 12.5 9.5 18 19.1 6.3' fill='none' stroke='%23fff' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
	filter: drop-shadow(0 1px 1px rgba(0, 0, 0, .3));
}

/* 3. Read-only fields (Service form: Inspection status)
   Keep the pre-selected answer fully visible instead of faded.
   !important is required: WPForms fades read-only fields with !important. */
.wpforms-container-full .wpforms-form .wpforms-field-readonly input[type="radio"] {
	opacity: 1 !important;
}

/* 4. Service form (12792): titles
   Lighter than WPForms' bold: field titles semi-bold (600), "Step 1 of 4" medium (500).
   Field titles one size smaller: WPForms' smallest label size is 14px,
   so they use WPForms' own next size down (13px).
   "Step 1 of 4" at 15px as the form heading, with a little more space
   between the progress bar and the first question.
   Field titles are typed in capitals in WPForms (no CSS needed).
   WPForms has no font-weight setting; the font (Montserrat) comes from Site Settings. */
#wpforms-12792 .wpforms-field-label:not(.wpforms-field-label-inline) {
	font-size: var(--wpforms-label-size-sublabel-font-size);
	line-height: var(--wpforms-label-size-sublabel-line-height);
	font-weight: 600;
}

#wpforms-12792 .wpforms-page-indicator,
#wpforms-12792 .wpforms-page-indicator * {
	font-weight: 500;
}

#wpforms-12792 .wpforms-page-indicator {
	margin-bottom: 15px;
}

#wpforms-12792 .wpforms-page-indicator-steps {
	font-size: 15px;
	line-height: 18px;
}

/* 5. Service form (12792): "Inspection status: read-only" on one line
   "read-only" is the field description in WPForms (translated with WPML),
   moved before the choices by functions.php, then placed beside the label here. */
#wpforms-12792-field_53-container legend.wpforms-field-label {
	float: left;
	margin: 0 .3em 10px 0;
}

#wpforms-12792-field_53-container .wpforms-field-description {
	margin: 0 0 10px;
	font-size: var(--wpforms-label-size-sublabel-font-size);
	line-height: var(--wpforms-label-size-sublabel-line-height);
	color: var(--ec-orange);
	font-weight: 500;
}

#wpforms-12792-field_53-container ul {
	clear: both;
}