/*
 * Forms of the site (Fluent Forms, decisions.md, 2026-10-23), the look of
 * design A (contact-us.html, .p-form): visible labels, fields 48px tall
 * with a gray border, pairs of fields side by side from 640px, "(optional)"
 * in normal weight, muted hints, a 22px checkbox, the button at the start,
 * notes in the note style. The plugin's own look (fluentform-public-
 * default.css) is not loaded (functions.php); its layout file stays, so
 * the rules below are one class stronger than its ".fluentform .x" rules.
 * Required fields carry no asterisk, optional ones say "(optional)".
 * Loaded only where a form is on the page (functions.php).
 */

.fluentform {
	--fluentform-primary: var(--wp--preset--color--navy);
	--fluentform-secondary: var(--wp--preset--color--muted);
	--fluentform-danger: var(--wp--custom--color--error);
	--fluentform-border-color: var(--wp--custom--color--input-border);
	--fluentform-border-radius: var(--wp--preset--border-radius--small);
}

/* Screen reader text of the plugin (it lives in the file we do not load). */
.fluentform .ff-support-sr-only {
	clip: rect(0, 0, 0, 0);
	border: 0;
	block-size: 1px;
	inline-size: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	white-space: nowrap;
}

.fluentform .frm-fluent-form {
	max-inline-size: 44rem;
	margin: 0;
}

.fluentform .frm-fluent-form .ff-el-group {
	margin: 0 0 1.1rem;
}

.fluentform .frm-fluent-form .ff-t-container {
	gap: 0 1.1rem;
	margin: 0;
}

@media (min-width: 640px) {
	.fluentform .frm-fluent-form .ff-t-container:not(.has-conditions),
	.fluentform .frm-fluent-form .ff-t-container.ff_cond_v,
	.fluentform .frm-fluent-form .ff-t-container.mobile:not(.ff_excluded):not(.has-conditions) {
		display: grid !important;
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	}
}

.fluentform .frm-fluent-form .ff-el-input--label {
	margin: 0 0 0.35rem;
}

.fluentform .frm-fluent-form .ff-el-input--label label {
	display: block;
	margin: 0;
	font-weight: 600;
}

.fluentform .frm-fluent-form .ff-el-input--label.asterisk-right label::after {
	content: none;
}

.fluentform .frm-fluent-form .torqtek-form-opt {
	font-weight: 400;
}

.fluentform .frm-fluent-form .ff-el-form-control {
	box-sizing: border-box;
	inline-size: 100%;
	min-block-size: 48px;
	margin: 0;
	padding: 0.6rem 0.75rem;
	border: 1px solid var(--wp--custom--color--input-border);
	border-radius: var(--wp--preset--border-radius--small);
	background-color: var(--wp--preset--color--surface);
	color: inherit;
	font: inherit;
}

.fluentform .frm-fluent-form textarea.ff-el-form-control {
	min-block-size: 8rem;
	resize: vertical;
}

.fluentform .frm-fluent-form .ff-el-is-error .ff-el-form-control {
	border-color: var(--wp--custom--color--error);
}

.fluentform .frm-fluent-form .ff-el-help-message,
.fluentform .frm-fluent-form .torqtek-form-hint {
	margin: 0.35rem 0 0;
	color: var(--wp--preset--color--muted);
	font-size: 0.92rem;
	font-style: normal;
}

.fluentform .frm-fluent-form .ff-custom_html .torqtek-form-hint {
	margin: 0;
}

.fluentform .frm-fluent-form .text-danger {
	margin: 0.35rem 0 0;
	color: var(--wp--custom--color--error);
	font-size: 0.92rem;
}

/* "I have read the Privacy Policy": a 22px box beside the text (the plugin
   lays it out as a table row). */
.fluentform .frm-fluent-form .ff-el-tc {
	display: block;
}

.fluentform .frm-fluent-form .ff-el-tc label.ff_tc_label > span,
.fluentform .frm-fluent-form .ff-el-tc label.ff_tc_label > div {
	display: block;
	inline-size: auto;
	padding: 0 !important;
}

.fluentform .frm-fluent-form .ff-el-tc label.ff_tc_label,
.fluentform .frm-fluent-form .ff-el-form-check-label {
	display: flex;
	gap: 0.6rem;
	align-items: flex-start;
	margin: 0;
	font-weight: 400;
	cursor: pointer;
}

.fluentform .frm-fluent-form .ff-el-form-check-label .ff-el-form-check-input {
	flex: none;
	inline-size: 22px;
	block-size: 22px;
	margin: 0.15rem 0 0;
	top: 0;
}

.fluentform .frm-fluent-form .ff_submit_btn_wrapper {
	margin: 0;
}

.fluentform .frm-fluent-form .torqtek-form-submit {
	cursor: pointer;
}

/* Without JavaScript (functions.php): the same note, above the form. */
.torqtek-form-noscript {
	max-inline-size: 44rem;
	margin: 0 0 1.1rem;
	padding: 1rem 1.25rem;
	border-inline-start: 4px solid var(--wp--preset--color--navy);
	background-color: var(--wp--custom--color--note-bg);
}

/* After sending: the note style of design A (.p-done). */
.fluentform .ff-message-success {
	max-inline-size: 44rem;
	margin: 0;
	padding: 1rem 1.25rem;
	border: 0;
	border-inline-start: 4px solid var(--wp--preset--color--navy);
	box-shadow: none;
	background-color: var(--wp--custom--color--note-bg);
}

.fluentform .ff-message-success p {
	margin: 0;
}