/**
 * Consent notice.
 *
 * Fixed to the bottom of the viewport, outside the document flow, so it
 * contributes exactly zero layout shift — a banner that pushes the article down
 * when it appears is both a CLS failure and the most irritating form of this
 * pattern.
 *
 * It is rendered server-side and only for a reader who has not decided, so
 * there is no flash of a notice that immediately removes itself.
 */

.ait-consent {
	position: fixed;
	right: var(--s-3);
	bottom: var(--s-3);
	left: var(--s-3);
	z-index: 60;
	display: flex;
	flex-direction: column;
	gap: var(--s-3);
	max-width: 34rem;
	margin-inline: auto;
	padding: var(--s-4);
	border: 1px solid var(--c-border);
	border-radius: var(--r-lg);
	background: var(--c-surface);

	/* Above the sticky header's shadow, below the drawer. */
	box-shadow: 0 4px 24px rgb(0 0 0 / 14%);
}

.ait-consent__text {
	margin: 0;
	color: var(--c-ink-muted);
	font-size: var(--fs-small);
	line-height: var(--lh-body);
}

.ait-consent__text a {
	color: inherit;
}

.ait-consent__actions {
	display: flex;
	gap: var(--s-2);
	justify-content: flex-end;
}

/*
 * Both buttons are the same size and equally reachable. Making "Allow" larger
 * or "Decline" a low-contrast text link is the dark pattern this notice
 * deliberately avoids — and it can afford to, because declining costs the site
 * nothing: the funnel counters are cookieless and run either way.
 */
.ait-consent__actions .ait-btn {
	flex: 0 0 auto;
	min-height: 44px;
}

@media (min-width: 640px) {
	.ait-consent {
		flex-direction: row;
		align-items: center;
		max-width: 46rem;
	}

	.ait-consent__actions {
		flex-shrink: 0;
	}
}

@keyframes ait-consent-in {
	from {
		transform: translateY(0.5rem);
		opacity: 0;
	}

	to {
		transform: translateY(0);
		opacity: 1;
	}
}

/*
 * Readers who have asked for less motion get the notice without the slide-in.
 * It is already in its final position on first paint, so there is nothing to
 * remove — this only suppresses the animation for everyone else.
 */
@media (prefers-reduced-motion: no-preference) {
	.ait-consent {
		animation: ait-consent-in 240ms ease-out both;
	}
}