/* KVANTA5 ROCKSDB UTXO TELEMETRY */

.kv5-utxo-status {
	padding: 0.85rem 1rem;
	border: 1px solid rgba(255, 255, 255, 0.09);
	border-radius: 0.5rem;
	background: rgba(12, 19, 29, 0.48);
	transition:
		border-color 180ms ease,
		box-shadow 180ms ease,
		opacity 180ms ease;
}

.kv5-utxo-status.kv5-utxo-refreshing {
	opacity: 0.82;
}

.kv5-utxo-status.kv5-utxo-updated {
	border-color: rgba(25, 135, 84, 0.68);
	box-shadow:
		0 0 0 0.15rem rgba(25, 135, 84, 0.12);
}

.kv5-utxo-status.kv5-utxo-stale {
	border-color: rgba(255, 193, 7, 0.62);
}

.kv5-utxo-overview-grid {
	display: grid;
	grid-template-columns:
		repeat(3, minmax(0, 1fr));
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: 0.6rem;
	overflow: hidden;
	background: rgba(12, 19, 29, 0.48);
}

.kv5-utxo-metric {
	min-width: 0;
	padding: 1.15rem 1.25rem;
	border-right: 1px solid rgba(255, 255, 255, 0.07);
	border-bottom: 1px solid rgba(255, 255, 255, 0.07);
}

.kv5-utxo-metric:nth-child(3n) {
	border-right: 0;
}

.kv5-utxo-metric:nth-last-child(-n + 3) {
	border-bottom: 0;
}

.kv5-utxo-feature {
	background:
		linear-gradient(
			135deg,
			rgba(13, 110, 253, 0.09),
			rgba(13, 110, 253, 0.015)
		);
}

.kv5-utxo-label {
	display: block;
	width: fit-content;
	margin-bottom: 0.45rem;
	font-size: 0.78rem;
	font-weight: 500;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--bs-secondary-color);
}

.kv5-utxo-value {
	font-size: clamp(1.2rem, 1.6vw, 1.75rem);
	font-weight: 650;
	line-height: 1.15;
	overflow-wrap: anywhere;
}

.kv5-utxo-note {
	margin-top: 0.35rem;
	font-size: 0.78rem;
	color: var(--bs-secondary-color);
}

.kv5-utxo-panel {
	height: 100%;
	min-height: 20rem;
}

.kv5-utxo-delta-grid {
	display: grid;
	grid-template-columns:
		repeat(3, minmax(0, 1fr));
	gap: 0.85rem;
}

.kv5-utxo-delta-cell {
	padding: 0.9rem;
	border: 1px solid rgba(255, 255, 255, 0.07);
	border-radius: 0.45rem;
	background: rgba(0, 0, 0, 0.12);
}

.kv5-utxo-delta-value {
	font-size: 1.15rem;
	font-weight: 650;
	overflow-wrap: anywhere;
}

.kv5-utxo-chart-card {
	min-height: 31rem;
}

.kv5-utxo-chart-card .card-body {
	height: 31rem;
}

#kv5-utxo-count-chart,
#kv5-utxo-activity-chart {
	max-height: 27rem;
}

#kv5-utxo-error {
	margin-bottom: 1rem;
}

@media (max-width: 991.98px) {
	.kv5-utxo-overview-grid {
		grid-template-columns:
			repeat(2, minmax(0, 1fr));
	}

	.kv5-utxo-metric,
	.kv5-utxo-metric:nth-child(3n) {
		border-right:
			1px solid rgba(255, 255, 255, 0.07);
		border-bottom:
			1px solid rgba(255, 255, 255, 0.07);
	}

	.kv5-utxo-metric:nth-child(2n) {
		border-right: 0;
	}

	.kv5-utxo-metric:nth-last-child(-n + 2) {
		border-bottom: 0;
	}
}

@media (max-width: 575.98px) {
	.kv5-utxo-status .ms-auto {
		width: 100%;
		margin-left: 0 !important;
	}

	.kv5-utxo-overview-grid {
		grid-template-columns: 1fr;
	}

	.kv5-utxo-metric,
	.kv5-utxo-metric:nth-child(2n),
	.kv5-utxo-metric:nth-child(3n) {
		border-right: 0;
		border-bottom:
			1px solid rgba(255, 255, 255, 0.07);
	}

	.kv5-utxo-metric:last-child {
		border-bottom: 0;
	}

	.kv5-utxo-delta-grid {
		grid-template-columns: 1fr;
	}

	.kv5-utxo-chart-card,
	.kv5-utxo-chart-card .card-body {
		min-height: 25rem;
		height: 25rem;
	}
}