/**
 * Mobile WhatsApp button — keep it above bottom nav / sticky add-to-cart.
 * Theme mobile nav breakpoint: max-width 1023px (.hide-desktop).
 */

@media (max-width: 1023px) {
	.qlwapp__container.qlwapp__container--bottom-right,
	.qlwapp__container.qlwapp__container--bottom-left,
	.qlwapp__container.qlwapp__container--middle-right,
	.qlwapp__container.qlwapp__container--middle-left {
		bottom: 4.75rem !important;
		top: auto !important;
	}

	/* Move to bottom-left so Account / Categories stay tappable on the right. */
	.qlwapp__container.qlwapp__container--bottom-right,
	.qlwapp__container.qlwapp__container--middle-right {
		left: 0 !important;
		right: auto !important;
	}

	.qlwapp__container.qlwapp__container--bottom-right .qlwapp__button,
	.qlwapp__container.qlwapp__container--middle-right .qlwapp__button {
		margin-right: 0 !important;
		margin-left: 12px !important;
	}

	.qlwapp__container.qlwapp__container--bottom-right .qlwapp__button .qlwapp__label,
	.qlwapp__container.qlwapp__container--bottom-right .qlwapp__button .qlwapp__time,
	.qlwapp__container.qlwapp__container--middle-right .qlwapp__button .qlwapp__label,
	.qlwapp__container.qlwapp__container--middle-right .qlwapp__button .qlwapp__time {
		left: 0 !important;
		right: auto !important;
	}

	.qlwapp__container.qlwapp__container--bottom-right .qlwapp__button--bubble .qlwapp__text,
	.qlwapp__container.qlwapp__container--middle-right .qlwapp__button--bubble .qlwapp__text {
		right: auto !important;
		left: var(--qlwapp-scheme-icon-size, 60px) !important;
	}

	.qlwapp__container.qlwapp__container--bottom-right .qlwapp__modal::before,
	.qlwapp__container.qlwapp__container--middle-right .qlwapp__modal::before {
		right: auto !important;
		left: 20px !important;
	}

	/* Product pages: lift above sticky add-to-cart bar as well. */
	body.single-product .qlwapp__container.qlwapp__container--bottom-right,
	body.single-product .qlwapp__container.qlwapp__container--bottom-left,
	body.single-product .qlwapp__container.qlwapp__container--middle-right,
	body.single-product .qlwapp__container.qlwapp__container--middle-left {
		bottom: 8.25rem !important;
	}

	/* Slightly smaller tap target on small screens. */
	.qlwapp__button {
		height: 36px !important;
		font-size: 14px !important;
		gap: 8px !important;
	}

	.qlwapp__button .qlwapp__icon {
		font-size: 20px !important;
	}
}