/**
 * BL Social Proof - bubble stilovi.
 * Brand preko [data-brand]: zadano radimposvom (bakar), mv (navy).
 */
.bl-sp-root {
	position: fixed;
	bottom: 22px;
	z-index: 99990;
	/* brand tokeni (radimposvom default) */
	--blsp-buy: #d17954;
	--blsp-buy-d: #993a25;
	--blsp-buy-bg: #fbeee6;
	--blsp-ren: #138a47;
	--blsp-ren-bg: #e7f4ec;
	--blsp-mem: #0a7ab0;
	--blsp-mem-bg: #e4f1f8;
	--blsp-ink: #1c1714;
	--blsp-success: #0b7a3b;
	--blsp-warn: #b45309;
}
.bl-sp-root.bl-sp-bl { left: 22px; }
.bl-sp-root.bl-sp-br { right: 22px; }

.bl-sp-root[data-brand="mali-veliki"],
.bl-sp-root[data-brand="mv"] {
	--blsp-buy: #162394;
	--blsp-buy-d: #0e1866;
	--blsp-buy-bg: #eef1fa;
	--blsp-ren: #0a5917;
	--blsp-ren-bg: #e7f1ea;
	--blsp-mem: #1d4ed8;
	--blsp-mem-bg: #e6efff;
}

.bl-sp-bubble {
	width: 330px;
	max-width: calc(100vw - 44px);
	background: #fff;
	color: var(--blsp-ink);
	border: 1px solid #e5e5e0;
	border-radius: 16px;
	box-shadow: 0 16px 38px -14px rgba(40, 20, 10, .42), 0 3px 8px rgba(40, 20, 10, .12);
	padding: 14px 14px 13px;
	display: flex;
	gap: 12px;
	position: relative;
	font-size: 13px;
	line-height: 1.4;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	animation: bl-sp-pop .45s cubic-bezier(.2, .9, .25, 1.3);
}
@keyframes bl-sp-pop {
	from { opacity: 0; transform: translateY(14px) scale(.96); }
	to { opacity: 1; transform: none; }
}

.bl-sp-av {
	width: 42px;
	height: 42px;
	border-radius: 12px;
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 800;
	font-size: 17px;
	color: #fff;
	background: var(--blsp-buy);
	text-transform: uppercase;
}
.bl-sp-ren .bl-sp-av { background: var(--blsp-ren); }
.bl-sp-mem .bl-sp-av { background: var(--blsp-mem); }

.bl-sp-body { flex: 1; min-width: 0; }

.bl-sp-chip {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: .3px;
	text-transform: uppercase;
	padding: 3px 8px;
	border-radius: 999px;
	margin-bottom: 5px;
	background: var(--blsp-buy-bg);
	color: var(--blsp-buy-d);
}
.bl-sp-ren .bl-sp-chip { background: var(--blsp-ren-bg); color: var(--blsp-ren); }
.bl-sp-mem .bl-sp-chip { background: var(--blsp-mem-bg); color: var(--blsp-mem); }
.bl-sp-dot { width: 6px; height: 6px; border-radius: 50%; background: currentColor; display: inline-block; }

.bl-sp-who { font-weight: 700; font-size: 13.5px; color: var(--blsp-ink); }
.bl-sp-product {
	color: #4a5562;
	font-size: 12.5px;
	margin-top: 1px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.bl-sp-time { display: flex; align-items: center; gap: 5px; color: #8a8f98; font-size: 11.5px; margin-top: 6px; }

/* "Upravo" - svjeza kupnja (dogodila se dok je korisnik na sajtu) */
@keyframes bl-sp-pulse-g { 0% { box-shadow: 0 0 0 0 rgba(28,122,28,.5); } 70% { box-shadow: 0 0 0 6px rgba(28,122,28,0); } 100% { box-shadow: 0 0 0 0 rgba(28,122,28,0); } }
@keyframes bl-sp-pulse-w { 0% { box-shadow: 0 0 0 0 rgba(255,255,255,.65); } 70% { box-shadow: 0 0 0 5px rgba(255,255,255,0); } 100% { box-shadow: 0 0 0 0 rgba(255,255,255,0); } }
.bl-sp-upravo {
	display: inline-flex; align-items: center; gap: 4px; vertical-align: middle;
	font-size: 9.5px; font-weight: 800; letter-spacing: .4px; text-transform: uppercase;
	padding: 2px 7px; border-radius: 999px; margin-left: 6px; margin-bottom: 5px;
	background: #1c7a1c; color: #fff;
}
.bl-sp-upravo-dot { width: 5px; height: 5px; border-radius: 50%; background: #fff; display: inline-block; animation: bl-sp-pulse-w 1.6s infinite; }
.bl-sp-time-fresh { color: #1c7a1c; font-weight: 700; }
.bl-sp-pulse { width: 7px; height: 7px; border-radius: 50%; background: #1c7a1c; display: inline-block; animation: bl-sp-pulse-g 1.6s infinite; }

.bl-sp-x {
	position: absolute;
	top: 9px;
	right: 11px;
	color: #c0bdb8;
	cursor: pointer;
	font-size: 15px;
	line-height: 1;
}
.bl-sp-x:hover { color: #8a8f98; }

@media (max-width: 600px) {
	.bl-sp-root { bottom: 14px; }
	.bl-sp-root.bl-sp-bl { left: 12px; }
	.bl-sp-root.bl-sp-br { right: 12px; }
}