/**
 * EF TV Login BG Rotator
 * Version: 0.1.4
 *
 * Screen-scoped frontend CSS for Streamit authentication pages.
 * The rotating image is rendered as a fixed global layer, not inside Elementor.
 */

html.ef-tv-auth-bg-ready,
body.ef-tv-auth-bg {
	min-height: 100%;
}

body.ef-tv-auth-bg {
	background: #000 !important;
}

/*
 * Fixed full-screen image layer.
 * This avoids Elementor inner-container background patches and guarantees
 * the selected image covers the viewport.
 */
body.ef-tv-auth-bg::before {
	content: "";
	position: fixed;
	inset: 0;
	z-index: 0;
	pointer-events: none;
	background-image: var(--ef-tv-auth-bg-image);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
}

/*
 * Global readability overlay.
 * Kept separate from the image layer so no box appears around the form.
 */
body.ef-tv-auth-bg::after {
	content: "";
	position: fixed;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	background: rgba(0, 0, 0, 0.18);
}

/*
 * Never place the rotating background inside Elementor or Streamit form
 * containers. Those containers must stay transparent.
 */
body.ef-tv-auth-bg .streamit-login,
body.ef-tv-auth-bg .streamit-registration,
body.ef-tv-auth-bg .elementor-widget-shortcode,
body.ef-tv-auth-bg .elementor-widget-container,
body.ef-tv-auth-bg .e-con,
body.ef-tv-auth-bg .e-con-inner {
	background-image: none !important;
	box-shadow: none !important;
}

/*
 * Keep page content above the fixed background and overlay.
 */
body.ef-tv-auth-bg > * {
	position: relative;
	z-index: 2;
}

body.ef-tv-auth-bg .streamit-login,
body.ef-tv-auth-bg .streamit-registration {
	position: relative;
	z-index: 3;
}