/* Social Chat mobile viewport fix. */
@media (max-width: 600px) {
	html,
	body {
		max-width: 100%;
		overflow-x: clip;
	}

	/* Current Social Chat React markup. */
	#qlwapp,
	.qlwapp {
		box-sizing: border-box;
		max-width: 100vw !important;
	}

	#qlwapp .qlwapp__container,
	.qlwapp .qlwapp__container {
		box-sizing: border-box;
		width: min(430px, calc(100vw - 24px)) !important;
		max-width: calc(100vw - 24px) !important;
	}

	/* Legacy markup used by older Social Chat render paths. */
	#qlwapp .qlwapp-container,
	.qlwapp .qlwapp-container {
		box-sizing: border-box;
		width: auto !important;
		max-width: calc(100vw - 24px) !important;
	}

	/* Keep expanded mobile chat panels within the viewport. */
	#qlwapp .qlwapp__modal,
	.qlwapp .qlwapp__modal {
		box-sizing: border-box;
		max-width: 100vw !important;
	}

	#qlwapp .qlwapp__button--bubble .qlwapp__text,
	.qlwapp .qlwapp__button--bubble .qlwapp__text {
		box-sizing: border-box;
		max-width: calc(100vw - 88px);
		overflow: hidden;
		text-overflow: ellipsis;
	}
}