/* VCount – สไตล์ป้ายแสดงยอดเข้าชม
 * สี/ขนาดมาจากหน้าตั้งค่า (CSS variables) ค่าเริ่มต้นตามธีม palangmsu.com
 * ใช้ !important กับสีตัวอักษร เพราะธีม/Elementor มักทับสีของโค้ดที่ฝัง
 */
:root {
	--vcount-color: #A51C30;
	--vcount-bg: #FBEAED;
	--vcount-grad-from: #A51C30;
	--vcount-grad-to: #D6455C;
	--vcount-size: 15px;
}

.vcount-wrap { margin: 1em 0; }

.vcount {
	display: inline-flex;
	align-items: center;
	gap: .45em;
	font-family: inherit;
	font-size: var(--vcount-size) !important;
	line-height: 1.4;
	color: var(--vcount-color) !important;
	vertical-align: middle;
}
.vcount .vcount-label,
.vcount .vcount-num { color: inherit !important; font-size: inherit !important; }
.vcount-icon { flex: none; width: 1.15em; height: 1.15em; opacity: .9; }
.vcount-num { font-weight: 700; font-variant-numeric: tabular-nums; }

/* ไล่ระดับสี (ค่าเริ่มต้น) */
.vcount--gradient {
	background: linear-gradient(135deg, var(--vcount-grad-from), var(--vcount-grad-to));
	color: #fff !important;
	padding: .35em .95em;
	border-radius: 999px;
	box-shadow: 0 2px 8px -2px color-mix(in srgb, var(--vcount-grad-from) 55%, transparent);
}
/* สีทึบ */
.vcount--solid {
	background: var(--vcount-grad-from);
	color: #fff !important;
	padding: .35em .9em;
	border-radius: .45em;
}
/* ป้ายสีอ่อน */
.vcount--badge {
	background: var(--vcount-bg);
	padding: .3em .75em;
	border-radius: .45em;
}
/* แคปซูลสีอ่อน */
.vcount--pill {
	background: var(--vcount-bg);
	padding: .3em .95em;
	border-radius: 999px;
}
/* เส้นขอบ */
.vcount--outline {
	background: transparent;
	border: 1.5px solid currentColor;
	padding: .25em .85em;
	border-radius: 999px;
}
/* ข้อความธรรมดา */
.vcount--plain { background: none; padding: 0; }

/* โพสต์ยอดนิยม */
.vcount-popular-title { margin: 0 0 .6em; font-size: 1.1em; color: var(--vcount-grad-from) !important; }
.vcount-popular-list { margin: 0; padding-left: 1.4em; }
.vcount-popular-list li { margin: 0 0 .6em; }
.vcount-popular-list li::marker { color: var(--vcount-grad-from); font-weight: 700; }
.vcount-popular-list.has-thumb { list-style: none; padding-left: 0; }
.vcount-popular-list.has-thumb li { display: flex; gap: .7em; align-items: center; }
.vcount-thumb img { width: 56px; height: 56px; object-fit: cover; border-radius: 8px; display: block; }
.vcount-popular-views {
	display: inline-block;
	font-size: .8em;
	color: var(--vcount-color) !important;
	background: var(--vcount-bg);
	padding: 0 .55em;
	border-radius: 999px;
	white-space: nowrap;
}
.vcount-total { font-weight: 700; font-variant-numeric: tabular-nums; color: var(--vcount-grad-from) !important; }