/* Mobile storefront: readable controls, reachable actions and uncluttered panels. */
.moto22-mobile-purchase { display: none; }

@media (max-width: 62rem) {
	.site-header__inner { column-gap: 1rem; }
	.single-product .commerce-main { padding-block: 1.5rem 2.5rem; }
	.single-product div.product div.images,
	.single-product div.product div.summary {
		float: none;
		width: 100%;
		margin-bottom: 1.25rem;
	}
	.single-product .woocommerce-product-gallery img {
		max-height: 65vh;
		object-fit: contain;
	}
	/* Outrank WooCommerce's .woocommerce div.product div.images overflow reset. */
	.single-product div.product div.images.woocommerce-product-gallery .flex-control-thumbs {
		display: flex;
		flex-wrap: nowrap;
		gap: .5rem;
		width: 100%;
		max-width: 100%;
		overflow-x: auto;
		overflow-y: hidden;
		padding-block: .5rem;
		scroll-snap-type: x proximity;
		scrollbar-width: thin;
		scrollbar-color: #837c72 #f1eee7;
	}
	.single-product div.product div.images.woocommerce-product-gallery .flex-control-thumbs li {
		flex: 0 0 4.5rem;
		width: 4.5rem;
		min-width: 4.5rem;
		float: none;
		scroll-snap-align: start;
	}
	.single-product div.product .woocommerce-tabs { padding-top: .75rem; }
	.single-product div.product .woocommerce-tabs ul.tabs {
		display: flex;
		gap: .35rem;
		overflow-x: auto;
		padding: .25rem .15rem 0;
		scroll-padding-inline: .25rem;
	}
	.single-product div.product .woocommerce-tabs ul.tabs li {
		flex: 0 0 auto;
		margin: 0;
		padding: 0;
		border: 1px solid var(--line);
		border-radius: .4rem .4rem 0 0;
	}
	.single-product div.product .woocommerce-tabs ul.tabs li::before,
	.single-product div.product .woocommerce-tabs ul.tabs li::after { display: none; }
	.single-product div.product .woocommerce-tabs ul.tabs li a {
		display: flex;
		align-items: center;
		min-height: 3rem;
		padding: .7rem 1rem;
		font-size: .9rem;
		white-space: nowrap;
	}
	.single-product div.product .woocommerce-tabs ul.tabs li a:focus-visible {
		outline-offset: -4px;
	}
	.single-product div.product .woocommerce-tabs .panel { margin-bottom: 1.5rem; }
}

@media (max-width: 50rem) {
	html { scroll-padding-bottom: 6rem; }
	.site-header { position: relative; z-index: 110; }
	.site-header__inner { gap: .5rem .75rem; padding-block: .5rem; }
	body:not(.woocommerce-checkout) .site-search {
		display: block;
		grid-column: 1 / -1;
		grid-row: 2;
		max-width: none;
		width: 100%;
	}
	.site-search .search-form > label { min-width: 0; flex: 1; }
	.header-actions a { justify-content: center; min-width: 2.75rem; min-height: 2.75rem; }
	.header-actions .account-link { display: flex !important; }
	.header-actions .account-link > span {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip-path: inset(50%);
		white-space: nowrap;
	}
	.cart-link__count { top: 0; left: 1.5rem; }
	.primary-navigation { max-height: 65vh; max-height: 65dvh; overflow-y: auto; overscroll-behavior: contain; }
	.primary-menu a { min-height: 3rem; }
	body input:not([type="checkbox"]):not([type="radio"]),
	body select, body textarea,
	body .woocommerce form .form-row input.input-text,
	body .wc-block-components-text-input input,
	body .wc-block-components-combobox input.components-combobox-control__input {
		font-size: 16px;
	}
	.single-product div.product .summary { padding: 1rem; border-radius: .5rem; }
	.single-product div.product .product_title { font-size: clamp(1.7rem, 6vw, 2.4rem); line-height: 1.12; }
	.single-product div.product .woocommerce-product-details__short-description { padding: .85rem; }
	.single-product div.product form.cart { scroll-margin-block: 1rem; }
	.single-product div.product form.cart .variations select { width: 100%; max-width: 100%; min-height: 3rem; }
	.single-product div.product form.cart .reset_variations { display: inline-flex; align-items: center; min-height: 2.75rem; }
	.single-product div.product form.cart .single_add_to_cart_button { min-height: 3.25rem; border-radius: .4rem; }
	.woocommerce ul.products { gap: .75rem; }
	.woocommerce ul.products li.product .woocommerce-loop-product__title { font-size: .95rem; line-height: 1.4; overflow-wrap: anywhere; }
	.woocommerce ul.products li.product .button { padding-inline: .65rem; font-size: .8rem; }
	.woocommerce .woocommerce-ordering select { width: 100%; }
	.purchase-progress { gap: .5rem; }
	.purchase-progress li { font-size: .75rem; }
	.wc-block-components-sidebar-layout { display: flex; flex-direction: column; gap: 1rem; }
	.wc-block-components-sidebar-layout .wc-block-components-main,
	.wc-block-components-sidebar-layout .wc-block-components-sidebar {
		box-sizing: border-box;
		width: 100%;
		margin: 0;
		padding-inline: 0 !important;
	}
	.wc-block-components-sidebar-layout .wc-block-components-sidebar { padding: 1rem !important; }
	.wc-block-checkout__sidebar { position: static !important; }
	.woocommerce-cart .entry-content > .wp-block-woocommerce-cart,
	.woocommerce-checkout .entry-content > .wp-block-woocommerce-checkout { width: 100%; }
	.woocommerce-cart-form .coupon { flex-wrap: wrap; gap: .5rem; }
	.woocommerce-cart-form .coupon .button { width: 100% !important; }
	.woocommerce table.shop_table td { padding: .85rem; }
	.woocommerce a.remove { display: inline-grid; place-items: center; min-width: 2.75rem; min-height: 2.75rem; }
	body.has-mobile-purchase { padding-bottom: calc(6rem + env(safe-area-inset-bottom, 0px)); }
	.moto22-mobile-purchase:not([hidden]) {
		display: block;
		position: fixed;
		z-index: 90;
		inset: auto 0 0;
		padding: .75rem max(1rem, env(safe-area-inset-right, 0px)) calc(.75rem + env(safe-area-inset-bottom, 0px)) max(1rem, env(safe-area-inset-left, 0px));
		border-top: 1px solid var(--line);
		background: #fff;
		box-shadow: 0 -.25rem 1rem #00000012;
	}
	.moto22-mobile-purchase a {
		display: flex;
		align-items: center;
		justify-content: center;
		min-height: 3rem;
		padding: .65rem 1rem;
		border-radius: .4rem;
		background: var(--red);
		color: var(--moto22-on-primary, #fff);
		font-weight: 800;
		text-align: center;
		text-decoration: none;
	}
}

@media (min-width: 22.5rem) and (max-width: 25rem) {
	.woocommerce ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
}
