/**
 * Consent banner presentation.
 *
 * The banner is rendered hidden by the server and revealed only by
 * consent.js, so a browser without JavaScript never sees a control that
 * cannot work: without JavaScript no vendor tag can load either.
 *
 * The root is the element that carries data-bnb-consent. Form labels in the sign-up and membership forms once shared
 * the bare class, and the day this sheet loaded they became fixed bars glued to the foot of the screen (design review,
 * 06.10.2026); the attribute keeps the banner's rules on the banner.
 */

.bnb-consent[data-bnb-consent] {
	position: fixed;
	inset-inline: 0;
	bottom: 0;
	z-index: 60;
	display: flex;
	flex-wrap: wrap;
	gap: var(--bnb-space-4, 1rem);
	align-items: center;
	justify-content: space-between;
	box-sizing: border-box;
	width: 100%;
	max-width: 100%;
	padding: var(--bnb-space-4, 1rem) var(--bnb-space-5, 1.5rem);
	border-top: 1px solid var(--bnb-line, #e0dfd8);
	background: var(--bnb-surface, #fff);
	box-shadow: var(--bnb-shadow-lg, 0 18px 46px rgb(15 25 45 / 16%));
	color: var(--bnb-ink, #141b2c);
	font-family: var(--bnb-font, Arial, sans-serif);
}

.bnb-consent[data-bnb-consent][hidden] {
	display: none;
}

.bnb-consent-copy {
	flex: 1 1 22rem;
	min-width: 0;
}

.bnb-consent-copy p {
	margin: 0;
	font-size: 0.95rem;
	line-height: 1.55;
}

.bnb-consent-copy a {
	color: var(--bnb-gold-ink, #5c430f);
	text-underline-offset: 3px;
}

.bnb-consent-actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--bnb-space-2, 0.5rem);
}

.bnb-consent-actions button {
	min-height: var(--bnb-tap, 44px);
	min-width: var(--bnb-tap, 44px);
	padding: 0 var(--bnb-space-5, 1.5rem);
	border: 1px solid var(--bnb-navy-900, #122447);
	border-radius: var(--bnb-r-pill, 999px);
	font: inherit;
	font-weight: 600;
	cursor: pointer;
}

.bnb-consent-accept {
	background: var(--bnb-navy-900, #122447);
	color: #fff;
}

.bnb-consent-decline {
	background: transparent;
	color: var(--bnb-navy-900, #122447);
}

.bnb-consent-actions button:focus-visible {
	outline: 3px solid var(--bnb-gold, #8a6420);
	outline-offset: 2px;
}

@media (max-width: 40rem) {
	.bnb-consent[data-bnb-consent] {
		padding: var(--bnb-space-4, 1rem);
	}

	.bnb-consent-actions {
		width: 100%;
	}

	.bnb-consent-actions button {
		flex: 1 1 10rem;
	}
}