body.theme-dark {
    background-color: #000000;
    color: #ffffff;
    scrollbar-color: #74797d #202326;
}

.theme-dark #header,
.theme-dark #top-menu .row,
.theme-dark #footer {
    background-color: #000;
}

.theme-dark #header {
    border-bottom-color: #0f1e2f;
}

body.theme-dark::-webkit-scrollbar,
.theme-dark ::-webkit-scrollbar {
    background: #202326;
}

body.theme-dark::-webkit-scrollbar-thumb,
.theme-dark ::-webkit-scrollbar-thumb {
    background: #74797d;
}

body.theme-dark::-webkit-scrollbar-corner,
.theme-dark ::-webkit-scrollbar-corner {
    background: #202326;
}

.theme-dark #top-brand-container {
    background-color: #000;
}

.theme-dark .header-help img {
    filter: invert(1);
}

.theme-dark #left-sidebar,
.theme-dark #top-menu .row,
.theme-dark #all-zones.visible {
    background-color: #222324;
}

@media only screen and (max-width: 767px) {
    .theme-dark #all-zones #top-menu {
        border-top: 1px solid #3d3e40;
    }
}

.theme-dark #left-sidebar {
    border-right: 1px solid #3d3e40;
}

.theme-dark #all-zones.visible {
    box-shadow: 0px 0px 20px 10px #0000003b;
}

.theme-dark .mobile-controls-toggle {
    background-color: #222324;
    border-color: #3d3e40;
    color: #b9bec3;
}

.theme-dark .left-panel-power-button {
    background-color: #3a3d40;
    border: 1px solid #45484b;
    box-shadow: inset 0 1px 0 #ffffff0f;
    color: #ffffff;
}

.theme-dark .left-panel-power-button:hover,
.theme-dark .left-panel-power-button:focus {
    background-color: #424548;
    color: #ffffff;
}

.theme-dark .left-panel-power-button:active {
    background-color: #333638;
}

.theme-dark .left-panel-power-on:before {
    background-color: #ffffff;
}

.theme-dark .left-panel-power-off:before {
    border: 2px solid #ffffff;
}

.theme-dark #left-sidebar .left-panel-mode .btn-group {
    background-color: #343638;
    box-shadow: inset 0 1px 0 #ffffff0f;
}

.theme-dark #left-sidebar .left-panel-mode .gbl-hvac-btn {
    background-color: #343638;
    border-left: 1px solid #45484b;
    color: #ffffff;
}

.theme-dark #left-sidebar .left-panel-mode .gbl-hvac-btn:first-child {
    border-left: 0;
}

.theme-dark #left-sidebar .left-panel-mode .gbl-hvac-btn:hover,
.theme-dark #left-sidebar .left-panel-mode .gbl-hvac-btn:focus {
    background-color: #3d4042;
    color: #ffffff;
}

.theme-dark #left-sidebar .left-panel-mode .gbl-hvac-btn.active,
.theme-dark #left-sidebar .left-panel-mode #btn-nav-heat.active {
    background-color: #3a3d40 !important;
    color: #ffffff;
}

.theme-dark #left-sidebar .left-panel-mode .gbl-hvac-auto.active {
    background-color: #2f6841 !important;
}

.theme-dark #left-sidebar .left-panel-mode #btn-nav-cool.active {
    background-color: #0e6da7 !important;
    color: #ffffff;
}

.theme-dark #left-sidebar .left-panel-mode #btn-nav-heat.active {
    background-color: #704044 !important;
}

.theme-dark #left-sidebar .left-panel-mode .gbl-hvac-vent.active {
    background-color: #654978 !important;
}

.theme-dark .left-panel-status {
    background-color: #222324;
    border-color: #393b3d;
    color: #ffffff;
}

.theme-dark .left-panel-status:hover,
.theme-dark .left-panel-status:focus {
    background-color: #2d3033;
    border-color: #50555a;
}

.theme-dark .left-panel-status-arrow {
    filter: brightness(0) saturate(100%) invert(82%) sepia(7%) saturate(180%) hue-rotate(169deg) brightness(91%) contrast(89%);
}

.theme-dark .quick-set-title {
    color: #b9bec3;
}

.theme-dark .quick-set-icon img {
    filter: none;
}

.theme-dark .quick-set-button {
    background-color: #3a3d40;
    box-shadow: inset 0 1px 0 #ffffff0f;
    color: #ffffff;
}

.theme-dark .quick-set-button:hover,
.theme-dark .quick-set-button:focus {
    background-color: #424548;
    color: #ffffff;
}

.theme-dark .quick-set-button:active {
    background-color: #333638;
}

.theme-dark .menu-nav {
    background-color: #202326;
    border: 1px solid #121416;
    box-shadow: inset 0 1px 0 #ffffff14, 0 2px 6px #00000066;
}

.theme-dark .menu-nav-item {
    color: #79a5ca;
}

.theme-dark .menu-nav-icon img {
    filter: invert(63%) sepia(16%) saturate(906%) hue-rotate(165deg) brightness(94%) contrast(86%);
}

/* Normalize the black schedule SVG before applying the navigation colors. */
.theme-dark .menu-nav-icon img[src$="ico-schedules.svg"] {
    filter: brightness(0) saturate(100%) invert(63%) sepia(16%) saturate(906%) hue-rotate(165deg) brightness(94%) contrast(86%);
}

.theme-dark .menu-nav-indicator {
    background-color: #3a3d40;
    box-shadow: inset 0 1px 0 #ffffff1f, 0 1px 2px #00000040;
}

.theme-dark .menu-nav-input:checked + .menu-nav-item {
    color: #ffffff;
}

.theme-dark .menu-nav-input:checked + .menu-nav-item .menu-nav-icon img {
    filter: none;
}

.theme-dark .menu-nav-input:checked + .menu-nav-item .menu-nav-icon img[src$="ico-schedules.svg"] {
    filter: brightness(0) invert(1);
}

.theme-dark .zone-detail-back-button img {
    filter: invert(1);
}

.theme-dark .rangeslider {
    background-color: #8d8d8d;
}

.theme-dark .zone-range-step {
    background-color: #3a3d40;
    box-shadow: inset 0 1px 0 #ffffff14, 0 1px 3px #00000066;
    border: none;
}

.theme-dark .zone-range-step:hover,
.theme-dark .zone-range-step:focus {
    background-color: #424548;
}

.theme-dark .zone-range-step:active {
    background-color: #333638;
}

.theme-dark .zone-range-step img {
    filter: invert(1);
}

.theme-dark .zone-detail-action-row .btn {
    background: #3a3d40;
    border: 1px solid #45484b;
    box-shadow: inset 0 1px 0 #ffffff0f;
    color: #ffffff;
}

.theme-dark .zone-detail-action-row .btn:hover,
.theme-dark .zone-detail-action-row .btn:focus {
    background: #424548;
    color: #ffffff;
}

.theme-dark .menu-nav-mobile {
    color: #ffffff;
}

.theme-dark .menu-nav-mobile-button,
.theme-dark .menu-nav-mobile-list {
    border: 1px solid #121416;
    box-shadow: inset 0 1px 0 #ffffff14, 0 2px 6px #00000066;
}

.theme-dark .menu-nav-mobile-button {
    background-color: #3a3d40;
}

.theme-dark .menu-nav-mobile-list {
    background-color: #202326;
}

.theme-dark .menu-nav-mobile-icon img {
    filter: none;
}

.theme-dark .menu-nav-mobile-option-icon img {
    filter: invert(63%) sepia(16%) saturate(906%) hue-rotate(165deg) brightness(94%) contrast(86%);
}

.theme-dark .menu-nav-mobile-option-icon img[src$="ico-schedules.svg"] {
    filter: brightness(0) saturate(100%) invert(63%) sepia(16%) saturate(906%) hue-rotate(165deg) brightness(94%) contrast(86%);
}

.theme-dark .menu-nav-mobile-option.active .menu-nav-mobile-option-icon img {
    filter: none;
}

.theme-dark .menu-nav-mobile-icon img[src$="ico-schedules.svg"],
.theme-dark .menu-nav-mobile-option.active .menu-nav-mobile-option-icon img[src$="ico-schedules.svg"] {
    filter: brightness(0) invert(1);
}

.theme-dark .menu-nav-mobile-button {
    color: #ffffff;
}

.theme-dark .menu-nav-mobile-option {
    color: #79a5ca;
}

.theme-dark .menu-nav-mobile-option:hover,
.theme-dark .menu-nav-mobile-option.active {
    background-color: #3a3d40;
    color: #ffffff;
}

.theme-dark #main-row {
    border-top: 1px solid #3d3e40;
}

.theme-dark #zone-list {
    background-color: #222324;
    box-shadow: none;
}

.theme-dark #zone-list .zone-item,
.theme-dark #zone-list .summary-row {
    background-color: #222324;
    border-color: #3d3e40;
    color: #ffffff;
}

.theme-dark #zone-list .zone-item:hover,
.theme-dark #zone-list .zone-selected .zone-item {
    background-color: #2c2d2f;
}

.theme-dark #zone-list .zone-name,
.theme-dark #zone-list .summary-title,
.theme-dark #zone-list .summary-count {
    color: #ffffff;
}

.theme-dark #zone-list .zone-temp {
    background-color: #060606;
    color: #ffffff;
}

.theme-dark .btn-toggle,
.theme-dark .btn-toggle.btn-secondary {
    background: #888989;
    color: #2f373c;
}

.theme-dark .btn-toggle.active,
.theme-dark .btn-toggle.btn-secondary.active {
    background-color: #ffffff;
}

.theme-dark .btn-toggle:before,
.theme-dark .btn-toggle:after,
.theme-dark .btn-toggle.btn-sm:before,
.theme-dark .btn-toggle.btn-sm:after,
.theme-dark .btn-toggle.btn-sm.btn-sm:before,
.theme-dark .btn-toggle.btn-sm.btn-sm:after,
.theme-dark .btn-toggle.btn-secondary:before,
.theme-dark .btn-toggle.btn-secondary:after {
    color: #2f373c;
}

.theme-dark .btn-toggle > .handle {
    background: #2f3f4a;
}

.theme-dark .card,
.theme-dark .row-zone-name,
.theme-dark .row-zone-stats,
.theme-dark .row-zone-data {
    background-color: #222324;
    color: #ffffff;
}

.theme-dark .card,
.theme-dark .row-zone-name,
.theme-dark .row-zone-stats,
.theme-dark .row-zone-data,
.theme-dark .row-schedule,
.theme-dark .table td,
.theme-dark .table th {
    border-color: #3d3e40;
}

.theme-dark .form-control {
    background-color: #202326;
    border-color: #45484b;
    color: #ffffff;
}

.theme-dark .btn-group .btn,
.theme-dark .schedule-time-button {
    background-color: #202326;
    border-color: #45484b;
    color: #ffffff;
}

.theme-dark .btn-group label:hover {
    background: #2b2e31;
}

.theme-dark .btn-group .active,
.theme-dark .schedule-time-button.active {
    background-color: #3a3d40;
    box-shadow: inset 2px 2px 5px #00000066;
    color: #ffffff;
}

.theme-dark .modal-content,
.theme-dark #settings .systems-list,
.theme-dark #other-systems .systems-list,
.theme-dark .summary-bg,
.theme-dark .diagnostics-details,
.theme-dark .table-diagnostics,
.theme-dark .table-min-max,
.theme-dark .card-schedule,
.theme-dark .split-details {
    background-color: #222324;
    color: #ffffff;
}

.theme-dark #gbl-tset-slider-amount,
.theme-dark #gbl-runtimer-slider-amount,
.theme-dark #gbl-cbandset-slider-amount,
.theme-dark #gbl-hbandset-slider-amount,
.theme-dark #label-unit-setpoint {
    background: #000;
    color: #fff;
}

.theme-dark #tech-info-modal .modal-dialog,
.theme-dark #tech-info-modal .modal-dialog .table tbody,
.theme-dark #tech-info-modal .modal-dialog .table td,
.theme-dark #tech-info-modal .modal-dialog .close {
    color: #ffffff;
}

.theme-dark .schedule-card .card-schedule {
    background-color: transparent;
    border: 0;
    box-shadow: none;
}

.theme-dark #settings .systems-list,
.theme-dark #other-systems .systems-list,
.theme-dark .summary-bg,
.theme-dark .diagnostics-details,
.theme-dark .table-diagnostics,
.theme-dark .table-min-max,
.theme-dark .card-schedule,
.theme-dark .split-details,
.theme-dark .row-schedule-select select,
.theme-dark .chk-dow {
    box-sizing: border-box;
}

.theme-dark #settings .systems-list,
.theme-dark #other-systems .systems-list,
.theme-dark .summary-bg,
.theme-dark .diagnostics-details,
.theme-dark .table-diagnostics,
.theme-dark .table-min-max,
.theme-dark .card-schedule,
.theme-dark .split-details {
    border: 1px solid #3d3e40;
    box-shadow: inset 0 1px 0 #ffffff0f, 0 2px 6px #00000066;
}

.theme-dark .summary-bg {
    border-radius: 5px;
}

.theme-dark .summary-row,
.theme-dark .acsystem {
    background-color: #222324;
    border-bottom-color: #3d3e40;
    color: #ffffff;
}

.theme-dark .summary-row:hover,
.theme-dark .acsystem:hover,
.theme-dark .acsystem.active {
    background-color: #2c2d2f;
}

.theme-dark .acsystem a,
.theme-dark .summary-row,
.theme-dark .summary-title,
.theme-dark .summary-count {
    color: #ffffff;
}

.theme-dark .table-min-max thead tr {
    background-color: #3a3d40;
    color: #ffffff;
}

.theme-dark .table-min-max th,
.theme-dark .table-min-max td,
.theme-dark .table-diagnostics tr td {
    border-color: #3d3e40;
    color: #ffffff;
}

.theme-dark .table-min-max tbody tr:nth-child(even) {
    background-color: #202326;
}

.theme-dark .table-diagnostics tr td span,
.theme-dark #diagnostics-airflow p,
.theme-dark .diagnostics-arrow-left span,
.theme-dark .diagnostics-arrow-right span {
    color: #ffffff;
}

.theme-dark .table-diagnostics tr td span {
    background-color: #060606;
    border: 1px solid #3d3e40;
}

.theme-dark .row-schedule-select select {
    background-color: #202326;
    border: 1px solid #45484b;
    color: #ffffff;
}

.theme-dark .row-schedule-select select:focus {
    border-color: #79a5ca;
    outline: 1px solid #79a5ca;
}

.theme-dark .chk-dow {
    background-color: #202326;
    border-color: #45484b;
    color: #79a5ca;
}

.theme-dark .chk-dow-on {
    background-color: #3a3d40;
    border-color: #79a5ca;
    box-shadow: inset 2px 2px 5px #00000066;
    color: #ffffff;
}

/* Draw the omitted interior left border without changing the button width. */
.theme-dark .chk-dow-on:not(:first-child) {
    box-shadow: inset 1px 0 0 #79a5ca, inset 2px 2px 5px #00000066;
}

.theme-dark .zone-big-number {
    color: #ffffff;
}

.theme-dark .zwave-value {
    color: #b9bec3;
}

.theme-dark #zone-details .zone-view {
    background-color: transparent;
    color: #ffffff;
}

.theme-dark #zone-details .row-zone-name,
.theme-dark #zone-schedules .row-zone-name {
    background-color: transparent;
    border-color: transparent;
    box-shadow: none;
}

.theme-dark .header-help:hover,
.theme-dark .header-help:focus {
    background-color: #2e3338;
    outline-color: #79a5ca;
}

.theme-dark .cc-help-popover {
    background-color: #222324;
    border-color: #4b5055;
    box-shadow: 0 4px 18px #00000080;
    color: #ffffff;
}

.theme-dark .cc-help-popover .driver-popover-footer button {
    background-color: #3f78a3;
    border-color: #79a5ca;
    color: #ffffff;
    text-shadow: none;
}

.theme-dark .cc-help-popover .driver-popover-footer button:hover,
.theme-dark .cc-help-popover .driver-popover-footer button:focus {
    background-color: #508bb8;
    border-color: #a7cae6;
    outline: 2px solid #ffffff;
}

.theme-dark .cc-help-popover .driver-popover-btn-disabled {
    background-color: #343638;
    border-color: #4b4e51;
    color: #8d9297;
}

.theme-dark .cc-help-popover .driver-popover-close-btn {
    color: #b9bec3;
}

.theme-dark .cc-help-popover .driver-popover-close-btn:hover,
.theme-dark .cc-help-popover .driver-popover-close-btn:focus {
    color: #ffffff;
    outline: 2px solid #79a5ca;
}

.theme-dark .cc-help-popover .driver-popover-progress-text {
    color: #b9bec3;
}

.theme-dark .cc-help-popover .driver-popover-arrow {
    border-color: #222324;
}

.theme-dark .cc-help-popover .driver-popover-arrow-side-left {
    border-bottom-color: transparent;
    -webkit-filter: drop-shadow(1px 0 0 #4b5055);
    filter: drop-shadow(1px 0 0 #4b5055);
    border-right-color: transparent;
    border-top-color: transparent;
}

.theme-dark .cc-help-popover .driver-popover-arrow-side-right {
    border-bottom-color: transparent;
    -webkit-filter: drop-shadow(-1px 0 0 #4b5055);
    filter: drop-shadow(-1px 0 0 #4b5055);
    border-left-color: transparent;
    border-top-color: transparent;
}

.theme-dark .cc-help-popover .driver-popover-arrow-side-top {
    border-bottom-color: transparent;
    border-left-color: transparent;
    border-right-color: transparent;
    -webkit-filter: drop-shadow(0 1px 0 #4b5055);
    filter: drop-shadow(0 1px 0 #4b5055);
}

.theme-dark .cc-help-popover .driver-popover-arrow-side-bottom {
    border-left-color: transparent;
    border-right-color: transparent;
    border-top-color: transparent;
    -webkit-filter: drop-shadow(0 -1px 0 #4b5055);
    filter: drop-shadow(0 -1px 0 #4b5055);
}