/**
 * OV RP增强设置 — 文章缩略图标签样式 (v2)
 *
 * 外观复用主题的 .badge 徽章类（与「置顶」「VIP」徽标同源），
 * 这里只补充颜色、间距、溢出与暗色模式处理。
 * 颜色由 PHP 内联 --ovrpe-tb-color 提供，缺失时回落到主题变量。
 *
 * v1.6.5 布局调整：
 * - 左上角（主题 .tips-badge 容器内）：自动分类标签 .ovrpe-tb-cat（白玻璃底 + 深色字）
 * - 右上角（插件注入的 .ovrpe-tb-right 容器）：手动标签（新游/更新 …）
 * 两个容器的徽标共用同一套样式；右侧容器不带 .tips-badge 类，
 * 因此下面的选择器必须同时覆盖 .ovrpe-tb-right。
 *
 * 文件名带 .v2：本站优化插件会剥离 ?ver= 查询参数，改样式后浏览器
 * 仍按旧 URL 命中 12 小时缓存 —— 换文件名强制回源（enqueue 见
 * class-thumbnail-badge.php）。
 */

/* ── 徽标基础样式（左右容器通用） ─────────────────────────────── */
.tips-badge .ovrpe-tb-item,
.ovrpe-tb-right .ovrpe-tb-item {
	background-color: var(--ovrpe-tb-color, var(--ri-secondary, #5d616e));
	color: #fff;
	border-radius: var(--ri-border-radius-sm, 0.375rem);
	letter-spacing: 0.02em;
	margin: 0 0.25rem 0.25rem 0;
	max-width: 12em;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	-webkit-backdrop-filter: blur(2px);
	backdrop-filter: blur(2px);
	transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

/*
 * 手动标签（新游/更新 …）字色兜底：主题有更高特异性的
 * `.post-item .tips-badge .badge{color:#950000}`（暗红，本意是给浅底徽标用的），
 * 会压过上面的 color:#fff —— 这里用同等/更高特异性把白字夺回来。
 * 注意：不包含 .ovrpe-tb-cat（分类标签是白玻璃底，需要深色字）。
 */
.post-item .tips-badge .ovrpe-tb-item:not(.ovrpe-tb-cat),
.post-item .ovrpe-tb-right .ovrpe-tb-item {
	color: #fff;
}

/* ── 左上角自动分类标签：白玻璃底（rgba 由内联 --ovrpe-tb-color 提供）── */
.tips-badge .ovrpe-tb-cat {
	font-weight: 600;
	color: #1f232b;
	-webkit-backdrop-filter: blur(8px) saturate(1.2);
	backdrop-filter: blur(8px) saturate(1.2);
	box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.08), 0 1px 3px rgba(0, 0, 0, 0.14);
}

/* 分类标签字色：压过主题 .post-item .tips-badge .badge{color:#950000} 的暗红，
   白底必须用深色字才可读（0,4,0 > 主题的 0,3,0） */
.post-item .tips-badge .ovrpe-tb-cat {
	color: #1f232b;
}

/* 暗色模式：白底标签保持白底，仅微降亮度避免刺眼；彩色手动标签提亮 + 同色描边 */
[data-bs-theme="dark"] .tips-badge .ovrpe-tb-cat {
	filter: brightness(0.94);
}
[data-bs-theme="dark"] .tips-badge .ovrpe-tb-item:not(.ovrpe-tb-cat),
[data-bs-theme="dark"] .ovrpe-tb-right .ovrpe-tb-item {
	filter: brightness(1.12);
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.14);
}

/* 右上角容器：徽标向右对齐排列（容器本身由定位类贴右） */
.ovrpe-tb-right {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	align-items: flex-start;
}

.ovrpe-tb-right .ovrpe-tb-item {
	margin: 0 0 0.25rem 0.25rem;
}

/* 移动端：收敛字号与内边距，避免遮挡缩略图主体 */
@media (max-width: 575.98px) {
	.tips-badge .ovrpe-tb-item,
	.ovrpe-tb-right .ovrpe-tb-item {
		font-size: 0.6875rem;
		padding: 0.28em 0.5em;
		max-width: 9em;
	}
}

/* 尊重系统的「减少动态效果」偏好 */
@media (prefers-reduced-motion: reduce) {
	.tips-badge .ovrpe-tb-item,
	.ovrpe-tb-right .ovrpe-tb-item {
		transition: none;
	}
}