/* My Car's Story — site styles loaded by the mycarsstory-site plugin.
   Order form (Gravity Form 2) on the dark site: light text, dark fields, red accents. */

#gform_wrapper_2 {
	--mcs-ink: #f3f5f7;
	--mcs-muted: #aeb8c0;
	--mcs-field: #0e1115;
	--mcs-line: #3a444e;
	--mcs-red: #c8102e;
	--mcs-red-hot: #e3263f;
	color: var(--mcs-ink);
	font-family: "Barlow", "Segoe UI", sans-serif;
	font-size: 17px;
}

/* Section headings */
#gform_wrapper_2 .gsection {
	border-bottom: 2px solid var(--mcs-red);
	padding: 0 0 8px;
	margin-top: 34px;
}
#gform_wrapper_2 .gsection_title {
	color: var(--mcs-ink);
	font-family: "Oswald", "Arial Narrow", sans-serif;
	font-weight: 600;
	font-size: 24px;
	letter-spacing: 0.5px;
	text-transform: uppercase;
	margin: 0;
}
#gform_wrapper_2 .gsection_description { color: var(--mcs-muted); margin-top: 6px; }

/* Labels, sub-labels, hints */
#gform_wrapper_2 .gfield_label,
#gform_wrapper_2 legend.gfield_label {
	color: var(--mcs-ink);
	font-weight: 600;
	font-size: 16px;
}
#gform_wrapper_2 .gfield_required { color: var(--mcs-red-hot); }
#gform_wrapper_2 .ginput_complex label,
#gform_wrapper_2 .gform-field-label--type-sub { color: var(--mcs-muted); font-size: 13px; }
#gform_wrapper_2 .gfield_description,
#gform_wrapper_2 .gform_description { color: var(--mcs-muted); font-size: 14.5px; line-height: 1.45; }
#gform_wrapper_2 .gform_title { color: var(--mcs-ink); }

/* Text inputs, text areas, selects */
#gform_wrapper_2 input[type="text"],
#gform_wrapper_2 input[type="email"],
#gform_wrapper_2 input[type="tel"],
#gform_wrapper_2 input[type="number"],
#gform_wrapper_2 input[type="url"],
#gform_wrapper_2 textarea,
#gform_wrapper_2 select {
	background: var(--mcs-field);
	color: var(--mcs-ink);
	border: 1px solid var(--mcs-line);
	border-radius: 4px;
	padding: 10px 12px;
	font-size: 16px;
	line-height: 1.4;
}
#gform_wrapper_2 input::placeholder,
#gform_wrapper_2 textarea::placeholder { color: #6d7881; opacity: 1; }
#gform_wrapper_2 input:focus,
#gform_wrapper_2 textarea:focus,
#gform_wrapper_2 select:focus {
	outline: none;
	border-color: var(--mcs-red-hot);
	box-shadow: 0 0 0 2px rgba(227, 38, 63, 0.35);
}

/* Radios and checkboxes */
#gform_wrapper_2 .gchoice label,
#gform_wrapper_2 .gfield_radio label,
#gform_wrapper_2 .gfield_checkbox label { color: var(--mcs-ink); font-size: 16px; }
#gform_wrapper_2 input[type="radio"],
#gform_wrapper_2 input[type="checkbox"] { accent-color: var(--mcs-red); }

/* List fields (specs, equipment, slogans) */
#gform_wrapper_2 .gfield_list_header,
#gform_wrapper_2 .gform-field-label--type-inline { color: var(--mcs-muted); }
#gform_wrapper_2 .gfield_list_icons img,
#gform_wrapper_2 .add_list_item,
#gform_wrapper_2 .delete_list_item { filter: invert(1) brightness(1.4); }

/* Photo upload drop zone */
#gform_wrapper_2 .gform_drop_area {
	background: var(--mcs-field);
	border: 2px dashed var(--mcs-line);
	border-radius: 6px;
	color: var(--mcs-muted);
	padding: 24px;
}
#gform_wrapper_2 .gform_drop_instructions { color: var(--mcs-ink); }
#gform_wrapper_2 .ginput_preview { color: var(--mcs-ink); }
#gform_wrapper_2 .gform_button_select_files,
#gform_wrapper_2 input.button.gform_button_select_files {
	background: transparent;
	color: var(--mcs-ink);
	border: 1px solid var(--mcs-ink);
	border-radius: 3px;
	padding: 8px 14px;
	cursor: pointer;
}

/* Errors */
#gform_wrapper_2 .validation_message,
#gform_wrapper_2 .gform_validation_errors,
#gform_wrapper_2 .validation_error { color: #ffb4bd; }
#gform_wrapper_2 .gform_validation_errors { background: #3a1c1f; border: 1px solid var(--mcs-red); border-radius: 4px; }

/* Submit */
#gform_wrapper_2 .gform_footer input[type="submit"],
#gform_wrapper_2 .gform_footer button {
	background: var(--mcs-red);
	color: #fff;
	border: 0;
	border-radius: 3px;
	padding: 16px 30px;
	font-family: "Oswald", "Arial Narrow", sans-serif;
	font-weight: 500;
	font-size: 16px;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	cursor: pointer;
}
#gform_wrapper_2 .gform_footer input[type="submit"]:hover,
#gform_wrapper_2 .gform_footer button:hover { background: var(--mcs-red-hot); }
@media (max-width: 640px) {
	#gform_wrapper_2 .gform_footer input[type="submit"] { width: 100%; }
}

/* Confirmation message */
#gform_confirmation_wrapper_2,
#gform_confirmation_message_2 { color: var(--mcs-ink); font-size: 18px; }