/*
Theme Name: FFA New Horizons
Theme URI: https://www.ffanewhorizons.tv/
Author: FFA / New Horizons TV
Author URI: https://www.ffanewhorizons.tv/
Description: Full site editing (block) theme for the FFA New Horizons TV registration and account site. Replaces the Avada dependency with a lightweight branded theme. Login and account-creation pages sit over a weekly screenshot of the live New Horizons browse page so the sign-in flow feels continuous with the streaming site.
Requires at least: 6.4
Tested up to: 6.6
Requires PHP: 8.1
Version: 1.0.2
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: ffa-new-horizons
*/

/* ==========================================================================
   Base
   ========================================================================== */

body {
	margin: 0;
	color: var(--wp--preset--color--ink, #141414);
	background: var(--wp--preset--color--surface, #ffffff);
	font-family: var(--wp--preset--font-family--brand, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif);
	-webkit-font-smoothing: antialiased;
}

a {
	color: var(--wp--preset--color--navy, #004c98);
}

/* ==========================================================================
   Site header (branded bar)
   ========================================================================== */

.nhtv-site-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.5rem;
	padding: 0.75rem 1.5rem;
	background: var(--wp--preset--color--navy, #004c98);
}

.nhtv-logo {
	display: block;
	width: 157px;
	height: 52px;
	max-width: 62vw;
	background: var(--nhtv-logo, none) left center / contain no-repeat;
}

.nhtv-logo .screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* ==========================================================================
   Footer
   ========================================================================== */

.nhtv-site-footer {
	padding: 1.5rem;
	background: var(--wp--preset--color--header, #141414);
	color: rgba(255, 255, 255, 0.72);
	font-size: 0.85rem;
	text-align: center;
}

.nhtv-site-footer a {
	color: #ffffff;
	text-decoration: none;
}

.nhtv-site-footer a:hover {
	text-decoration: underline;
}

/* ==========================================================================
   Standard page content
   ========================================================================== */

.nhtv-page-main {
	max-width: 880px;
	margin: 0 auto;
	padding: 2.5rem 1.5rem 4rem;
}

/* ==========================================================================
   Auth screens (login / register / password) over the browse screenshot
   ========================================================================== */

.nhtv-auth-screen {
	min-height: 100vh;
	min-height: 100svh;
	display: flex;
	flex-direction: column;
	/* Layered background (top to bottom): a light darkening gradient for card
	   contrast, the live browse screenshot (URL injected in wp_head), and a
	   solid fallback colour for before the first screenshot is fetched. */
	background:
		linear-gradient(180deg, rgba(4, 16, 40, 0.38) 0%, rgba(0, 30, 66, 0.44) 100%),
		var(--nhtv-browse-bg, none) center center / cover no-repeat,
		#0a1428;
}

.nhtv-auth-header {
	background: transparent;
	padding: 1rem 1.5rem;
}

.nhtv-auth-header .nhtv-logo {
	height: 56px;
}

.nhtv-auth-main {
	flex: 1 1 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 2rem 1.25rem 3.5rem;
}

.nhtv-auth-card {
	width: 100%;
	max-width: 440px;
	background: #ffffff;
	border-radius: 14px;
	padding: 2.25rem 2.25rem 2.5rem;
	box-shadow: 0 24px 60px rgba(0, 0, 0, 0.35), 0 2px 8px rgba(0, 0, 0, 0.2);
}

/* Wider card for the manage-account form, whose fields are two-column. */
.nhtv-auth-card--wide {
	max-width: 760px;
}

.nhtv-auth-card .nhtv-auth-title {
	margin: 0 0 1.25rem;
	font-size: 1.6rem;
	line-height: 1.2;
	color: var(--wp--preset--color--navy, #004c98);
	text-align: center;
}

/* Make the plugin's self-contained form fill the card cleanly. */
.nhtv-auth-card input[type="text"],
.nhtv-auth-card input[type="email"],
.nhtv-auth-card input[type="password"],
.nhtv-auth-card input[type="tel"],
.nhtv-auth-card select,
.nhtv-auth-card textarea {
	width: 100%;
	box-sizing: border-box;
}

@media (max-width: 480px) {
	.nhtv-auth-card {
		padding: 1.75rem 1.35rem 2rem;
		border-radius: 12px;
	}
}
