/* Copyright 2026 sysmocom - s.f.m.c. GmbH
 * SPDX-License-Identifier: GPL-2.0-or-later */

/* biome-ignore-all lint/style/noDescendingSpecificity: false positives */

/*
 * Colors
 */
:root {
	--dark-top-menu: #26384a;

	--dark-bg: #0f0f0f;
	--dark-bg2: #232427;
	--dark-bg3: #1a1a1a;
	--dark-bg4: #1d2331; /* syntax highlighting: same as pygments lightbulb bg */

	--dark-text: #e9e9e9;
	--dark-link: #22a8f9;

	--dark-gray: #44474c;
	--dark-gray-inverted: #8d8b89;
	--dark-gray2: #a6a6a6;

	--dark-hover: #ff8989;
	--dark-hover2: #283747;
	--dark-hover3: #3e5670;
	--dark-hover4: #385a82;
	--dark-hover4-inverted: #c7a57c;

	--dark-green: #243f24;
	--dark-green2: #0f6c0f;
	--dark-green3: #65b165;

	--dark-blue: #10122d;
	--dark-blue2: #322c79;
	--dark-blue3: #29405b;

	--dark-red: #431717;
	--dark-red2: #792c2c;
}

/*
 * Body
 */
html.dark,
html.dark body,
html.dark #wrapper {
	color: var(--dark-text);
	background: var(--dark-bg);
}

html.dark a,
html.dark a:link,
html.dark a:visited {
	color: var(--dark-link);
}
html.dark a:hover {
	color: var(--dark-hover);
}
html.dark a.icon .icon-svg {
	stroke: var(--dark-link);
}
html.dark a.icon:hover .icon-svg {
	stroke: var(--dark-hover);
}

html.dark h1,
html.dark h2,
html.dark h3,
html.dark h4,
html.dark h5,
html.dark h6,
html.dark .mypage-box {
	color: var(--dark-text);
}

html.dark svg.icon-svg {
	stroke: var(--dark-gray2);
}

html.dark hr {
	background-color: var(--dark-gray);
}

html.dark a.user.user-mention {
	background-color: var(--dark-hover2);
}

/*
 * Body: form elements
 */
html.dark select,
html.dark input:not(.autocomplete),
html.dark textarea,
html.dark #quick-search #q {
	background-color: var(--dark-bg);
	border-color: var(--dark-gray);
	color: var(--dark-text);
}

html.dark label,
html.dark legend {
	color: var(--dark-text);
}

html.dark fieldset {
	border-color: var(--dark-gray);
	background-color: unset;
}

html.dark table {
	border-collapse: collapse;
}

html.dark input[type="submit"]:hover {
	background-color: var(--dark-hover2);
}

html.dark div.box,
html.dark form div.box {
	background-color: var(--dark-bg2);
	border-color: var(--dark-gray);
	color: var(--dark-text);
}

/*
 * Body: form: tag select
 */
/* dropdown */
html.dark .select2-container--default .select2-selection--multiple,
html.dark
	.select2-container--default
	.select2-results__option[aria-selected="true"],
html.dark .select2-dropdown {
	background-color: var(--dark-bg);
	border-color: var(--dark-gray);
}
html.dark
	.select2-container--default
	.select2-results__option--highlighted[aria-selected] {
	background-color: var(--dark-hover2);
}

html.dark
	.select2-container--default
	.select2-selection--multiple
	.select2-selection__choice {
	background-color: var(--dark-gray);
	color: var(--dark-text);
}

html.dark
	.select2-container--default
	.select2-selection--multiple
	.select2-selection__choice__remove {
	color: var(--dark-link);
}

html.dark
	.select2-container--default
	.select2-selection--multiple
	.select2-selection__choice__remove:hover {
	color: var(--dark-hover);
}

/*
 * Body: username/issue autocomplete
 */
html.dark .tribute-container ul {
	background-color: var(--dark-bg);
}

/*
 * Header
 */
html.dark #top-menu {
	background: var(--dark-top-menu);
}

html.dark #header {
	background: linear-gradient(180deg, #405f7b 30%, #132938);
}

html.dark #main-menu a.selected {
	background-color: var(--dark-bg);
	color: var(--dark-text);
}

html.dark #main-menu a:hover,
html.dark #main-menu li a.new-object {
	background: var(--dark-hover3);
}

html.dark #main-menu .menu-children {
	background: var(--dark-gray);
	border-color: var(--dark-gray);
}

html.dark #main-menu .menu-children li a {
	background: var(--dark-bg);
	color: var(--dark-text);
}

html.dark #main-menu .menu-children li a:hover {
	background: var(--dark-gray);
}

/*
 * Header: ? icon menu
 */
html.dark #top-menu .menu-children {
	border: 1px solid var(--dark-gray);
}
html.dark #top-menu .menu-children,
html.dark #top-menu .menu-children a {
	color: var(--dark-text);
	background-color: var(--dark-bg);
}
html.dark #top-menu .menu-children a:hover {
	color: var(--dark-hover);
	background-color: var(--dark-hover2);
}

/*
 * Header: dropdowns
 */
html.dark .drdn-trigger,
html.dark .drdn-content,
html.dark #project-jump .drdn-trigger,
html.dark #project-jump .drdn-content {
	border-color: var(--dark-gray);
	color: var(--dark-text);
}

html.dark .drdn-content,
html.dark #project-jump .drdn-trigger,
html.dark #project-jump .drdn-content {
	background-color: var(--dark-bg);
}

html.dark .drdn-items,
html.dark #project-jump .drdn-items {
	border-color: var(--dark-gray);
}

html.dark .drdn-items a:hover,
html.dark #project-jump .drdn-items a:hover {
	background-color: var(--dark-hover2);
}

html.dark .drdn-items > *,
html.dark #project-jump .drdn-items > *,
html.dark .contextual .drdn-items > a:hover {
	/* biome-ignore lint: redmine's css uses !important too */
	color: var(--dark-text) !important;
	border-color: var(--dark-bg);
}

/*
 * Header: light / dark buttons
 */
.rds-force-light,
.rds-force-dark {
	display: none;
	float: right;
	margin: 0px 8px;
	padding: 0px 2px;
	cursor: pointer;
}

html.dark .rds-force-light,
html.light .rds-force-dark {
	display: block;
}

.rds-force-dark:hover {
	background: var(--dark-top-menu);
}

.rds-force-light:hover {
	background: var(--dark-hover3);
}

/*
 * Sidebar
 */
html.dark #sidebar {
	background: var(--dark-bg3);
	border-color: var(--dark-gray);
}

html.dark #sidebar-switch-button svg {
	stroke: var(--dark-text);
}

html.dark #sidebar-switch-button:hover {
	background-color: var(--dark-hover2);
}

html.dark #sidebar h1,
html.dark #sidebar h2,
html.dark #sidebar h3,
html.dark #sidebar h4,
html.dark #sidebar h5,
html.dark #sidebar h6 {
	color: var(--dark-text);
}

html.dark #sidebar a.selected {
	background-color: var(--dark-gray);
}

html.dark .tag-count {
	background: var(--dark-bg3);
	color: var(--dark-text);
	border-color: var(--dark-gray);
}

html.dark #sidebar .delete svg.icon-svg {
	opacity: 0.7;
}
html.dark #sidebar .delete:hover svg.icon-svg {
	stroke: var(--dark-hover);
	opacity: 1;
}

/*
 * Content: other
 */
html.dark #content {
	background-color: var(--dark-bg);
}
html.dark #content h1,
html.dark #content h2,
html.dark #content h3,
html.dark #content h4,
html.dark #content h5,
html.dark #content h6 {
	color: var(--dark-text);
}

html.dark .badge-status-open {
	color: var(--dark-link);
	border-color: var(--dark-link);
}

html.dark .badge-status-closed {
	color: var(--dark-green3);
	border-color: var(--dark-green3);
}

html.dark blockquote {
	border-color: var(--dark-gray);
}

html.dark .block-receiver {
	border-color: var(--dark-bg);
}

html.dark .mypage-box,
html.dark #projects-index ul.projects li.root,
html.dark #projects-index li.root ul.projects {
	border-color: var(--dark-gray);
}

html.dark .issue-report-graph {
	filter: invert(1);
}

html.dark table.progress {
	border: 1px solid var(--dark-gray);
	border-collapse: unset;
}
html.dark table.progress tbody {
	filter: invert(1);
}

/*
 * Content: dashboard
 */
html.dark .dashboard-block h1 svg,
html.dark .dashboard-block h2 svg,
html.dark .dashboard-block h3 svg,
html.dark .dashboard-block h4 svg,
html.dark .dashboard-block h5 svg,
html.dark .dashboard-block h6 svg {
	stroke: var(--dark-text);
}

/*
 * Content: messages (success, warning, error, nodata)
 */
html.dark #flash_notice {
	background-color: var(--dark-green);
	border-color: var(--dark-green2);
	color: var(--dark-text);
}

html.dark #errorExplanation {
	background-color: var(--dark-red);
	border-color: var(--dark-red2);
	color: var(--dark-text);
}

html.dark .warning,
html.dark .nodata {
	background-color: var(--dark-blue);
	border-color: var(--dark-blue2);
	color: var(--dark-text);
}

html.dark #flash_notice svg.icon-svg,
html.dark #errorExplanation svg.icon-svg {
	stroke: var(--dark-text);
}

/*
 * Content: pagination
 */
html.dark .pagination,
html.dark .other-formats {
	color: var(--dark-text);
}

html.dark .pagination ul.pages li {
	border-color: var(--dark-gray);
}

html.dark .pagination ul.pages li.current {
	background-color: var(--dark-gray);
}

/*
 * Content: login form
 */
html.dark #login-form {
	background-color: var(--dark-bg2);
	border-color: var(--dark-gray);
}

/*
 * Content: wiki
 */
html.dark div.wiki pre {
	background-color: var(--dark-bg4);
	border-color: var(--dark-gray);
}
html.dark div.pre-wrapper a.copy-pre-content-link {
	background-color: var(--dark-bg);
	border-color: var(--dark-gray);
}

html.dark div.wiki-preview {
	color: var(--dark-text);
	background-color: var(--dark-bg);
	border-color: var(--dark-gray);
}

html.dark ul.toc {
	background-color: var(--dark-bg2);
	border-color: var(--dark-gray);
}
html.dark div.wiki ul.toc a,
html.dark div.wiki ul.toc > li:first-child {
	color: var(--dark-gray2);
}

html.dark div.wiki a:target + h1,
html.dark div.wiki a:target + h2,
html.dark div.wiki a:target + h3,
html.dark div.wiki a:target + h4,
html.dark div.wiki a:target + h5,
html.dark div.wiki a:target + h6 {
	background-color: var(--dark-hover2);
}

html.dark pre.text-diff {
	background-color: var(--dark-bg);
	border-color: var(--dark-gray);
	color: var(--dark-gray2);
}
html.dark span.diff_in {
	color: var(--dark-text);
	background-color: var(--dark-green2);
}
html.dark span.diff_out {
	color: var(--dark-text);
	background-color: var(--dark-red2);
}

html.dark div.wiki :not(pre) > code {
	background-color: var(--dark-gray);
}

/*
 * Content: issue
 */
html.dark div.issue {
	background-color: var(--dark-bg2);
	border-color: var(--dark-gray);
}

html.dark .badge-issues-count {
	background-color: var(--dark-gray);
}

html.dark .badge-private {
	background-color: var(--dark-red);
}

html.dark .journal-header {
	background-color: var(--dark-bg2);
}

html.dark div:target .journal-header {
	background-color: var(--dark-hover2);
}

html.dark .journals .journal-meta .journal-link {
	color: var(--dark-gray2);
}

html.dark #content .tabs ul,
html.dark #content .tabs ul li a {
	border-color: var(--dark-gray);
}

html.dark #content .tabs ul li a.selected {
	background-color: var(--dark-bg);
	color: var(--dark-text);
	border-bottom: 1px solid var(--dark-bg);
}

html.dark #content .tabs ul li a:hover {
	background-color: var(--dark-hover3);
	color: var(--dark-text);
}

html.dark #sticky-issue-header {
	background-color: var(--dark-bg);
	border-color: var(--dark-gray);
}

/*
 * Content: issue editor
 */
html.dark .jstElements button {
	filter: invert(1);
	border-color: var(--dark-gray-inverted);
}
html.dark .jstElements button:hover {
	background-color: var(--dark-hover4-inverted);
}
html.dark .table-generator td {
	background-color: var(--dark-bg);
}
html.dark .table-generator td.selected-cell {
	background-color: var(--dark-hover4);
}

/*
 * Content: table
 */
html.dark table {
	border-color: var(--dark-gray);
}

html.dark th,
html.dark tr.total {
	background-color: var(--dark-bg2);
	border-color: var(--dark-gray);
}

html.dark td {
	border-color: var(--dark-gray);
}
html.dark td.enabled {
	background-color: var(--dark-green2);
}

html.dark tr,
html.dark tr.group td,
html.dark table.list:not(.odd-even) tbody tr:nth-child(2n) {
	background-color: var(--dark-bg2);
}

html.dark tr.odd,
html.dark table.list:not(.odd-even) tbody tr:nth-child(2n + 1) {
	background-color: var(--dark-bg3);
}

html.dark tr:hover,
html.dark table.list:not(.odd-even) tbody tr:hover {
	background-color: var(--dark-hover2);
}
html.dark .context-menu-selection {
	/* biome-ignore lint: redmine's css uses !important too */
	background-color: var(--dark-blue3) !important;
}

html.dark .context-menu-selection:hover {
	/* biome-ignore lint: redmine's css uses !important too */
	background-color: var(--dark-hover4) !important;
}

/*
 * Content: gantt
 */
html.dark .gantt_hdr {
	/* some gantt_hdr elements have colors with inline style="", so just
	 * invert it. */
	filter: invert(1);
}

html.dark .gantt-table tbody tr:hover {
	background-color: var(--dark-bg2);
}
html.dark .gantt_subjects div.issue-subject:hover {
	background-color: var(--dark-hover2);
}

/*
 * Content: table context menu
 */
html.dark #context-menu ul {
	background-color: var(--dark-bg);
	border-color: var(--dark-gray);
}

html.dark #context-menu li {
	border-color: var(--dark-bg);
}

html.dark #context-menu li:hover {
	background-color: var(--dark-bg2);
	border-color: var(--dark-gray);
}

html.dark #context-menu svg.icon-svg {
	stroke: var(--dark-link);
}

html.dark #context-menu a:hover {
	color: var(--dark-link);
}

/*
 * Content: generated graphs
 */
html.dark .graphviz-macro-image,
html.dark .mscgen-macro-image {
	filter: invert(1) contrast(88%);
}

/*
 * Content: search
 */
html.dark .highlight {
	background-color: var(--dark-hover2);
	color: var(--dark-text);
}
html.dark #search-results .description {
	color: var(--dark-gray2);
}

/*
 * Content: activity
 */
html.dark #activity h1,
html.dark #activity h2,
html.dark #activity h3,
html.dark #activity h4,
html.dark #activity h5,
html.dark #activity h6 {
	background-color: var(--dark-bg2);
}

html.dark div#activity dt {
	border-color: var(--dark-gray);
}

html.dark div#activity dt .time,
html.dark div#activity dd span.description {
	color: var(--dark-gray2);
}

/*
 * Content: issues/calendar
 */
html.dark ul.cal {
	border-color: var(--dark-gray);
}
html.dark li.calhead,
html.dark li.week-number {
	background-color: var(--dark-bg2);
}
html.dark li.calbody {
	border-color: var(--dark-bg2);
}
html.dark li.calbody.this-month {
	background-color: var(--dark-bg3);
}
html.dark li.calbody.nwday:not(.odd),
html.dark li.calbody.other-month {
	background-color: var(--dark-bg);
}
html.dark li.calbody.other-month p.day-num {
	color: var(--dark-gray);
}
html.dark li.calbody.today {
	background-color: var(--dark-hover2);
}

/*
 * Content: issues/calendar, tooltip
 */
html.dark div.tooltip:hover span.tip {
	border-color: var(--dark-gray2);
	background-color: var(--dark-bg);
	color: var(--dark-text);
}
html.dark .tooltip span.tip a {
	/* biome-ignore lint: redmine's css uses !important too */
	color: var(--dark-link) !important;
}

/*
 * Modal (e.g. for adding watchers to a wiki page / issue)
 */
html.dark div.modal {
	background-color: var(--dark-bg2);
	border-color: var(--dark-bg);
}
html.dark div.ui-dialog-titlebar {
	color: var(--dark-text);
	background-color: var(--dark-bg);
	border-color: var(--dark-bg);
}
html.dark div.modal .ui-button {
	filter: invert(1);
}

html.dark input.autocomplete {
	/* This element has icons that look bad if changing the bg color, so
	 * just invert it. Input rules from above have :not(.autocomplete). */
	filter: invert(1);
}

html.dark div.modal input[type="submit"] {
	border-color: var(--dark-gray);
	background-color: var(--dark-gray);
	color: var(--dark-text);
}
html.dark div.modal input[type="submit"]:hover {
	background-color: var(--dark-hover3);
}

/*
 * Content: help/macros
 */
html.dark div.macro-desc {
	border-color: var(--dark-gray);
}

/*
 * Syntax highlighting
 */

/* Generated with: "pygmentize -f html -a .syntaxhl -S lightbulb"
 * biome-ignore format: generated code */
html.dark {
	td.linenos .normal { color: #3c4354; background-color: transparent; padding-left: 5px; padding-right: 5px; }
	span.linenos { color: #3c4354; background-color: transparent; padding-left: 5px; padding-right: 5px; }
	td.linenos .special { color: #3c4354; background-color: #ffffc0; padding-left: 5px; padding-right: 5px; }
	span.linenos.special { color: #3c4354; background-color: #ffffc0; padding-left: 5px; padding-right: 5px; }
	.syntaxhl .hll { background-color: #6e7681 }
	.syntaxhl { background: #1d2331; color: #D4D2C8 }
	.syntaxhl .c { color: #7E8AA1 } /* Comment */
	.syntaxhl .err { color: #F88F7F } /* Error */
	.syntaxhl .esc { color: #D4D2C8 } /* Escape */
	.syntaxhl .g { color: #D4D2C8 } /* Generic */
	.syntaxhl .k { color: #FFAD66 } /* Keyword */
	.syntaxhl .l { color: #D5FF80 } /* Literal */
	.syntaxhl .n { color: #D4D2C8 } /* Name */
	.syntaxhl .o { color: #FFAD66 } /* Operator */
	.syntaxhl .x { color: #D4D2C8 } /* Other */
	.syntaxhl .p { color: #D4D2C8 } /* Punctuation */
	.syntaxhl .ch { color: #F88F7F; font-style: italic } /* Comment.Hashbang */
	.syntaxhl .cm { color: #7E8AA1 } /* Comment.Multiline */
	.syntaxhl .cp { color: #FFAD66; font-weight: bold } /* Comment.Preproc */
	.syntaxhl .cpf { color: #7E8AA1 } /* Comment.PreprocFile */
	.syntaxhl .c1 { color: #7E8AA1 } /* Comment.Single */
	.syntaxhl .cs { color: #7E8AA1; font-style: italic } /* Comment.Special */
	.syntaxhl .gd { color: #F88F7F; background-color: #3D1E20 } /* Generic.Deleted */
	.syntaxhl .ge { color: #D4D2C8; font-style: italic } /* Generic.Emph */
	.syntaxhl .ges { color: #D4D2C8 } /* Generic.EmphStrong */
	.syntaxhl .gr { color: #F88F7F } /* Generic.Error */
	.syntaxhl .gh { color: #D4D2C8 } /* Generic.Heading */
	.syntaxhl .gi { color: #6AD4AF; background-color: #19362C } /* Generic.Inserted */
	.syntaxhl .go { color: #7E8AA1 } /* Generic.Output */
	.syntaxhl .gp { color: #D4D2C8 } /* Generic.Prompt */
	.syntaxhl .gs { color: #D4D2C8; font-weight: bold } /* Generic.Strong */
	.syntaxhl .gu { color: #D4D2C8 } /* Generic.Subheading */
	.syntaxhl .gt { color: #F88F7F } /* Generic.Traceback */
	.syntaxhl .kc { color: #FFAD66 } /* Keyword.Constant */
	.syntaxhl .kd { color: #FFAD66 } /* Keyword.Declaration */
	.syntaxhl .kn { color: #FFAD66 } /* Keyword.Namespace */
	.syntaxhl .kp { color: #FFAD66 } /* Keyword.Pseudo */
	.syntaxhl .kr { color: #FFAD66 } /* Keyword.Reserved */
	.syntaxhl .kt { color: #73D0FF } /* Keyword.Type */
	.syntaxhl .ld { color: #D5FF80 } /* Literal.Date */
	.syntaxhl .m { color: #DFBFFF } /* Literal.Number */
	.syntaxhl .s { color: #D5FF80 } /* Literal.String */
	.syntaxhl .na { color: #FFD173 } /* Name.Attribute */
	.syntaxhl .nb { color: #FFD173 } /* Name.Builtin */
	.syntaxhl .nc { color: #73D0FF } /* Name.Class */
	.syntaxhl .no { color: #FFD173 } /* Name.Constant */
	.syntaxhl .nd { color: #7E8AA1; font-weight: bold; font-style: italic } /* Name.Decorator */
	.syntaxhl .ni { color: #95E6CB } /* Name.Entity */
	.syntaxhl .ne { color: #73D0FF } /* Name.Exception */
	.syntaxhl .nf { color: #FFD173 } /* Name.Function */
	.syntaxhl .nl { color: #D4D2C8 } /* Name.Label */
	.syntaxhl .nn { color: #D4D2C8 } /* Name.Namespace */
	.syntaxhl .nx { color: #D4D2C8 } /* Name.Other */
	.syntaxhl .py { color: #FFD173 } /* Name.Property */
	.syntaxhl .nt { color: #5CCFE6 } /* Name.Tag */
	.syntaxhl .nv { color: #D4D2C8 } /* Name.Variable */
	.syntaxhl .ow { color: #FFAD66 } /* Operator.Word */
	.syntaxhl .pm { color: #D4D2C8 } /* Punctuation.Marker */
	.syntaxhl .w { color: #D4D2C8 } /* Text.Whitespace */
	.syntaxhl .mb { color: #DFBFFF } /* Literal.Number.Bin */
	.syntaxhl .mf { color: #DFBFFF } /* Literal.Number.Float */
	.syntaxhl .mh { color: #DFBFFF } /* Literal.Number.Hex */
	.syntaxhl .mi { color: #DFBFFF } /* Literal.Number.Integer */
	.syntaxhl .mo { color: #DFBFFF } /* Literal.Number.Oct */
	.syntaxhl .sa { color: #F29E74 } /* Literal.String.Affix */
	.syntaxhl .sb { color: #D5FF80 } /* Literal.String.Backtick */
	.syntaxhl .sc { color: #D5FF80 } /* Literal.String.Char */
	.syntaxhl .dl { color: #D5FF80 } /* Literal.String.Delimiter */
	.syntaxhl .sd { color: #7E8AA1 } /* Literal.String.Doc */
	.syntaxhl .s2 { color: #D5FF80 } /* Literal.String.Double */
	.syntaxhl .se { color: #95E6CB } /* Literal.String.Escape */
	.syntaxhl .sh { color: #D5FF80 } /* Literal.String.Heredoc */
	.syntaxhl .si { color: #95E6CB } /* Literal.String.Interpol */
	.syntaxhl .sx { color: #95E6CB } /* Literal.String.Other */
	.syntaxhl .sr { color: #95E6CB } /* Literal.String.Regex */
	.syntaxhl .s1 { color: #D5FF80 } /* Literal.String.Single */
	.syntaxhl .ss { color: #DFBFFF } /* Literal.String.Symbol */
	.syntaxhl .bp { color: #5CCFE6 } /* Name.Builtin.Pseudo */
	.syntaxhl .fm { color: #FFD173 } /* Name.Function.Magic */
	.syntaxhl .vc { color: #D4D2C8 } /* Name.Variable.Class */
	.syntaxhl .vg { color: #D4D2C8 } /* Name.Variable.Global */
	.syntaxhl .vi { color: #D4D2C8 } /* Name.Variable.Instance */
	.syntaxhl .vm { color: #D4D2C8 } /* Name.Variable.Magic */
	.syntaxhl .il { color: #DFBFFF } /* Literal.Number.Integer.Long */
}

/* Undo light background colors for strings set by the light theme */
html.dark {
	.syntaxhl .dl,
	.syntaxhl .s,
	.syntaxhl .s1,
	.syntaxhl .s2,
	.syntaxhl .sa,
	.syntaxhl .sb,
	.syntaxhl .sc,
	.syntaxhl .sd,
	.syntaxhl .se,
	.syntaxhl .sh,
	.syntaxhl .si,
	.syntaxhl .sr,
	.syntaxhl .ss,
	.syntaxhl .sx {
		background-color: var(--dark-bg4);
	}
}

/*
 * Footer
 */
html.dark #footer {
	background: var(--dark-bg);
	border-top-color: var(--dark-gray);
}

/*
 * Plugin: banner
 */
html.dark div.banner_alert {
	background-color: var(--dark-red);
	border-color: var(--dark-red2);
	color: var(--dark-text);
}

html.dark div.banner_normal,
html.dark div.banner_warn,
html.dark div.banner_info {
	background-color: var(--dark-blue);
	border-color: var(--dark-blue2);
	color: var(--dark-text);
}

/*
 * Mobile layout
 */

.rds-force-light-mobile,
.rds-force-dark-mobile {
	display: none;
	cursor: pointer;
	line-height: 39px;
}

html.dark .rds-force-light-mobile,
html.light .rds-force-dark-mobile {
	display: block;
}

html.dark .flyout-menu {
	background-color: var(--dark-bg2);
}
html.dark .flyout-menu h3 {
	background-color: var(--dark-bg);
	border-color: var(--dark-gray);
}

@media screen and (max-width: 899px) {
	.flyout-menu__search {
		/* Make space for the light/dark buttons */
		height: 100px;
	}

	html.dark #content > .contextual > a,
	html.dark #content > .contextual > .drdn,
	html.dark p.buttons a {
		border-color: var(--dark-gray);
	}

	html.dark #project-jump .drdn-trigger {
		background-color: unset;
	}

	html.dark #header a.mobile-toggle-button {
		border-color: var(--dark-bg);
	}

	html.dark #project-jump div.drdn-content {
		background-color: var(--dark-top-menu);
	}
	html.dark .drdn-items > *,
	html.dark #project-jump .drdn-items > * {
		border-color: var(--dark-top-menu);
	}
	html.dark #project-jump .drdn-items {
		border-color: var(--dark-top-menu);
	}
	html.dark #project-jump .drdn-content .autocomplete {
		border-color: var(--dark-gray);
	}
}