/* ============================================================
   📝 Markdown 内容样式
   为 Markdown 解析后的内容提供样式支持
   ============================================================ */

/* ============================================================
   🎨 Markdown 标题渐变色样式
   ============================================================ */

/* 💜 一级标题  */
h1,
h1.wp-block-heading,
.vp-single-content h1,
.entry-content h1,
.wp-block-post-content h1 {
	background: var(--vp-c-h1-gradient) !important; /* ◀️ 应用平滑渐变 */
	-webkit-background-clip: text !important; /* ◀️ 将背景裁剪为文字形状 */
	-webkit-text-fill-color: transparent !important; /* ◀️ 文字填充透明，显示背景渐变 */
	background-clip: text !important;
	color: transparent !important;
}

/* 🔵 二级标题 */
h2,
h2.wp-block-heading,
.vp-single-content h2,
.entry-content h2,
.wp-block-post-content h2 {
	background: var(--vp-c-h2-gradient) !important; /* ◀️ 应用平滑渐变 */
	-webkit-background-clip: text !important; /* ◀️ 将背景裁剪为文字形状 */
	-webkit-text-fill-color: transparent !important; /* ◀️ 文字填充透明，显示背景渐变 */
	background-clip: text !important;
	color: transparent !important;
}

/* 🟠 三级标题 */
h3,
h3.wp-block-heading,
.vp-single-content h3,
.entry-content h3,
.wp-block-post-content h3 {
	background: var(--vp-c-h3-gradient) !important; /* ◀️ 应用平滑渐变 */
	-webkit-background-clip: text !important; /* ◀️ 将背景裁剪为文字形状 */
	-webkit-text-fill-color: transparent !important; /* ◀️ 文字填充透明，显示背景渐变 */
	background-clip: text !important;
	color: transparent !important;
}

/* ⬛ 四级标题 */
h4,
h4.wp-block-heading,
.vp-single-content h4,
.entry-content h4,
.wp-block-post-content h4 {
	background: var(--vp-c-h4-gradient) !important; /* ◀️ 应用平滑渐变 */
	-webkit-background-clip: text !important; /* ◀️ 将背景裁剪为文字形状 */
	-webkit-text-fill-color: transparent !important; /* ◀️ 文字填充透明，显示背景渐变 */
	background-clip: text !important;
	color: transparent !important;
}

/* 💕 五级标题 */
h5,
h5.wp-block-heading,
.vp-single-content h5,
.entry-content h5,
.wp-block-post-content h5 {
	background: var(--vp-c-h5-gradient) !important; /* ◀️ 应用平滑渐变 */
	-webkit-background-clip: text !important; /* ◀️ 将背景裁剪为文字形状 */
	-webkit-text-fill-color: transparent !important; /* ◀️ 文字填充透明，显示背景渐变 */
	background-clip: text !important;
	color: transparent !important;
}

/* 🔷 六级标题 */
h6,
h6.wp-block-heading,
.vp-single-content h6,
.entry-content h6,
.wp-block-post-content h6 {
	background: var(--vp-c-h6-gradient) !important; /* ◀️ 应用平滑渐变 */
	-webkit-background-clip: text !important; /* ◀️ 将背景裁剪为文字形状 */
	-webkit-text-fill-color: transparent !important; /* ◀️ 文字填充透明，显示背景渐变 */
	background-clip: text !important;
	color: transparent !important;
}

/* ============================================================
   📋 Markdown 内容基础样式
   ============================================================ */

/* 🔗 引用块样式 */
.vp-docs-body blockquote,
.vp-docs-content blockquote,
.entry-content blockquote {
	border-left: 4px solid var(--vp-c-brand-1);
	padding-left: 1rem;
	margin-left: 0;
	color: var(--vp-c-text-2);
	background-color: var(--vp-c-bg-soft);
	padding: 1rem 1rem 1rem 1.25rem;
	border-radius: 0 var(--vp-border-radius) var(--vp-border-radius) 0;
}

/* ============================================================
   💻 代码块样式 - VitePress 风格
   ============================================================ */

/* 🔗 代码块容器 - VitePress 风格 (通用选择器) */
pre,
.wp-block-code,
.wp-block-preformatted {
	position: relative !important;
	background: var(--vp-code-block-bg) !important;
	border-radius: var(--vp-border-radius-lg) !important;
	padding: 0 !important;
	overflow: hidden !important;
	margin: 1.5em 0 !important;
	box-shadow: var(--vp-shadow-2) !important;
	border: 1px solid var(--vp-code-block-border) !important;
	font-family: var(--vp-font-family-mono) !important;
}

/* 🔗 代码块容器 - 特定容器内 */
.vp-docs-body pre,
.vp-docs-content pre,
.entry-content pre {
	position: relative;
	background: var(--vp-code-block-bg);
	border-radius: var(--vp-border-radius-lg);
	padding: 0;
	overflow: hidden;
	margin: 1.5em 0;
	box-shadow: var(--vp-shadow-2);
	border: 1px solid var(--vp-code-block-border);
}





/* 📄 代码内容区域 (通用选择器) */
pre code,
.wp-block-code code,
.wp-block-preformatted code {
	display: block !important;
	padding: 3.25rem 1.5rem 1.5rem !important;
	font-family: var(--vp-font-family-mono) !important;
	font-size: 0.875rem !important;
	line-height: 1.7 !important;
	color: var(--vp-code-block-color) !important;
	background: transparent !important;
	overflow-x: auto !important;
}

/* 📄 代码内容区域 - 特定容器内 */
.vp-docs-body pre code,
.vp-docs-content pre code,
.entry-content pre code {
	display: block;
	padding: 3.25rem 1.5rem 1.5rem;
	font-family: var(--vp-font-family-mono);
	font-size: 0.875rem;
	line-height: 1.7;
	color: var(--vp-code-block-color);
	background: transparent;
	overflow-x: auto;
}

/* 🌆 暗色模式 (通用选择器) */
@media (prefers-color-scheme: dark) {
	pre,
	.wp-block-code,
	.wp-block-preformatted {
		background: var(--vp-code-block-bg) !important;
		border-color: var(--vp-code-block-border) !important;
	}
	
	.vp-docs-body pre,
	.vp-docs-content pre,
	.entry-content pre {
		background: var(--vp-code-block-bg);
		border-color: var(--vp-code-block-border);
	}
}

.vp-dark pre,
.vp-dark .wp-block-code,
.vp-dark .wp-block-preformatted,
.vp-dark .vp-docs-body pre,
.vp-dark .vp-docs-content pre,
.vp-dark .entry-content pre {
	background: var(--vp-code-block-bg) !important;
	border-color: var(--vp-code-block-border) !important;
}



/* 行内代码 (通用选择器) */
code {
	font-family: var(--vp-font-family-mono);
	font-size: 0.875em;
	background-color: var(--vp-c-code-bg);
	color: var(--vp-c-code-text);
	padding: 0.2em 0.4em;
	border-radius: var(--vp-border-radius-sm);
}

pre code {
	background: none;
	padding: 0;
}

/* 行内代码 - 特定容器内 */
.vp-docs-body code,
.vp-docs-content code,
.entry-content code {
	font-family: var(--vp-font-family-mono);
	font-size: 0.875em;
	background-color: var(--vp-c-code-bg);
	color: var(--vp-c-code-text);
	padding: 0.2em 0.4em;
	border-radius: var(--vp-border-radius-sm);
}

.vp-docs-body pre code,
.vp-docs-content pre code,
.entry-content pre code {
	background: none;
	padding: 0;
}

/* ============================================================
   📋 代码复制按钮样式
   ============================================================ */

.vp-code-copy-button {
	position: absolute;
	top: 0.625rem;
	right: 0.75rem;
	z-index: 4;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2rem;
	height: 2rem;
	padding: 0;
	background: transparent;
	border: 1px solid var(--vp-code-block-border);
	border-radius: var(--vp-border-radius);
	color: var(--vp-c-text-2);
	cursor: pointer;
	opacity: 0;
	transition: all 0.2s ease;
}

pre:hover .vp-code-copy-button,
.wp-block-code:hover .vp-code-copy-button,
.wp-block-preformatted:hover .vp-code-copy-button,
.vp-docs-body pre:hover .vp-code-copy-button,
.vp-docs-content pre:hover .vp-code-copy-button,
.entry-content pre:hover .vp-code-copy-button {
	opacity: 1;
}

.vp-code-copy-button:hover {
	background: var(--vp-c-bg-soft);
	border-color: var(--vp-c-brand-1);
	color: var(--vp-c-brand-1);
}

.vp-code-copy-button.copied {
	color: var(--vp-c-brand-1);
	border-color: var(--vp-c-brand-1);
}

.vp-code-copy-button svg {
	width: 1rem;
	height: 1rem;
}

/* ============================================================
   🔢 代码行号样式
   ============================================================ */

.vp-code-block {
	display: flex;
}

.vp-code-lines {
	flex-shrink: 0;
	padding: 3.25rem 0.75rem 1.5rem 1rem;
	font-family: var(--vp-font-family-mono);
	font-size: 0.875rem;
	line-height: 1.7;
	color: var(--vp-c-text-3);
	text-align: right;
	user-select: none;
	border-right: 1px solid var(--vp-code-block-border);
	background: var(--vp-code-block-bg);
}

.vp-code-line-number {
	display: block;
}

.vp-code-content {
	flex: 1;
	overflow-x: auto;
}

.vp-code-content pre {
	margin: 0;
	border: none;
	border-radius: 0;
	box-shadow: none;
}

.vp-code-content pre::before,
.vp-code-content pre::after {
	display: none;
}

.vp-code-content pre code {
	padding: 3.25rem 1.5rem 1.5rem;
}

/* ============================================================
   🎨 代码高亮样式 - GitHub 主题
   ============================================================ */

.vp-code-keyword {
	color: var(--vp-code-keyword);
}

.vp-code-string {
	color: var(--vp-code-string);
}

.vp-code-number {
	color: var(--vp-code-number);
}

.vp-code-function {
	color: var(--vp-code-function);
}

.vp-code-comment {
	color: var(--vp-code-comment);
	font-style: italic;
}

.vp-code-class {
	color: var(--vp-code-class);
}

.vp-code-variable {
	color: var(--vp-code-variable);
}

.vp-code-operator {
	color: var(--vp-code-operator);
}

.vp-code-punctuation {
	color: var(--vp-code-punctuation);
}

/* 🔗 表格样式 */
.vp-docs-body table,
.vp-docs-content table,
.entry-content table {
	width: 100%;
	border-collapse: collapse;
	margin: 1em 0;
}

.vp-docs-body th,
.vp-docs-body td,
.vp-docs-content th,
.vp-docs-content td,
.entry-content th,
.entry-content td {
	padding: 0.75rem 1rem;
	border: 1px solid var(--vp-c-border);
	text-align: left;
}

.vp-docs-body th,
.vp-docs-content th,
.entry-content th {
	background-color: var(--vp-c-bg-soft);
	font-weight: 600;
}

/* 🔗 列表样式 */
.vp-docs-body ul,
.vp-docs-body ol,
.vp-docs-content ul,
.vp-docs-content ol,
.entry-content ul,
.entry-content ol {
	padding-left: 1.5em;
	margin: 1em 0;
}

.vp-docs-body li,
.vp-docs-content li,
.entry-content li {
	margin: 0.5em 0;
}

/* 🔗 链接样式 */
.vp-docs-body a,
.vp-docs-content a,
.entry-content a {
	color: var(--vp-c-brand-1);
	text-decoration: none;
	transition: color 0.25s;
}

.vp-docs-body a:hover,
.vp-docs-content a:hover,
.entry-content a:hover {
	color: var(--vp-c-brand-2);
}

/* 🔗 分隔线样式 */
.vp-docs-body hr,
.vp-docs-content hr,
.entry-content hr {
	border: none;
	border-top: 1px solid var(--vp-c-divider);
	margin: 2em 0;
}

/* 🔗 图片样式 */
.vp-docs-body img,
.vp-docs-content img,
.entry-content img {
	max-width: 100%;
	height: auto;
	border-radius: var(--vp-border-radius);
}

/* ============================================================
   🎨 代码语言图标样式
   ============================================================ */

/* 📘 Markdown 图标 */
pre[data-lang="md"]::before,
pre[data-lang="markdown"]::before,
.wp-block-code[data-lang="md"]::before,
.wp-block-code[data-lang="markdown"]::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect width='24' height='24' fill='%23000' rx='2'/%3E%3Ctext x='12' y='17' font-size='10' font-weight='bold' text-anchor='middle' fill='%23fff'%3EMD%3C/text%3E%3C/svg%3E");
}

/* 🟢 Vue 图标 */
pre[data-lang="vue"]::before,
.wp-block-code[data-lang="vue"]::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect width='24' height='24' fill='%234FC08D' rx='2'/%3E%3Ctext x='12' y='17' font-size='11' font-weight='bold' text-anchor='middle' fill='%23fff'%3EVUE%3C/text%3E%3C/svg%3E");
}

/* 🔵 CSS 图标 */
pre[data-lang="css"]::before,
.wp-block-code[data-lang="css"]::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect width='24' height='24' fill='%23264DE4' rx='2'/%3E%3Ctext x='12' y='17' font-size='12' font-weight='bold' text-anchor='middle' fill='%23fff'%3ECSS%3C/text%3E%3C/svg%3E");
}

/* 🟣 SCSS 图标 */
pre[data-lang="scss"]::before,
.wp-block-code[data-lang="scss"]::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect width='24' height='24' fill='%23CC6699' rx='2'/%3E%3Ctext x='12' y='17' font-size='9' font-weight='bold' text-anchor='middle' fill='%23fff'%3ESCSS%3C/text%3E%3C/svg%3E");
}

/* 🔵 TypeScript 图标 */
pre[data-lang="ts"]::before,
pre[data-lang="typescript"]::before,
.wp-block-code[data-lang="ts"]::before,
.wp-block-code[data-lang="typescript"]::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect width='24' height='24' fill='%233178C6' rx='2'/%3E%3Ctext x='12' y='17' font-size='10' font-weight='bold' text-anchor='middle' fill='%23fff'%3ETS%3C/text%3E%3C/svg%3E");
}

/* 🟡 JavaScript 图标 */
pre[data-lang="js"]::before,
pre[data-lang="javascript"]::before,
.wp-block-code[data-lang="js"]::before,
.wp-block-code[data-lang="javascript"]::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect width='24' height='24' fill='%23F7DF1E' rx='2'/%3E%3Ctext x='12' y='17' font-size='14' font-weight='bold' text-anchor='middle' fill='%23000'%3EJS%3C/text%3E%3C/svg%3E");
}

/* 🟣 PHP 图标 */
pre[data-lang="php"]::before,
.wp-block-code[data-lang="php"]::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect width='24' height='24' fill='%23777BB4' rx='2'/%3E%3Ctext x='12' y='17' font-size='14' font-weight='bold' text-anchor='middle' fill='%23fff'%3EPHP%3C/text%3E%3C/svg%3E");
}

/* 🟠 HTML 图标 */
pre[data-lang="html"]::before,
.wp-block-code[data-lang="html"]::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect width='24' height='24' fill='%23E34C26' rx='2'/%3E%3Ctext x='12' y='17' font-size='10' font-weight='bold' text-anchor='middle' fill='%23fff'%3EHTML%3C/text%3E%3C/svg%3E");
}

/* 🔵 Go 图标 */
pre[data-lang="go"]::before,
pre[data-lang="golang"]::before,
.wp-block-code[data-lang="go"]::before,
.wp-block-code[data-lang="golang"]::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect width='24' height='24' fill='%2300ADD8' rx='2'/%3E%3Ctext x='12' y='17' font-size='14' font-weight='bold' text-anchor='middle' fill='%23fff'%3EGo%3C/text%3E%3C/svg%3E");
}

/* 🟡 Python 图标 */
pre[data-lang="python"]::before,
pre[data-lang="py"]::before,
.wp-block-code[data-lang="python"]::before,
.wp-block-code[data-lang="py"]::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect width='24' height='24' fill='%233776AB' rx='2'/%3E%3Ctext x='12' y='17' font-size='9' font-weight='bold' text-anchor='middle' fill='%23fff'%3EPY%3C/text%3E%3C/svg%3E");
}

/* 🔵 C 图标 */
pre[data-lang="c"]::before,
.wp-block-code[data-lang="c"]::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect width='24' height='24' fill='%23A8B9CC' rx='2'/%3E%3Ctext x='12' y='17' font-size='14' font-weight='bold' text-anchor='middle' fill='%23000'%3EC%3C/text%3E%3C/svg%3E");
}

/* 🔵 C# 图标 */
pre[data-lang="csharp"]::before,
pre[data-lang="c#"]::before,
pre[data-lang="cs"]::before,
.wp-block-code[data-lang="csharp"]::before,
.wp-block-code[data-lang="c#"]::before,
.wp-block-code[data-lang="cs"]::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect width='24' height='24' fill='%23239120' rx='2'/%3E%3Ctext x='12' y='17' font-size='12' font-weight='bold' text-anchor='middle' fill='%23fff'%3EC#%3C/text%3E%3C/svg%3E");
}

/* 🔴 Java 图标 */
pre[data-lang="java"]::before,
.wp-block-code[data-lang="java"]::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect width='24' height='24' fill='%23007396' rx='2'/%3E%3Ctext x='12' y='17' font-size='10' font-weight='bold' text-anchor='middle' fill='%23fff'%3EJAVA%3C/text%3E%3C/svg%3E");
}

/* 🟤 Rust 图标 */
pre[data-lang="rust"]::before,
pre[data-lang="rs"]::before,
.wp-block-code[data-lang="rust"]::before,
.wp-block-code[data-lang="rs"]::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect width='24' height='24' fill='%23DEA584' rx='2'/%3E%3Ctext x='12' y='17' font-size='9' font-weight='bold' text-anchor='middle' fill='%23000'%3ERUST%3C/text%3E%3C/svg%3E");
}

/* 🟣 Kotlin 图标 */
pre[data-lang="kotlin"]::before,
.wp-block-code[data-lang="kotlin"]::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect width='24' height='24' fill='%237F52FF' rx='2'/%3E%3Ctext x='12' y='17' font-size='8' font-weight='bold' text-anchor='middle' fill='%23fff'%3EKotlin%3C/text%3E%3C/svg%3E");
}

/* 🎨 代码语言图标 - 特定容器内（使用简化版本） */
.vp-docs-body pre[data-lang="md"]::before,
.vp-docs-body pre[data-lang="markdown"]::before,
.vp-docs-content pre[data-lang="md"]::before,
.vp-docs-content pre[data-lang="markdown"]::before,
.entry-content pre[data-lang="md"]::before,
.entry-content pre[data-lang="markdown"]::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect width='24' height='24' fill='%23000' rx='2'/%3E%3Ctext x='12' y='17' font-size='10' font-weight='bold' text-anchor='middle' fill='%23fff'%3EMD%3C/text%3E%3C/svg%3E");
}

.vp-docs-body pre[data-lang="vue"]::before,
.vp-docs-content pre[data-lang="vue"]::before,
.entry-content pre[data-lang="vue"]::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect width='24' height='24' fill='%234FC08D' rx='2'/%3E%3Ctext x='12' y='17' font-size='11' font-weight='bold' text-anchor='middle' fill='%23fff'%3EVUE%3C/text%3E%3C/svg%3E");
}

.vp-docs-body pre[data-lang="css"]::before,
.vp-docs-content pre[data-lang="css"]::before,
.entry-content pre[data-lang="css"]::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect width='24' height='24' fill='%23264DE4' rx='2'/%3E%3Ctext x='12' y='17' font-size='12' font-weight='bold' text-anchor='middle' fill='%23fff'%3ECSS%3C/text%3E%3C/svg%3E");
}

.vp-docs-body pre[data-lang="scss"]::before,
.vp-docs-content pre[data-lang="scss"]::before,
.entry-content pre[data-lang="scss"]::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect width='24' height='24' fill='%23CC6699' rx='2'/%3E%3Ctext x='12' y='17' font-size='9' font-weight='bold' text-anchor='middle' fill='%23fff'%3ESCSS%3C/text%3E%3C/svg%3E");
}

.vp-docs-body pre[data-lang="ts"]::before,
.vp-docs-body pre[data-lang="typescript"]::before,
.vp-docs-content pre[data-lang="ts"]::before,
.vp-docs-content pre[data-lang="typescript"]::before,
.entry-content pre[data-lang="ts"]::before,
.entry-content pre[data-lang="typescript"]::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect width='24' height='24' fill='%233178C6' rx='2'/%3E%3Ctext x='12' y='17' font-size='10' font-weight='bold' text-anchor='middle' fill='%23fff'%3ETS%3C/text%3E%3C/svg%3E");
}

.vp-docs-body pre[data-lang="js"]::before,
.vp-docs-body pre[data-lang="javascript"]::before,
.vp-docs-content pre[data-lang="js"]::before,
.vp-docs-content pre[data-lang="javascript"]::before,
.entry-content pre[data-lang="js"]::before,
.entry-content pre[data-lang="javascript"]::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect width='24' height='24' fill='%23F7DF1E' rx='2'/%3E%3Ctext x='12' y='17' font-size='14' font-weight='bold' text-anchor='middle' fill='%23000'%3EJS%3C/text%3E%3C/svg%3E");
}

.vp-docs-body pre[data-lang="php"]::before,
.vp-docs-content pre[data-lang="php"]::before,
.entry-content pre[data-lang="php"]::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect width='24' height='24' fill='%23777BB4' rx='2'/%3E%3Ctext x='12' y='17' font-size='14' font-weight='bold' text-anchor='middle' fill='%23fff'%3EPHP%3C/text%3E%3C/svg%3E");
}

.vp-docs-body pre[data-lang="html"]::before,
.vp-docs-content pre[data-lang="html"]::before,
.entry-content pre[data-lang="html"]::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect width='24' height='24' fill='%23E34C26' rx='2'/%3E%3Ctext x='12' y='17' font-size='10' font-weight='bold' text-anchor='middle' fill='%23fff'%3EHTML%3C/text%3E%3C/svg%3E");
}

.vp-docs-body pre[data-lang="go"]::before,
.vp-docs-body pre[data-lang="golang"]::before,
.vp-docs-content pre[data-lang="go"]::before,
.vp-docs-content pre[data-lang="golang"]::before,
.entry-content pre[data-lang="go"]::before,
.entry-content pre[data-lang="golang"]::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect width='24' height='24' fill='%2300ADD8' rx='2'/%3E%3Ctext x='12' y='17' font-size='14' font-weight='bold' text-anchor='middle' fill='%23fff'%3EGo%3C/text%3E%3C/svg%3E");
}

.vp-docs-body pre[data-lang="python"]::before,
.vp-docs-body pre[data-lang="py"]::before,
.vp-docs-content pre[data-lang="python"]::before,
.vp-docs-content pre[data-lang="py"]::before,
.entry-content pre[data-lang="python"]::before,
.entry-content pre[data-lang="py"]::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect width='24' height='24' fill='%233776AB' rx='2'/%3E%3Ctext x='12' y='17' font-size='9' font-weight='bold' text-anchor='middle' fill='%23fff'%3EPY%3C/text%3E%3C/svg%3E");
}

.vp-docs-body pre[data-lang="c"]::before,
.vp-docs-content pre[data-lang="c"]::before,
.entry-content pre[data-lang="c"]::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect width='24' height='24' fill='%23A8B9CC' rx='2'/%3E%3Ctext x='12' y='17' font-size='14' font-weight='bold' text-anchor='middle' fill='%23000'%3EC%3C/text%3E%3C/svg%3E");
}

.vp-docs-body pre[data-lang="csharp"]::before,
.vp-docs-body pre[data-lang="c#"]::before,
.vp-docs-body pre[data-lang="cs"]::before,
.vp-docs-content pre[data-lang="csharp"]::before,
.vp-docs-content pre[data-lang="c#"]::before,
.vp-docs-content pre[data-lang="cs"]::before,
.entry-content pre[data-lang="csharp"]::before,
.entry-content pre[data-lang="c#"]::before,
.entry-content pre[data-lang="cs"]::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect width='24' height='24' fill='%23239120' rx='2'/%3E%3Ctext x='12' y='17' font-size='12' font-weight='bold' text-anchor='middle' fill='%23fff'%3EC#%3C/text%3E%3C/svg%3E");
}

.vp-docs-body pre[data-lang="java"]::before,
.vp-docs-content pre[data-lang="java"]::before,
.entry-content pre[data-lang="java"]::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect width='24' height='24' fill='%23007396' rx='2'/%3E%3Ctext x='12' y='17' font-size='10' font-weight='bold' text-anchor='middle' fill='%23fff'%3EJAVA%3C/text%3E%3C/svg%3E");
}

.vp-docs-body pre[data-lang="rust"]::before,
.vp-docs-body pre[data-lang="rs"]::before,
.vp-docs-content pre[data-lang="rust"]::before,
.vp-docs-content pre[data-lang="rs"]::before,
.entry-content pre[data-lang="rust"]::before,
.entry-content pre[data-lang="rs"]::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect width='24' height='24' fill='%23DEA584' rx='2'/%3E%3Ctext x='12' y='17' font-size='9' font-weight='bold' text-anchor='middle' fill='%23000'%3ERUST%3C/text%3E%3C/svg%3E");
}

.vp-docs-body pre[data-lang="kotlin"]::before,
.vp-docs-content pre[data-lang="kotlin"]::before,
.entry-content pre[data-lang="kotlin"]::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect width='24' height='24' fill='%237F52FF' rx='2'/%3E%3Ctext x='12' y='17' font-size='8' font-weight='bold' text-anchor='middle' fill='%23fff'%3EKotlin%3C/text%3E%3C/svg%3E");
}