.bh-pwa-prompt[hidden],
.bh-pwa-toast[hidden] {
	display: none !important;
}

.bh-pwa-prompt {
	position: fixed;
	left: 50%;
	top: max(18px, env(safe-area-inset-top));
	z-index: 99990;
	display: grid;
	grid-template-columns: 56px minmax(0, 1fr) auto;
	align-items: center;
	gap: 18px;
	width: min(920px, calc(100vw - 40px));
	padding: 18px;
	border: 1px solid rgba(255, 255, 255, .24);
	border-radius: 20px;
	background: rgba(5, 7, 12, .98);
	box-shadow: 0 24px 70px rgba(0, 0, 0, .42), 0 0 0 4px rgba(255, 196, 0, .08);
	color: #fff;
	transform: translateX(-50%);
	backdrop-filter: blur(18px);
	animation: bh-pwa-enter .28s ease-out both;
}

.bh-pwa-prompt--notify {
	border-color: rgba(255, 255, 255, .24);
	background: rgba(5, 7, 12, .98);
}

@keyframes bh-pwa-enter {
	from { opacity: 0; transform: translate(-50%, -18px); }
	to { opacity: 1; transform: translate(-50%, 0); }
}

.bh-pwa-prompt > img,
.bh-pwa-prompt__bell {
	width: 56px;
	height: 56px;
	border-radius: 16px;
}

.bh-pwa-prompt > img {
	object-fit: contain;
	background: #fff;
	padding: 7px;
	box-shadow: inset 0 0 0 1px rgba(12, 47, 136, .1);
}

.bh-pwa-prompt__bell {
	display: grid;
	place-items: center;
	background: #ffc400;
	color: #080a0f;
}

.bh-pwa-prompt__bell svg {
	width: 27px;
	height: 27px;
}

.bh-pwa-prompt__copy {
	display: grid;
	gap: 4px;
	min-width: 0;
}

.bh-pwa-prompt__copy strong {
	font-size: 17px;
	line-height: 1.25;
	color: #fff;
}

.bh-pwa-prompt__copy span,
.bh-pwa-prompt__copy small {
	font-size: 13px;
	line-height: 1.5;
	color: #d5d9e2;
}

.bh-pwa-prompt__copy small:not(:empty) {
	margin-top: 3px;
	color: #ffd85a;
}

.bh-pwa-prompt__actions {
	display: flex;
	align-items: center;
	gap: 10px;
}

.bh-pwa-prompt .bh-btn {
	white-space: nowrap;
	border-color: #ffc400;
	background: #ffc400;
	box-shadow: 0 9px 25px rgba(255, 196, 0, .18);
	color: #080a0f;
	font-weight: 800;
}

.bh-pwa-prompt .bh-btn:hover,
.bh-pwa-prompt .bh-btn:focus {
	border-color: #ffe071;
	background: #ffe071;
	color: #080a0f;
}

.bh-pwa-prompt__later {
	border: 0;
	background: transparent;
	padding: 10px;
	color: #fff;
	cursor: pointer;
}

.bh-pwa-prompt__later:hover,
.bh-pwa-prompt__later:focus { color: #ffc400; }

.bh-pwa-toast {
	position: fixed;
	right: 20px;
	top: max(20px, env(safe-area-inset-top));
	z-index: 99999;
	max-width: min(420px, calc(100vw - 40px));
	padding: 14px 18px;
	border-radius: 13px;
	background: #05070c;
	box-shadow: 0 18px 50px rgba(0, 0, 0, .35);
	color: #fff;
	font-size: 14px;
	font-weight: 700;
}

@media (max-width: 680px) {
	.bh-pwa-prompt {
		grid-template-columns: 46px minmax(0, 1fr);
		gap: 12px;
		width: calc(100vw - 24px);
		top: max(12px, env(safe-area-inset-top));
		padding: 15px;
		border-radius: 17px;
	}

	.bh-pwa-prompt > img,
	.bh-pwa-prompt__bell {
		width: 46px;
		height: 46px;
		border-radius: 13px;
	}

	.bh-pwa-prompt__actions {
		grid-column: 1 / -1;
		justify-content: stretch;
	}

	.bh-pwa-prompt__actions .bh-btn {
		flex: 1;
	}

	.bh-pwa-prompt__copy strong {
		font-size: 15px;
	}

	.bh-pwa-toast {
		right: 12px;
		top: max(12px, env(safe-area-inset-top));
	}
}

@media (prefers-reduced-motion: reduce) {
	.bh-pwa-prompt { animation: none; }
}
