/* ============================================================
   Grans Cash Four Cars — Fluent Forms styling
   Loaded ONLY on /get-offer (see functions.php).
   Scoped to body.gc-styled .ff-el-group etc. to match the design.
   ============================================================ */

body.gc-styled .fluentform .ff-el-group { margin-bottom: 20px; }

/* Labels — navy, bold */
body.gc-styled .fluentform .ff-el-input--label label,
body.gc-styled .fluentform .ff-el-input--label > label {
	color: var(--gc-navy);
	font-weight: 700;
	font-size: 15px;
	margin-bottom: 6px;
	display: inline-block;
}
body.gc-styled .fluentform .ff-el-is-required.asterisk-right > label:after {
	color: var(--gc-red);
}

/* Inputs / selects / textarea — light gray, 10px radius, min 48px, 16px text */
body.gc-styled .fluentform input[type="text"],
body.gc-styled .fluentform input[type="email"],
body.gc-styled .fluentform input[type="tel"],
body.gc-styled .fluentform input[type="number"],
body.gc-styled .fluentform input[type="url"],
body.gc-styled .fluentform select,
body.gc-styled .fluentform textarea {
	background: var(--gc-bg-light);
	border: 1px solid var(--gc-border);
	border-radius: 10px;
	min-height: 48px;
	padding: 12px 14px;
	font-size: 16px;            /* >=16px: no zoom-in on mobile tap */
	line-height: 1.4;
	color: var(--gc-text);
	width: 100%;
	box-shadow: none;
	transition: border-color .15s ease, box-shadow .15s ease;
}
body.gc-styled .fluentform textarea { min-height: 120px; resize: vertical; }

/* Placeholder */
body.gc-styled .fluentform ::placeholder { color: #8a93a6; opacity: 1; }

/* Clear focus outline */
body.gc-styled .fluentform input:focus,
body.gc-styled .fluentform select:focus,
body.gc-styled .fluentform textarea:focus {
	outline: none;
	border-color: var(--gc-navy);
	box-shadow: 0 0 0 3px rgba(31,58,106,0.18);
}

/* Radio options — readable, spaced, keyboard-visible focus */
body.gc-styled .fluentform .ff-el-form-check { margin: 6px 0; }
body.gc-styled .fluentform .ff-el-form-check-label { font-size: 16px; color: var(--gc-text); cursor: pointer; }
body.gc-styled .fluentform input[type="radio"],
body.gc-styled .fluentform input[type="checkbox"] { width: 18px; height: 18px; accent-color: var(--gc-red); margin-right: 8px; }
body.gc-styled .fluentform input[type="radio"]:focus-visible,
body.gc-styled .fluentform input[type="checkbox"]:focus-visible {
	outline: 2px solid var(--gc-navy); outline-offset: 2px;
}

/* Submit button — big red */
body.gc-styled .fluentform .ff-btn-submit,
body.gc-styled .fluentform .ff_submit_btn_wrapper button[type="submit"] {
	background: var(--gc-red) !important;
	color: #fff !important;
	border: 0 !important;
	border-radius: 10px !important;
	font-weight: 700;
	font-size: 17px;
	min-height: 54px;
	padding: 14px 34px;
	width: 100%;
	max-width: 420px;
	cursor: pointer;
	transition: background-color .15s ease, transform .05s ease;
}
body.gc-styled .fluentform .ff-btn-submit:hover { background: #b51f1f !important; }
body.gc-styled .fluentform .ff-btn-submit:focus-visible { outline: 3px solid var(--gc-navy); outline-offset: 2px; }

/* Validation error messages */
body.gc-styled .fluentform .error,
body.gc-styled .fluentform .text-danger,
body.gc-styled .fluentform .ff-el-is-error .text-danger {
	color: var(--gc-red);
	font-size: 14px;
	margin-top: 5px;
}
body.gc-styled .fluentform .ff-el-is-error input,
body.gc-styled .fluentform .ff-el-is-error textarea,
body.gc-styled .fluentform .ff-el-is-error select {
	border-color: var(--gc-red);
}

/* Small print under the button */
.gc-form-legal { font-size: 13px; color: var(--gc-muted); margin-top: 14px; line-height: 1.5; }
.gc-form-legal a { color: var(--gc-navy); text-decoration: underline; }

/* Side cards */
.gc-side-card {
	background: var(--gc-white);
	border: 1px solid var(--gc-border);
	border-top: 4px solid var(--gc-navy);
	border-radius: var(--gc-radius-card);
	box-shadow: var(--gc-shadow);
	padding: 24px 26px !important;
	margin-bottom: 20px;
}
.gc-side-card .elementor-heading-title { color: var(--gc-navy); }
.gc-phone-big a, a.gc-phone-big {
	font-size: 26px; font-weight: 800; color: var(--gc-navy); text-decoration: none; display: inline-block;
}
.gc-phone-big a:hover { color: var(--gc-red); }