/**
 * Post TTS — giao diện cổ trang (giống khối dưới search): tối, viền đỏ, góc vàng.
 * Play/Pause bằng CSS; volume SVG; không emoji WP.
 */

.post-tts-player-wrap.post-tts-xianxia {
	--post-tts-max-w: 100%;
	--post-tts-gold: #d4af37;
	--post-tts-gold-bright: #e8c547;
	--post-tts-red-deep: #4a0a0a;
	--post-tts-bg-0: #141008;
	--post-tts-bg-1: #1a100c;
	--post-tts-border: #7a1f1f;
	line-height: normal;
	position: relative;
	width: 100%;
	max-width: min(100%, var(--post-tts-max-w));
	margin: 1rem auto;
	padding: 16px 18px 14px;
	box-sizing: border-box;
	isolation: isolate;

	background: linear-gradient(165deg, var(--post-tts-bg-1) 0%, #0d0806 42%, #120a08 100%);
	border: 1px solid var(--post-tts-border);
	border-radius: 6px;
	box-shadow:
		0 0 0 1px rgba(58, 18, 8, 0.85),
		inset 0 0 32px rgba(0, 0, 0, 0.45),
		inset 0 1px 0 rgba(212, 175, 55, 0.06),
		0 8px 24px rgba(0, 0, 0, 0.5);

	font-family: Georgia, "Times New Roman", "Songti SC", "Noto Serif SC", serif;
	color: var(--post-tts-gold);
}
.post-tts-bar p{
	margin: 0 !important;
}
/* Góc vàng */
.post-tts-xianxia .post-tts-corner {
	position: absolute;
	width: 16px;
	height: 16px;
	pointer-events: none;
	z-index: 1;
}

.post-tts-xianxia .post-tts-c-tl {
	left: 8px;
	top: 8px;
	border-top: 2px solid #c9a227;
	border-left: 2px solid #c9a227;
}

.post-tts-xianxia .post-tts-c-tr {
	right: 8px;
	top: 8px;
	border-top: 2px solid #c9a227;
	border-right: 2px solid #c9a227;
}

.post-tts-xianxia .post-tts-c-bl {
	left: 8px;
	bottom: 8px;
	border-bottom: 2px solid #c9a227;
	border-left: 2px solid #c9a227;
}

.post-tts-xianxia .post-tts-c-br {
	right: 8px;
	bottom: 8px;
	border-bottom: 2px solid #c9a227;
	border-right: 2px solid #c9a227;
}

.post-tts-xianxia .post-tts-ornament {
	position: absolute;
	left: 50%;
	top: 0;
	transform: translate(-50%, -42%) rotate(45deg);
	width: 9px;
	height: 9px;
	background: linear-gradient(135deg, #e8c547, #8b6508);
	border: 1px solid rgba(201, 162, 39, 0.65);
	pointer-events: none;
	z-index: 2;
	box-shadow: 0 0 8px rgba(212, 175, 55, 0.4);
}

/* Tiêu đề */
.post-tts-xianxia .post-tts-headline {
	margin: 0 0 12px;
	padding: 0 4px;
	text-align: center;
	font-size: 0.82rem;
	font-weight: 700;
	letter-spacing: 0.28em;
	color: var(--post-tts-gold-bright);
	text-shadow:
		0 0 10px rgba(212, 175, 55, 0.35),
		0 1px 0 #2a1808;
	line-height: 1.3;
}

/**
 * Thanh điều khiển: flex một hàng — volume luôn nằm trong khung (không dùng grid để tránh lệch theme).
 */
.post-tts-xianxia .post-tts-bar {
	--post-tts-row-h: 36px;

	position: relative;
	z-index: 2;
	display: flex !important;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: flex-start;
	gap: 10px;
	width: 100%;
	min-width: 0;
	max-width: 100%;
	margin: 0 0 10px;
	padding: 0;
	min-height: var(--post-tts-row-h);
	overflow: hidden;
	direction: ltr;
	unicode-bidi: isolate;
}

.post-tts-player-wrap.post-tts-xianxia .post-tts-bar,
.post-tts-player-wrap.post-tts-xianxia .post-tts-bar * {
	box-sizing: border-box;
}

.post-tts-player-wrap.post-tts-xianxia .post-tts-bar .post-tts-btn-play,
.post-tts-player-wrap.post-tts-xianxia .post-tts-bar .post-tts-time,
.post-tts-player-wrap.post-tts-xianxia .post-tts-bar .post-tts-progress-wrap,
.post-tts-player-wrap.post-tts-xianxia .post-tts-bar .post-tts-vol-box,
.post-tts-player-wrap.post-tts-xianxia .post-tts-bar input[type="range"] {
	float: none !important;
	clear: none !important;
	position: relative !important;
	top: auto !important;
	left: auto !important;
	right: auto !important;
	bottom: auto !important;
	transform: none !important;
}

/* Nút play */
.post-tts-xianxia .post-tts-btn-play {
	flex: 0 0 auto;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	min-width: 36px;
	min-height: 0 !important;
	max-height: 36px !important;
	padding: 0 !important;
	margin: 0 !important;
	border-radius: 50%;
	border: 1px solid #c9a227;
	background: linear-gradient(145deg, #7a1212 0%, var(--post-tts-red-deep) 55%, #2a0606 100%);
	cursor: pointer;
	box-shadow:
		0 0 10px rgba(120, 20, 20, 0.45),
		inset 0 1px 0 rgba(255, 255, 255, 0.1);
	transition: box-shadow 0.15s ease;
}

.post-tts-xianxia .post-tts-btn-play:hover {
	box-shadow:
		0 0 0 2px rgba(212, 175, 55, 0.3),
		0 0 14px rgba(160, 30, 30, 0.55);
}

.post-tts-xianxia .post-tts-ic-play {
	display: block;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 6px 0 6px 10px;
	border-color: transparent transparent transparent rgba(255, 255, 255, 0.95);
	margin-left: 3px;
}

.post-tts-xianxia .post-tts-ic-pause {
	display: none;
	align-items: center;
	justify-content: center;
	gap: 3px;
	width: 100%;
	height: 100%;
}

.post-tts-xianxia .post-tts-ic-pause::before,
.post-tts-xianxia .post-tts-ic-pause::after {
	content: "";
	display: block;
	width: 3px;
	height: 12px;
	background: rgba(255, 255, 255, 0.95);
	border-radius: 1px;
}

.post-tts-xianxia .post-tts-btn-play.is-playing .post-tts-ic-play {
	display: none;
}

.post-tts-xianxia .post-tts-btn-play.is-playing .post-tts-ic-pause {
	display: flex;
}

/* Thời gian */
.post-tts-xianxia .post-tts-time {
	flex: 0 0 auto;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	width: 2.6rem;
	min-width: 2.5rem;
	max-width: 3.2rem;
	height: var(--post-tts-row-h);
	font-size: 0.74rem;
	color: var(--post-tts-gold);
	font-family: ui-monospace, "Cascadia Mono", Consolas, monospace;
	line-height: 1 !important;
	padding: 0 !important;
	margin: 0 !important;
	border: 0;
}

.post-tts-xianxia .post-tts-time-cur {
	justify-content: flex-start;
}

.post-tts-xianxia .post-tts-time-dur {
	justify-content: flex-end;
}

/* Seek — chiếm phần giữa */
.post-tts-xianxia .post-tts-progress-wrap {
	flex: 1 1 auto;
	min-width: 0;
	width: auto;
	max-width: 100%;
	display: flex;
	align-items: center;
	justify-content: stretch;
	height: var(--post-tts-row-h);
}

.post-tts-xianxia .post-tts-seek {
	--post-tts-pct: 0%;
	-webkit-appearance: none;
	appearance: none;
	width: 100%;
	height: 28px;
	margin: 0 !important;
	padding: 0 !important;
	border: none !important;
	cursor: pointer;
	background: transparent !important;
	box-shadow: none !important;
}

.post-tts-xianxia .post-tts-seek::-webkit-slider-runnable-track {
	height: 5px;
	border-radius: 4px;
	background: linear-gradient(
		90deg,
		#5c1010 0%,
		var(--post-tts-gold) var(--post-tts-pct),
		#2a1810 var(--post-tts-pct),
		#0f0806 100%
	);
}

.post-tts-xianxia .post-tts-seek::-webkit-slider-thumb {
	-webkit-appearance: none;
	appearance: none;
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background: radial-gradient(circle at 35% 35%, #fff8cc, var(--post-tts-gold) 60%, #5c4010);
	border: 1px solid #3a2818;
	box-shadow: 0 0 6px rgba(212, 175, 55, 0.55);
	margin-top: -3.5px;
}

.post-tts-xianxia .post-tts-seek::-moz-range-thumb {
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background: var(--post-tts-gold);
	border: 1px solid #3a2818;
	cursor: pointer;
}

.post-tts-xianxia .post-tts-seek::-moz-range-track {
	height: 5px;
	border-radius: 4px;
	background: linear-gradient(
		90deg,
		#5c1010 0%,
		var(--post-tts-gold) var(--post-tts-pct),
		#2a1810 var(--post-tts-pct),
		#0f0806 100%
	);
}

/* Âm lượng — góc phải, không tràn ra ngoài viền */
.post-tts-xianxia .post-tts-vol-box {
	flex: 0 0 auto;
	display: inline-flex !important;
	flex-direction: row;
	align-items: center;
	justify-content: flex-end;
	gap: 6px;
	min-width: 0;
	max-width: 120px;
	height: var(--post-tts-row-h);
	max-height: var(--post-tts-row-h);
	margin: 0 !important;
	padding: 0 2px !important;
	overflow: visible;
}

/* Theme thường cho button min-height ~40px — ép nằm trong hàng */
.post-tts-xianxia .post-tts-bar button.post-tts-btn-mute {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	box-sizing: border-box !important;
	width: 30px !important;
	height: 30px !important;
	min-width: 30px !important;
	min-height: 0 !important;
	max-width: 30px !important;
	max-height: 30px !important;
	padding: 0 !important;
	margin: 0 !important;
	background: transparent !important;
	border: none !important;
	box-shadow: none !important;
	cursor: pointer;
	line-height: 0 !important;
	opacity: 0.9;
	flex: 0 0 30px;
	vertical-align: middle !important;
}

.post-tts-xianxia .post-tts-btn-mute svg {
	display: block !important;
	width: 18px !important;
	height: 18px !important;
	margin: 0 !important;
	pointer-events: none;
	flex-shrink: 0;
}

.post-tts-xianxia .post-tts-btn-mute:hover {
	opacity: 1;
}

.post-tts-xianxia .post-tts-svg-vol-off {
	display: none;
}

.post-tts-xianxia .post-tts-btn-mute.is-muted .post-tts-svg-vol-on {
	display: none;
}

.post-tts-xianxia .post-tts-btn-mute.is-muted .post-tts-svg-vol-off {
	display: block;
}

.post-tts-xianxia .post-tts-vol {
	-webkit-appearance: none;
	appearance: none;
	width: 52px;
	min-width: 40px;
	max-width: 72px;
	height: 24px;
	margin: 0 !important;
	padding: 0 !important;
	border: none !important;
	background: transparent !important;
	box-shadow: none !important;
	flex: 1 1 auto;
}

.post-tts-xianxia .post-tts-vol::-webkit-slider-runnable-track {
	height: 4px;
	border-radius: 2px;
	background: rgba(212, 175, 55, 0.25);
}

.post-tts-xianxia .post-tts-vol::-webkit-slider-thumb {
	-webkit-appearance: none;
	width: 10px;
	height: 10px;
	margin-top: -3px;
	border-radius: 50%;
	background: radial-gradient(circle at 30% 30%, #fff3a0, var(--post-tts-gold));
	border: 1px solid #4a3020;
	box-shadow: 0 0 4px rgba(212, 175, 55, 0.5);
}

.post-tts-xianxia .post-tts-vol::-moz-range-track {
	height: 4px;
	border-radius: 2px;
	background: rgba(212, 175, 55, 0.25);
}

.post-tts-xianxia .post-tts-vol::-moz-range-thumb {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: var(--post-tts-gold);
	border: 1px solid #4a3020;
	cursor: pointer;
}

/* Chú thích dưới — giống mẫu: dòng 1 italic, dòng 2 nhỏ hơn */
.post-tts-xianxia .post-tts-meta {
	margin: 0 0 4px;
	padding: 0 8px;
	font-size: 0.76rem;
	font-style: italic;
	font-weight: 400;
	color: #c4a86a;
	text-align: center;
	line-height: 1.45;
	opacity: 0.95;
}

.post-tts-xianxia .post-tts-sub {
	margin: 0;
	padding: 0 8px;
	font-size: 0.68rem;
	font-style: normal;
	color: #8a7548;
	text-align: center;
	letter-spacing: 0.08em;
	opacity: 0.88;
}

.post-tts-xianxia .post-tts-audio-el {
	position: absolute;
	left: -9999px;
	width: 300px;
	height: 32px;
	opacity: 0;
	pointer-events: none;
}

@media (max-width: 600px) {
	.post-tts-player-wrap.post-tts-xianxia {
		--post-tts-max-w: 100%;
		margin: 0.85rem 0;
		padding: 14px 12px 12px;
		border-radius: 4px;
	}

	.post-tts-xianxia .post-tts-headline {
		font-size: 0.72rem;
		letter-spacing: 0.14em;
	}

	.post-tts-xianxia .post-tts-bar {
		gap: 6px;
		--post-tts-row-h: 34px;
	}

	.post-tts-xianxia .post-tts-vol-box {
		max-width: 100px;
		gap: 4px;
	}

	.post-tts-xianxia .post-tts-vol {
		width: 40px;
		min-width: 36px;
		max-width: 56px;
	}
}