/* [OURS] Плашка подписки на web push (pushpromo, задача PUSH 2026-07-30).
   Ненавязчиво: правый нижний угол, не перекрывает контент, плавное появление.
   Цвета — фирменные витрины (#202c38 тёмный, #0FAEE3 акцент). */

.pushpromo {
	position: fixed;
	right: 16px;
	bottom: 16px;
	z-index: 9990;
	display: flex;
	align-items: flex-start;
	gap: 10px;
	max-width: 360px;
	padding: 14px 16px;
	background: #fff;
	border: 1px solid #e3e8ee;
	border-radius: 10px;
	box-shadow: 0 6px 24px rgba(32, 44, 56, 0.18);
	opacity: 0;
	transform: translateY(12px);
	transition: opacity 0.35s ease, transform 0.35s ease;
	font-size: 14px;
	color: #202c38;
}
.pushpromo.visible { opacity: 1; transform: translateY(0); }
/* [PRODUCT-CARD 12.09, решение Димы «б»] при видимой липкой панели покупки карточки плашка встаёт НАД ней, а не поверх
   её кнопки (замер 12.09: на 1440 накрывала верхние ≈33 px «Купити», на 390 — панель целиком). Высоту панели отдаёт
   переменная --q-barh (eshop/card_preview.css: 64 на ПК, 54 на телефоне); без неё — легаси 54. */
body.barbuy-open .pushpromo { bottom: calc(16px + var(--q-barh, 54px) + env(safe-area-inset-bottom, 0px)); }

.pushpromo_icon { font-size: 26px; line-height: 1; margin-top: 2px; color: #0FAEE3; } /* [Б19.7] SVG-колокольчик акцентом */

.pushpromo_body { flex: 1 1 auto; }

.pushpromo_text { font-weight: 700; line-height: 1.35; padding-right: 14px; }

.pushpromo_hint { margin-top: 4px; font-size: 12px; color: #747474; line-height: 1.35; }

.pushpromo_btns { margin-top: 10px; display: flex; gap: 8px; }

.pushpromo_btns button {
	border: 0;
	border-radius: 6px;
	padding: 8px 14px;
	font-size: 13px;
	cursor: pointer;
}
.pushpromo_yes   { background: #0FAEE3; color: #fff; font-weight: 700; }
.pushpromo_yes:hover { background: #00C0F7; }
.pushpromo_later { background: #F1F1F1; color: #202c38; }
.pushpromo_later:hover { background: #e6e6e6; }

.pushpromo_close {
	position: absolute;
	top: 6px;
	right: 10px;
	font-size: 18px;
	line-height: 1;
	color: #747474;
	cursor: pointer;
}
.pushpromo_close:hover { color: #202c38; }

@media (max-width: 600px) {
	.pushpromo { right: 8px; left: 8px; bottom: 8px; max-width: none; }
	body.barbuy-open .pushpromo { bottom: calc(8px + var(--q-barh, 54px) + env(safe-area-inset-bottom, 0px)); }
}