/**
 * Abik Post Views Analytics — public styles.
 * Lightweight, theme-agnostic styles for shortcodes and badges.
 */

.pva-views {
	font-size: 0.9em;
	color: inherit;
}

.pva-ranking,
.pva-trending {
	list-style: none;
	margin: 1em 0;
	padding: 0;
	counter-reset: pva-counter;
}

.pva-ranking-item,
.pva-trending-item {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 0.5em;
	padding: 0.4em 0;
	border-bottom: 1px solid rgba(0, 0, 0, 0.06);
	counter-increment: pva-counter;
}

.pva-ranking-item::before,
.pva-trending-item::before {
	content: counter(pva-counter);
	min-width: 1.6em;
	height: 1.6em;
	line-height: 1.6em;
	text-align: center;
	border-radius: 50%;
	background: currentColor;
	color: #fff;
	font-size: 0.8em;
	opacity: 0.6;
}

.pva-ranking-item a,
.pva-trending-item a {
	flex: 1;
	text-decoration: none;
	color: inherit;
}

.pva-ranking-item a:hover,
.pva-trending-item a:hover {
	text-decoration: underline;
}

.pva-ranking-count,
.pva-trending-delta {
	font-variant-numeric: tabular-nums;
	font-weight: 600;
	font-size: 0.85em;
	opacity: 0.8;
}

.pva-trending-delta {
	color: #2a7f3f;
}

/* --- Badges --- */
.pva-badge {
	display: inline-flex;
	align-items: baseline;
	gap: 0.3em;
	padding: 0.25em 0.7em;
	font-size: 0.85em;
	line-height: 1.4;
	vertical-align: middle;
}

.pva-badge-pill {
	background: #f0f4ff;
	color: #2d3a8c;
	border-radius: 999px;
}

.pva-badge-flat {
	background: #f5f5f5;
	color: #333;
}

.pva-badge-minimal {
	background: transparent;
	color: inherit;
}

.pva-badge-card {
	background: #fff;
	color: #333;
	border: 1px solid #e0e0e0;
	border-radius: 6px;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}

.pva-badge-count {
	font-weight: 700;
	font-variant-numeric: tabular-nums;
}

.pva-badge-label {
	font-weight: 400;
	opacity: 0.7;
}

/* --- Empty states --- */
.pva-ranking-empty,
.pva-trending-empty {
	opacity: 0.6;
	font-style: italic;
	font-size: 0.9em;
}