/**
 * TemplatePressor published pages — full-width canvas (Elementor-style blank template).
 *
 * Sticky scroll pins (Immersive Corridor, Scroll Scene, etc.) attach to the nearest
 * ancestor with a non-visible overflow. Putting overflow-y:auto on a height:auto body
 * creates a false scroll containment: body grows with content and never scrolls, while
 * the viewport does — so pins scrub but slide away with the page. Keep document scroll
 * on html; body stays overflow-y:visible. Prefer overflow-x:clip (does not create a
 * scrollport) over hidden for horizontal rubber-band clipping.
 */

html:has(body.pressor-canvas-template),
html:has(body.pressor-page) {
	height: auto !important;
	min-height: 100%;
	max-height: none !important;
	overflow-x: clip;
	overflow-y: auto;
}

body.pressor-page,
body.pressor-canvas-template {
	height: auto !important;
	min-height: 100%;
	max-height: none !important;
	margin: 0;
	padding: 0;
	overflow-x: clip;
	overflow-y: visible;
}

body.pressor-canvas-template #page,
body.pressor-canvas-template .site,
body.pressor-canvas-template .site-content,
body.pressor-canvas-template .content-area,
body.pressor-canvas-template .entry-content,
body.pressor-canvas-template .wp-block-post-content,
body.pressor-canvas-template .wp-site-blocks,
body.pressor-page #page,
body.pressor-page .site,
body.pressor-page .site-content,
body.pressor-page .content-area,
body.pressor-page .entry-content,
body.pressor-page .wp-block-post-content,
body.pressor-page .wp-site-blocks {
	width: 100% !important;
	max-width: none !important;
	height: auto !important;
	min-height: 0 !important;
	max-height: none !important;
	margin: 0 !important;
	padding: 0 !important;
	overflow: visible !important;
}

.pressor-page-root {
	display: block;
	width: 100%;
	max-width: none;
	min-height: auto;
	height: auto;
	margin: 0;
	padding: 0;
	overflow: visible;
	box-sizing: border-box;
}

body.pressor-page .tp-ui-screen,
body.pressor-page .tp-screen-inner,
body.pressor-page .pressor-page-canvas {
	width: 100% !important;
	max-width: none !important;
	height: auto !important;
	max-height: none !important;
	margin: 0 !important;
	overflow: visible !important;
	box-sizing: border-box;
}

body.pressor-page .tp-ui-screen,
body.pressor-page .pressor-page-canvas {
	position: relative;
	min-height: auto;
	color: #e2e8f0;
}

body.pressor-page .pressor-page-canvas[data-tp-free-layout="1"] {
	min-height: 100vh;
}

/* Map backdrop: abspos page-bg ignores parent min-height. Own a viewport box. */
body.pressor-page .pressor-page-canvas:has(.tp-ui-page-background--map),
body.pressor-canvas-template .pressor-page-canvas:has(.tp-ui-page-background--map),
body.pressor-tp-preview .pressor-page-canvas:has(.tp-ui-page-background--map) {
	min-height: 100vh !important;
	min-height: 100dvh !important;
}
body.pressor-page .tp-ui-page-background--map,
body.pressor-canvas-template .tp-ui-page-background--map,
body.pressor-tp-preview .tp-ui-page-background--map {
	min-height: 100vh;
	min-height: 100dvh;
}

/* Flow full-page canvases (Login, etc.): builder stretches the stage to the
   viewport, but publish inlined min-height:auto and node_root min-height:0.
   Backdrop can still paint 100vh; colored columns then hug the form. */
body.pressor-canvas-template .pressor-page-root,
body.pressor-page.pressor-canvas-template .pressor-page-canvas,
body.pressor-canvas-template .tp-ui-screen.pressor-page-canvas {
	min-height: 100vh !important;
	min-height: 100dvh !important;
}

/**
 * Page-bg WebGL "Pin to viewport center" — must ship on every live canvas page.
 * Publish CSS collection used to skip WEBGL_LAYER_CSS when PAGE_BACKGROUND_CSS
 * already contained `.tp-ui-webgl-layer{` (transform override), so these rules
 * never baked and pinned layers stayed position:static (scrolled away).
 */
body.pressor-page .tp-ui-webgl-layer--page.tp-ui-webgl-layer--viewport-fixed,
body.pressor-canvas-template .tp-ui-webgl-layer--page.tp-ui-webgl-layer--viewport-fixed {
	/* Sticky, not fixed: canvas isolation + FuturNav (fixed/sticky chrome
	   or a z-index:1 wrapper panel) turns position:fixed into a trapped
	   or behind-the-theme layer. Sticky stays in the page-bg box and
	   still pins the preset to the viewport. */
	position: sticky !important;
	inset: auto !important;
	top: 0 !important;
	left: 0 !important;
	right: 0 !important;
	width: 100% !important;
	min-width: 0 !important;
	height: 100vh !important;
	max-height: 100dvh;
	z-index: 0 !important;
	pointer-events: none;
}
body.pressor-page .tp-ui-page-background:has(> .tp-ui-webgl-layer--viewport-fixed),
body.pressor-canvas-template .tp-ui-page-background:has(> .tp-ui-webgl-layer--viewport-fixed) {
	z-index: 0 !important;
	overflow: visible !important;
}
body.pressor-page .tp-ui-canvas-root:has(.tp-ui-webgl-layer--viewport-fixed),
body.pressor-page .pressor-page-canvas:has(.tp-ui-webgl-layer--viewport-fixed),
body.pressor-page .tp-screen-inner:has(.tp-ui-webgl-layer--viewport-fixed),
body.pressor-canvas-template .tp-ui-canvas-root:has(.tp-ui-webgl-layer--viewport-fixed),
body.pressor-canvas-template .pressor-page-canvas:has(.tp-ui-webgl-layer--viewport-fixed),
body.pressor-canvas-template .tp-screen-inner:has(.tp-ui-webgl-layer--viewport-fixed) {
	isolation: isolate;
	z-index: 0;
}

/**
 * WebGL section hosts inside grids (and alone) must own height on published
 * auto-height canvases. Absolute shader planes + empty overlays contribute 0
 * in-flow size — builder shell height masks that; the live page does not.
 */
body.pressor-page .tp-ui-webgl-layer.tp-ui-webgl-layer--section-host {
	--tp-webgl-section-min: 240px;
	min-height: var(--tp-webgl-section-min);
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	grid-template-rows: minmax(var(--tp-webgl-section-min), auto);
}
body.pressor-page .tp-ui-webgl-layer--section-host > .tp-ui-webgl-layer__content {
	min-height: var(--tp-webgl-section-min);
	align-self: stretch;
}
body.pressor-page .tp-ui-grid-cell > .tp-ui-webgl-layer--section-host,
body.pressor-page .tp-ui-panel.tp-ui-grid-cell > .tp-ui-webgl-layer--section-host,
body.pressor-page .tp-ui-grid > .tp-ui-panel > .tp-ui-webgl-layer--section-host {
	width: 100%;
	height: 100%;
	min-height: max(100%, var(--tp-webgl-section-min));
	align-self: stretch;
}
body.pressor-page .tp-ui-grid > .tp-ui-panel.tp-ui-grid-cell,
[data-tp-builder-canvas] .tp-ui-grid > .tp-ui-panel.tp-ui-grid-cell {
	min-height: 240px;
}

/**
 * Optional: hide theme chrome when the per-page toggle is on (non-canvas theme templates).
 */
body.pressor-clean-canvas:not(.pressor-canvas-template) header.site-header,
body.pressor-clean-canvas:not(.pressor-canvas-template) .site-header,
body.pressor-clean-canvas:not(.pressor-canvas-template) .wp-block-template-part[data-area="header"],
body.pressor-clean-canvas:not(.pressor-canvas-template) .wp-site-blocks > header,
body.pressor-clean-canvas:not(.pressor-canvas-template) .entry-header,
body.pressor-clean-canvas:not(.pressor-canvas-template) .page-header,
body.pressor-clean-canvas:not(.pressor-canvas-template) .page-title,
body.pressor-clean-canvas:not(.pressor-canvas-template) h1.entry-title,
body.pressor-clean-canvas:not(.pressor-canvas-template) h1.wp-block-post-title {
	display: none !important;
}

body.pressor-clean-canvas:not(.pressor-canvas-template) footer.site-footer,
body.pressor-clean-canvas:not(.pressor-canvas-template) .site-footer,
body.pressor-clean-canvas:not(.pressor-canvas-template) .wp-block-template-part[data-area="footer"],
body.pressor-clean-canvas:not(.pressor-canvas-template) .wp-site-blocks > footer,
body.pressor-clean-canvas:not(.pressor-canvas-template) .entry-footer {
	display: none !important;
}

body.pressor-clean-canvas:not(.pressor-canvas-template) .wp-site-blocks {
	padding: 0 !important;
	margin: 0 !important;
}

body.pressor-clean-canvas:not(.pressor-canvas-template) .entry-content,
body.pressor-clean-canvas:not(.pressor-canvas-template) .wp-block-post-content {
	padding: 0 !important;
	margin: 0 !important;
	max-width: none !important;
}

body.pressor-clean-canvas:not(.pressor-canvas-template) .wp-block-group.alignfull.has-global-padding {
	padding-left: 0 !important;
	padding-right: 0 !important;
}

/* Page cursor hide-OS — kept on the always-enqueued canvas sheet so live pages
   still hide the system pointer when pressor-page-options.css is not loaded. */
html[class*='pressor-po-cursor-'],
html[class*='pressor-po-cursor-'] *,
html.tp-cursor-engine--hide-os,
html.tp-cursor-engine--hide-os * {
	cursor: none !important;
}

html.tp-cursor-engine--paused.tp-cursor-engine--hide-os,
html.tp-cursor-engine--paused.tp-cursor-engine--hide-os * {
	cursor: auto !important;
}

/**
 * FuturNav color chrome — always-enqueued so mid-file @import in baked page CSS
 * cannot drop monogram / CTA / link colors on a published page.
 */
body.pressor-page .tp-ui-futur-nav-header,
body.pressor-canvas-template .tp-ui-futur-nav-header {
	--tp-fn-primary: #6366f1;
	--tp-fn-secondary: #06b6d4;
	--tp-fn-accent: #a855f7;
	--tp-fn-nav-bg: rgba(0, 0, 0, 0.4);
	--tp-fn-nav-solid: rgba(0, 0, 0, 0.85);
	--tp-fn-text: #fff;
	color: var(--tp-fn-text);
}
body.pressor-page .tp-ui-fn-nav,
body.pressor-canvas-template .tp-ui-fn-nav {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 1rem 2rem;
	background: linear-gradient(90deg, #4f46e5, #0f172a 46%, #7c3aed);
	/* No backdrop-filter: Chrome drops sibling WebGL canvases from the
	   compositor when any backdrop-filter is on the page. */
}
body.pressor-page .tp-ui-fn-nav__monogram:not(.tp-ui-fn-nav__monogram--image),
body.pressor-canvas-template .tp-ui-fn-nav__monogram:not(.tp-ui-fn-nav__monogram--image) {
	background: linear-gradient(135deg, var(--tp-fn-primary), var(--tp-fn-accent));
	color: #fff;
}
body.pressor-page .tp-ui-fn-nav__cta,
body.pressor-canvas-template .tp-ui-fn-nav__cta {
	background: linear-gradient(135deg, var(--tp-fn-primary), var(--tp-fn-accent));
	color: #fff;
}
body.pressor-page .tp-ui-fn-nav__brand-text,
body.pressor-canvas-template .tp-ui-fn-nav__brand-text {
	color: var(--tp-fn-text);
}
body.pressor-page .tp-ui-fn-nav__link,
body.pressor-canvas-template .tp-ui-fn-nav__link {
	color: rgba(255, 255, 255, 0.7);
}
body.pressor-page .tp-ui-fn-nav__link:hover,
body.pressor-page .tp-ui-fn-nav__link.is-active,
body.pressor-canvas-template .tp-ui-fn-nav__link:hover,
body.pressor-canvas-template .tp-ui-fn-nav__link.is-active {
	color: var(--tp-fn-secondary);
}

/**
 * FuturNav + page-bg WebGL. Isolation on the canvas turns position:fixed
 * into a canvas-local box — a nested header (inside a panel) stayed fixed
 * because the old rule required a direct child, and the shader vanished.
 * Sticky keeps the bar pinned. Hide the flow spacer (header is in-flow).
 */
body.pressor-page .pressor-page-canvas > [data-tp-node-id]:has(> .tp-ui-futur-nav-header),
body.pressor-page .pressor-page-canvas > .tp-ui-onclick-link > [data-tp-node-id]:has(> .tp-ui-futur-nav-header),
body.pressor-canvas-template .pressor-page-canvas > [data-tp-node-id]:has(> .tp-ui-futur-nav-header),
body.pressor-canvas-template .pressor-page-canvas > .tp-ui-onclick-link > [data-tp-node-id]:has(> .tp-ui-futur-nav-header) {
	z-index: 1030;
	position: relative;
	background: transparent !important;
}
body.pressor-page .pressor-page-canvas:has(.tp-ui-page-background--has-webgl) .tp-ui-futur-nav-header[data-tp-fn-fixed="1"],
body.pressor-canvas-template .pressor-page-canvas:has(.tp-ui-page-background--has-webgl) .tp-ui-futur-nav-header[data-tp-fn-fixed="1"] {
	position: sticky !important;
	top: 0 !important;
	left: auto !important;
	right: auto !important;
	bottom: auto !important;
	width: 100% !important;
	z-index: 1030;
	isolation: auto;
}
body.pressor-page .pressor-page-canvas:has(.tp-ui-page-background--has-webgl) .tp-ui-futur-nav-offset,
body.pressor-canvas-template .pressor-page-canvas:has(.tp-ui-page-background--has-webgl) .tp-ui-futur-nav-offset {
	display: none !important;
}
body.pressor-page:has(.tp-ui-page-background--has-webgl) .tp-ui-futur-nav-header,
body.pressor-canvas-template:has(.tp-ui-page-background--has-webgl) .tp-ui-futur-nav-header,
body.pressor-page:has(.tp-ui-page-background--has-webgl) .tp-ui-futur-nav-header *,
body.pressor-canvas-template:has(.tp-ui-page-background--has-webgl) .tp-ui-futur-nav-header * {
	backdrop-filter: none !important;
	-webkit-backdrop-filter: none !important;
	filter: none !important;
	isolation: auto !important;
	will-change: auto !important;
	contain: none !important;
}
body.pressor-page:has(.tp-ui-page-background--has-webgl) .tp-ui-fn-nav,
body.pressor-canvas-template:has(.tp-ui-page-background--has-webgl) .tp-ui-fn-nav {
	transition: background 0.3s ease, box-shadow 0.3s ease !important;
}
#pressor-fn-nav-host {
	position: relative;
	z-index: 1030;
	width: 100%;
}

/**
 * Page-bg WebGL: isolate the canvas so the shader stays in the page stack
 * (never z-index:-1 behind the theme). Do not paint a preset-specific fill —
 * that froze aurora on every page and hid Pressor Prism after a preset change.
 */
html:has(.tp-ui-page-background--has-webgl),
body.pressor-page:has(.tp-ui-page-background--has-webgl),
body.pressor-canvas-template:has(.tp-ui-page-background--has-webgl) {
	background: #070b12 !important;
}
body.pressor-page .pressor-page-canvas:has(.tp-ui-page-background--has-webgl),
body.pressor-canvas-template .pressor-page-canvas:has(.tp-ui-page-background--has-webgl) {
	isolation: isolate;
	z-index: 0;
	/* Beat the published inline background:transparent so the WP theme
	   cannot show through when the shader is still binding. */
	background: #070b12 !important;
}
body.pressor-page .tp-ui-page-background--has-webgl,
body.pressor-canvas-template .tp-ui-page-background--has-webgl {
	position: absolute !important;
	inset: 0 !important;
	z-index: 0 !important;
	width: 100% !important;
	min-height: 100vh !important;
	height: 100% !important;
}
body.pressor-page .tp-ui-page-background--has-webgl > .tp-ui-webgl-layer--page,
body.pressor-canvas-template .tp-ui-page-background--has-webgl > .tp-ui-webgl-layer--page {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	min-height: 100vh;
}
body.pressor-page .tp-ui-webgl-layer--page.tp-ui-webgl-layer--viewport-fixed,
body.pressor-canvas-template .tp-ui-webgl-layer--page.tp-ui-webgl-layer--viewport-fixed {
	z-index: 0 !important;
	background: #070b12;
}
body.pressor-page .tp-ui-webgl-layer--page.tp-ui-webgl-layer--live > .tp-ui-webgl-layer__canvas,
body.pressor-canvas-template .tp-ui-webgl-layer--page.tp-ui-webgl-layer--live > .tp-ui-webgl-layer__canvas {
	opacity: 1;
	z-index: 1;
}

/**
 * Transparent corridor + page-bg WebGL: do not paint the pin's grey veil over
 * the page shader.
 */
body.pressor-page .pressor-page-canvas:has(.tp-ui-page-background--has-webgl) .tp-ui-immersive-world--transparent .tp-ui-immersive-world__pin,
body.pressor-canvas-template .pressor-page-canvas:has(.tp-ui-page-background--has-webgl) .tp-ui-immersive-world--transparent .tp-ui-immersive-world__pin {
	background: transparent;
}
