/* Dark mode for sphinx_rtd_theme. Applies when the system uses a dark appearance. */

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

		--background: #201f1f;
		--background-outer: #181717;
		--surface: #2b2a2a;
		--surface-hover: #363434;
		--border: #3d3b3b;
		--border-strong: #4e4b4b;

		--text: #d4d2d2;
		--text-strong: #efeded;
		--text-muted: #9b9898;

		--link: #5dade2;
		--link-hover: #85c1e9;
		--link-visited: #bb8fce;

		--accent: #1f6a99;
		--accent-border: #1a5a85;

		--code-literal: #f1948a;
		--code-background: #181717;

		--note-background: #1a2833;
		--note-title: #2f6f99;
		--tip-background: #142a26;
		--tip-title: #15836d;
		--warning-background: #2f2414;
		--warning-title: #9a5f24;
		--danger-background: #321c1a;
		--danger-title: #a8463d;
	}

	/* Page and content area */

	body,
	.wy-body-for-nav,
	.wy-nav-content-wrap,
	.wy-nav-content {
		background: var(--background);
		color: var(--text);
	}

	@media screen and (min-width: 1100px) {
		.wy-nav-content-wrap {
			background: var(--background-outer);
		}
	}

	h1, h2, h3, h4, h5, h6, legend {
		color: var(--text-strong);
	}

	/* Scoped to the content area, so the theme keeps its own link colors in the navigation. */
	.rst-content a {
		color: var(--link);
	}

	.rst-content a:visited {
		color: var(--link-visited);
	}

	.rst-content a:hover {
		color: var(--link-hover);
	}

	hr {
		border-top-color: var(--border);
	}

	footer,
	#search-results .context {
		color: var(--text-muted);
	}

	#search-results .search li,
	#search-results .search li:first-child {
		border-color: var(--border);
	}

	.rst-content .highlighted {
		background: #7d6608;
		box-shadow: 0 0 0 2px #7d6608;
		color: #fff;
	}

	/* Navigation */

	.wy-nav-top,
	.wy-side-nav-search,
	.wy-side-nav-search img {
		background-color: var(--accent);
	}

	.wy-side-nav-search input[type=text] {
		background: var(--background);
		border-color: var(--accent-border);
		box-shadow: none;
		color: var(--text-strong);
	}

	.wy-side-nav-search input[type=text]::placeholder {
		color: var(--text-muted);
	}

	.wy-menu-vertical li.current {
		background: #292727;
	}

	.wy-menu-vertical li.current a {
		color: var(--text);
		border-right-color: var(--border);
	}

	.wy-menu-vertical li.toctree-l1.current > a {
		border-color: var(--border);
	}

	.wy-menu-vertical li.current a:hover {
		background: var(--surface-hover);
	}

	.wy-menu-vertical li.current > a,
	.wy-menu-vertical li.on a,
	.wy-menu-vertical li.current > a:hover,
	.wy-menu-vertical li.on a:hover {
		background: var(--background);
		color: var(--text-strong);
	}

	.wy-menu-vertical li.toctree-l2.current > a,
	.wy-menu-vertical li.toctree-l2.current li.toctree-l3 > a {
		background: #2f2d2d;
	}

	.wy-menu-vertical li.toctree-l3.current > a,
	.wy-menu-vertical li.toctree-l3.current li.toctree-l4 > a {
		background: #353232;
	}

	.wy-menu-vertical li.current > a button.toctree-expand,
	.wy-menu-vertical li.on a button.toctree-expand,
	.wy-menu-vertical li.current > a:hover button.toctree-expand,
	.wy-menu-vertical li.on a:hover button.toctree-expand {
		color: var(--text-muted);
	}

	/* Inline code, keys, and code blocks */

	.rst-content code,
	.rst-content tt {
		background: var(--surface);
		border-color: var(--border);
		color: var(--text);
	}

	.rst-content code.literal,
	.rst-content tt.literal {
		color: var(--code-literal);
	}

	.rst-content code.xref,
	.rst-content tt.xref,
	a .rst-content code,
	a .rst-content tt {
		color: var(--text-strong);
	}

	/* Same selector as the theme, which sets the light colors with a high specificity. */
	.rst-content :not(dl.option-list) > :not(dt):not(kbd):not(.kbd) > .kbd,
	.rst-content :not(dl.option-list) > :not(dt):not(kbd):not(.kbd) > kbd {
		background-color: var(--surface);
		border-color: var(--border-strong);
		box-shadow: 0 2px #0d0c0c;
		color: var(--text-strong);
	}

	.rst-content div[class^=highlight],
	.rst-content pre.literal-block {
		border-color: var(--border);
	}

	.highlight {
		background: var(--code-background);
	}

	/* The light Pygments style gives lexer errors a background that the dark style doesn't reset. */
	.highlight .err {
		background-color: transparent;
	}

	/* Tables */

	.rst-content table.docutils,
	.rst-content table.docutils td,
	.rst-content table.docutils th,
	.rst-content table.docutils thead th,
	html.writer-html5 .rst-content table.docutils th {
		border-color: var(--border);
	}

	.rst-content table.docutils thead {
		color: var(--text-strong);
	}

	.rst-content table.docutils:not(.field-list) tr:nth-child(2n-1) td {
		background-color: #262525;
	}

	/* Notices */

	.rst-content .note,
	.rst-content .seealso {
		background: var(--note-background);
	}

	.rst-content .note .admonition-title,
	.rst-content .seealso .admonition-title {
		background: var(--note-title);
	}

	.rst-content .tip,
	.rst-content .hint,
	.rst-content .important {
		background: var(--tip-background);
	}

	.rst-content .tip .admonition-title,
	.rst-content .hint .admonition-title,
	.rst-content .important .admonition-title {
		background: var(--tip-title);
	}

	.rst-content .warning,
	.rst-content .caution,
	.rst-content .attention {
		background: var(--warning-background);
	}

	.rst-content .warning .admonition-title,
	.rst-content .caution .admonition-title,
	.rst-content .attention .admonition-title {
		background: var(--warning-title);
	}

	.rst-content .danger,
	.rst-content .error {
		background: var(--danger-background);
	}

	.rst-content .danger .admonition-title,
	.rst-content .error .admonition-title {
		background: var(--danger-title);
	}

	/* Previous and next buttons. The theme sets these colors with !important. */

	.btn {
		box-shadow: inset 0 -2px 0 0 rgba(0, 0, 0, 0.3);
	}

	.btn-neutral,
	.btn-neutral:visited {
		background-color: var(--surface) !important;
		color: var(--text) !important;
	}

	.btn-neutral:hover {
		background-color: var(--surface-hover) !important;
		color: var(--text-strong) !important;
	}

	/* Images */

	/* Turns the black symbols into the gray of the body text. */
	.rst-content img.symbol {
		filter: invert(0.83);
	}

	/* Like the border of a dark window: a light 1pt rim, which the screenshots leave out, and a dark
	   line outside it. See img.window in clientv2.css. */
	.rst-content img.window {
		filter:
			drop-shadow(1px 0 0 rgb(51, 51, 51)) drop-shadow(-1px 0 0 rgb(51, 51, 51))
			drop-shadow(0 1px 0 rgb(51, 51, 51)) drop-shadow(0 -1px 0 rgb(51, 51, 51))
			drop-shadow(1px 0 0 rgba(0, 0, 0, 0.2)) drop-shadow(-1px 0 0 rgba(0, 0, 0, 0.2))
			drop-shadow(0 1px 0 rgba(0, 0, 0, 0.2)) drop-shadow(0 -1px 0 rgba(0, 0, 0, 0.2))
			drop-shadow(0 3px 8px rgba(0, 0, 0, 0.45));
	}

	/* Quick Actions is a glass panel, whose rim is brighter than a window's. */
	.rst-content img.glass {
		filter:
			drop-shadow(1px 0 0 rgb(87, 87, 99)) drop-shadow(-1px 0 0 rgb(87, 87, 99))
			drop-shadow(0 1px 0 rgb(87, 87, 99)) drop-shadow(0 -1px 0 rgb(87, 87, 99))
			drop-shadow(1px 0 0 rgba(0, 0, 0, 0.2)) drop-shadow(-1px 0 0 rgba(0, 0, 0, 0.2))
			drop-shadow(0 1px 0 rgba(0, 0, 0, 0.2)) drop-shadow(0 -1px 0 rgba(0, 0, 0, 0.2))
			drop-shadow(0 3px 8px rgba(0, 0, 0, 0.45));
	}

	.rst-content img.only-light {
		display: none;
	}
}