/**
 * AP Syntax Highlighter — macOS-style code block wrapper (scoped).
 */

.ap-code {
	--ap-code-bg: #1e1e1e;
	--ap-code-toolbar: linear-gradient(180deg, #3d3d3d 0%, #2d2d2d 100%);
	--ap-code-border: rgba(255, 255, 255, 0.08);
	--ap-code-shadow: 0 18px 44px rgba(0, 0, 0, 0.38);
	--ap-code-title: rgba(255, 255, 255, 0.55);
	--ap-code-dot-close: #ff5f57;
	--ap-code-dot-minimize: #febc2e;
	--ap-code-dot-maximize: #28c840;
	--ap-code-font: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
	--ap-code-transition: 0.25s ease;

	max-width: 100%;
	margin: 1.5rem 0;
	border-radius: 12px;
	overflow: hidden;
	border: 1px solid var(--ap-code-border);
	box-shadow: var(--ap-code-shadow);
	background: var(--ap-code-bg);
}

.ap-code__toolbar {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	padding: 0.55rem 0.85rem;
	background: var(--ap-code-toolbar);
	border-bottom: 1px solid rgba(0, 0, 0, 0.35);
	user-select: none;
}

.ap-code__dots {
	display: flex;
	align-items: center;
	gap: 0.42rem;
	flex-shrink: 0;
}

.ap-code__dot {
	display: block;
	width: 12px;
	height: 12px;
	border-radius: 50%;
	box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.18);
	transition: filter var(--ap-code-transition);
}

.ap-code__dot--close {
	background: var(--ap-code-dot-close);
}

.ap-code__dot--minimize {
	background: var(--ap-code-dot-minimize);
}

.ap-code__dot--maximize {
	background: var(--ap-code-dot-maximize);
}

.ap-code:hover .ap-code__dot {
	filter: brightness(1.08);
}

.ap-code__title {
	flex: 1;
	text-align: center;
	margin-right: calc(12px * 3 + 0.42rem * 2);
	font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	font-size: 0.72rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--ap-code-title);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.ap-code__body {
	position: relative;
	overflow-x: auto;
	background: var(--ap-code-bg);
}

.ap-code__body pre,
.ap-code__body pre.wp-block-code {
	margin: 0 !important;
	padding: 1.1rem 1.25rem !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	font-family: var(--ap-code-font) !important;
	font-size: 0.875rem !important;
	line-height: 1.6 !important;
	tab-size: 4;
}

.ap-code__body code {
	font-family: var(--ap-code-font) !important;
	font-size: inherit !important;
	background: transparent !important;
	padding: 0 !important;
	border-radius: 0 !important;
	white-space: pre !important;
	word-wrap: normal !important;
	word-break: normal !important;
}

.ap-code__body .token.comment,
.ap-code__body .token.prolog,
.ap-code__body .token.doctype,
.ap-code__body .token.cdata {
	color: #6a9955;
}

.ap-code__body .token.punctuation {
	color: #d4d4d4;
}

.ap-code__body .token.property,
.ap-code__body .token.tag,
.ap-code__body .token.boolean,
.ap-code__body .token.number,
.ap-code__body .token.constant,
.ap-code__body .token.symbol {
	color: #b5cea8;
}

.ap-code__body .token.selector,
.ap-code__body .token.attr-name,
.ap-code__body .token.string,
.ap-code__body .token.char,
.ap-code__body .token.builtin {
	color: #ce9178;
}

.ap-code__body .token.operator,
.ap-code__body .token.entity,
.ap-code__body .token.url,
.ap-code__body .language-css .token.string,
.ap-code__body .style .token.string {
	color: #d4d4d4;
}

.ap-code__body .token.atrule,
.ap-code__body .token.attr-value,
.ap-code__body .token.keyword {
	color: #569cd6;
}

.ap-code__body .token.function,
.ap-code__body .token.class-name {
	color: #dcdcaa;
}

.ap-code__body .token.regex,
.ap-code__body .token.important,
.ap-code__body .token.variable {
	color: #d16969;
}

.ap-code__body::-webkit-scrollbar {
	height: 8px;
}

.ap-code__body::-webkit-scrollbar-track {
	background: rgba(255, 255, 255, 0.04);
}

.ap-code__body::-webkit-scrollbar-thumb {
	background: rgba(255, 255, 255, 0.18);
	border-radius: 999px;
}

.ap-code__body::-webkit-scrollbar-thumb:hover {
	background: rgba(255, 255, 255, 0.28);
}
