/*
 * Shared faint live-page wave layer (weekly sermons + homepage duo).
 * Host: #page::before on body.fpc-public-weekly-sermons or body.fpc-public-home-duo.
 */

@keyframes fpc-live-flow-drift {
	0%,
	100% {
		opacity: 1;
	}
	50% {
		opacity: 0.88;
	}
}

body.fpc-public-weekly-sermons:not(.fpc-leader-portal) #page::before,
body.fpc-public-home-duo:not(.fpc-leader-portal) #page::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
	overflow: hidden;
	background-repeat: no-repeat;
	background-size: 120% 120%;
	background-position: 50% 45%;
	background-image:
		radial-gradient(150% 120% at 0% 0%, transparent 37%, rgb(var(--fpc-live-action-fill-rgb) / 0.02) 37.5%, rgb(var(--fpc-live-action-fill-rgb) / 0.05) 38%, rgb(var(--fpc-live-action-fill-rgb) / 0.02) 38.5%, transparent 39%),
		radial-gradient(150% 120% at 100% 100%, transparent 37%, rgb(var(--fpc-live-action-fill-rgb) / 0.018) 37.5%, rgb(var(--fpc-live-action-fill-rgb) / 0.045) 38%, rgb(var(--fpc-live-action-fill-rgb) / 0.018) 38.5%, transparent 39%),
		radial-gradient(150% 120% at 100% 0%, transparent 45%, rgb(var(--fpc-live-action-rgb) / 0.012) 48%, rgb(var(--fpc-live-action-rgb) / 0.035) 50%, rgb(var(--fpc-live-action-rgb) / 0.012) 52%, transparent 55%),
		radial-gradient(150% 120% at 0% 100%, transparent 45%, rgb(var(--fpc-live-action-rgb) / 0.012) 48%, rgb(var(--fpc-live-action-rgb) / 0.035) 50%, rgb(var(--fpc-live-action-rgb) / 0.012) 52%, transparent 55%),
		radial-gradient(ellipse at 20% 30%, rgb(var(--fpc-live-action-rgb) / 0.06) 0%, transparent 60%),
		radial-gradient(ellipse at 80% 70%, rgb(var(--fpc-live-action-rgb) / 0.05) 0%, transparent 60%),
		radial-gradient(ellipse at 80% 18%, rgb(var(--fpc-live-action-rgb) / 0.04) 0%, transparent 55%),
		radial-gradient(ellipse at 12% 82%, rgb(var(--fpc-live-action-fill-rgb) / 0.03) 0%, transparent 58%);
	animation: fpc-live-flow-drift 40s ease-in-out infinite;
	will-change: opacity;
}

html.dark body.fpc-public-weekly-sermons:not(.fpc-leader-portal) #page::before,
html.dark body.fpc-public-home-duo:not(.fpc-leader-portal) #page::before {
	background-image:
		radial-gradient(150% 120% at 100% 0%, transparent 37%, rgb(var(--fpc-live-focus-rgb) / 0.038) 37.5%, rgb(var(--fpc-live-focus-rgb) / 0.095) 38%, rgb(var(--fpc-live-focus-rgb) / 0.038) 38.5%, transparent 39%),
		radial-gradient(150% 120% at 0% 100%, transparent 37%, rgb(var(--fpc-live-focus-rgb) / 0.028) 37.5%, rgb(var(--fpc-live-focus-rgb) / 0.075) 38%, rgb(var(--fpc-live-focus-rgb) / 0.028) 38.5%, transparent 39%),
		radial-gradient(150% 120% at 100% 0%, transparent 45%, rgb(var(--fpc-text-rgb) / 0.018) 48%, rgb(var(--fpc-live-focus-rgb) / 0.05) 50%, rgb(var(--fpc-text-rgb) / 0.018) 52%, transparent 55%),
		radial-gradient(150% 120% at 0% 100%, transparent 45%, rgb(var(--fpc-text-rgb) / 0.018) 48%, rgb(var(--fpc-live-focus-rgb) / 0.05) 50%, rgb(var(--fpc-text-rgb) / 0.018) 52%, transparent 55%),
		radial-gradient(ellipse at 80% 30%, rgb(var(--fpc-live-focus-rgb) / 0.075) 0%, transparent 60%),
		radial-gradient(ellipse at 20% 70%, rgb(var(--fpc-live-action-rgb) / 0.045) 0%, transparent 60%),
		radial-gradient(ellipse at 50% 12%, rgb(var(--fpc-live-focus-rgb) / 0.06) 0%, transparent 55%),
		radial-gradient(ellipse at 18% 88%, rgb(var(--fpc-live-action-rgb) / 0.035) 0%, transparent 58%);
}

@media (prefers-reduced-motion: reduce) {
	body.fpc-public-weekly-sermons:not(.fpc-leader-portal) #page::before,
	body.fpc-public-home-duo:not(.fpc-leader-portal) #page::before {
		animation: none;
	}
}