/*
 * Deliberate differences from the original, each explained. Everything else in
 * assets/css/ is generated by migration/carry_css.py and must not be hand-edited.
 */

/*
 * The main heading every page now has for search engines and screen readers
 * (migration/enhance-data.json, headings). Where the design's own title is not
 * a heading, this one is read but never drawn.
 */
.tr-hidden-h1 {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* ------------------------------------------------------------------
 * The payment plugin's "Processing..." overlay.
 *
 * It prints into every footer and is hidden by the plugin's own stylesheet,
 * which this build does not load (inc/upsell.php explains why). inc/upsell.php
 * also removes the markup on every page that has no checkout on it; this is the
 * lock that holds if a plugin release moves that hook, and the rule the
 * plugin's own script overrides inline when it really is working.
 * ------------------------------------------------------------------ */
.upsell-loader {
	display: none;
}

/* ------------------------------------------------------------------
 * Click-to-play videos (UABB video module): the player frame.
 *
 * The frame only exists after "play" is pressed, so carry_css.py -- which
 * keeps rules that match an element at page load -- dropped the rule that
 * sizes it, and the player drew at the browser's default 300x150 in the
 * top-left corner of the black box (Gerek, OTO1, 2026-09-30). Copied from
 * the original's bb-plugin/cache/210-layout.css. Five pages: Blueprint sales,
 * OTO1, OTO2, Show Don't Tell, the unlocked video.
 * ------------------------------------------------------------------ */
.uabb-video__outer-wrap iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 2;
	background: transparent;
}

/* ------------------------------------------------------------------
 * "To Watch For Free, Click Here" (home page and /writersroom-v2/sales/).
 *
 * Shown only at tablet and phone widths, where the original sets it at 17px
 * beside the 20px "If You're Ready To Start Now, Click Here" button directly
 * below it -- measured identical on the live site. Gerek asked for the two to
 * match (2026-09-30): the same 20px/20px as the other button.
 * ------------------------------------------------------------------ */
.fl-node-41unjr7sv2bw .uabb-creative-button-wrap .uabb-creative-button-text {
	font-size: 20px;
	line-height: 20px;
}

/* ------------------------------------------------------------------
 * Stacked columns use the full width on tablets.
 *
 * Beaver Builder's layout-base caps every "small" column (50% or less) at
 * max-width 400px once columns stack at <=768px. On a phone that is invisible
 * (the phone is narrower); on a 768px tablet it leaves each stacked column a
 * 400px strip with 184px of empty space either side -- "almost like it was two
 * columns" (Gerek, /writersroom-sales/ at tablet, 2026-09-30). The live site
 * does the same. 91 such columns on 13 addresses at 768px: the Blueprint sales
 * page, the unlocked page, the upsell steps, every "full access" sidebar.
 * Images inside keep their own size limits; nothing is stretched.
 * ------------------------------------------------------------------ */
@media (max-width: 768px) {
	.fl-col-small:not(.fl-col-small-full-width) {
		max-width: none;
	}
}

/* ------------------------------------------------------------------
 * /writersroom-v2/unlocked/: the two buttons under the video.
 *
 * At <=768px the original drops "JOIN NOW" / "BUY NEXT VIDEO" to 20px and
 * their sub-lines to 14px and 12px -- hard to read on a tablet, while the
 * "JOIN NOW" at the foot of the page stays 30px (Gerek, 2026-09-30). Tablet
 * and phone now use the foot button's 30px/42px, sub-lines 24px. Desktop is
 * unchanged.
 * ------------------------------------------------------------------ */
@media (max-width: 768px) {
	.fl-node-4lvdabe73ugk .fl-button-text,
	.fl-node-9tm45skbxip0 .fl-button-text {
		font-size: 30px;
		line-height: 42px;
	}
	/* The page's own rule is .fl-builder-content .fl-node-x a.fl-button
	 * span.sub-text; match it or it wins. */
	.fl-builder-content .fl-node-4lvdabe73ugk a.fl-button span.sub-text,
	.fl-builder-content .fl-node-9tm45skbxip0 a.fl-button span.sub-text {
		font-size: 24px;
		line-height: 1.3;
	}
}

/* ------------------------------------------------------------------
 * The orange one-click "Yes" buttons (OTO1, OTO1 downsell, OTO2, OTO2
 * downsell).
 *
 * Lime Funnels built them as a 300px-wide box with a fixed inline height
 * (100px, 154px on OTO1's first) and overflow hidden, so "UPGRADE NOW FOR
 * JUST $1 FOR 14 DAYS" and "...FOR JUST $49 TODAY" lose their first and last
 * lines at every width -- on the live site too; 7 of the 9 buttons clip
 * somewhere (Gerek, 2026-09-30). Wider (up to 560px, never past the screen)
 * and as tall as the text needs; the "No thanks" link beneath gets the same
 * width.
 * ------------------------------------------------------------------ */
.fl-module-lfpro-bb-upsell .bb-upsell__action-creative-button-wrap,
.fl-module-lfpro-bb-upsell .bb-upsell__action-reject-button-wrap {
	max-width: 560px;
}
.fl-module-lfpro-bb-upsell a.bb-upsell__action-creative-button {
	height: auto !important;
	min-height: 100px;
	gap: 16px;
}
.fl-module-lfpro-bb-upsell .bb-upsell__action-button-text {
	line-height: 1.2 !important;
	text-align: center;
	/* The original sets Montserrat 100 (Thin): white on orange, nearly
	 * invisible. Bold, from the real 700 weight (inc/fonts.php). */
	font-weight: 700 !important;
}

/* ------------------------------------------------------------------
 * OTO2 (/ultimate-story-writing-blueprint/oto2/): no welcome video.
 *
 * Its Vimeo video (386322114) no longer exists -- "This video isn't available"
 * on the live site too. Gerek (2026-09-30): hide it and adapt the copy. The
 * player, the "Play the video to turn on sound" line above it and the "Please
 * watch this short video..." line under it are hidden; the two sentences that
 * asked for the video are reworded in enhance-data.json "copy".
 * ------------------------------------------------------------------ */
.fl-node-mtq8v9y2funl,
.fl-node-8td5qw4e0oxb,
.fl-node-2vgxiz78wus9 {
	display: none !important;
}