:root {
	--diebspiel-bg: #ffffff;
	--diebspiel-surface: #efefef;
	--diebspiel-text: #252525;
	--diebspiel-muted: #515151;
	--diebspiel-line: #e3e3e3;
	--diebspiel-accent: #3333ff;
	--diebspiel-on-accent: #ffffff;
	--diebspiel-thumb: #777786;
	--diebspiel-thumb-hover: #545464;
	color-scheme: light;
}

:root[data-diebspiel-color="dark"] {
	--diebspiel-bg: #17181e;
	--diebspiel-surface: #24252f;
	--diebspiel-text: #f0f0f5;
	--diebspiel-muted: #b5b6c4;
	--diebspiel-line: #3b3d4b;
	--diebspiel-accent: #b5a8ff;
	--diebspiel-on-accent: #17132d;
	--diebspiel-thumb: #858697;
	--diebspiel-thumb-hover: #b5b6c4;
	color-scheme: dark;
}

@media (prefers-color-scheme: dark) {
	:root:not([data-diebspiel-color]) {
		--diebspiel-bg: #17181e;
		--diebspiel-surface: #24252f;
		--diebspiel-text: #f0f0f5;
		--diebspiel-muted: #b5b6c4;
		--diebspiel-line: #3b3d4b;
		--diebspiel-accent: #b5a8ff;
		--diebspiel-on-accent: #17132d;
		--diebspiel-thumb: #858697;
		--diebspiel-thumb-hover: #b5b6c4;
		color-scheme: dark;
	}
}

html {
	overflow-y: auto;
	scrollbar-gutter: stable;
	scrollbar-color: var(--diebspiel-thumb) var(--diebspiel-surface);
	scrollbar-width: thin;
}

html::-webkit-scrollbar { width: 10px; height: 10px; }
html::-webkit-scrollbar-track { background: var(--diebspiel-surface); }
html::-webkit-scrollbar-thumb { background: var(--diebspiel-thumb); border: 2px solid var(--diebspiel-surface); }
html::-webkit-scrollbar-thumb:hover { background: var(--diebspiel-thumb-hover); }

/* Core's mobile overlay needs JavaScript; expose normal links when initialization is blocked. */
html:not([data-diebspiel-mode]) .wp-site-blocks .wp-block-navigation__responsive-container {
	display: block !important;
	position: static;
}

html:not([data-diebspiel-mode]) .wp-site-blocks :is(
	.wp-block-navigation__responsive-container-open,
	.wp-block-navigation__responsive-container-close,
	.wp-block-navigation-submenu__toggle,
	.wp-block-navigation__submenu-icon
) { display: none !important; }

html:not([data-diebspiel-mode]) .wp-site-blocks .wp-block-navigation__submenu-container {
	position: static !important;
	visibility: visible !important;
	opacity: 1 !important;
	width: auto !important;
	height: auto !important;
	min-width: 0 !important;
	overflow: visible !important;
}

@media (forced-colors: active) {
	html { scrollbar-color: auto; scrollbar-width: auto; }
}