/* =====================================================================
   Retreats 2026 — ROOM TABS (29 Oct 2026, director): same look as the Rooms hub tabs.
   Path in theme: /assets/css/retreats-room-tabs.css — loaded only on page-retreats-2026.php, after retreats-2026.css.
   Markup + script: part-room-tabs-2026.php.

   Every rule is COPIED from rooms-2026.css (same values, same order) and scoped to #room-types, so nothing here
   touches the other Retreats sections, and the old room-card rules in retreats-2026.css (.xr-room-label,
   .xr-room-features, .xr-room-link…) can't leak in. If the Rooms hub tabs change, copy the change here too.
   --xr-secnav-h = height of the global menu (set by the script), instead of the Rooms hub's sticky section menu.
   ===================================================================== */

/* ---------- "Rooms & Accommodations" header: same space under the text as the Rooms hub's "Stay" block ---------- */
html body #xr-page.xr-page .xr-rooms { padding-bottom: 72px; }
@media (max-width: 700px) {
	html body #xr-page.xr-page .xr-rooms { padding-bottom: 44px; }
}

/* ---------- Page width (Rooms hub: 1100 → 1280 → 1400px) ---------- */
@media (min-width: 1360px) { html body #xr-page #room-types { --xr-max: 1280px; } }
@media (min-width: 1680px) { html body #xr-page #room-types { --xr-max: 1400px; } }

/* ---------- Photo slider ---------- */
html body #xr-page #room-types .xr-slider { position: relative; }
html body #xr-page #room-types .xr-slider-track {
	display: flex;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	scrollbar-width: none;
	aspect-ratio: 3 / 2;
	background: #e9e1d4;
}
html body #xr-page #room-types .xr-slider-track::-webkit-scrollbar { display: none; }
html body #xr-page #room-types .xr-slider-track:focus-visible { outline: 2px solid var(--xr-clay); outline-offset: 2px; }
html body #xr-page #room-types .xr-slide { flex: 0 0 100%; scroll-snap-align: start; position: relative; }
html body #xr-page #room-types .xr-slide img,
html body #xr-page #room-types .xr-slide video { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; }
html body #xr-page #room-types .xr-slide--video { display: none; }       /* phones only: the video becomes slide 1 */
html body #xr-page .xr-slider-btn {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	border: 1px solid rgba(255,255,255,.9);
	background: rgba(32,30,29,.35);
	color: #fff;
	cursor: pointer;
	transition: background-color .2s, opacity .2s;
}
html body #xr-page .xr-slider-btn:hover { background: var(--xr-clay); border-color: var(--xr-clay); }
html body #xr-page .xr-slider-btn:disabled { opacity: 0; pointer-events: none; }
html body #xr-page #room-types .xr-slider-prev { left: 12px; }
html body #xr-page #room-types .xr-slider-next { right: 12px; }
html body #xr-page #room-types .xr-slider-count {
	position: absolute;
	right: 12px;
	bottom: 12px;
	padding: 3px 10px;
	border-radius: 999px;
	background: rgba(32,30,29,.55);
	color: #fff;
	font-size: 12px;
	letter-spacing: .06em;
}
html body #xr-page #room-types .xr-slider.is-single .xr-slider-btn,
html body #xr-page #room-types .xr-slider.is-single .xr-slider-count { display: none; }

/* ---------- Room info ---------- */
html body #xr-page #room-types .xr-room-label { font-size: 13px; font-weight: 600; letter-spacing: .06em; color: var(--xr-clay); margin-bottom: 8px; }
html body #xr-page #room-types .xr-room-tier { margin-left: 4px; }
html body #xr-page #room-types .xr-rcard-title { font-family: var(--xr-prata); font-size: 24px; font-weight: 400; letter-spacing: normal; text-transform: none; line-height: 1.3; color: #1a1a1a; margin-bottom: 10px; }
html body #xr-page #room-types .xr-room-text { font-size: 15px; line-height: 1.6; color: #444; margin-bottom: 16px; }
html body #xr-page #room-types .xr-room-features { list-style: none; margin-bottom: 24px; }
html body #xr-page #room-types .xr-room-features li { display: flex; align-items: center; gap: 12px; font-size: 15px; color: #444; margin-bottom: 7px; }
html body #xr-page #room-types .xr-room-features .xr-icon { flex-shrink: 0; color: #9c8a5e; }
html body #xr-page #room-types .xr-room-link {
	align-self: auto;
	margin-top: 0;
	padding-bottom: 6px;
	border-bottom: 0; /* the underline is xinalani-ui.css's ::before line (as on the Rooms hub); a border here = 2nd line */
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .06em;
	color: var(--xr-clay) !important;
	transition: color .2s, border-color .2s;
}
html body #xr-page #room-types .xr-room-link:hover { color: var(--xr-forest) !important; }

@media (max-width: 700px) {
	html body #xr-page .xr-slider-btn { width: 36px; height: 36px; }
}

/* ---------- Desktop text sizes ---------- */
@media (min-width: 961px) {
	html body #xr-page #room-types .xr-room-label { font-size: 14px; }
	html body #xr-page #room-types .xr-rcard-title { font-size: 27px; }
	html body #xr-page #room-types .xr-room-text { font-size: 16.5px; }
	html body #xr-page #room-types .xr-room-features li { font-size: 16px; }
	html body #xr-page #room-types .xr-room-link { font-size: 14px; }
	html body #xr-page #room-types .xr-slider-count { font-size: 13px; }
}
@media (min-width: 1360px) {
	html body #xr-page #room-types .xr-rcard-title { font-size: 30px; }
	html body #xr-page #room-types .xr-room-text { font-size: 17.5px; }
	html body #xr-page #room-types .xr-room-features li { font-size: 17px; margin-bottom: 9px; }
}

/* ---------- Room tabs ---------- */
html body #xr-page #room-types { background: #F7F2EC; padding-bottom: 96px; }
html body #xr-page #room-types .xr-roomtabs {
	display: flex;
	justify-content: center;
	gap: 4px;
	padding: 0 24px;
	background: #fff;
	border-bottom: 0;
	overflow-x: auto;
	scrollbar-width: none;
}
html body #xr-page #room-types .xr-roomtabs::-webkit-scrollbar { display: none; }
html body #xr-page #room-types .xr-roomtab {
	flex: 0 0 auto;
	padding: 16px 26px;
	border: 0;
	background: transparent;
	font-family: var(--xr-prata);
	font-size: 16px;
	line-height: 1.3;
	color: #8c4a32;
	white-space: nowrap;
	cursor: pointer;
	transition: background-color .25s, color .25s;
}
html body #xr-page #room-types .xr-roomtab:hover { background: #FAF6F0; }
html body #xr-page #room-types .xr-roomtab.is-active { background: #F7F2EC; color: var(--xr-clay); }  /* same sand as the section: the tab "opens" into it */
html body #xr-page #room-types .xr-roomtab:focus-visible { outline: 2px solid var(--xr-clay); outline-offset: -3px; }
html body #xr-page #room-types .xr-roomtabs .xr-tab-short { display: none; }

html body #xr-page #room-types .xr-rooms2-list { display: flex; flex-direction: column; gap: 80px; padding-top: 56px; }
html.xr-tabs-js body #xr-page #room-types .xr-rooms2-list { gap: 0; }
html body #xr-page #room-types .xr-rcard[hidden] { display: none !important; }
html body #xr-page #room-types .xr-rcard:focus { outline: none; }

/* Card: video square left | photo slider + info right (desktop). Phones: one gallery + info. */
html body #xr-page #room-types .xr-rcard {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 24px;
	align-items: start;
}
html body #xr-page #room-types .xr-rcard-video { position: relative; aspect-ratio: 1 / 1; overflow: hidden; background: #e9e1d4; }
html body #xr-page #room-types .xr-rcard-video video,
html body #xr-page #room-types .xr-rcard-video img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; }

html body #xr-page #room-types .xr-rcard .xr-rcard-side .xr-rcard-body { padding: 20px 0 0; background: transparent; border-radius: 0; }
html body #xr-page #room-types .xr-rcard .xr-room-label { margin-bottom: 6px; }
html body #xr-page #room-types .xr-rcard .xr-rcard-title { margin-bottom: 8px; }
html body #xr-page #room-types .xr-rcard .xr-room-text { margin-bottom: 14px; }
html body #xr-page #room-types .xr-rcard .xr-room-features { margin-bottom: 18px; }
html body #xr-page #room-types .xr-rcard .xr-room-features li { margin-bottom: 4px; line-height: 1.4; }
html body #xr-page #room-types .xr-rcard .xr-rcard-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 32px; margin: 0; }

@media (min-width: 961px) {
	html body #xr-page #room-types .xr-rooms2-list {
		--xr-rvid: clamp(420px, calc((min(100vw - 17px, var(--xr-max)) - 48px - 40px) * .555), 600px);
		max-width: var(--xr-max);
	}
	html body #xr-page #room-types .xr-rcard { grid-template-columns: var(--xr-rvid) minmax(0, 1fr); gap: 40px; align-items: stretch; }
	html body #xr-page #room-types .xr-rcard-video { align-self: start; }
	html body #xr-page #room-types .xr-rcard-side { display: flex; flex-direction: column; min-height: 0; }
	html body #xr-page #room-types .xr-rcard .xr-rcard-side .xr-slider { flex: 1 0 0; min-height: 220px; display: flex; }
	html body #xr-page #room-types .xr-rcard-side .xr-slider-track { flex: 1; aspect-ratio: auto; }
	html body #xr-page #room-types .xr-rcard .xr-rcard-actions { margin-bottom: -5px; }
	html body #xr-page #room-types .xr-roomtab { font-size: 17px; }
}
@media (min-width: 961px) and (max-width: 1199px) {
	html body #xr-page #room-types .xr-rooms2-list { --xr-rvid: clamp(400px, calc((min(100vw - 17px, var(--xr-max)) - 48px - 28px) * .569), 560px); }
	html body #xr-page #room-types .xr-rcard { gap: 28px; }
	html body #xr-page #room-types .xr-rcard .xr-rcard-side .xr-slider { min-height: 180px; }
	html body #xr-page #room-types .xr-rcard .xr-rcard-side .xr-rcard-body { padding-top: 16px; }
	html body #xr-page #room-types .xr-rcard .xr-room-features li { margin-bottom: 3px; }
}
@media (min-width: 1360px) {
	html body #xr-page #room-types .xr-rcard .xr-room-features li { margin-bottom: 5px; }
}

/* ---------- Phones ---------- */
@media (max-width: 700px) {
	html body #xr-page #room-types { padding-bottom: 64px; }
	html body #xr-page #room-types .xr-rooms2-list { padding-top: 24px; gap: 56px; }
	html body #xr-page #room-types .xr-roomtabs { justify-content: space-between; gap: 0; padding: 0 4px; }
	html body #xr-page #room-types .xr-roomtab { flex: 1 1 auto; padding: 14px 10px; font-size: 15px; }
	html body #xr-page #room-types .xr-roomtabs .xr-tab-full { display: none; }
	html body #xr-page #room-types .xr-roomtabs .xr-tab-short { display: inline; }

	html body #xr-page #room-types .xr-rcard { grid-template-columns: 1fr; gap: 0; }
	html body #xr-page #room-types .xr-rcard-video { display: none; }
	html body #xr-page #room-types .xr-slide--video { display: block; }
	html body #xr-page #room-types .xr-slider-track { aspect-ratio: 4 / 3; }
	html body #xr-page #room-types .xr-rcard .xr-rcard-side .xr-rcard-body { padding: 18px 0 0; }
	html body #xr-page #room-types .xr-rcard .xr-rcard-actions { gap: 4px 28px; }
}

/* ---------- Arrows, space under the tabs, one-screen card, cross-fade (Rooms hub 2nd round) ---------- */
html body #xr-page #room-types .xr-rooms2-list { position: relative; padding-top: 40px; }
html body #xr-page #room-types .xr-roompager[hidden] { display: none !important; }
html body #xr-page #room-types .xr-roomnav {
	display: flex; align-items: center; justify-content: center;
	width: 44px; height: 44px; padding: 0;
	border: 1.5px solid var(--xr-clay); border-radius: 50%;
	background: transparent; color: var(--xr-clay);
	cursor: pointer;
	transition: background-color .25s ease, color .25s ease, transform .25s ease;
}
html body #xr-page #room-types .xr-roomnav:hover { background: var(--xr-clay); color: #fff; }
html body #xr-page #room-types .xr-roomnav:active { transform: scale(.94); }
html body #xr-page #room-types .xr-roomnav:focus-visible { outline: 2px solid var(--xr-ink); outline-offset: 3px; }
html body #xr-page #room-types .xr-roompager-count { font-size: 13px; font-weight: 600; letter-spacing: .12em; color: var(--xr-clay); min-width: 48px; text-align: center; }

html.xr-tabs-js body #xr-page #room-types .xr-rcard { transition: opacity .5s cubic-bezier(.22, .61, .36, 1); }
html.xr-tabs-js body #xr-page #room-types .xr-rcard.is-fading { opacity: 0; transition-duration: .22s; }
@media (prefers-reduced-motion: reduce) {
	html.xr-tabs-js body #xr-page #room-types .xr-rcard { transition: none; }
}

@media (min-width: 961px) {
	html body #xr-page #room-types .xr-rooms2-list {
		max-width: calc(var(--xr-max) + 112px);
		padding-left: 80px;
		padding-right: 80px;
		--xr-rvid: clamp(340px, min(calc((min(100vw - 17px, var(--xr-max) + 112px) - 160px - 40px) * .555), calc(100vh - var(--xr-secnav-h, 77px) - 58px - 40px - 20px)), 600px);
	}
	html body #xr-page #room-types .xr-roompager { position: static; }
	html body #xr-page #room-types .xr-roompager-count { display: none; }
	html body #xr-page #room-types .xr-roomnav { position: absolute; z-index: 2; top: calc(40px + var(--xr-rvid) / 2); transform: translateY(-50%); }
	html body #xr-page #room-types .xr-roomnav:active { transform: translateY(-50%) scale(.94); }
	html body #xr-page #room-types .xr-roomnav--prev { left: 16px; }
	html body #xr-page #room-types .xr-roomnav--next { right: 16px; }
}
@media (min-width: 961px) and (max-width: 1199px) {
	html body #xr-page #room-types .xr-rooms2-list {
		padding-left: 68px; padding-right: 68px;
		--xr-rvid: clamp(320px, min(calc((min(100vw - 17px, var(--xr-max) + 112px) - 136px - 28px) * .569), calc(100vh - var(--xr-secnav-h, 77px) - 58px - 40px - 20px)), 560px);
	}
	html body #xr-page #room-types .xr-roomnav--prev { left: 10px; }
	html body #xr-page #room-types .xr-roomnav--next { right: 10px; }
}
@media (min-width: 961px) and (max-height: 800px) {
	html body #xr-page #room-types .xr-rcard .xr-rcard-side .xr-slider { min-height: 140px; }
	html body #xr-page #room-types .xr-rcard .xr-rcard-side .xr-rcard-body { padding-top: 14px; }
	html body #xr-page #room-types .xr-rcard .xr-room-text { margin-bottom: 10px; }
	html body #xr-page #room-types .xr-rcard .xr-room-features { margin-bottom: 12px; }
	html body #xr-page #room-types .xr-rcard .xr-room-features li { margin-bottom: 2px; }
}

/* Tablets + phones: "‹ 1 / 4 ›" under the card */
@media (max-width: 960px) {
	html body #xr-page #room-types .xr-rooms2-list { padding-top: 28px; }
	html body #xr-page #room-types .xr-roompager { display: flex; align-items: center; justify-content: center; gap: 18px; margin-top: 20px; }
	html body #xr-page #room-types .xr-roomnav { width: 40px; height: 40px; }
}

/* Phones: photo + text + links + arrows fit the screen under the menu + tabs (~48px) */
@media (max-width: 700px) {
	html body #xr-page #room-types .xr-rooms2-list { padding-top: 16px; }
	html body #xr-page #room-types .xr-roompager { margin-top: 14px; }
	html body #xr-page #room-types .xr-rcard .xr-rcard-side {
		display: flex;
		flex-direction: column;
		height: max(400px, calc(100svh - var(--xr-secnav-h, 97px) - 48px - 16px - 54px - 14px));
	}
	html body #xr-page #room-types .xr-rcard .xr-rcard-side .xr-slider { flex: 1 1 auto; min-height: 130px; display: flex; }
	html body #xr-page #room-types .xr-rcard .xr-rcard-side .xr-slider-track { flex: 1; aspect-ratio: auto; }
	html body #xr-page #room-types .xr-rcard .xr-rcard-side .xr-rcard-body { flex: none; padding-top: 14px; }
	html body #xr-page #room-types .xr-rcard .xr-room-text { margin-bottom: 10px; }
	html body #xr-page #room-types .xr-rcard .xr-room-features { margin-bottom: 10px; }
	html body #xr-page #room-types .xr-rcard .xr-room-features li { margin-bottom: 2px; }
}

/* ---------- Card proportions (Rooms hub 3rd + 4th round), desktop ---------- */
@media (min-width: 961px) {
	html body #xr-page #room-types .xr-rooms2-list {
		--xr-rvid: clamp(460px, min(calc((min(100vw - 17px, var(--xr-max) + 112px) - 160px - 40px) / 1.85), calc(100vh - var(--xr-secnav-h, 77px) - 58px - 40px - 20px)), 600px);
		--xr-rcol: calc(var(--xr-rvid) * .85);
	}
	html body #xr-page #room-types .xr-rcard { grid-template-columns: var(--xr-rvid) var(--xr-rcol); justify-content: center; gap: 40px; }
	html body #xr-page #room-types .xr-rcard .xr-rcard-side .xr-slider {
		flex: 1 1 auto;
		min-height: calc(var(--xr-rcol) / 1.75);
		max-height: calc(var(--xr-rcol) / 1.5);
	}
	html body #xr-page #room-types .xr-rcard .xr-rcard-side .xr-rcard-body { flex: .001 0 auto; display: flex; flex-direction: column; padding-top: 16px; }
	html body #xr-page #room-types .xr-rcard .xr-rcard-actions { margin-top: auto; }
	html body #xr-page #room-types .xr-rcard .xr-room-label { font-size: 12.5px; margin-bottom: 4px; }
	html body #xr-page #room-types .xr-rcard .xr-rcard-title { font-size: 25px; line-height: 1.25; margin-bottom: 6px; }
	html body #xr-page #room-types .xr-rcard .xr-room-text { font-size: 14.5px; line-height: 1.5; margin-bottom: 10px; }
	html body #xr-page #room-types .xr-rcard .xr-room-features { margin-bottom: 10px; }
	html body #xr-page #room-types .xr-rcard .xr-room-features li { font-size: 14px; margin-bottom: 2px; line-height: 1.45; gap: 10px; }
	html body #xr-page #room-types .xr-rcard .xr-room-features .xr-icon { width: 18px; height: 18px; }
	html body #xr-page #room-types .xr-rcard .xr-room-link { font-size: 13px; padding-bottom: 4px; }
}
@media (min-width: 1360px) and (min-height: 820px) {
	html body #xr-page #room-types .xr-rcard .xr-rcard-title { font-size: 27px; }
	html body #xr-page #room-types .xr-rcard .xr-room-text { font-size: 15.5px; }
	html body #xr-page #room-types .xr-rcard .xr-room-features li { font-size: 15px; margin-bottom: 3px; }
}
@media (min-width: 961px) {
	html body #xr-page #room-types .xr-roomnav--prev { left: max(12px, calc(50% - (var(--xr-rvid) + 40px + var(--xr-rcol)) / 2 - 68px)); }
	html body #xr-page #room-types .xr-roomnav--next { right: max(12px, calc(50% - (var(--xr-rvid) + 40px + var(--xr-rcol)) / 2 - 68px)); }
	html body #xr-page #room-types .xr-rcard { align-items: stretch; }
	html body #xr-page #room-types .xr-rcard .xr-rcard-video { align-self: stretch; aspect-ratio: auto; height: auto; min-height: var(--xr-rvid); }
	html body #xr-page #room-types .xr-rcard .xr-rcard-actions { margin-bottom: 0; }
	html body #xr-page #room-types .xr-rcard .xr-rcard-actions .xr-room-link { line-height: 1.2; }
}

/* ---------- Phones: "Explore" links on ONE line (xinalani-ui stacks .xr-room-link as full-width blocks → !important) ---------- */
@media (max-width: 700px) {
	html body #xr-page #room-types .xr-rcard .xr-rcard-actions {
		display: flex !important;
		flex-direction: row !important;
		flex-wrap: nowrap !important;
		align-items: center !important;
		gap: 0 22px !important;
		width: 100%;
		margin-top: 24px !important;
	}
	html body #xr-page #room-types .xr-rcard .xr-rcard-actions .xr-room-link {
		display: inline-block !important;
		flex: 0 1 auto !important;
		width: auto !important;
		min-height: 0 !important;
		margin: 0 !important;
		padding: 0 0 6px !important;
		white-space: nowrap !important;
		font-size: clamp(12.5px, 3.7vw, 13.6px) !important;   /* = eyebrow */
		letter-spacing: .1em !important;
		line-height: 1.3 !important;
	}
}
html body #xr-page #room-types .xr-roomnav:hover { background: transparent; color: var(--xr-clay); }
@media (hover: hover) and (pointer: fine) {
	html body #xr-page #room-types .xr-roomnav:hover { background: var(--xr-clay); color: #fff; }
}

/* Short link labels on phones ("Small Palapa · Big Palapa") */
html body #xr-page #room-types .xr-link-full { display: inline; }
html body #xr-page #room-types .xr-link-short { display: none; }
@media (max-width: 700px) {
	html body #xr-page #room-types .xr-link-full { display: none; }
	html body #xr-page #room-types .xr-link-short { display: inline; }
}

/* Selected tab bold without moving the text */
html body #xr-page #room-types .xr-roomtabs .xr-roomtab { font-weight: 400; -webkit-text-stroke: 0 transparent; }
html body #xr-page #room-types .xr-roomtabs .xr-roomtab.is-active,
html body #xr-page #room-types .xr-roomtabs .xr-roomtab[aria-selected="true"] { -webkit-text-stroke: .55px currentColor; }
@media (max-width: 700px) {
	html body #xr-page #room-types .xr-roomtabs .xr-roomtab.is-active,
	html body #xr-page #room-types .xr-roomtabs .xr-roomtab[aria-selected="true"] { -webkit-text-stroke-width: .5px; }
}

/* ---------- Typography v2 (director's Canva), room tabs + card only, desktop ---------- */
@media (min-width: 961px) {
	html body #xr-page #room-types .xr-rooms2-list { --xr-ct: clamp(12px, calc(var(--xr-rvid) * .026), 15.5px); }
	html body #xr-page #room-types .xr-roomtabs .xr-roomtab { font-size: 17px; line-height: 1.3; }
	html body #xr-page #room-types .xr-rcard .xr-room-label { font-size: calc(var(--xr-ct) * .86); font-weight: 600; letter-spacing: .12em; line-height: 1.3; margin-bottom: .45em; }
	html body #xr-page #room-types .xr-rcard .xr-rcard-title { font-size: calc(var(--xr-ct) * 1.72); line-height: 1.25; margin-bottom: .45em; }
	html body #xr-page #room-types .xr-rcard .xr-room-text { font-size: var(--xr-ct); line-height: 1.4; margin-bottom: .8em; }
	html body #xr-page #room-types .xr-rcard .xr-room-features { margin-bottom: .7em; }
	html body #xr-page #room-types .xr-rcard .xr-room-features li { font-size: calc(var(--xr-ct) * .97); line-height: 1.7; margin-bottom: 0; }
	html body #xr-page #room-types .xr-rcard .xr-rcard-actions .xr-room-link { font-size: calc(var(--xr-ct) * .9); font-weight: 600; letter-spacing: .12em; line-height: 1.3; }
	html body #xr-page #room-types .xr-rcard .xr-rcard-side .xr-rcard-body { padding-top: 12px; }
	html body #xr-page #room-types .xr-rcard .xr-room-features .xr-icon { width: 1.35em; height: 1.35em; }
}

/* ---------- Photos: "enlarge" icon + full-screen photo viewer ---------- */
html body #xr-page #room-types .xr-slide img { cursor: zoom-in; }
html body #xr-page #room-types .xr-slider-zoom {
	position: absolute; top: 12px; right: 12px; z-index: 2;
	display: flex; align-items: center; justify-content: center;
	width: 40px; height: 40px; border-radius: 50%;
	border: 1px solid rgba(255,255,255,.9); background: rgba(32,30,29,.35); color: #fff;
	pointer-events: none; /* the click goes to the photo underneath */
	opacity: 0; transition: opacity .2s;
}
@media (hover: hover) {
	html body #xr-page #room-types .xr-slider:hover .xr-slider-zoom { opacity: 1; }
}
@media (hover: none) { /* phones + tablets: no mouse, so the icon is always shown */
	html body #xr-page #room-types .xr-slider-zoom { opacity: 1; width: 34px; height: 34px; top: 10px; right: 10px; }
	html body #xr-page #room-types .xr-slider-zoom svg { width: 16px; height: 16px; }
}
html body #xr-page #room-types .xr-slider.is-on-video .xr-slider-zoom { display: none; } /* the video can't be enlarged */

html.xr-lightbox-open { overflow: hidden; } /* no page scroll behind the viewer */
html body #xr-page .xr-lightbox {
	position: fixed; inset: 0; z-index: 100000;
	display: flex; align-items: center; justify-content: center;
	padding: 56px 72px; background: rgba(20,18,17,.92);
}
html body #xr-page .xr-lightbox[hidden] { display: none; }
html body #xr-page .xr-lightbox-img {
	display: block; width: auto; height: auto; max-width: 100%; max-height: 100%;
	object-fit: contain; border-radius: 4px; box-shadow: 0 10px 40px rgba(0,0,0,.4);
}
html body #xr-page .xr-lightbox-close {
	position: absolute; top: 14px; right: 14px;
	display: flex; align-items: center; justify-content: center;
	width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%;
	background: transparent; color: #fff; cursor: pointer; transition: background-color .2s;
}
html body #xr-page .xr-lightbox-close:hover { background: rgba(255,255,255,.15); }
html body #xr-page .xr-lightbox .xr-slider-btn { width: 48px; height: 48px; }
html body #xr-page .xr-lightbox-prev { left: 14px; }
html body #xr-page .xr-lightbox-next { right: 14px; }
html body #xr-page .xr-lightbox-count {
	position: absolute; bottom: 16px; left: 50%; transform: translateX(-50%);
	color: #fff; font-size: 14px; letter-spacing: .06em;
}
html body #xr-page .xr-lightbox.is-single .xr-slider-btn,
html body #xr-page .xr-lightbox.is-single .xr-lightbox-count { display: none; }
@media (max-width: 700px) {
	html body #xr-page .xr-lightbox { padding: 60px 8px; }
	html body #xr-page .xr-lightbox .xr-slider-btn { top: auto; bottom: 8px; transform: none; width: 42px; height: 42px; }
	html body #xr-page .xr-lightbox-count { bottom: 20px; }
}