#header #navigation-menu {
    background: var(--darkened-bg);
    border-bottom-color: var(--border-color);
}

#header ul#navigation-menu li a {
    border-right-color: var(--hairline-color);
    color: var(--body-quiet-color);
}

#header ul#navigation-menu li.disabled a,
#header ul#navigation-menu li.disabled a:hover {
    background: none;
    color: var(--body-quiet-color);
    opacity: 0.5;
}

#header ul#navigation-menu li:hover,
#header ul#navigation-menu li.over,
#header ul#navigation-menu li.selected {
    background: var(--body-bg);
}

#header ul#navigation-menu li ul {
    background: var(--body-bg);
}

#header ul#navigation-menu li ul li a {
    border-color: var(--hairline-color);
    color: var(--body-quiet-color);
}

#header ul#navigation-menu li ul li ul {
    border-top-color: var(--hairline-color);
}

#header ul#navigation-menu li:hover > ul li,
#header ul#navigation-menu li.over > ul li,
#header ul#navigation-menu li ul li:hover > ul li,
#header ul#navigation-menu li ul li.over > ul li {
    background: var(--body-bg);
}

#header ul#navigation-menu li ul li:hover,
#header ul#navigation-menu li ul li.over,
#header ul#navigation-menu li ul li ul li:hover,
#header ul#navigation-menu li ul li ul li.over {
    background: var(--selected-bg);
}

#header ul#navigation-menu li a.has-icon:after {
    top: 50%;
    transform: translateY(calc(-50% - 2px));
}

#header ul#navigation-menu li ul li a.has-icon:after {
    transform: translateY(calc(-50% - 1.5px));
}


:root .warning {
    color: var(--error-fg);
}

:root #dashboard-panel h3 a {
    background: none;
    border-color: var(--border-color);
}

:root #dashboard-panel ul li {
    background-color: var(--body-bg);
    border-color: var(--border-color);
}

:root .dashboard-module {
    border-color: var(--border-color);
}

:root .dashboard-placeholder {
    background-color: var(--selected-bg);
    border-color: var(--primary);
}

:root .dashboard-module h2 {
    background: var(--header-bg);
    color: var(--header-link-color);
}

:root .dashboard-module h2 a {
    color: var(--header-link-color);
}

:root .dashboard-module h3 {
    background: var(--darkened-bg);
    color: var(--body-quiet-color);
}

:root .dashboard-module h3 a {
    color: var(--body-quiet-color);
}

:root .dashboard-module-content {
    border-top-color: var(--hairline-color);
}

:root .dashboard-module-content a {
    color: var(--link-fg);
}

:root .dashboard-module ul li {
    background: transparent;
}

:root .dashboard-module ul li.odd {
    background: var(--darkened-bg);
}

:root .dashboard-module ul li.even {
    background: var(--body-bg);
}

:root .dashboard-module ul li:hover {
    background: var(--selected-row);
    color: var(--body-fg);
}

:root .dashboard-module ul.inline li.odd,
:root .dashboard-module ul.inline li.even {
    background: none;
}

:root .group ul {
    background-color: transparent;
    border-color: var(--border-color);
}

:root .group > ul {
    background-color: var(--darkened-bg);
    border-style: solid;
    border-width: 0 0 1px 0;
}

:root .group-accordion .group-accordion-header,
:root .group-accordion .group-accordion-header.ui-state-default {
    background-color: var(--darkened-bg);
    border-bottom-color: var(--border-color);
}


:root .group.ui-widget,
:root .group .ui-widget,
:root .group .ui-widget input,
:root .group .ui-widget select,
:root .group .ui-widget textarea,
:root .group .ui-widget button {
    font-family: var(--font-family-primary);
    font-size: inherit;
}

:root .group .ui-widget-content,
:root .group.ui-widget-content {
    background: var(--body-bg);
    border-color: var(--border-color);
    color: var(--body-fg);
}

:root .group .ui-widget-content a {
    color: var(--link-fg);
}

:root .group .ui-widget-header,
:root .group.ui-widget-header {
    background: var(--darkened-bg);
    border-color: var(--border-color);
    color: var(--body-fg);
}

:root .group .ui-widget-header a {
    color: var(--link-fg);
}

:root .group .ui-state-default,
:root .group .ui-widget-content .ui-state-default,
:root .group .ui-widget-header .ui-state-default {
    background: var(--darkened-bg);
    border-color: var(--border-color);
    color: var(--body-quiet-color);
}

:root .group .ui-state-default a,
:root .group .ui-state-default a:link,
:root .group .ui-state-default a:visited {
    color: var(--body-quiet-color);
}

:root .group .ui-state-hover,
:root .group .ui-state-default:hover,
:root .group .ui-widget-content .ui-state-hover,
:root .group .ui-widget-header .ui-state-hover,
:root .group .ui-state-focus,
:root .group .ui-widget-content .ui-state-focus,
:root .group .ui-widget-header .ui-state-focus {
    background: var(--selected-bg);
    border-color: var(--border-color);
    color: var(--body-fg);
}

:root .group .ui-state-hover a,
:root .group .ui-state-hover a:hover,
:root .group .ui-state-hover a:link,
:root .group .ui-state-hover a:visited {
    color: var(--body-fg);
}

:root .group .ui-state-active,
:root .group .ui-tabs-active,
:root .group .ui-widget-content .ui-state-active,
:root .group .ui-widget-header .ui-state-active {
    background: var(--body-bg);
    border-color: var(--border-color);
    color: var(--body-fg);
}

:root .group .ui-state-active a,
:root .group .ui-state-active a:link,
:root .group .ui-state-active a:visited {
    color: var(--body-fg);
}

:root .group .dashboard-module.ui-tabs-panel {
    background: var(--body-bg);
}

@media (prefers-color-scheme: dark) {
    :root .group .ui-icon {
        filter: invert(1);
    }
}

html[data-theme="light"] .group .ui-icon {
    filter: none;
}

html[data-theme="dark"] .group .ui-icon {
    filter: invert(1);
}


#content {
    padding: 0;
    margin: 15px;
}

#header {
    padding-inline: 0;
}

#header #user-tools {
    padding-inline-end: 1.2em;
}

#bookmark-form {
    clear: both;
}

div.breadcrumbs {
    display: block;
    padding: 10px 15px;
    border: 0;
    background-position: 0 -8px;
}

div.breadcrumbs a {
    display: inline;
}

body div.breadcrumbs {
    border-bottom: 1px solid var(--hairline-color);
}

body #header #branding h1,
body #header #branding #site-name {
    background: var(--thx-branding-logo, none) no-repeat 10px 5px;
    text-indent: var(--thx-branding-indent, 0);
    width: var(--thx-branding-width, auto);
    height: var(--thx-branding-height, auto);
    padding-inline-start: 10px;
}


:root .dashboard-module h2 a.toggle-icon,
:root .dashboard-module h2 a.close-icon {
    filter: invert(1);
}