/**
 * Consent Banner — base styles.
 *
 * Theme-specific overrides (colors, fonts) belong in the child theme SCSS.
 * Override via CSS custom properties:
 *   --bf-consent-bg, --bf-consent-text, --bf-consent-btn-bg, --bf-consent-btn-text
 */

.bf-consent-banner {
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 10000;
	background: var(--bf-consent-bg, #1a1a2e);
	color: var(--bf-consent-text, #e0e0e0);
	transition: transform 0.3s ease, opacity 0.3s ease;
}

.bf-consent-banner--hidden {
	transform: translateY(100%);
	opacity: 0;
	pointer-events: none;
	/* Take the hidden banner out of the tab order and the accessibility tree.
	   The banner can sit near the top of the DOM (right after the skip link),
	   so an invisible-but-focusable Accept button would be the second tab stop
	   for every returning visitor. The delay lets the slide-out finish first. */
	visibility: hidden;
	transition: transform 0.3s ease, opacity 0.3s ease, visibility 0s linear 0.3s;
}

.bf-consent-banner__inner {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 1.5rem;
	max-width: 1200px;
	margin: 0 auto;
	padding: 1rem 1.5rem;
}

.bf-consent-banner__text {
	font-size: 0.875rem;
	line-height: 1.5;
}

.bf-consent-banner__text a {
	color: inherit;
	text-decoration: underline;
}

.bf-consent-banner__accept {
	flex-shrink: 0;
	padding: 0.5rem 1.5rem;
	background: var(--bf-consent-btn-bg, #e94560);
	color: var(--bf-consent-btn-text, #fff);
	border: none;
	border-radius: 4px;
	font-size: 0.875rem;
	font-weight: 600;
	cursor: pointer;
	transition: opacity 0.2s ease;
}

.bf-consent-banner__accept:hover {
	opacity: 0.85;
}

@media (max-width: 600px) {
	.bf-consent-banner__inner {
		flex-direction: column;
		gap: 0.75rem;
		padding: 0.75rem 1rem;
		text-align: center;
	}
}