.fluent_com .wpzyh-code-block {
	--wpzyh-code-bg: #202329;
	--wpzyh-code-bar: #2a2e35;
	--wpzyh-code-text: #e5e7eb;
	--wpzyh-code-muted: #a8b0bd;
	margin: 0.75em 0;
	overflow: hidden;
	border: 1px solid color-mix(in srgb, currentColor 10%, transparent);
	border-radius: 10px;
	background: var(--wpzyh-code-bg);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}

html:not(.dark) .fluent_com .wpzyh-code-block {
	--wpzyh-code-bg: #f6f7f9;
	--wpzyh-code-bar: #eceef2;
	--wpzyh-code-text: #22262d;
	--wpzyh-code-muted: #626b78;
}

.fluent_com .wpzyh-code-bar {
	min-height: 36px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 0 10px 0 12px;
	background: var(--wpzyh-code-bar);
}

.fluent_com .wpzyh-code-dots {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

.fluent_com .wpzyh-code-dot {
	width: 11px;
	height: 11px;
	border-radius: 50%;
	box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.12);
}

.fluent_com .wpzyh-code-dot:nth-child(1) { background: #ff5f57; }
.fluent_com .wpzyh-code-dot:nth-child(2) { background: #febc2e; }
.fluent_com .wpzyh-code-dot:nth-child(3) { background: #28c840; }

.fluent_com .wpzyh-code-copy {
	appearance: none;
	border: 0;
	border-radius: 6px;
	background: transparent;
	color: var(--wpzyh-code-muted);
	font: inherit;
	font-size: 12px;
	line-height: 1;
	padding: 6px 8px;
	cursor: pointer;
}

.fluent_com .wpzyh-code-copy:hover,
.fluent_com .wpzyh-code-copy:focus-visible {
	background: color-mix(in srgb, currentColor 9%, transparent);
	color: var(--wpzyh-code-text);
	outline: none;
}

.fluent_com .wpzyh-code-copy.is-copied {
	color: #16a36a;
}

.fluent_com .wpzyh-code-block > pre {
	margin: 0 !important;
	padding: 14px 16px !important;
	overflow-x: auto;
	border: 0 !important;
	border-radius: 0 !important;
	background: var(--wpzyh-code-bg) !important;
	color: var(--wpzyh-code-text) !important;
	font-family: "SFMono-Regular", "SF Mono", Menlo, Monaco, Consolas, "Liberation Mono", monospace;
	font-size: 13px;
	line-height: 1.6;
	tab-size: 4;
	white-space: pre;
}

@media (max-width: 640px) {
	.fluent_com .wpzyh-code-block {
		border-radius: 8px;
	}

	.fluent_com .wpzyh-code-block > pre {
		padding: 12px 14px !important;
		font-size: 12.5px;
	}
}