/* Rise With Teagan — funnel chrome
   ------------------------------------------------------------------
   Shared header and footer treatment for every page that exists to get one
   decision made: lead magnet landing pages, the confirmation page, membership
   signup, and the checkout steps to come.

   Scoped to a single body class, `rwt-funnel`, rather than one per page type.
   Any page that adds that class gets the stripped chrome — which is what stops
   this file growing a new selector every time the funnel gains a step.

   Figma 1437-4536 (header) and 1437-4689 (footer).

   Header: terracotta bar, logo centred, nothing else. No announcement banner,
   no search, no account, no nav — each of those is an exit from the one action
   the page is asking for.

   Footer: centred logo, then the legal links, then the copyright line.

   NOTE: the Elementor element ids below are load-bearing. Those containers
   carry no semantic classes, so the ids are the only stable hook available
   without forking the header/footer templates. If either is rebuilt in
   Elementor these selectors need revisiting — that is the trade for not
   maintaining a second copy of the site chrome.                            */

/* ---------------------------------------------------------------- header */

/* Announcement banner — it advertises the recipe book, which is a different
   decision to the one this page is asking for. */
body.rwt-funnel .elementor-element-4c0007e,

/* Search / account / burger cluster. */
body.rwt-funnel .elementor-element-8c26c22,

/* Main nav and its off-canvas panel. */
body.rwt-funnel .elementor-element-4d3b74d,
body.rwt-funnel .elementor-element-2d14c35 {
	display: none;
}

/* The site header sticks at top:-42px, which is exactly the banner's height —
   that is how the banner scrolls away while the logo bar stays put. With the
   banner removed here, the same offset drags the bar itself off the top of the
   viewport, so it sticks flush instead. */
body.rwt-funnel .elementor-location-header {
	top: 0;
}

/* Logo alone, centred on the 100px bar. */
body.rwt-funnel .elementor-element-e20438a > .e-con-inner {
	justify-content: center;
	align-items: center;
	min-height: 100px;
}

/* ---------------------------------------------------------------- footer */

/* The full footer block is hidden except for its logo, which the design keeps.
   Restoring the block and hiding its siblings is less brittle than rebuilding
   a second footer that would then drift from the real one. */
body.rwt-funnel .elementor-location-footer .elementor-element-fe8b06f {
	display: flex;
	padding: 46px 24px 0;
	/* The site footer rules a line under this block to separate it from the
	   sitemap columns. With those gone there is nothing to separate. */
	border-bottom: 0;
}

body.rwt-funnel .elementor-location-footer .elementor-element-a394087,
body.rwt-funnel .elementor-location-footer .elementor-element-b2675e4,
body.rwt-funnel .elementor-location-footer .elementor-element-e427d6c {
	display: none;
}

body.rwt-funnel .elementor-location-footer .elementor-element-bbcabdc,
body.rwt-funnel .elementor-location-footer .elementor-element-c8df2ab {
	width: 100%;
	max-width: none;
	justify-content: center;
	align-items: center;
	padding: 0;
}

body.rwt-funnel .elementor-location-footer .elementor-element-f1455a5 img {
	width: 138px;
	height: auto;
	display: block;
	margin: 0 auto;
}

/* Bottom bar: three centred lines instead of the site's left/centre/right
   split. The links take a full row; the copyright and the credit share one. */
body.rwt-funnel .elementor-location-footer .elementor-element-6dfb807 > .e-con-inner {
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 6px 8px;
	padding: 20px 24px 46px;
}

body.rwt-funnel .elementor-location-footer .elementor-element-d3f6413 {
	order: 1;
	flex: 0 0 100%;
	width: 100%;
	justify-content: center;
	gap: 8px;
}

body.rwt-funnel .elementor-location-footer .elementor-element-3c58c0f {
	order: 2;
	flex: 0 0 auto;
	width: auto;
}

body.rwt-funnel .elementor-location-footer .elementor-element-f02f457 {
	order: 3;
	flex: 0 0 auto;
	width: auto;
}

/* Middot separators, as drawn — between the two links, and between the
   copyright and the credit.

   Applied to the heading widgets, never to an .e-con container: Elementor
   already uses ::before on containers as an absolutely-positioned background
   overlay, so a separator put there is invisible. The widget is flexed so the
   middot sits beside the text rather than on a line of its own above it. */
body.rwt-funnel .elementor-location-footer .elementor-element-576dabf,
body.rwt-funnel .elementor-location-footer .elementor-element-c145260 {
	display: flex;
	align-items: center;
	gap: 8px;
}

body.rwt-funnel .elementor-location-footer .elementor-element-576dabf::before,
body.rwt-funnel .elementor-location-footer .elementor-element-c145260::before {
	content: "·";
	position: static;
	/* No opacity knocked off it — the copyright line is already muted, so a
	   further 0.65 left the separator all but invisible against the terracotta. */
	opacity: 1;
}

/* ================================================================ mobile

   The 100px bar is a desktop figure from the design. On a phone it was taking
   12% of the screen to hold a 120px logo, so it comes down to 64px. */

@media ( max-width: 800px ) {

	body.rwt-funnel .elementor-element-e20438a > .e-con-inner {
		min-height: 64px;
		padding-top: 0;
		padding-bottom: 0;
	}

	body.rwt-funnel .elementor-location-footer .elementor-element-fe8b06f {
		padding-top: 34px;
	}

	body.rwt-funnel .elementor-location-footer .elementor-element-6dfb807 > .e-con-inner {
		padding-bottom: 34px;
	}
}

/* ---------------------------------------------- processing overlay (Lane C) */

/* Shown between "Complete my order" / "Sign Up" and the next page arriving.
   Both checkouts (FunnelKit store checkout and MemberPress /register/) load
   this sheet, so the overlay lives here once and each checkout only adds its
   own button state. Driven by rwt-processing-overlay.php + processing-overlay.js:
   the script mirrors the plugins' own busy signals (Woo's form.processing /
   whole-form blockUI, MemberPress's disabled .mepr-submit) so it never has
   to know which gateway is charging the card. Steve, 2026-08-16: the default
   Woo dim ("page sort of dulls out") sat there ~10s with nothing saying the
   payment was processing — people thought the site had frozen.

   Stripe's 3-D Secure challenge iframe uses the maximum z-index, so it
   always sits above this and stays usable. */
body.rwt-funnel .rwt-processing {
	position: fixed;
	inset: 0;
	z-index: 99990;
	display: none;
	align-items: center;
	justify-content: center;
	padding: 24px;
	background: rgba( 245, 233, 226, 0.94 ); /* cream #F5E9E2 */
	-webkit-backdrop-filter: blur( 2px );
	backdrop-filter: blur( 2px );
}

body.rwt-funnel .rwt-processing.is-on {
	display: flex;
	animation: rwt-processing-in 0.22s ease-out both;
}

body.rwt-funnel .rwt-processing__card {
	box-sizing: border-box;
	width: 100%;
	max-width: 420px;
	padding: 36px 32px 32px;
	background: var( --e-global-color-d3c7489, #FFFFFF );
	border: 1px solid var( --e-global-color-ec00e88, #F0D5CF );
	border-radius: 16px;
	box-shadow: 0 16px 48px rgba( 61, 50, 43, 0.12 );
	text-align: center;
}

body.rwt-funnel .rwt-processing__spinner {
	box-sizing: border-box;
	width: 48px;
	height: 48px;
	margin: 0 auto 20px;
	border-radius: 50%;
	border: 4px solid var( --e-global-color-ec00e88, #F0D5CF );
	border-top-color: var( --e-global-color-03edebf, #C46A5A ); /* terracotta */
	animation: rwt-processing-spin 0.9s linear infinite;
}

body.rwt-funnel .rwt-processing__title {
	margin: 0 0 8px;
	color: var( --e-global-color-03edebf, #C46A5A );
	font-family: var( --e-global-typography-primary-font-family, "DM Sans" ), sans-serif;
	font-size: 21px;
	font-weight: 600;
	line-height: 1.3;
}

body.rwt-funnel .rwt-processing__text {
	margin: 0;
	color: var( --e-global-color-text, #3D322B );
	font-family: var( --e-global-typography-primary-font-family, "DM Sans" ), sans-serif;
	font-size: 15px;
	line-height: 1.5;
}

@keyframes rwt-processing-spin {
	to { transform: rotate( 360deg ); }
}

@keyframes rwt-processing-in {
	from { opacity: 0; }
	to   { opacity: 1; }
}

@media ( prefers-reduced-motion: reduce ) {
	body.rwt-funnel .rwt-processing.is-on { animation: none; }
	body.rwt-funnel .rwt-processing__spinner {
		animation: none;
		border-color: var( --e-global-color-03edebf, #C46A5A );
		border-top-color: var( --e-global-color-ec00e88, #F0D5CF );
	}
}

/* Woo's own blockUI dim (white, 60%) is what read as "frozen". Keep its
   click-shield, drop its pixels — the overlay above carries the message. */
body.rwt-funnel.rwt-is-processing form.checkout > .blockUI.blockOverlay {
	opacity: 0 !important;
}