.qbm-widget {
	display: inline-flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 6px;
	font-family: inherit;
	background: transparent;
}

.qbm-widget * {
	box-sizing: border-box;
}

.qbm-row {
	display: inline-flex;
	align-items: center;
	gap: 14px;
	flex-wrap: wrap;
}

.qbm-price {
	display: inline-flex;
	align-items: baseline;
	gap: 4px;
	font-size: 26px;
	font-weight: 700;
	line-height: 1;
	color: #ffffff;
}

.qbm-currency {
	font-size: 13px;
	font-weight: 500;
	color: rgba(255, 255, 255, .75);
}

.qbm-badge {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 4px 10px;
	border-radius: 999px;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.4;
	white-space: nowrap;
}

.qbm-badge.qbm-up {
	color: #8bc34a;
	background-color: rgba(139, 195, 74, .18);
}

.qbm-badge.qbm-down {
	color: #ff6b6b;
	background-color: rgba(255, 107, 107, .18);
}

.qbm-badge.qbm-neutral {
	color: #cfd8dc;
	background-color: rgba(255, 255, 255, .12);
}

.qbm-arrow {
	display: inline-flex;
	align-items: center;
}

.qbm-arrow svg {
	display: block;
}

.qbm-delta {
	font-size: 14px;
	font-weight: 500;
	white-space: nowrap;
}

.qbm-delta.qbm-up {
	color: #8bc34a;
}

.qbm-delta.qbm-down {
	color: #ff6b6b;
}

.qbm-delta.qbm-neutral {
	color: #cfd8dc;
}

.qbm-fallback {
	font-size: 13px;
	font-style: italic;
	color: rgba(255, 255, 255, .8);
}

.qbm-last-update {
	font-size: 11px;
	font-weight: 400;
	color: rgba(255, 255, 255, .6);
}

.qbm-stale-notice {
	font-style: italic;
}