/* Skin for the real FluentForms so they read as the designs they replaced.
   Two shells use them:
     .mev-card inside .mev-lv  -> contact page, tokens are HSL triplets
     .cnd-inquiry-form         -> catering page, tokens are whole oklch() colours
   FluentForms puts every field inside a <fieldset>, so the grid belongs there, not on <form>. */

/* ---------- shared reset ---------- */
.mev-lv .fluentform,
.mev-lv .fluentform form,
.cnd-inquiry-form .fluentform,
.cnd-inquiry-form .fluentform form { margin: 0; }
.mev-lv .fluentform fieldset,
.cnd-inquiry-form .fluentform fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
.mev-lv .fluentform .ff-el-group,
.cnd-inquiry-form .fluentform .ff-el-group { margin-bottom: 0; }
/* honeypot stays in the DOM but must not take a grid cell */
.mev-lv .fluentform .ff-hpsf-container,
.cnd-inquiry-form .fluentform .ff-hpsf-container { display: none; }

/* ---------- contact card ---------- */
.mev-lv .fluentform fieldset {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1rem;
	align-items: start;
}
.mev-lv .fluentform fieldset > .ff-el-group:has(textarea),
.mev-lv .fluentform fieldset > .ff_submit_btn_wrapper,
.mev-lv .fluentform fieldset > .ff-el-group:has(.ff-el-form-check) { grid-column: 1 / -1; }
.mev-lv .fluentform .ff-el-input--label label {
	display: block;
	font-size: .72rem;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: hsl(var(--muted-foreground));
	margin-bottom: .4rem;
}
.mev-lv .fluentform .ff-el-form-control {
	width: 100%;
	border: 1px solid hsl(var(--border));
	border-radius: 8px;
	padding: .7rem .85rem;
	font-size: .95rem;
	font-family: inherit;
	line-height: 1.4;
	background: hsl(var(--background));
	color: hsl(var(--foreground));
	box-shadow: none;
	height: auto;
}
.mev-lv .fluentform textarea.ff-el-form-control { min-height: 120px; resize: vertical; }
.mev-lv .fluentform .ff-el-form-control:focus {
	outline: none;
	border-color: hsl(var(--primary));
	box-shadow: 0 0 0 3px hsl(var(--primary) / .12);
}
.mev-lv .fluentform .ff-btn-submit {
	border-radius: 999px;
	background: hsl(var(--primary));
	color: hsl(var(--primary-foreground));
	padding: .85rem 1.9rem;
	font-size: .95rem;
	font-weight: 600;
}
.mev-lv .fluentform .ff-btn-submit:hover {
	transform: translateY(-2px);
	box-shadow: var(--shadow-soft);
	background: hsl(var(--primary-glow));
}
.mev-lv .fluentform .ff-el-is-error .ff-el-form-control { border-color: hsl(var(--destructive)); }
.mev-lv .fluentform .error.text-danger { color: hsl(var(--destructive)); }
.mev-lv .fluentform .ff-message-success {
	border: 1px solid hsl(var(--border));
	background: hsl(var(--card));
	color: hsl(var(--foreground));
}

/* ---------- catering enquiry card ---------- */
.cnd-inquiry-form .fluentform fieldset {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1.25rem;
	align-items: start;
}
.cnd-inquiry-form .fluentform fieldset > .ff-el-group:has(textarea),
.cnd-inquiry-form .fluentform fieldset > .ff_submit_btn_wrapper { grid-column: 1 / -1; }
.cnd-inquiry-form .fluentform .ff-el-input--label label {
	display: block;
	margin-bottom: .375rem;
	font-size: .75rem;
	font-weight: 500;
	letter-spacing: .15em;
	text-transform: uppercase;
	color: var(--muted-foreground);
}
.cnd-inquiry-form .fluentform .ff-el-form-control {
	width: 100%;
	border: 1px solid var(--border);
	border-radius: .75rem;
	background: var(--cream);
	padding: .75rem 1rem;
	font-family: inherit;
	font-size: .875rem;
	line-height: 1.4;
	color: var(--primary);
	box-shadow: none;
	height: auto;
	transition: border-color .2s, box-shadow .2s;
}
.cnd-inquiry-form .fluentform textarea.ff-el-form-control { min-height: 118px; resize: vertical; }
.cnd-inquiry-form .fluentform .ff-el-form-control:focus {
	outline: none;
	border-color: var(--coral);
	box-shadow: 0 0 0 2px color-mix(in oklab, var(--coral) 20%, transparent);
}
.cnd-inquiry-form .fluentform .ff-btn-submit {
	width: 100%;
	border-radius: 999px;
	background: var(--primary);
	color: var(--primary-foreground);
	padding: 1rem 1.75rem;
	font-size: .875rem;
	font-weight: 500;
}
.cnd-inquiry-form .fluentform .ff-btn-submit:hover {
	transform: translateY(-2px);
	box-shadow: 0 18px 40px -18px color-mix(in oklab, var(--primary) 55%, transparent);
}
.cnd-inquiry-form .fluentform .ff-el-is-error .ff-el-form-control { border-color: var(--destructive); }
.cnd-inquiry-form .fluentform .error.text-danger { color: var(--destructive); }
.cnd-inquiry-form .fluentform .ff-message-success {
	border: 1px solid var(--border);
	background: var(--card);
	color: var(--foreground);
	border-radius: .75rem;
	padding: 1.25rem 1.4rem;
}

/* ---------- shared button and message shape ---------- */
.mev-lv .fluentform .ff-btn-submit,
.cnd-inquiry-form .fluentform .ff-btn-submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .5rem;
	border: 0;
	font-family: inherit;
	cursor: pointer;
	transition: transform .25s ease, box-shadow .25s ease, background .25s ease;
}
.mev-lv .fluentform .error.text-danger,
.cnd-inquiry-form .fluentform .error.text-danger { font-size: .78rem; margin-top: .3rem; }
.mev-lv .fluentform .ff-message-success,
.cnd-inquiry-form .fluentform .ff-message-success { border-radius: .75rem; padding: 1.25rem 1.4rem; }
/* the captcha and any stack error sit below the grid, full width */
.mev-lv .fluentform .cf-turnstile,
.mev-lv .fluentform .ff-errors-in-stack,
.cnd-inquiry-form .fluentform .cf-turnstile,
.cnd-inquiry-form .fluentform .ff-errors-in-stack { margin-top: 1rem; }

@media (max-width: 640px) {
	.mev-lv .fluentform fieldset,
	.cnd-inquiry-form .fluentform fieldset { grid-template-columns: 1fr; }
}