/* Mobile UX fixes layered over app.css (minified, no source). */

/* ==== header + floating (<=1023px, where app.css switches to the mobile header) ==== */
@media screen and (max-width: 1023px) {
	/* Hamburger button: app.css gives it width:26px + 16px side padding under border-box sizing, so it
	   collapses to 32px while its 26px icon span sits at left:16px -> icon pokes 10px past the viewport
	   (docW = vw + 10) and gets clipped. Give it a real 44px box and centre the icon inside it. */
	.header .header_inner .m_button {
		box-sizing: border-box;
		width: 44px;
		height: 56px;
		padding: 0;
		flex-shrink: 0;
	}
	.header .header_inner .m_button span {
		left: 0;
		right: 0;
	}

	/* "Book a Test Drive" icon link: its label is transparent text in a 42px box; "Test Drive" (nbsp, can't
	   wrap) overflows ~30px to the right and sits on top of the hamburger, so taps on the menu button
	   navigated to /book-a-test-drive/. Clip the invisible label to the icon's own box. */
	.header .header_inner .globalnav .type5 p a {
		overflow: hidden;
		width: 44px;
	}

	/* Back-to-top tab vs. Infobip live-chat bubble: app.css pins .local_navigater to the bottom-right
	   (top:100%; margin-top:-66px => bottom ~22px), directly under the Infobip chat bubble
	   (#ib-button-messaging: fixed, 60x60, right/bottom 20px). Lift the tab above the bubble with a
	   12px gap and widen it to a 44px tap target. Desktop (>=1024px) keeps the original mid-right
	   placement, which never collides with the bubble. */
	.local_navigater:not(.pc) {
		top: auto;
		bottom: calc(20px + 60px + 12px + env(safe-area-inset-bottom, 0px));
		margin-top: 0;
		width: 44px;
	}
	/* keep the icon flush with the right edge at the new 44px width (ul is 220px) */
	.local_navigater:not(.pc) ul {
		transform: translateX(-176px);
	}
}

/* ==== phones: logo, Formidable forms, footer search + footer links ==== */
@media screen and (max-width: 767px) {
	/* Logo: with the hamburger no longer overflowing off-screen, the fixed 200px logo collides with the
	   "Vehicles" toggle on narrow phones (<=400px). Let it shrink to the space left of the nav items. */
	.header .header_inner .title img {
		width: 200px;
		max-width: calc(100vw - 230px);
	}

	/* 16px form text so iOS Safari does not zoom on focus */
	.frm_forms input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
	.frm_forms select,
	.frm_forms textarea {
		font-size: 16px !important;
	}

	/* Stack every Formidable field in one full-width column (overrides frm_half / frm6 / frm4 grid spans) */
	.frm_forms form .frm_fields_container,
	.frm_forms form .frm_combo_inputs_container,
	.frm_forms form .frm_grid_container {
		grid-template-columns: minmax(0, 1fr) !important;
		column-gap: 0 !important;
	}
	/* Let fieldsets shrink below min-content (fixed 304px reCAPTCHA iframe otherwise widens every field) */
	.frm_forms fieldset {
		min-width: 0 !important;
	}
	.frm_forms .frm_form_field,
	.frm_forms .frm_combo_inputs_container > *,
	.frm_forms .frm_submit {
		grid-column: 1 / -1 !important;
		width: 100% !important;
		max-width: 100% !important;
		box-sizing: border-box !important;
		float: none !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	/* 44px tall text inputs / selects on phones */
	.frm_forms input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="submit"]):not([type="button"]),
	.frm_forms select {
		height: 44px !important;
	}

	/* Submit buttons: 44px tall hit area */
	.frm_forms .frm_submit button,
	.frm_forms .frm_submit input[type="submit"],
	.frm_forms .frm_button_submit {
		min-height: 44px !important;
		line-height: 44px !important;
		padding-top: 0 !important;
		padding-bottom: 0 !important;
		max-width: 100% !important;
	}
	/* Narrow phones: trim side padding so long labels (Trade-in submit) fit a ~229px form */
	.frm_forms .frm_submit .uk-button {
		padding-left: 16px !important;
		padding-right: 16px !important;
	}

	/* Checkbox / radio: ~22px visual, whole label row is a >= 44px hit area */
	.frm_forms .frm_checkbox label,
	.frm_forms .frm_radio label {
		display: flex !important;
		align-items: center;
		min-height: 44px;
		gap: 10px;
		text-indent: 0 !important;
		padding-left: 0 !important;
		cursor: pointer;
	}
	.frm_forms .frm_checkbox input[type="checkbox"],
	.frm_forms .frm_radio input[type="radio"] {
		flex: 0 0 auto;
		width: 22px !important;
		height: 22px !important;
		margin: 0 !important;
	}

	/* Footer search form: 16px text (no iOS zoom), 44px tall field + button */
	.search-form .search-field,
	.search-form .search-submit {
		font-size: 16px !important;
		height: 44px !important;
	}

	/* Footer bottom links (Contact Us / FAQ / Privacy Policy): 44px tap targets */
	.tjam-footer-bottom-list li > a {
		display: inline-flex;
		align-items: center;
		min-height: 44px;
		padding: 0 10px;
	}

	/* "Site created by Zipteq" credit link: 44px tap target */
	.brisko-footer-poweredby .creation a {
		display: inline-block;
		min-height: 44px;
		line-height: 44px;
		padding: 0 6px;
	}
}