/**
 * QA batch 2026-07-16 — BugHerd #678 (mobile search) + #698 (SKU tel-link styling).
 * Companion to includes/mobile-search-and-sku-fixes.php.
 */

/* #698 — neutralise iOS auto-detected tel: links on product SKUs (scoped to SKU only). */
.sku a,
.sku_wrapper a,
.product_meta .sku a {
	color: inherit;
	text-decoration: none;
	pointer-events: none;
}

/* #678 — mobile only, so desktop search is unchanged. */
@media (max-width: 767px) {
	/* (a) 16px kills iOS Safari's focus auto-zoom. !important because a higher-specificity
	   rule computes the input to 14px (verified via getComputedStyle on DEV, 2026-07-18),
	   which is under the 16px threshold and re-triggers the zoom. */
	.swp-input,
	.swp-input--search,
	input.swp-input {
		font-size: 16px !important;
	}

	/* (b) fixed 315px live-search dropdown overflowed narrow screens — make it fit. */
	.searchwp-live-search-results {
		width: auto;
		min-width: 0;
		max-width: calc(100vw - 32px);
	}

	/* (c) BugHerd #678 (Laura) — shrink the live-search result FONTS only so the dropdown is
	   easier to scan on a phone (SearchWP defaults: title 1.1em, desc 0.9em, price 1em). We do
	   NOT touch the row's flex geometry — overriding --img/--info flex made the title wrap under
	   the thumbnail (regression, reverted). Smaller fonts reduce content width, so they can only
	   help wrapping, never cause it. Scoped under .searchwp-live-search-results for specificity. */
	.searchwp-live-search-results .searchwp-live-search-result--title,
	.searchwp-live-search-results .searchwp-live-search-result--title a {
		font-size: 13px;
		line-height: 1.3;
	}
	.searchwp-live-search-results .searchwp-live-search-result--desc {
		font-size: 11px;
		line-height: 1.3;
	}
	.searchwp-live-search-results .searchwp-live-search-result--ecommerce * {
		font-size: 12px;
	}

	/* Keep each result on ONE line (thumbnail left, title/price right). SearchWP's default
	   flex-wrap:wrap stacks the title under the thumbnail at mobile width; nowrap + min-width:0
	   lets the info column shrink (it already has overflow:hidden + ellipsis) instead of wrapping. */
	.searchwp-live-search-results .searchwp-live-search-result {
		flex-wrap: nowrap;
	}
	.searchwp-live-search-results .searchwp-live-search-result--info {
		min-width: 0;
	}

	/* Cart flyout close target (Tif, 2026-07-18) — the UAEL mini-cart off-canvas
	   close (X) is a 22x22 hit area, too small to tap reliably on a phone (users
	   could only dismiss it by tapping the overlay). Grow the tappable area to
	   ~44px (Apple touch-target guidance); the icon stays centred. Site-wide. */
	.uael-mc-offcanvas__close-btn {
		min-width: 44px;
		min-height: 44px;
		display: flex;
		align-items: center;
		justify-content: center;
		cursor: pointer;
		touch-action: manipulation;
	}
}
