/* WapuOS · shared mobile data-sheet drag affordance. */
.wapu-bottom-sheet-drag-handle{display:none}

@media (max-width:47.9375rem){
	:root{
		--wapu-visual-viewport-width:100vw;
		--wapu-visual-viewport-height:100dvh;
		--wapu-visual-viewport-left:0px;
		--wapu-visual-viewport-top:0px;
		--wapu-data-sheet-height:min(78dvh,44rem);
		--wapu-data-sheet-max-height:calc(var(--wapu-visual-viewport-height,100dvh) - max(.5rem,env(safe-area-inset-top,0px)));
	}

	/* 7.7.146 · One mobile geometry contract for every canonical Data Sheet.
	 * Use the real visual viewport when available so sheets stay horizontally
	 * centred even after browser chrome/keyboard viewport changes. Content owns
	 * the initial height and grows until the usable viewport; complex editors may
	 * opt into full usable height below. */
	[data-wapu-dialog][data-wapu-dialog-presentation="sheet"],
	[data-wapu-dialog][data-wapu-dialog-presentation="adaptive"]{
		position:fixed!important;
		top:var(--wapu-visual-viewport-top,0px)!important;
		left:var(--wapu-visual-viewport-left,0px)!important;
		right:auto!important;
		bottom:auto!important;
		width:var(--wapu-visual-viewport-width,100vw)!important;
		max-width:var(--wapu-visual-viewport-width,100vw)!important;
		height:var(--wapu-visual-viewport-height,100dvh)!important;
		max-height:var(--wapu-visual-viewport-height,100dvh)!important;
		margin:0!important;
		padding:0!important;
		display:flex!important;
		align-items:flex-end!important;
		justify-content:center!important;
		overflow:hidden!important;
		box-sizing:border-box!important;
	}
	[data-wapu-dialog][data-wapu-dialog-presentation="sheet"] > [data-wapu-dialog-backdrop],
	[data-wapu-dialog][data-wapu-dialog-presentation="adaptive"] > [data-wapu-dialog-backdrop]{
		position:absolute!important;
		inset:0!important;
		width:100%!important;
		height:100%!important;
	}
	[data-wapu-dialog][data-wapu-dialog-presentation="sheet"] [data-wapu-dialog-panel],
	[data-wapu-dialog][data-wapu-dialog-presentation="adaptive"] [data-wapu-dialog-panel]{
		position:relative!important;
		top:auto!important;
		right:auto!important;
		bottom:auto!important;
		left:auto!important;
		box-sizing:border-box!important;
		width:100%!important;
		max-width:100%!important;
		height:auto!important;
		min-height:0!important;
		max-height:var(--wapu-data-sheet-max-height)!important;
		margin:0 auto!important;
		border-radius:var(--wtds-panel-radius,var(--wtds-r-xl)) var(--wtds-panel-radius,var(--wtds-r-xl)) 0 0!important;
		overflow:hidden!important;
		transform:translate3d(0,100%,0);
	}
	[data-wapu-dialog][data-wapu-dialog-presentation="sheet"].is-open [data-wapu-dialog-panel],
	[data-wapu-dialog][data-wapu-dialog-presentation="adaptive"].is-open [data-wapu-dialog-panel]{
		transform:translate3d(0,0,0);
	}

	/* The cart variation editor is a form-like surface: give it the whole usable
	 * viewport and keep scrolling inside its content region, not in the page. */
	#wapu-cart-edit-modal[data-wapu-dialog] [data-wapu-dialog-panel]{
		height:var(--wapu-data-sheet-max-height)!important;
		max-height:var(--wapu-data-sheet-max-height)!important;
	}
	[data-wapu-dialog] [data-wapu-dialog-handle]{
		display:flex!important;
		width:100%!important;
		height:auto!important;
		min-height:1.25rem!important;
		margin:0!important;
		padding:.375rem 0 .25rem!important;
		border-radius:0!important;
		background:transparent!important;
	}
	.wapu-single__offcanvas.is-sheet-expanded,
	[data-wapu-dialog-panel].is-sheet-expanded,
	[data-wapu-floating-window-panel].is-sheet-expanded{
		height:var(--wapu-data-sheet-max-height)!important;
		max-height:var(--wapu-data-sheet-max-height)!important;
	}
	.wapu-bottom-sheet-drag-handle{
		display:block;
		inline-size:2.5rem;
		block-size:.25rem;
		margin:.5rem auto .125rem;
		border-radius:var(--wtds-r-pill);
		background:var(--wtds-separator-strong,var(--wtds-separator));
		flex:0 0 auto;
		cursor:grab;
		touch-action:none;
	}
	[data-wapu-sheet-drag-handle]{touch-action:none}
	.is-sheet-dragging{transition:none!important;user-select:none!important}
	.is-sheet-dragging [data-wapu-sheet-drag-handle]{cursor:grabbing}
	.is-sheet-dismissing{pointer-events:none!important}

	/* Single PDP: description and similares are true bottom sheets on mobile. */
	.wapu-single__offcanvas[data-active-panel="description"],
	.wapu-single__offcanvas[data-active-panel="similar"]{
		display:flex!important;
		flex-direction:column!important;
		position:fixed!important;
		top:auto!important;
		right:0!important;
		bottom:0!important;
		left:0!important;
		width:100%!important;
		height:var(--wapu-data-sheet-height)!important;
		max-height:calc(100dvh - env(safe-area-inset-top,0px) - var(--wtds-s-4))!important;
		border-radius:var(--wtds-panel-radius) var(--wtds-panel-radius) 0 0!important;
		background:var(--wtds-surface)!important;
		box-shadow:var(--wtds-shadow-xl)!important;
		overflow:hidden!important;
		contain:layout paint;
		transform:translate3d(0,105%,0)!important;
		transition:transform var(--wtds-dur) var(--wtds-ease),visibility 0s linear var(--wtds-dur)!important;
	}
	.wapu-single__offcanvas[data-active-panel="description"][aria-hidden="false"],
	.wapu-single__offcanvas[data-active-panel="similar"][aria-hidden="false"]{
		transform:translate3d(0,0,0)!important;
		visibility:visible;
		pointer-events:auto;
		transition:transform var(--wtds-dur) var(--wtds-ease),visibility 0s linear 0s!important;
	}
	.wapu-single__offcanvas-topbar[data-wapu-sheet-drag-handle]{
		position:relative;
		flex:0 0 auto;
		min-height:2.75rem;
		padding:.875rem var(--wtds-s-2) .375rem!important;
		cursor:grab;
		touch-action:none;
		background:var(--wtds-surface)!important;
		border-bottom:0!important;
	}
	.wapu-single__offcanvas-topbar[data-wapu-sheet-drag-handle]::before{
		content:"";
		position:absolute;
		left:50%;
		top:.5rem;
		transform:translateX(-50%);
		inline-size:2.5rem;
		block-size:.25rem;
		border-radius:var(--wtds-r-pill);
		background:var(--wtds-separator-strong,var(--wtds-separator));
	}
	.wapu-single__offcanvas-close{
		margin-inline-start:auto;
		inline-size:2rem;
		block-size:2rem;
		min-inline-size:2rem;
		min-block-size:2rem;
		padding:0!important;
		border-radius:50%!important;
	}
	.wapu-single__offcanvas[data-active-panel="description"] .wapu-single__offcanvas-panel,
	.wapu-single__offcanvas[data-active-panel="similar"] .wapu-single__offcanvas-panel{
		min-height:0;
		flex:1 1 auto;
		height:auto!important;
		padding:var(--wtds-s-2) var(--wtds-s-3) calc(var(--wtds-s-4) + env(safe-area-inset-bottom,0px))!important;
		overflow-y:auto!important;
		overflow-x:hidden!important;
		overscroll-behavior-y:contain;
		-webkit-overflow-scrolling:touch;
		scrollbar-gutter:stable;
	}
	.wapu-single__offcanvas[data-active-panel="description"] .wapu-single__offcanvas-desc-wrap{
		min-height:0;
		overflow:visible;
	}

	/* Canonical Floating Window also becomes a Data Sheet on mobile. Keep its
	 * geometry/handle aligned with Dialog without changing its desktop contract. */
	[data-wapu-floating-window-panel]{
		height:var(--wapu-data-sheet-height)!important;
		max-height:var(--wapu-data-sheet-max-height)!important;
		border-radius:var(--wtds-panel-radius,var(--wtds-r-xl)) var(--wtds-panel-radius,var(--wtds-r-xl)) 0 0!important;
	}
	[data-wapu-floating-window] .wapu-floating-window__grip{
		width:2.5rem;
		height:.25rem;
		border-radius:var(--wtds-r-pill);
		background:var(--wtds-separator-strong,var(--wtds-separator));
	}
	[data-wapu-products-window][data-surface="bottom-sheet"] .wapu-checkout-products-window__content{
		min-height:0;
		overflow:hidden;
	}
	[data-wapu-products-window][data-surface="bottom-sheet"] .wapu-checkout-products-window__list{
		min-height:0;
		overflow-y:auto!important;
		overscroll-behavior-y:contain;
		-webkit-overflow-scrolling:touch;
	}
}

@media (prefers-reduced-motion:reduce){
	.is-sheet-dragging,.is-sheet-dismissing{transition:none!important}
}