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

/*
 * The spam guard's invisible Turnstile widget sits inside each subscribe form,
 * where the original had only a hidden nonce. It draws nothing, but its empty
 * container would still be a flex or block child of the form; taking it out of
 * the flow keeps the form's layout identical.
 */
.fl-subscribe-form .itv-turnstile {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip-path: inset(50%);
}

/*
 * The main heading added to pages whose visible title is not a heading
 * (migration/enhance.py). Read by screen readers and search engines, drawn
 * nowhere: the standard visually-hidden pattern.
 */
.tc-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;
}

/*
 * Where a broken borrowed icon was removed from /hollywood/ (convert_pages.py
 * drop_broken_images): the same space the broken image took, 58px wide (the
 * carried .uabb-photo-img rule) and no height, so the text beside it stays put.
 * A block, not inline: an inline box would open a 7px line in its wrapper,
 * which the broken image does not.
 */
.uabb-image .tc-icon-space {
	display: block;
	height: 0;
}

/*
 * The desktop dropdowns, restyled at Gerek's request (2026-09-28) to match the
 * rounded cards on mommaschiro.com: a floating card with 14px corners and a soft
 * shadow, and each link fills a rounded box on hover instead of only changing
 * colour. The deeper blue (#215fb5, the builder's own accent) keeps the text
 * readable on the tint; the original's #6699ff would not be.
 *
 * Every copy of the header menu gets it: header layout 29 and the ones carried
 * into the home hero, /programs/, /media/ and /mybooks/. Above 768px only; at
 * 768 and below the submenus open inside the phone menu and are left as they
 * were. The card sits 8px below its item, so an invisible ::before bridges the
 * gap and the menu does not close as the pointer crosses it. It fades in with
 * an animation rather than a transition because the carried rules still switch
 * it on with display, which cannot be transitioned.
 */
@media (min-width: 769px) {
	.fl-module-menu .fl-menu .menu .fl-has-submenu > .sub-menu {
		margin-top: 8px;
		padding: 8px;
		min-width: 240px;
		background-color: #fff;
		border: 1px solid rgba(41, 107, 199, 0.1);
		border-radius: 14px;
		box-shadow: 0 16px 36px -12px rgba(20, 45, 90, 0.22), 0 2px 8px rgba(20, 45, 90, 0.06);
	}
	.fl-module-menu .fl-menu .menu .fl-has-submenu > .sub-menu::before {
		content: "";
		position: absolute;
		top: -9px;
		left: 0;
		right: 0;
		height: 9px;
	}
	.fl-module-menu .fl-menu .fl-has-submenu:hover > .sub-menu,
	.fl-module-menu .fl-menu .fl-has-submenu.focus > .sub-menu {
		animation: tc-submenu-in 0.16s ease-out;
	}
	.fl-module-menu .fl-menu .menu .sub-menu > li {
		border: 0;
	}
	.fl-module-menu .fl-menu .menu .sub-menu > li + li {
		margin-top: 2px;
	}
	.fl-module-menu .fl-menu .menu .sub-menu a {
		display: block;
		padding: 11px 14px;
		border-radius: 9px;
		line-height: 1.3;
		white-space: nowrap;
		transition: background-color 0.15s ease, color 0.15s ease;
	}
	.fl-module-menu .fl-menu .menu .sub-menu a:hover,
	.fl-module-menu .fl-menu .menu .sub-menu a:focus-visible {
		background-color: rgba(102, 153, 255, 0.14);
		color: #215fb5;
	}
	.fl-module-menu .fl-menu .menu .sub-menu > li.current-menu-item > a {
		background-color: rgba(102, 153, 255, 0.08);
		color: #215fb5;
	}
}
@keyframes tc-submenu-in {
	from { opacity: 0; transform: translateY(4px); }
	to   { opacity: 1; transform: none; }
}

/*
 * "All Programs" (assets/js/menu.js addParentLinks): where a menu opens its
 * submenus by tap, tapping "Programs" opens the submenu instead of going to the
 * page, so the submenu's first item goes there. A menu used with a mouse never
 * gets `no-hover` and keeps the original dropdown.
 */
.fl-menu:not(.no-hover) .tc-parent-link {
	display: none;
}

/*
 * The Ultimate Addons video player (/testimonials/, /media/). The YouTube or
 * Vimeo player is created only when the thumbnail is pressed (assets/js/
 * modules.js), so the capture never saw it and carry_css.py never carried its
 * rule: the player opened at the browser's default 300x150 in the corner, too
 * small for its controls or its fullscreen button. This is the original's own
 * rule (Ultimate Addons' video module stylesheet, read from the live site
 * 2026-09-28): the player fills the 16:9 frame the thumbnail filled.
 */
.uabb-video__outer-wrap iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 2;
	background: transparent;
}

/*
 * All Things Hollywood episodes (body.tc-audio-gone, inc/content-grid.php):
 * all 13 recordings are gone from the podcast host, on the original too, and
 * the Spotify, Apple and Amazon badges under the player lead to listings that
 * no longer exist. Both hidden until Travis supplies the audio (Gerek,
 * 2026-09-28, decisions B6); the episode's title and description stay.
 */
.tc-audio-gone .fl-module-audio,
.tc-audio-gone .fl-module-photo:has(a[href*="open.spotify.com"], a[href*="podcasts.apple.com"], a[href*="music.amazon.com/podcasts"]) {
	display: none !important;
}

/*
 * Podcast "listen on" buttons that lead nowhere (checked in a browser
 * 2026-09-28, decisions B6). Both Apple Podcasts listings are gone (All
 * Things Hollywood id1332101779, Just Write id1532619716), so every Apple
 * button's column is hidden and its two neighbours, Spotify and Amazon, share
 * the row: the 22 Just Write episodes and /show/. Both still work for Just
 * Write. /hollywood/'s subscribe block is hidden whole: none of its three
 * buttons reaches All Things Hollywood (Spotify gone, Apple gone, Amazon is
 * Just Write).
 */
.fl-col:has(> .fl-col-content > .fl-module a[href*="podcasts.apple.com/us/podcast/just-write/id1532619716"], > .fl-col-content > .fl-module a[href*="podcasts.apple.com/us/podcast/all-things-hollywood-show/id1332101779"]) {
	display: none !important;
}
@media (min-width: 769px) {
	.fl-col-group:has(> .fl-col > .fl-col-content > .fl-module a[href*="id1532619716"], > .fl-col > .fl-col-content > .fl-module a[href*="id1332101779"]) > .fl-col {
		width: 50% !important;
	}
}
.fl-node-svy18lmkciap,
.fl-node-ylmf41aswrn6 {
	display: none !important;
}

/*
 * Sign-up form fields, every form on the site (Gerek, 2026-09-28: "white on
 * white", hard to see). The original's fields were #fcfcfc with a #e6e6e6
 * border on a white section, and the "Name" / "Email Address" hint was 40%
 * gray. Now a pale blue field with a blue-gray border and rounded corners,
 * a readable hint (#5f6f86, about 5:1 against the field), dark typed text,
 * and a blue ring while typing. The same 1px border, so no form changes
 * height. Sizes and padding stay with each form's own carried rules.
 */
body .fl-builder-content .fl-subscribe-form .fl-form-field input {
	background-color: #f2f6fd;
	border: 1px solid #a9b8d6;
	border-radius: 8px;
	color: #1f2a3d;
	box-shadow: inset 0 1px 2px rgba(20, 45, 90, 0.06);
	transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}
body .fl-builder-content .fl-subscribe-form .fl-form-field input::placeholder {
	color: #5f6f86;
	opacity: 1;
}
body .fl-builder-content .fl-subscribe-form .fl-form-field input:focus {
	background-color: #fff;
	border-color: #215fb5;
	box-shadow: 0 0 0 3px rgba(102, 153, 255, 0.28);
	outline: none;
}

/*
 * The contact form (/contact/, inc/contact-form.php), in place of the
 * LiveAgent form: the same light panel on the hero's dark background, the
 * site's sign-up field style, and a Send button in the site's orange (#ff9c00,
 * the "Get the Blueprint" buttons) with black text (Gerek, 2026-09-28).
 */
.tc-contact-form {
	max-width: 500px;
	padding: 20px 20px 22px;
	background: #f2f2f2;
	border-radius: 6px;
	color: #222;
	text-align: left;
}
.tc-contact-form [hidden] {
	display: none !important;
}
.tc-contact-form .tc-contact-form__title {
	margin: 0 0 10px;
	font-size: 17px;
	font-weight: 700;
	color: #222;
}
.tc-contact-form label {
	display: block;
	margin: 12px 0 5px;
	font-size: 14px;
	font-weight: 600;
	color: #222;
}
.tc-contact-form input[type="text"],
.tc-contact-form input[type="email"],
.tc-contact-form textarea {
	display: block;
	width: 100%;
	padding: 11px 14px;
	background: #fff;
	border: 1px solid #a9b8d6;
	border-radius: 8px;
	color: #1f2a3d;
	font: inherit;
	font-size: 16px;
	line-height: 1.4;
	box-sizing: border-box;
}
.tc-contact-form textarea {
	min-height: 120px;
	resize: vertical;
}
.tc-contact-form :is(input, textarea):focus {
	border-color: #215fb5;
	box-shadow: 0 0 0 3px rgba(102, 153, 255, 0.28);
	outline: none;
}
.tc-contact-form .is-invalid {
	border-color: #c62828;
	box-shadow: 0 0 0 3px rgba(198, 40, 40, 0.15);
}
.tc-contact-form .tc-contact-form__send {
	margin-top: 16px;
	padding: 12px 28px;
	background: #ff9c00;
	border: 0;
	border-radius: 8px;
	color: #111 !important;
	font: inherit;
	font-size: 16px;
	font-weight: 700;
	cursor: pointer;
}
.tc-contact-form .tc-contact-form__send:hover,
.tc-contact-form .tc-contact-form__send:focus-visible {
	background: #e88e00;
}
.tc-contact-form .tc-contact-form__send:focus-visible {
	outline: 3px solid #1f2a3d;
	outline-offset: 2px;
}
.tc-contact-form .tc-contact-form__send:disabled {
	opacity: 0.7;
	cursor: default;
}
.tc-contact-form .tc-contact-form__error {
	margin: 0 0 8px;
	padding: 10px 12px;
	background: #fdecea;
	border-radius: 6px;
	color: #9b1c1c;
	font-size: 15px;
}
.tc-contact-form .tc-contact-form__done {
	padding: 12px 0 4px;
	font-size: 18px;
	line-height: 1.5;
	color: #1f2a3d;
}
.tc-contact-form .itv-turnstile {
	margin-top: 8px;
}

/*
 * The "Synopsis" switch on /mybooks/ (Ultimate Addons Content Toggle), in its
 * ON state. Never switched on when the original was captured, so these two
 * rules were not carried; they are the original's (read from the live site,
 * 2026-09-28): the knob slides right and the track turns orange. The
 * behaviour is in assets/js/modules.js.
 */
.uabb-rbs-switch.checked + .uabb-rbs-slider::before {
	transform: translateX(2.1em);
}
.fl-module-uabb-content-toggle .uabb-rbs-switch.checked + .uabb-rbs-slider {
	background-color: #ffab2e;
}