/* SMS opt-in disclaimer block — Fluent Forms (client-injected) and Gravity
   Forms (native field, marked with the same tmb-sms-optin-field class on its
   .gfield wrapper) share this look so the two engines read consistently.

   THEME-AGNOSTIC BY DESIGN: every color here is derived from the form's own
   text color via `currentColor` / `inherit` and translucent overlays. The
   block must be legible on a white card (Toucan) AND on a dark brand panel
   (experigreen.com's green quote form) without per-site overrides — a
   hardcoded #555 on a dark green panel was unreadable. Never hardcode a
   text or border color in this file. */

.tmb-sms-optin-block,
.gfield.tmb-sms-optin-field {
	box-sizing: border-box;
	width: 100%;
	margin: 16px 0 14px;
	padding: 12px 14px;
	border: 1px solid;
	border-color: color-mix(in srgb, currentColor 22%, transparent);
	border-radius: 6px;
	background: color-mix(in srgb, currentColor 6%, transparent);
	color: inherit;
	clear: both;
}

/* Fallback for browsers without color-mix(): keep a subtle, neutral look
   that still inherits the text color (border/bg use opacity, not a hue). */
@supports not (color: color-mix(in srgb, red 50%, blue)) {
	.tmb-sms-optin-block,
	.gfield.tmb-sms-optin-field {
		border-color: rgba(127, 127, 127, 0.35);
		background: rgba(127, 127, 127, 0.08);
	}
}

.tmb-sms-optin-disclaimer,
.gfield.tmb-sms-optin-field .gfield_description {
	margin: 0 0 10px;
	font-size: 12px;
	line-height: 1.5;
	color: inherit;
	opacity: 0.9;
	text-align: left;
}

.tmb-sms-optin-disclaimer a,
.gfield.tmb-sms-optin-field .gfield_description a {
	color: inherit;
	text-decoration: underline;
	font-weight: 600;
}

.tmb-sms-optin-choice {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	margin: 0;
	font-size: 13px;
	line-height: 1.4;
	color: inherit;
	cursor: pointer;
	text-align: left;
}

.tmb-sms-optin-choice input[type="checkbox"] {
	flex: 0 0 auto;
	width: 16px;
	height: 16px;
	margin: 2px 0 0;
	accent-color: currentColor;
}

.tmb-sms-optin-choice span {
	color: inherit;
}
