:root {
	--bc-dev-env-banner-height: 18px;
}

body.bc-dev-env {
	--bc-dev-env-banner-height: 18px;
}

body.bc-dev-env::before {
	content: attr(data-bc-dev-env-label);
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	height: var(--bc-dev-env-banner-height);
	background: linear-gradient(90deg, #dc2626, #7f1d1d);
	color: #ffffff;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.32em;
	text-transform: uppercase;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 1200;
	pointer-events: none;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
}

body.bc-dev-env .sticky-top {
	top: var(--bc-dev-env-banner-height) !important;
	z-index: 1190;
}

body.bc-dev-env .modal,
body.bc-dev-env .modal-backdrop {
	z-index: calc(1200 + 5);
}

@media (max-width: 767px) {
	body.bc-dev-env::before {
		font-size: 10px;
		letter-spacing: 0.2em;
	}
}

@media print {
	body.bc-dev-env::before {
		display: none;
	}
}