/**
 * Bottom-anchor coexistence zone.
 *
 * This stylesheet owns only elements that belong to Game Overdrive. It never
 * styles a provider container, an ad iframe or a creative: the anchor's own
 * geometry is published by assets/js/go-anchor-host.js as one custom property,
 * and everything here reacts to that number.
 *
 * Reference behaviour (Voxel bottom anchor, measured 28/07/2026):
 *   full-bleed container, ~120px tall, ~15% of the viewport, creative centred,
 *   dismiss control at the top edge, no page reservation.
 * Game Overdrive adapts the reference because it carries a permanent floating
 * accessibility panel: the anchor band becomes a real safe zone instead of an
 * overlay, so no control is ever covered and no z-index fight is needed.
 */

:root {
	--go-bottom-anchor-space: 0px;
	--go-bottom-anchor-gap: 12px;
	--go-bottom-anchor-safe: calc(var(--go-bottom-anchor-space, 0px) + env(safe-area-inset-bottom, 0px));
	--go-bottom-anchor-control: calc(var(--go-bottom-anchor-safe) + var(--go-bottom-anchor-gap));
}

/*
 * Reserve the measured band at the end of the document so the last paragraph,
 * the newsletter and the footer can always be reached. The value is 0px until
 * a creative really renders, so a cached page never ships an empty gap.
 */
html body.go-has-bottom-anchor {
	padding-block-end: var(--go-bottom-anchor-safe);
}

/*
 * Floating publisher controls move above the anchor instead of under it. The
 * accessibility panel is the priority: it must stay reachable at every width.
 */
html body.go-has-bottom-anchor :is(
	.go-a11y,
	.go-backtop,
	.go-preferred-toast
) {
	bottom: var(--go-bottom-anchor-control);
	inset-block-end: var(--go-bottom-anchor-control);
}

/* Consent surfaces answer to the same zone so a message never lands on an ad. */
html body.go-has-bottom-anchor :is(
	.go-consent,
	.go-consent-reopen,
	.cmplz-cookiebanner,
	.cky-consent-container,
	#cookie-law-info-bar,
	#cookie-notice,
	.cookie-notice-container
) {
	bottom: calc(var(--go-bottom-anchor-safe) + 10px);
	inset-block-end: calc(var(--go-bottom-anchor-safe) + 10px);
}

/*
 * Third-party floating widgets that ship their own fixed anchoring. They are
 * listed explicitly so an unknown fixed element is never moved by accident.
 */
html body.go-has-bottom-anchor :is(
	.kodee-fab,
	.hostinger-ai-assistant-fab
) {
	bottom: var(--go-bottom-anchor-control);
	inset-block-end: var(--go-bottom-anchor-control);
}

/*
 * The return to the normal position must be as calm as the departure: the
 * controls glide rather than jump when the reader dismisses the anchor or the
 * creative collapses.
 */
.go-a11y,
.go-backtop,
.go-preferred-toast,
.kodee-fab {
	transition: bottom 240ms ease, inset-block-end 240ms ease;
}

@media (max-width: 767px) {
	:root {
		--go-bottom-anchor-gap: 8px;
	}
}

/*
 * A very tall creative is reported by the runtime, never resized and never
 * hidden. The only publisher-side reaction is to keep the control column
 * usable: on a short viewport the panel hugs the anchor more closely instead of
 * being pushed off screen.
 */
@media (max-height: 620px) {
	:root {
		--go-bottom-anchor-gap: 6px;
	}
}

/*
 * Nothing here paints over a creative. The dark-mode work is limited to the
 * publisher band that sits behind the provider container, so a transparent
 * anchor blends with the page instead of exposing scrolling content.
 */
html[data-theme='dark-mode'] body.go-has-bottom-anchor::after,
html[data-theme='light-mode'] body.go-has-bottom-anchor::after {
	content: '';
	position: fixed;
	inset: auto 0 0 0;
	z-index: 1;
	block-size: var(--go-bottom-anchor-safe);
	background: var(--canvas, transparent);
	pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
	.go-a11y,
	.go-backtop,
	.go-preferred-toast,
	.kodee-fab {
		transition: none;
	}
}

@media print {
	html body.go-has-bottom-anchor {
		padding-block-end: 0;
	}

	html body.go-has-bottom-anchor::after {
		display: none;
	}
}