/* ============================================================
   « Or get your results by email » form (assets/smc-measure.js,
   window.smcEmailCapture), under the main button of the QCM end card and of
   the quiz-funnel result card. Loaded only on a site that switched the form
   on (includes/measure.php). Same two layers as the cards:
   1. TOKENS under :where(), zero specificity. They default to the tokens of
      the card around the form (--qf-* for the module, --smc-qcm-* for the
      QCM), so the form follows a site palette without anything new to set.
   2. RULES scoped on .smc-lead.smc-lead with !important where themes leak
      (inputs, links, buttons: every button state declares its own
      background, some themes paint it on hover).
   ============================================================ */

/* 1. Tokens ----------------------------------------------------------- */
:where(.smc-lead) {
	--smc-lead-font: var(--qf-font, var(--smc-qcm-font, inherit));
	--smc-lead-fg: var(--qf-fg, var(--smc-qcm-fg, #14233a));
	--smc-lead-muted: var(--qf-muted, var(--smc-qcm-muted, #5b6b82));
	--smc-lead-line: var(--qf-line, var(--smc-qcm-line, #dde5f0));
	--smc-lead-field-bg: #ffffff;
	--smc-lead-button-bg: var(--qf-fg, var(--smc-qcm-fg, #14233a));
	--smc-lead-button-hover: color-mix(in srgb, var(--smc-lead-button-bg) 82%, #ffffff);
	--smc-lead-button-fg: #ffffff;
	--smc-lead-error: var(--qf-weak, var(--smc-qcm-wrong, #dc2626));
	--smc-lead-success: var(--smc-qcm-correct, #15803d);
	--smc-lead-radius: 12px;
}

/* 2. Rules ------------------------------------------------------------ */
.smc-lead.smc-lead,
.smc-lead.smc-lead * {
	box-sizing: border-box !important;
}
.smc-lead.smc-lead {
	margin: 18px 0 0 !important;
	padding: 16px 0 0 !important;
	border-top: 1px solid var(--smc-lead-line) !important;
	font-family: var(--smc-lead-font) !important;
	color: var(--smc-lead-fg) !important;
	text-align: left !important;
}
.smc-lead.smc-lead form {
	margin: 0 !important;
	padding: 0 !important;
	background: none !important;
	border: 0 !important;
}
.smc-lead.smc-lead p {
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: none !important;
	text-indent: 0 !important;
	letter-spacing: normal !important;
}
.smc-lead.smc-lead p::first-letter {
	float: none !important;
	font-size: inherit !important;
}
.smc-lead.smc-lead .smc-lead__title {
	margin: 0 0 10px !important;
	font-size: 15px !important;
	font-weight: 700 !important;
	line-height: 1.35 !important;
	color: var(--smc-lead-fg) !important;
}
.smc-lead.smc-lead .smc-lead__label {
	display: block !important;
	margin: 0 0 6px !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	color: var(--smc-lead-muted) !important;
}
.smc-lead.smc-lead .smc-lead__row {
	display: flex !important;
	flex-wrap: wrap;
	gap: 8px;
}
.smc-lead.smc-lead .smc-lead__input {
	flex: 1 1 200px;
	min-width: 0;
	height: 46px !important;
	margin: 0 !important;
	padding: 0 14px !important;
	font: 500 16px/1.2 var(--smc-lead-font) !important;
	color: #14233a !important;
	background: var(--smc-lead-field-bg) !important;
	border: 1px solid var(--smc-lead-line) !important;
	border-radius: var(--smc-lead-radius) !important;
	box-shadow: none !important;
}
.smc-lead.smc-lead .smc-lead__input:focus {
	outline: 2px solid var(--smc-lead-button-bg) !important;
	outline-offset: 1px;
}
.smc-lead.smc-lead .smc-lead__input[aria-invalid="true"] {
	border-color: var(--smc-lead-error) !important;
}
.smc-lead.smc-lead .smc-lead__button,
.smc-lead.smc-lead .smc-lead__button:visited {
	flex: 0 0 auto;
	height: 46px !important;
	margin: 0 !important;
	padding: 0 18px !important;
	font: 700 15px/1 var(--smc-lead-font) !important;
	color: var(--smc-lead-button-fg) !important;
	background: var(--smc-lead-button-bg) !important;
	border: 0 !important;
	border-radius: var(--smc-lead-radius) !important;
	box-shadow: none !important;
	text-transform: none !important;
	cursor: pointer !important;
}
.smc-lead.smc-lead .smc-lead__button:hover,
.smc-lead.smc-lead .smc-lead__button:focus-visible {
	color: var(--smc-lead-button-fg) !important;
	background: var(--smc-lead-button-hover) !important;
}
.smc-lead.smc-lead .smc-lead__button:disabled,
.smc-lead.smc-lead .smc-lead__button:disabled:hover {
	color: var(--smc-lead-button-fg) !important;
	background: var(--smc-lead-button-bg) !important;
	opacity: .6;
	cursor: progress !important;
}
.smc-lead.smc-lead .smc-lead__consent {
	margin: 8px 0 0 !important;
	font-size: 12px !important;
	line-height: 1.45 !important;
	color: var(--smc-lead-muted) !important;
}
.smc-lead.smc-lead a.smc-lead__privacy,
.smc-lead.smc-lead a.smc-lead__privacy:visited,
.smc-lead.smc-lead a.smc-lead__privacy:hover {
	color: inherit !important;
	background: none !important;
	text-decoration: underline !important;
	text-underline-offset: 2px;
}
.smc-lead.smc-lead .smc-lead__status {
	margin: 8px 0 0 !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	color: var(--smc-lead-muted) !important;
}
.smc-lead.smc-lead .smc-lead__status:empty {
	display: none !important;
}
.smc-lead.smc-lead .smc-lead__status.is-error {
	color: var(--smc-lead-error) !important;
}
.smc-lead.smc-lead .smc-lead__status.is-success {
	font-size: 15px !important;
	color: var(--smc-lead-success) !important;
}
