/* ─────────────────────────────────────────────────────────────────────────
   VRTour Embed — Frontend CSS
   Custom properties overridden by VRTour_Settings::inject_css_vars()
   ───────────────────────────────────────────────────────────────────────── */

:root {
	--vrt-lazy-overlay-bg:    rgba(0,0,0,0.45);
	--vrt-lazy-btn-bg:        #2563eb;
	--vrt-lazy-btn-icon:      #ffffff;
	--vrt-lazy-btn-text:      #ffffff;
	--vrt-link-bar-bg:        #f8fafc;
	--vrt-link-text:          #2563eb;
	--vrt-link-justify:       flex-start;
	--vrt-link-icon-display:  inline-flex;
	--vrt-link-text-display:  inline;
}

.vrtour-embed { width:100%; margin-bottom:1.5em; }

/* ── Ratio wrapper (16:9) ─────────────────────────────────────── */
.vrtour-frame-wrap.vrtour-ratio {
	position:relative; width:100%; padding-bottom:56.25%;
	height:0; overflow:hidden; border-radius:6px; background:#111;
}
.vrtour-frame-wrap.vrtour-ratio .vrtour-iframe {
	position:absolute; top:0; left:0;
	width:100% !important; height:100% !important; border:0;
}

/* ── Fixed wrapper ────────────────────────────────────────────── */
.vrtour-frame-wrap.vrtour-fixed {
	position:relative; width:100%; overflow:hidden;
	border-radius:6px; background:#111;
}
.vrtour-frame-wrap.vrtour-fixed .vrtour-iframe { display:block; width:100%; border:0; }

/* ── View Full Tour link bar ──────────────────────────────────── */
.vrtour-link-bar {
	border-top:1px solid #e2e8f0; padding:10px 14px;
	background:var(--vrt-link-bar-bg); border-radius:0 0 6px 6px;
	display:flex; justify-content:var(--vrt-link-justify);
}
.vrtour-ext-link {
	display:inline-flex; align-items:center; gap:7px;
	font-size:.85rem; font-weight:500;
	color:var(--vrt-link-text) !important;
	text-decoration:none; transition:opacity .15s;
}
.vrtour-ext-link:hover { opacity:.75; text-decoration:underline; }
.vrtour-ext-link i  { font-size:.75rem; display:var(--vrt-link-icon-display); }
.vrtour-ext-link span { display:var(--vrt-link-text-display); }

/* ── Error ────────────────────────────────────────────────────── */
.vrtour-error {
	padding:10px 14px; background:#fef2f2;
	border:1px solid #fca5a5; border-radius:6px;
	color:#7f1d1d; font-style:italic; font-size:.875rem;
}

/* ── Lazy poster ──────────────────────────────────────────────── */
.vrtour-poster {
	position:absolute; inset:0;
	background-size:cover; background-position:center; background-color:#0f172a;
	z-index:10; cursor:pointer;
	display:flex; flex-direction:column; align-items:center;
	justify-content:center; gap:0;
	transition:opacity .35s;
}
.vrtour-poster.loaded { opacity:0; pointer-events:none; }

.vrtour-poster-btn {
	display:flex; flex-direction:column; align-items:center; gap:12px;
	padding:24px 32px;
	background:var(--vrt-lazy-overlay-bg);
	backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
	border:2px solid rgba(255,255,255,.18); border-radius:14px;
	transition:transform .2s;
}
.vrtour-poster:hover .vrtour-poster-btn { transform:scale(1.04); }

.vrtour-poster-btn i {
	font-size:1.8rem; color:var(--vrt-lazy-btn-icon);
	background:var(--vrt-lazy-btn-bg); border-radius:50%;
	width:56px; height:56px; display:flex;
	align-items:center; justify-content:center;
}
.vrtour-poster-btn span {
	font-size:.875rem; font-weight:600; letter-spacing:.03em;
	color:var(--vrt-lazy-btn-text);
}

/* ── Lightbox trigger button (standalone) ────────────────────────────── */
.vrtour-lightbox-trigger-wrap { display: inline-block; }
.vrtour-lightbox-trigger {
	background: none;
	border: none;
	cursor: pointer;
	padding: 0;
	display: block;
	width: 100%;
}
/* When used inside the link bar, behave like the ext-link (inline-flex) */
.vrtour-link-bar .vrtour-lightbox-trigger {
	display: inline-flex !important;
	align-items: center;
	width: auto;
}
.vrtour-lightbox-thumb {
	display: block;
	width: 100%;
	padding-bottom: 56.25%;
	background-size: cover;
	background-position: center;
	background-color: #0f172a;
	border-radius: 6px;
	position: relative;
}
.vrtour-lightbox-play {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
}
.vrtour-lightbox-play i {
	font-size: 2rem;
	color: var(--vrt-lazy-btn-icon);
	background: var(--vrt-lazy-btn-bg);
	border-radius: 50%;
	width: 56px;
	height: 56px;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: transform .2s;
}
.vrtour-lightbox-trigger:hover .vrtour-lightbox-play i { transform: scale(1.1); }
.vrtour-lightbox-btn-text {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 12px 24px;
	background: var(--vrt-lazy-btn-bg);
	color: var(--vrt-lazy-btn-text);
	border-radius: 8px;
	font-size: .9rem;
	font-weight: 600;
	transition: opacity .2s;
}
.vrtour-lightbox-trigger:hover .vrtour-lightbox-btn-text { opacity: .85; }

/* ── Lightbox overlay ────────────────────────────────────────────────── */
.vrtour-lb-overlay {
	position: fixed;
	inset: 0;
	z-index: 999999;
	background: var(--vrt-lb-overlay-bg);
	display: flex;
	align-items: center;
	justify-content: center;
	animation: vrtour-lb-in .2s ease;
}
@keyframes vrtour-lb-in {
	from { opacity: 0; }
	to   { opacity: 1; }
}
.vrtour-lb-window {
	position: relative;
	width: var(--vrt-lb-coverage);
	aspect-ratio: 16 / 9;
	max-height: 92vh;
	max-width: 98vw;
	background: #000;
	border-radius: 8px;
	box-shadow: var(--vrt-lb-shadow);
	overflow: hidden;
	animation: vrtour-lb-scale .25s ease;
}
@keyframes vrtour-lb-scale {
	from { transform: scale(.92); opacity: 0; }
	to   { transform: scale(1);   opacity: 1; }
}
.vrtour-lb-window iframe {
	width: 100%;
	height: 100%;
	border: 0;
	display: block;
}
.vrtour-lb-close {
	position: absolute;
	top: 10px;
	right: 12px;
	z-index: 10;
	background: rgba(0,0,0,.55);
	border: none;
	color: #fff;
	border-radius: 50%;
	width: 34px;
	height: 34px;
	font-size: 1rem;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background .15s;
	line-height: 1;
}
.vrtour-lb-close:hover { background: rgba(0,0,0,.8); }