/**
 * 공개구매 컴팩트 PIP — 주문·주문확인·단골/알림 모달 (LIVE 배지 + 크게보기, 음성 유지)
 * 확대(is-expanded) 시에는 inc.deal_live_pip_expand.php 레이아웃(하단 ON AIR 카드)을 그대로 사용.
 */
#idx_live_pip.is-order-pip-minimized:not(.is-expanded) {
	z-index: 100050 !important;
	width: auto !important;
	min-width: 0 !important;
	max-width: min(118px, calc(100vw - 20px)) !important;
	box-shadow: 0 6px 16px rgba(0, 0, 0, 0.28) !important;
	animation: idxOrderPipFloat 2.1s ease-in-out infinite;
}
#idx_live_pip.is-order-pip-minimized.is-live-vertical:not(.is-expanded),
#idx_live_pip.is-order-pip-minimized.is-portrait:not(.is-expanded) {
	width: auto !important;
	max-width: min(118px, calc(100vw - 20px)) !important;
}
#idx_live_pip.is-order-pip-minimized.is-expanded {
	animation: none !important;
	position: fixed !important;
	inset: 0 !important;
	top: 0 !important;
	left: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	width: 100% !important;
	max-width: none !important;
	min-width: 0 !important;
	margin: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	/* 확대 PIP 공용 스택(100210)과 동일 — 100090 이면 #header.auth_top(100000) 등에 클릭이 가로채임 */
	z-index: 100210 !important;
	display: grid !important;
	grid-template-rows: minmax(0, 1fr) max-content;
	grid-template-columns: 1fr;
	overflow: hidden !important;
}
#idx_live_pip.is-order-pip-minimized.is-expanded .idx-live-body {
	display: block !important;
	position: relative !important;
	width: 100% !important;
	height: 100% !important;
	min-height: 0 !important;
	left: auto !important;
	top: auto !important;
	margin: 0 !important;
	padding: 0 !important;
	opacity: 1 !important;
	overflow: hidden !important;
	/* body pe:auto 이면 height:100% 히트박스가 하단 ON AIR 카드를 덮어 「장바구니 담기」 클릭이 먹히지 않음.
	   채팅바 등 자식은 각자 pe:auto 로 수신 (expand CSS 와 동일 패턴). */
	pointer-events: none !important;
	clip: auto !important;
	clip-path: none !important;
	border: 0 !important;
}
#idx_live_pip.is-order-pip-minimized.is-expanded .idx-live-body iframe {
	width: 100% !important;
	height: 100% !important;
	min-height: 0 !important;
	object-fit: contain;
	pointer-events: none !important;
	touch-action: none !important;
}
#idx_live_pip.is-order-pip-minimized.is-expanded .idx-live-body video,
#idx_live_pip.is-order-pip-minimized.is-expanded .idx-live-body #idx_live_pip_video,
#idx_live_pip.is-order-pip-minimized.is-expanded .idx-live-body .idx-live-video-stage video {
	width: 100% !important;
	height: 100% !important;
	min-height: 0 !important;
	max-width: none !important;
	max-height: none !important;
	display: block !important;
	visibility: visible !important;
	opacity: 1 !important;
	object-fit: cover;
	object-position: center center;
	transform: scaleX(-1) !important;
	-webkit-transform: scaleX(-1) !important;
	filter: none !important;
	pointer-events: none !important;
	touch-action: none !important;
}
#idx_live_pip.is-order-pip-minimized.is-expanded .idx-live-body .idx-live-video-stage {
	position: absolute !important;
	inset: 0 !important;
	z-index: 1 !important;
	overflow: hidden !important;
	background: #000 !important;
	opacity: 1 !important;
	visibility: visible !important;
	pointer-events: none !important;
}
#idx_live_pip.is-order-pip-minimized:not(.is-expanded) .idx-live-head {
	display: flex !important;
	padding: 5px 6px !important;
	justify-content: space-between !important;
	align-items: center !important;
	gap: 5px !important;
}
#idx_live_pip.is-order-pip-minimized:not(.is-expanded) .idx-live-head-left {
	display: flex !important;
	visibility: visible !important;
	pointer-events: auto !important;
	flex: 0 0 auto !important;
	min-width: 0 !important;
	cursor: pointer !important;
}
#idx_live_pip.is-order-pip-minimized:not(.is-expanded) .idx-live-badge {
	display: inline-flex !important;
	visibility: visible !important;
	pointer-events: auto !important;
	cursor: pointer !important;
}
#idx_live_pip.is-order-pip-minimized:not(.is-expanded) #idx_live_pip_settings_btn,
#idx_live_pip.is-order-pip-minimized:not(.is-expanded) #idx_live_pip_toggle,
#idx_live_pip.is-order-pip-minimized:not(.is-expanded) #idx_live_pip_close,
#idx_live_pip.is-order-pip-minimized:not(.is-expanded) .idx-live-foot,
#idx_live_pip.is-order-pip-minimized:not(.is-expanded) .idx-live-on-air-slot,
#idx_live_pip.is-order-pip-minimized:not(.is-expanded) .idx-live-head-btn:not(#idx_live_pip_fullscreen) {
	display: none !important;
	visibility: hidden !important;
	pointer-events: none !important;
}
#idx_live_pip.is-order-pip-minimized:not(.is-expanded) .idx-live-actions {
	display: inline-flex !important;
	visibility: visible !important;
	margin-left: 0 !important;
	width: auto !important;
	flex: 0 0 auto !important;
	justify-content: center !important;
}
#idx_live_pip.is-order-pip-minimized:not(.is-expanded):not(.is-stream-offline) #idx_live_pip_fullscreen {
	display: inline-flex !important;
	visibility: visible !important;
	pointer-events: auto !important;
}
#idx_live_pip.is-order-pip-minimized:not(.is-expanded) .idx-live-body {
	/* display:none / clip-path 은 iOS·WebView 에서 재생·음성을 끊음.
	   최소 크기로 유지해 결제 페이지 최소화 PIP 에서도 음성 지속 */
	display: block !important;
	position: fixed !important;
	left: -4px !important;
	bottom: -4px !important;
	width: 2px !important;
	height: 2px !important;
	margin: 0 !important;
	padding: 0 !important;
	opacity: 0.02 !important;
	overflow: hidden !important;
	pointer-events: none !important;
	clip: auto !important;
	clip-path: none !important;
	border: 0 !important;
	z-index: 0 !important;
}
#idx_live_pip.is-order-pip-minimized:not(.is-expanded) .idx-live-body video,
#idx_live_pip.is-order-pip-minimized:not(.is-expanded) .idx-live-body #idx_live_pip_video,
#idx_live_pip.is-order-pip-minimized:not(.is-expanded) .idx-live-body iframe {
	width: 2px !important;
	height: 2px !important;
	min-width: 2px !important;
	min-height: 2px !important;
	opacity: 0.02 !important;
}
#idx_live_pip.is-order-pip-minimized:not(.is-expanded) .idx-live-unmute-banner,
#idx_live_pip.is-order-pip-minimized:not(.is-expanded) .idx-live-buffering,
#idx_live_pip.is-order-pip-minimized:not(.is-expanded) .idx-live-waiting,
#idx_live_pip.is-order-pip-minimized:not(.is-expanded) .idx-live-settings-menu {
	display: none !important;
}
#idx_live_pip .idx-live-compact-unmute {
	display: none;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba(255,255,255,.18);
	color: #fff;
	cursor: pointer;
	flex: 0 0 auto;
	-webkit-tap-highlight-color: transparent;
}
#idx_live_pip.is-order-pip-minimized:not(.is-expanded) .idx-live-compact-unmute.is-needed {
	display: inline-flex !important;
	visibility: visible !important;
	pointer-events: auto !important;
}
#idx_live_pip .idx-live-compact-unmute-icon {
	display: inline-block;
	width: 14px;
	height: 14px;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'><path d='M3 9v6h4l5 5V4L7 9H3zm13.5 3c0-1.77-1.02-3.29-2.5-4.03v8.05c1.48-.73 2.5-2.25 2.5-4.02z'/></svg>");
}
#idx_live_pip.is-order-pip-minimized.is-stream-offline:not(.is-expanded) .idx-live-badge {
	font-size: 8px;
	padding: 0 5px;
	max-width: 76px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
/* 확대 시 하단 ON AIR 카드 — 컴팩트 숨김 규칙보다 우선.
   컨테이너 pointer-events 는 expand CSS(none + 카드만 auto)를 따르며, 여기서 auto 로 덮지 않음. */
#idx_live_pip.is-order-pip-minimized.is-expanded .idx-live-on-air-slot.is-visible {
	display: block !important;
	visibility: visible !important;
}
body.rm-regular-modal-open #idx_live_pip.is-order-pip-minimized:not(.is-expanded) {
	z-index: 100050 !important;
}
@keyframes idxOrderPipFloat {
	0%, 100% { transform: translateY(0); }
	50% { transform: translateY(-2px); }
}
