/* Reskins TypeDoc's default theme to match the rest of the mwg site. Loaded after
   TypeDoc's own stylesheet, so plain selectors here win on source order. The site has one
   deliberate dark theme (see assets/site.css), so both the light and dark variable sets are
   pointed at it rather than following the OS preference. */

:root {
	--light-color-background: #0b0e14;
	--light-color-background-secondary: #141a24;
	--light-color-background-active: #1a2130;
	--light-color-accent: #2a3142;
	--light-color-active-menu-item: #1a2130;
	--light-color-text: #eef1f6;
	--light-color-contrast-text: #ffffff;
	--light-color-text-aside: #8b96a8;
	--light-color-icon-background: #141a24;
	--light-color-icon-text: #eef1f6;
	--light-color-link: #ffb347;
	--light-color-focus-outline: #ffb347;
	--light-color-ts-keyword: #5b6ee1;
	--light-color-ts-project: #ffb347;
	--light-color-ts-class: #7c8ff0;
	--light-color-ts-interface: #8fae64;
	--light-color-ts-function: #ffb347;
	--light-color-ts-variable: #7c8ff0;
	--light-color-ts-property: #ffb347;
	--light-color-document: #eef1f6;
	--light-color-scheme: dark;

	--dark-color-background: #0b0e14;
	--dark-color-background-secondary: #141a24;
	--dark-color-background-active: #1a2130;
	--dark-color-accent: #2a3142;
	--dark-color-active-menu-item: #1a2130;
	--dark-color-text: #eef1f6;
	--dark-color-contrast-text: #ffffff;
	--dark-color-text-aside: #8b96a8;
	--dark-color-icon-background: #141a24;
	--dark-color-icon-text: #eef1f6;
	--dark-color-link: #ffb347;
	--dark-color-focus-outline: #ffb347;
	--dark-color-ts-keyword: #5b6ee1;
	--dark-color-ts-project: #ffb347;
	--dark-color-ts-class: #7c8ff0;
	--dark-color-ts-interface: #8fae64;
	--dark-color-ts-function: #ffb347;
	--dark-color-ts-variable: #7c8ff0;
	--dark-color-ts-property: #ffb347;
	--dark-color-document: #eef1f6;
	--dark-color-scheme: dark;
}

body {
	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
	background-image: linear-gradient(rgba(238, 241, 246, 0.09) 1px, transparent 1px),
		linear-gradient(90deg, rgba(238, 241, 246, 0.09) 1px, transparent 1px);
	background-size: 32px 32px;
}

.title,
h1,
h2,
h3,
h4,
.tsd-page-title h1 {
	font-family: 'JetBrains Mono', 'Cascadia Code', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

.tsd-page-toolbar {
	background: rgba(11, 14, 20, 0.86);
	backdrop-filter: blur(6px);
	border-bottom: 1px solid var(--color-accent);
}

#tsd-toolbar-links a {
	font-family: 'JetBrains Mono', 'Cascadia Code', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 0.82rem;
}

#tsd-toolbar-links a:hover {
	color: var(--color-link);
}

.tsd-navigation.settings,
.tsd-navigation a,
.tsd-page-navigation {
	font-family: 'JetBrains Mono', 'Cascadia Code', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 0.85rem;
}

/* TypeDoc's base stylesheet hardcodes inline code to a plain white background rather
   than a theme variable, so it stays white-on-near-white against our dark theme unless
   overridden directly here. */
code {
	background: var(--light-color-background-active);
	color: var(--light-color-text);
	border-radius: 2px;
}

pre code {
	background: none;
}

code,
pre {
	font-family: 'JetBrains Mono', 'Cascadia Code', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

/* The one native form control TypeDoc's own stylesheet never themes: left as a plain
   browser <select>, it renders with the OS's own dark-mode chrome (a rounded grey pill,
   system font, default caret) rather than the site's flat, sharp-bordered, monospace
   controls - the one spot in the Settings panel that still reads as unstyled default UI. */
#tsd-theme {
	appearance: none;
	font-family: 'JetBrains Mono', 'Cascadia Code', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 0.85rem;
	color: var(--color-text);
	background-color: var(--color-background);
	border: 1px solid var(--color-accent);
	border-radius: 2px;
	padding: 0.3rem 1.6rem 0.3rem 0.5rem;
	background-image: linear-gradient(45deg, transparent 50%, var(--color-text) 50%),
		linear-gradient(135deg, var(--color-text) 50%, transparent 50%);
	background-position: calc(100% - 1rem) 55%, calc(100% - 0.6rem) 55%;
	background-size: 0.4rem 0.4rem, 0.4rem 0.4rem;
	background-repeat: no-repeat;
}

#tsd-theme:hover,
#tsd-theme:focus {
	border-color: var(--color-link);
}
