/**
 * V4 — section trang chủ: nền trong suốt để ảnh/gradient body (streaming) hiện rõ.
 */
body.ui-v4 .km-home-section--grid-v2,
body.ui-v4 .km-home-section--grid-v4 {
	background: transparent;
	border-top: none;
	border-bottom: none;
	backdrop-filter: none;
	-webkit-backdrop-filter: none;
}

/*
 * Đang thịnh hành — section thoáng hơn; khối carousel: nền tím mờ + blur (trong một phần, không full transparent).
 */
body.ui-v4 .km-home-section--trending-v2,
body.ui-v4 .km-home-section--trending-v4 {
	padding-top: 2.35rem;
	padding-bottom: 2.85rem;
	background: transparent;
	border-top: none;
	border-bottom: none;
	backdrop-filter: none;
	-webkit-backdrop-filter: none;
}

body.ui-v4 .km-home-section--trending-v2 .km-carousel--streaming-five,
body.ui-v4 .km-home-section--trending-v4 .km-carousel--streaming-five {
	margin-top: 0.75rem;
	padding: 1.35rem 1.35rem 1.55rem;
	box-sizing: border-box;
	border-radius: var(--v4-radius-md);
	background: linear-gradient(
		155deg,
		rgba(56, 20, 72, 0.5) 0%,
		rgba(36, 12, 52, 0.42) 48%,
		rgba(28, 8, 42, 0.48) 100%
	);
	border: 1px solid rgba(255, 255, 255, 0.08);
	box-shadow:
		inset 0 1px 0 rgba(255, 255, 255, 0.06),
		0 10px 36px rgba(0, 0, 0, 0.28);
	backdrop-filter: blur(14px) saturate(1.12);
	-webkit-backdrop-filter: blur(14px) saturate(1.12);
}

body.ui-v4 .km-carousel--streaming-five .km-carousel__track {
	padding-top: 0.5rem;
	padding-bottom: 0.95rem;
}

.ui-v4 .km-home--ui-v4 .km-home-section--grid-v2 .km-home-grid-v2__title,
.ui-v4 .km-home--ui-v4 .km-section-head--v4 .km-section-head__title {
	font-family: var(--v4-font-display);
	letter-spacing: 0.04em;
}

.ui-v4 .km-home-grid-v2__head {
	border-bottom: 1px solid var(--v4-divider);
	padding-bottom: 0.65rem;
	margin-bottom: 0.75rem;
}

.ui-v4 .km-home-grid-v2__title {
	color: transparent;
	background: var(--v4-grad-text-display);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	filter: drop-shadow(0 2px 14px var(--v4-vi-28));
}

.ui-v4 .km-home-grid-v2__more {
	color: var(--v4-gold);
	border: 1px solid var(--v4-edge);
	border-radius: 999px;
	padding: 0.3rem 0.9rem;
}

.ui-v4 .km-home-section--grid-v4 .km-home-grid-meta {
	margin-bottom: 0.9rem;
	opacity: 0.72;
}

/* «Đang thịnh hành» — thay gradient cam/đỏ (main.css) bằng tím hồng V4 */
body.ui-v4.km-streaming-ui .km-section-head__title--streaming-trend::after {
	background: var(--v4-grad-line);
	opacity: 1;
}

body.ui-v4.km-streaming-ui .km-section-head__trend-label {
	background: var(--v4-grad-text-accent);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	-webkit-text-fill-color: transparent;
	filter: drop-shadow(0 2px 12px var(--v4-vi-28));
}

@supports not ((-webkit-background-clip: text) or (background-clip: text)) {
	body.ui-v4.km-streaming-ui .km-section-head__trend-label {
		color: var(--v4-fuchsia);
		-webkit-text-fill-color: currentColor;
		background: none;
		filter: none;
	}
}

body.ui-v4.km-streaming-ui .km-section-head__emoji {
	filter: drop-shadow(0 0 10px var(--v4-pk-45));
}

body.ui-v4.km-streaming-ui .km-trend-card--streaming .km-trend-card__rank-num {
	color: var(--v4-fuchsia);
	text-shadow:
		0 0 24px var(--v4-vi-35),
		0 2px 14px var(--v4-pk-35),
		0 1px 0 rgba(0, 0, 0, 0.88);
}

@media (max-width: 768px) {
	body.ui-v4 .km-home-section--trending-v2,
	body.ui-v4 .km-home-section--trending-v4 {
		padding-top: 1.85rem;
		padding-bottom: 2.15rem;
	}

	body.ui-v4 .km-home-section--trending-v2 .km-carousel--streaming-five,
	body.ui-v4 .km-home-section--trending-v4 .km-carousel--streaming-five {
		padding: 1.1rem 0.95rem 1.3rem;
		margin-top: 0.55rem;
	}
}