/* Scoped Frontlander PlayCanvas host inside the car 360 box. */

.cbz-panorama__native-wrap {
	position: relative;
	width: 100%;
	max-width: 100%;
	height: min(56vw, 560px);
	min-height: 280px;
	max-height: 560px;
	border-radius: 14px;
	overflow: hidden;
	background: #1d292c;
	contain: layout style paint;
}

@media (min-width: 821px) {
	.cbz-panorama__native-wrap {
		height: 560px;
		min-height: 560px;
		max-height: 560px;
	}
}

#cbz-frontlander-mount {
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
	background: #1d292c !important;
	color: #fff;
	/* Containing block for tour UI that was written with position:fixed for iframe. */
	transform: translateZ(0);
	isolation: isolate;
	/* Do not inherit tour reset typography onto siblings; keep theme outside intact. */
	font-family: Helvetica, Arial, sans-serif;
}

#cbz-frontlander-mount .container,
#cbz-frontlander-mount .content,
#cbz-frontlander-mount .content1 {
	position: absolute !important;
	inset: 0 !important;
	width: 100% !important;
	height: 100% !important;
	pointer-events: none;
	z-index: 10;
}

#cbz-frontlander-mount .fix_nav,
#cbz-frontlander-mount .fix_nav_tit,
#cbz-frontlander-mount .fl-color-flyout,
#cbz-frontlander-mount .fl-size-card {
	pointer-events: auto;
}

#cbz-frontlander-mount .fix_nav,
#cbz-frontlander-mount .fl-size-card {
	position: absolute !important;
}

#cbz-frontlander-mount.is-loading::after {
	content: "در حال بارگذاری تور ۳۶۰…";
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-weight: 700;
	z-index: 2;
	pointer-events: none;
	background: radial-gradient(circle at 50% 50%, rgba(201, 162, 39, 0.12), rgba(15, 17, 21, 0.85));
}

#cbz-frontlander-mount #application-canvas {
	position: absolute !important;
	inset: 0 !important;
	width: 100% !important;
	height: 100% !important;
	display: block;
	touch-action: none;
}

#cbz-frontlander-mount #application-splash-wrapper {
	position: absolute !important;
	inset: 0 !important;
	height: 100% !important;
	width: 100% !important;
	z-index: 5;
}

.cbz-frontlander-error {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	color: #fff;
	font-weight: 700;
	padding: 24px;
	text-align: center;
}

@media (max-width: 820px) {
	.cbz-panorama__native-wrap {
		height: min(72vw, 420px);
		min-height: 260px;
		max-height: 420px;
	}

	/* Keep tour toolbar usable inside the shorter mobile frame. */
	#cbz-frontlander-mount .fix_nav {
		width: 58px !important;
		right: 4px !important;
		max-height: calc(100% - 8px) !important;
		padding: 2px 4px 6px !important;
	}
	#cbz-frontlander-mount .fix_nav_tit img {
		width: 22px !important;
		height: 22px !important;
	}
	#cbz-frontlander-mount .fix_nav_tit p {
		font-size: 8px !important;
		line-height: 11px !important;
	}
	#cbz-frontlander-mount .fl-color-flyout {
		right: calc(100% + 4px) !important;
		max-width: min(240px, calc(100vw - 90px));
		flex-wrap: wrap;
		overflow: auto;
		max-height: 70%;
	}
	#cbz-frontlander-mount .fl-size-card {
		left: 50% !important;
		right: auto !important;
		transform: translateX(-50%) !important;
		width: min(280px, calc(100% - 16px)) !important;
		min-width: 0 !important;
		bottom: 8px !important;
	}
}

@media (max-width: 480px) {
	.cbz-panorama__native-wrap {
		height: min(78vw, 360px);
		min-height: 240px;
		max-height: 360px;
	}
}