/*
 * NodeAlpha theme adjustments.
 *
 * Keep structural decisions in block templates/theme.json. This file is for
 * small site-level fixes and environment-aware polish that theme.json cannot
 * currently express, such as automatic dark mode via prefers-color-scheme.
 */

:root {
	color-scheme: light;
	--wp--preset--color--base: #fbfaf7;
	--wp--preset--color--contrast: rgba(0, 0, 0, 0.76);
	--nodealpha-surface: #fbfaf7;
	--nodealpha-surface-alt: #f6f6f6;
	--nodealpha-article-surface: #f3e6c3;
	--nodealpha-muted: rgba(0, 0, 0, 0.46);
	--nodealpha-border: rgba(0, 0, 0, 0.16);
	--nodealpha-link-accent: #27ae60;
	--nodealpha-code-background: #f6f6f6;
	--nodealpha-code-foreground: #1d1d1d;
	--nodealpha-reading-measure: 780px;
	--nodealpha-content-gutter: clamp(1rem, 3vw, 1.5rem);
	--nodealpha-reading-font: system-ui, -apple-system, BlinkMacSystemFont, "PingFang SC", "Noto Sans CJK SC", "Source Han Sans SC", "Microsoft YaHei", sans-serif;
	--nodealpha-heading-font: var(--wp--preset--font-family--system-font);
	--nodealpha-quote-background: rgba(0, 0, 0, 0.03);
	--nodealpha-shadow-soft: 0 18px 60px rgba(0, 0, 0, 0.06);
}

html,
body,
.wp-site-blocks {
	background-color: var(--wp--preset--color--base);
	color: var(--wp--preset--color--contrast);
}

.wp-site-blocks {
	min-height: 100vh;
}

.wp-block-post-content img,
.wp-block-post-featured-image img {
	height: auto;
	max-width: 100%;
}

code {
	overflow-wrap: anywhere;
}

pre {
	max-width: 100%;
	overflow-x: auto;
}

pre code {
	overflow-wrap: normal;
	white-space: pre;
}

.enlighter-default {
	max-width: 100%;
	overflow-x: visible;
}

.enlighter-default .enlighter {
	max-width: 100%;
	overflow-x: visible;
}

.enlighter-default .enlighter-code {
	max-width: 100%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.nodealpha-main {
	margin-inline: auto;
}

.nodealpha-single-main {
	margin-top: clamp(1.25rem, 3vw, 2rem) !important;
	padding-inline: 0;
}

.nodealpha-article,
.nodealpha-article-header,
.nodealpha-post-meta {
	margin-inline: auto;
}

.nodealpha-article {
	max-width: none;
	width: 100%;
}

.nodealpha-article-header,
.nodealpha-post-meta,
.nodealpha-content.wp-block-post-content {
	box-sizing: border-box;
	max-width: calc(var(--nodealpha-reading-measure) + var(--nodealpha-content-gutter) + var(--nodealpha-content-gutter));
	padding-inline: var(--nodealpha-content-gutter);
	width: 100%;
}

.nodealpha-article-header {
	border-bottom: 0;
	padding-bottom: 0.75rem;
}

.nodealpha-article-title {
	font-family: var(--nodealpha-heading-font);
	font-size: clamp(1.35rem, 1.16rem + 0.65vw, 1.75rem);
	font-weight: 600;
	letter-spacing: -0.012em;
	line-height: 1.45;
	text-wrap: balance;
}

.nodealpha-article-meta,
.nodealpha-post-meta {
	color: var(--nodealpha-muted);
	font-size: 0.875rem;
	line-height: 1.7;
}

.nodealpha-article-meta :where(p, .wp-block-post-date, .wp-block-post-author, .wp-block-post-terms),
.nodealpha-post-meta :where(p, .wp-block-post-date, .wp-block-post-author, .wp-block-post-terms) {
	margin: 0;
}

.nodealpha-article-meta :where(a),
.nodealpha-post-meta :where(a) {
	color: inherit;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.18em;
}

.nodealpha-article-meta :where(a:hover),
.nodealpha-post-meta :where(a:hover) {
	color: var(--nodealpha-link-accent);
}

.nodealpha-meta-separator {
	color: color-mix(in srgb, var(--nodealpha-muted) 70%, transparent);
}

.nodealpha-content {
	box-sizing: border-box;
	max-width: calc(var(--nodealpha-reading-measure) + var(--nodealpha-content-gutter) + var(--nodealpha-content-gutter));
	margin-inline: auto;
	padding-inline: var(--nodealpha-content-gutter);
	color: inherit;
	font-family: var(--nodealpha-reading-font);
	font-size: clamp(1rem, 0.98rem + 0.1vw, 1.0625rem);
	letter-spacing: 0.01em;
	line-height: 2;
	overflow-wrap: break-word;
}

.nodealpha-page-content {
	margin-top: var(--wp--preset--spacing--40);
}

.nodealpha-content > * {
	margin-block-start: 0;
	margin-block-end: 0;
}

.nodealpha-content > * + * {
	margin-block-start: 0.75em;
}

.nodealpha-content :where(p) {
	margin-block: 0 0.75em;
}

.nodealpha-content > p {
	text-indent: 2em;
}

.nodealpha-content :where(li p, blockquote p, figcaption, .wp-element-caption, .wp-block-button p) {
	text-indent: 0;
}

.nodealpha-content :where(h1, h2, h3, h4, h5, h6) {
	font-family: var(--nodealpha-heading-font);
	font-weight: 600;
	letter-spacing: -0.01em;
	line-height: 1.55;
	margin-block-start: 1.65em;
	margin-block-end: 0.65em;
	scroll-margin-top: 2rem;
	text-wrap: balance;
}

.nodealpha-content :where(h2) {
	border-bottom: 1px solid var(--nodealpha-border);
	font-size: clamp(1.25rem, 1.12rem + 0.45vw, 1.5rem);
	padding-bottom: 0.35em;
}

.nodealpha-content :where(h3) {
	font-size: clamp(1.12rem, 1.04rem + 0.28vw, 1.28rem);
}

.nodealpha-content :where(h4) {
	font-size: 1.05rem;
}

.nodealpha-content :where(ul, ol) {
	padding-inline-start: 1.45em;
}

.nodealpha-content :where(li + li) {
	margin-top: 0.35em;
}

.nodealpha-content :where(figure, .wp-block-image, .wp-block-gallery, .wp-block-embed) {
	margin-block: 2rem;
}

.nodealpha-content :where(.wp-block-image img, .wp-block-post-featured-image img) {
	display: block;
	margin-inline: auto;
}

.nodealpha-content img {
	border-radius: 8px;
}

.nodealpha-content :where(figcaption, .wp-element-caption) {
	color: var(--nodealpha-muted);
	font-size: 0.9em;
	line-height: 1.6;
	margin-top: 0.75rem;
	text-align: center;
}

.nodealpha-content :where(.alignwide) {
	max-width: min(var(--wp--style--global--wide-size), calc(100vw - var(--nodealpha-content-gutter) - var(--nodealpha-content-gutter)));
}

.nodealpha-content :where(blockquote, .wp-block-quote) {
	background-color: var(--nodealpha-quote-background);
	border-left: 3px solid var(--nodealpha-border);
	color: color-mix(in srgb, currentcolor 82%, var(--nodealpha-muted));
	margin-block: 1.8em;
	padding: 0.65rem 1rem;
}

.nodealpha-content :where(blockquote p, .wp-block-quote p) {
	margin-block: 0.75em;
}

.nodealpha-content :where(.wp-block-pullquote) {
	border-color: var(--nodealpha-border);
	margin-block: 2rem;
	padding-block: 1.5rem;
}

.nodealpha-content :where(pre, .wp-block-code, .wp-block-preformatted) {
	background-color: var(--nodealpha-code-background);
	border: 1px solid var(--nodealpha-border);
	border-radius: 10px;
	color: var(--nodealpha-code-foreground);
	font-size: 0.92em;
	line-height: 1.65;
	margin-block: 1.6em;
	overflow-x: auto;
	padding: 1rem;
	-webkit-overflow-scrolling: touch;
}

.nodealpha-content :where(.enlighter-default) {
	margin-block: 1.6em;
}

.nodealpha-content :where(.wp-block-code code, pre code) {
	background: none;
	border: 0;
	color: inherit;
	display: block;
	overflow-wrap: normal;
	padding: 0;
	white-space: pre;
}

.nodealpha-content :not(pre) > code,
.nodealpha-content :where(kbd, samp) {
	background-color: var(--nodealpha-code-background);
	border: 1px solid var(--nodealpha-border);
	border-radius: 0.25em;
	color: var(--nodealpha-code-foreground);
	font-size: 0.92em;
	padding: 0.08em 0.32em;
}

.nodealpha-content :where(.wp-block-table) {
	margin-block: 2rem;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.nodealpha-content :where(table) {
	border-collapse: collapse;
	font-size: 0.95em;
	line-height: 1.65;
	min-width: 38rem;
	width: 100%;
}

.nodealpha-content :where(th, td) {
	border: 1px solid var(--nodealpha-border);
	padding: 0.65em 0.8em;
	vertical-align: top;
}

.nodealpha-content :where(th) {
	background-color: var(--nodealpha-surface-alt);
	font-weight: 600;
}

.nodealpha-post-meta {
	border-top-color: var(--nodealpha-border) !important;
	font-size: 0.875rem;
}

.nodealpha-post-nav {
	margin-bottom: 0.9rem;
}

.nodealpha-post-nav :where(a) {
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
}

.nodealpha-post-nav :where(a:hover) {
	color: var(--nodealpha-link-accent);
}

.nodealpha-post-meta-row {
	row-gap: 0.35rem;
}

.nodealpha-post-meta-label {
	color: var(--wp--preset--color--contrast);
	font-weight: 600;
	letter-spacing: 0.04em;
}

@media (max-width: 700px) {
	:root {
		--nodealpha-content-gutter: clamp(1rem, 5vw, 1.25rem);
	}

	.nodealpha-single-main {
		margin-top: 1.25rem !important;
	}

	.nodealpha-article-title {
		font-size: clamp(1.3rem, 1.08rem + 1.2vw, 1.6rem);
		letter-spacing: -0.008em;
	}

	.nodealpha-content {
		font-size: 1rem;
		line-height: 1.95;
	}

	.nodealpha-content :where(h1, h2, h3, h4, h5, h6) {
		margin-block-start: 1.5em;
	}

	.nodealpha-content :where(table) {
		min-width: 34rem;
	}
}

@media (prefers-color-scheme: dark) {
	:root {
		color-scheme: dark;

		/* Override WordPress preset variables so existing block classes adapt. */
		--wp--preset--color--base: #111315;
		--wp--preset--color--contrast: #e8e2d2;
		--wp--preset--color--primary: #2f3f22;
		--wp--preset--color--secondary: #b7d58a;
		--wp--preset--color--tertiary: #1b1f23;

		--nodealpha-surface: #171a1f;
		--nodealpha-surface-alt: #1b1f23;
		--nodealpha-article-surface: #191712;
		--nodealpha-muted: #aaa397;
		--nodealpha-border: rgba(255, 255, 255, 0.14);
		--nodealpha-link-accent: #c6df99;
		--nodealpha-code-background: #20242a;
		--nodealpha-code-foreground: #e9e3d7;
		--nodealpha-quote-background: rgba(255, 255, 255, 0.045);
		--nodealpha-shadow-soft: 0 24px 70px rgba(0, 0, 0, 0.28);
	}

	html,
	body,
	.wp-site-blocks {
		background-color: var(--wp--preset--color--base);
		color: var(--wp--preset--color--contrast);
	}

	body {
		text-rendering: optimizeLegibility;
	}

	::selection {
		background-color: rgba(183, 213, 138, 0.32);
		color: var(--wp--preset--color--contrast);
	}

	a,
	.wp-block-post-title a,
	.wp-block-site-title a,
	.wp-block-query-pagination a {
		color: var(--wp--preset--color--contrast);
	}

	.wp-block-post-content a,
	.wp-block-post-excerpt a,
	.wp-block-read-more,
	.wp-block-post-date a,
	.wp-block-post-terms a {
		color: var(--nodealpha-link-accent);
		text-decoration-color: color-mix(in srgb, var(--nodealpha-link-accent) 65%, transparent);
		text-underline-offset: 0.18em;
	}

	a:hover,
	.wp-block-post-content a:hover,
	.wp-block-post-excerpt a:hover,
	.wp-block-read-more:hover,
	.wp-block-post-date a:hover,
	.wp-block-post-terms a:hover {
		color: #d7edac;
		text-decoration-color: currentcolor;
	}

	a:focus-visible,
	.wp-element-button:focus-visible,
	.wp-block-button__link:focus-visible {
		outline: 2px solid var(--nodealpha-link-accent);
		outline-offset: 3px;
	}

	.has-base-background-color {
		background-color: var(--wp--preset--color--base) !important;
	}

	.has-contrast-background-color {
		background-color: var(--wp--preset--color--contrast) !important;
	}

	.has-tertiary-background-color {
		background-color: var(--wp--preset--color--tertiary) !important;
	}

	.has-primary-background-color {
		background-color: var(--wp--preset--color--primary) !important;
	}

	.has-secondary-background-color {
		background-color: var(--wp--preset--color--secondary) !important;
	}

	.has-base-color {
		color: var(--wp--preset--color--base) !important;
	}

	.has-contrast-color {
		color: var(--wp--preset--color--contrast) !important;
	}

	header.wp-block-template-part,
	footer.wp-block-template-part,
	.wp-block-template-part,
	.wp-block-group,
	.wp-block-columns,
	.wp-block-column {
		border-color: var(--nodealpha-border);
	}

	[style*="border-bottom-color:var(--wp--preset--color--contrast)"],
	[style*="border-bottom-color: var(--wp--preset--color--contrast)"] {
		border-bottom-color: var(--nodealpha-border) !important;
	}

	.wp-block-separator,
	hr {
		border-color: var(--nodealpha-border);
		opacity: 1;
	}

	.wp-block-button__link,
	.wp-element-button {
		border: 1px solid var(--nodealpha-border);
	}

	.wp-block-button__link.has-base-background-color:hover,
	.wp-block-button__link.has-base-background-color:focus,
	.wp-element-button.has-base-background-color:hover,
	.wp-element-button.has-base-background-color:focus {
		background-color: var(--wp--preset--color--contrast) !important;
		color: var(--wp--preset--color--base) !important;
	}

	.wp-block-button__link.has-base-background-color:active,
	.wp-element-button.has-base-background-color:active {
		background-color: var(--wp--preset--color--secondary) !important;
		color: var(--wp--preset--color--base) !important;
	}

	/* Legacy fallback for older unsynced single-template markup. */
	.single .wp-block-group[style*="background-color:#f3e6c3"],
	.single .wp-block-group[style*="background-color: #f3e6c3"] {
		background-color: var(--nodealpha-article-surface) !important;
		border: 1px solid var(--nodealpha-border);
		box-shadow: 0 24px 70px rgba(0, 0, 0, 0.28);
	}

	blockquote,
	.wp-block-quote,
	.wp-block-pullquote {
		border-color: var(--nodealpha-border);
		color: var(--nodealpha-muted);
	}

	.wp-block-pullquote {
		background-color: transparent;
	}

	pre,
	.wp-block-code,
	.wp-block-preformatted {
		background-color: var(--nodealpha-code-background);
		border: 1px solid var(--nodealpha-border);
		border-radius: 8px;
		color: var(--nodealpha-code-foreground);
	}

	pre {
		padding: 1rem;
	}

	:not(pre) > code,
	kbd,
	samp {
		background-color: var(--nodealpha-code-background);
		border: 1px solid var(--nodealpha-border);
		border-radius: 0.25em;
		color: var(--nodealpha-code-foreground);
		padding: 0.08em 0.32em;
	}

	table,
	.wp-block-table table,
	.wp-block-table td,
	.wp-block-table th {
		border-color: var(--nodealpha-border);
	}

	.wp-block-table figcaption,
	.wp-block-image figcaption,
	.wp-block-embed figcaption,
	.wp-block-audio figcaption,
	.wp-block-video figcaption,
	.wp-block-post-excerpt__excerpt,
	.wp-block-post-date,
	.wp-block-post-author,
	.wp-block-post-terms,
	.wp-block-query-pagination {
		color: var(--nodealpha-muted);
	}

	input,
	textarea,
	select {
		background-color: var(--nodealpha-surface-alt);
		border: 1px solid var(--nodealpha-border);
		color: var(--wp--preset--color--contrast);
	}

	input::placeholder,
	textarea::placeholder {
		color: color-mix(in srgb, var(--nodealpha-muted) 78%, transparent);
	}

	.wp-block-navigation__responsive-container.is-menu-open {
		background-color: var(--wp--preset--color--base);
		color: var(--wp--preset--color--contrast);
	}

	.wp-block-post-featured-image__overlay.has-contrast-background-color {
		background-color: #000000 !important;
	}

	/* Enlighter is loaded after the theme stylesheet, so use important
	   declarations here to reliably restyle code blocks in dark mode. */
	.enlighter-default,
	.enlighter-t-enlighter,
	.enlighter-t-enlighter .enlighter-code,
	.enlighter-t-enlighter div.enlighter,
	.enlighter-t-enlighter .enlighter-raw {
		background-color: var(--nodealpha-code-background) !important;
		border-color: var(--nodealpha-border) !important;
		color: var(--nodealpha-code-foreground) !important;
	}

	.enlighter-t-enlighter {
		border-radius: 8px;
		box-shadow: none !important;
	}

	.enlighter-t-enlighter div.enlighter > div {
		background-color: transparent !important;
		border-color: rgba(255, 255, 255, 0.06) !important;
		color: var(--nodealpha-code-foreground) !important;
	}

	.enlighter-t-enlighter.enlighter-hover div.enlighter > div:hover,
	.enlighter-t-enlighter.enlighter-hover.enlighter-linenumbers div.enlighter > div:hover {
		background-color: #292f38 !important;
		color: var(--nodealpha-code-foreground) !important;
	}

	.enlighter-t-enlighter.enlighter-linenumbers div.enlighter > div::before {
		background-color: #171b21 !important;
		border-right-color: var(--nodealpha-border) !important;
		color: #87909e !important;
	}

	.enlighter-t-enlighter .enlighter-btn {
		background-color: var(--nodealpha-surface-alt) !important;
		border-color: var(--nodealpha-border) !important;
		color: var(--nodealpha-muted) !important;
	}

	.enlighter-t-enlighter span[class*="enlighter-c"] {
		color: #87909e !important;
	}

	.enlighter-t-enlighter span[class*="enlighter-k"] {
		color: #9fc7ff !important;
	}

	.enlighter-t-enlighter span[class*="enlighter-s"] {
		color: #c8d98d !important;
	}

	.enlighter-t-enlighter span[class*="enlighter-n"],
	.enlighter-t-enlighter span[class*="enlighter-m"] {
		color: #d9b7ff !important;
	}

	.enlighter-t-enlighter span[class*="enlighter-g"],
	.enlighter-t-enlighter span[class*="enlighter-e"] {
		color: #f1c27d !important;
	}
}
