html.dark-mode,
html.dark-mode body,
body.dark-mode {
  background: #101820;
  color: #dce5ec;
}

html.dark-mode #main-content,
html.dark-mode #page-content,
html.dark-mode .container-fluid,
body.dark-mode #main-content,
body.dark-mode #page-content,
body.dark-mode .container-fluid {
  background: #101820;
  color: #dce5ec;
}

body.dark-mode .navbar-header, .navbar-default, .navbar-static-top, .navbar-container-fluid {
    background-color: #2c3e50 !important;
    border-color: #2c3e50 !important;
}

body.dark-mode .top-navigation
{
    background-color: #15232d !important;
}

@media (max-width: 767px) {
  html.dark-mode .navbar-collapse,
  body.dark-mode .navbar-collapse,
  html.dark-mode #top-navigation,
  body.dark-mode #top-navigation {
    background-color: #15232d !important;
  }

  html.dark-mode #map-mobile-menu,
  body.dark-mode #map-mobile-menu {
    background: transparent !important;
    border-top-left-radius: 0 !important;
    border-top-right-radius: 0 !important;
  }

  html.dark-mode #map-mobile-menu:not([style*="max-height:0"]):not([style*="max-height: 0"]),
  body.dark-mode #map-mobile-menu:not([style*="max-height:0"]):not([style*="max-height: 0"]) {
    background: #15232d !important;
    border-top-left-radius: 10px !important;
    border-top-right-radius: 10px !important;
  }

  html.dark-mode #map-mobile-menu > div:first-child,
  body.dark-mode #map-mobile-menu > div:first-child {
    background: #15232d !important;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
  }

  html.dark-mode #map-mobile-menu .farm-list,
  html.dark-mode #map-mobile-menu .sensor-list,
  html.dark-mode #map-mobile-menu .probes-list,
  html.dark-mode #map-mobile-menu .zones-list,
  body.dark-mode #map-mobile-menu .farm-list,
  body.dark-mode #map-mobile-menu .sensor-list,
  body.dark-mode #map-mobile-menu .probes-list,
  body.dark-mode #map-mobile-menu .zones-list {
    background: #15232d !important;
  }

  html.dark-mode #map-mobile-menu .list-group-item,
  body.dark-mode #map-mobile-menu .list-group-item {
    background: #15232d !important;
    border-color: #2b3f4c !important;
    color: #dce5ec;
  }
}

html.dark-mode .navbar-default .navbar-nav > li > a,
html.dark-mode .navbar-default .navbar-brand,
body.dark-mode .navbar-default .navbar-nav > li > a,
body.dark-mode .navbar-default .navbar-brand {
  color: #dce5ec;
}

html.dark-mode .navbar-default .navbar-toggle,
body.dark-mode .navbar-default .navbar-toggle {
  border-color: #42525f;
}

html.dark-mode .navbar-default .navbar-toggle .icon-bar,
body.dark-mode .navbar-default .navbar-toggle .icon-bar {
  background-color: #dce5ec;
}

html.dark-mode #tab-bar,
html.dark-mode .senseit-tab,
body.dark-mode #tab-bar,
body.dark-mode .senseit-tab {
  background-color: #15232d !important;
  border-color: #2b3f4c !important;
  color: #b8c7d3 !important;
}

html.dark-mode .senseit-tab:hover,
body.dark-mode .senseit-tab:hover {
  background: #1f3340 !important;
  color: #e9f3f8 !important;
}

html.dark-mode .active-tab,
body.dark-mode .active-tab {
  background-color: #1e71b0;
  color: #ffffff !important;
  border-bottom-color: #4bb3fd !important;
}

html.dark-mode .nav-tabs,
body.dark-mode .nav-tabs {
  border-bottom-color: #2b3f4c;
}

html.dark-mode .nav-tabs > li > a,
body.dark-mode .nav-tabs > li > a {
  background: #15232d;
  border-color: #2b3f4c;
  color: #b8c7d3;
}

html.dark-mode .nav-tabs > li.active > a,
html.dark-mode .nav-tabs > li.active > a:focus,
html.dark-mode .nav-tabs > li.active > a:hover,
body.dark-mode .nav-tabs > li.active > a,
body.dark-mode .nav-tabs > li.active > a:focus,
body.dark-mode .nav-tabs > li.active > a:hover {
  background: #101820;
  border-color: #2b3f4c;
  border-bottom-color: #101820;
  color: #ffffff;
}

html.dark-mode a,
body.dark-mode a {
  color: #fff;
}

html.dark-mode .text-muted,
body.dark-mode .text-muted {
  color: #91a2ae !important;
}

html.dark-mode .card,
html.dark-mode div.shadow,
html.dark-mode .panel,
html.dark-mode .well,
html.dark-mode .bubble,
html.dark-mode .border-grey,
body.dark-mode .card,
body.dark-mode div.shadow,
body.dark-mode .panel,
body.dark-mode .well,
body.dark-mode .bubble,
body.dark-mode .border-grey {
  background: #15232d !important;
  border-color: #2b3f4c !important;
  color: #dce5ec;
  box-shadow: none;
}

html.dark-mode div.shadow:hover,
body.dark-mode div.shadow:hover {
  background: #1a2b36 !important;
}

html.dark-mode .table,
body.dark-mode .table {
  color: #dce5ec;
}

html.dark-mode .table > thead > tr > th,
html.dark-mode .table > tbody > tr > th,
html.dark-mode .table > tfoot > tr > th,
html.dark-mode .table > thead > tr > td,
html.dark-mode .table > tbody > tr > td,
html.dark-mode .table > tfoot > tr > td,
body.dark-mode .table > thead > tr > th,
body.dark-mode .table > tbody > tr > th,
body.dark-mode .table > tfoot > tr > th,
body.dark-mode .table > thead > tr > td,
body.dark-mode .table > tbody > tr > td,
body.dark-mode .table > tfoot > tr > td {
  border-color: #2b3f4c !important;
}

html.dark-mode .table-striped > tbody > tr:nth-of-type(odd),
body.dark-mode .table-striped > tbody > tr:nth-of-type(odd) {
  background-color: #14212a;
}

html.dark-mode .table-hover > tbody > tr:hover,
body.dark-mode .table-hover > tbody > tr:hover {
  background-color: #1f3340;
}

html.dark-mode .modal-content,
html.dark-mode .modal-header,
html.dark-mode .modal-body,
html.dark-mode .modal-footer,
body.dark-mode .modal-content,
body.dark-mode .modal-header,
body.dark-mode .modal-body,
body.dark-mode .modal-footer {
  background: #15232d;
  border-color: #2b3f4c;
  color: #dce5ec;
}

html.dark-mode .modal-backdrop,
body.dark-mode .modal-backdrop {
  background-color: #000;
}

html.dark-mode .dropdown-menu,
html.dark-mode .dropdown-menu-list,
html.dark-mode .custom-dropdown-menu,
body.dark-mode .dropdown-menu,
body.dark-mode .dropdown-menu-list,
body.dark-mode .custom-dropdown-menu {
  background: #15232d;
  border-color: #2b3f4c;
  color: #dce5ec;
}

html.dark-mode .dropdown-menu > li > a,
html.dark-mode .dropdown-menu-list > li > a,
html.dark-mode .custom-dropdown-menu a,
body.dark-mode .dropdown-menu > li > a,
body.dark-mode .dropdown-menu-list > li > a,
body.dark-mode .custom-dropdown-menu a {
  color: #dce5ec;
}

html.dark-mode .dropdown-menu > li > a:focus,
html.dark-mode .dropdown-menu > li > a:hover,
html.dark-mode .dropdown-menu-list > li > a:focus,
html.dark-mode .dropdown-menu-list > li > a:hover,
html.dark-mode .custom-dropdown-menu a:hover,
body.dark-mode .dropdown-menu > li > a:focus,
body.dark-mode .dropdown-menu > li > a:hover,
body.dark-mode .dropdown-menu-list > li > a:focus,
body.dark-mode .dropdown-menu-list > li > a:hover,
body.dark-mode .custom-dropdown-menu a:hover {
  background: #1e71b0;
  color: #ffffff;
}

html.dark-mode .divider,
body.dark-mode .divider {
  background-color: #2b3f4c !important;
}

html.dark-mode .form-control,
html.dark-mode input,
html.dark-mode textarea,
html.dark-mode select,
body.dark-mode .form-control,
body.dark-mode input,
body.dark-mode textarea,
body.dark-mode select {
  background-color: #0f1a22;
  border-color: #314554;
  color: #e9f3f8;
}

html.dark-mode .form-control:focus,
html.dark-mode input:focus,
html.dark-mode textarea:focus,
html.dark-mode select:focus,
body.dark-mode .form-control:focus,
body.dark-mode input:focus,
body.dark-mode textarea:focus,
body.dark-mode select:focus {
  border-color: #4bb3fd;
  box-shadow: 0 0 0 2px rgba(75, 179, 253, 0.2);
}

html.dark-mode .form-control::placeholder,
html.dark-mode input::placeholder,
html.dark-mode textarea::placeholder,
body.dark-mode .form-control::placeholder,
body.dark-mode input::placeholder,
body.dark-mode textarea::placeholder {
  color: #7f929f;
}

html.dark-mode .input-group-addon,
body.dark-mode .input-group-addon {
  background: #1f3340;
  border-color: #314554;
  color: #dce5ec;
}

html.dark-mode .select2-container--default .select2-selection--single,
html.dark-mode .select2-container--default .select2-selection--multiple,
body.dark-mode .select2-container--default .select2-selection--single,
body.dark-mode .select2-container--default .select2-selection--multiple {
  background: #0f1a22;
  border-color: #314554;
  color: #e9f3f8;
}

html.dark-mode .select2-container--default .select2-selection--single .select2-selection__rendered,
html.dark-mode .select2-container--default .select2-selection--multiple .select2-selection__choice,
body.dark-mode .select2-container--default .select2-selection--single .select2-selection__rendered,
body.dark-mode .select2-container--default .select2-selection--multiple .select2-selection__choice {
  background: #15232d;
  border-color: #314554;
  color: #e9f3f8;
}

html.dark-mode .select2-dropdown,
body.dark-mode .select2-dropdown {
  background: #15232d;
  border-color: #314554;
  color: #e9f3f8;
}

html.dark-mode .select2-container--default .select2-results__option--highlighted[aria-selected],
body.dark-mode .select2-container--default .select2-results__option--highlighted[aria-selected] {
  background: #1e71b0;
}

html.dark-mode .btn-default,
body.dark-mode .btn-default {
  background: #243746;
  border-color: #3a5364;
  color: #e9f3f8;
}

html.dark-mode .btn-default:hover,
html.dark-mode .btn-default:focus,
body.dark-mode .btn-default:hover,
body.dark-mode .btn-default:focus {
  background: #30495b;
  border-color: #4b6678;
  color: #ffffff;
}

html.dark-mode .loading-overlay,
html.dark-mode .font-loading-screen,
body.dark-mode .loading-overlay,
body.dark-mode .font-loading-screen {
  background: #101820;
  color: #dce5ec;
}

html.dark-mode .sidebar,
html.dark-mode #probeInfoSidebar,
body.dark-mode .sidebar,
body.dark-mode #probeInfoSidebar {
  background: #15232d !important;
  border-color: #2b3f4c !important;
  color: #dce5ec;
}

html.dark-mode .json-container,
body.dark-mode .json-container {
  background: #0f1a22;
  border-color: #314554;
  color: #dce5ec;
}

html.dark-mode .paginate_button,
body.dark-mode .paginate_button {
  background: #243746;
  color: #dce5ec;
}

html.dark-mode .dataTables_paginate .current,
body.dark-mode .dataTables_paginate .current {
  background: #1e71b0;
  color: #ffffff;
}

html.dark-mode .highcharts-background,
body.dark-mode .highcharts-background {
  fill: #0f1a22;
}

/* SiloLevel card: lighten silo outline and text in dark mode */
html.dark-mode .card-1 svg line,
body.dark-mode .card-1 svg line {
  stroke: #8bafc5 !important;
}
html.dark-mode .card-1 svg text,
body.dark-mode .card-1 svg text {
  fill: #d0e0ea !important;
}

/* Text sitting on a coloured fill (orange/red/green) → always dark for contrast */
.card-1 svg text.silo-on-fill,
html.dark-mode .card-1 svg text.silo-on-fill,
body.dark-mode .card-1 svg text.silo-on-fill {
  fill: #111111 !important;
}

html.dark-mode #set_temp,
body.dark-mode #set_temp {
  color: #e9f3f8 !important;
  background-color: transparent !important;
}

html.dark-mode .highcharts-grid-line,
body.dark-mode .highcharts-grid-line,
html.dark-mode .highcharts-plot-line,
body.dark-mode .highcharts-plot-line {
  stroke: rgba(236, 240, 241, 0.12) !important;
}

html.dark-mode .highcharts-title,
html.dark-mode .highcharts-axis-title,
html.dark-mode .highcharts-axis-labels text,
html.dark-mode .highcharts-legend-item text,
body.dark-mode .highcharts-title,
body.dark-mode .highcharts-axis-title,
body.dark-mode .highcharts-axis-labels text,
body.dark-mode .highcharts-legend-item text {
  fill: #dce5ec !important;
  color: #dce5ec !important;
}

html.dark-mode #div-floorplan svg rect[id$="-bg"][fill="#ecf0f1"],
html.dark-mode #div-floorplan svg rect[id$="-fill"][fill="#ecf0f1"],
body.dark-mode #div-floorplan svg rect[id$="-bg"][fill="#ecf0f1"],
body.dark-mode #div-floorplan svg rect[id$="-fill"][fill="#ecf0f1"] {
  fill: #314554 !important;
}

html.dark-mode .bg-default,
body.dark-mode .bg-default {
  background-color: #314554 !important;
}

body.dark-mode .card-1 {
  background-color: #314554 !important;
  border-radius: 5px;
}
body.dark-mode .card-1-footer-div {
    background-color: transparent;
}

html.dark-mode #map-mobile-menu,
html.dark-mode #map-sidebar,
body.dark-mode #map-mobile-menu,
body.dark-mode #map-sidebar {
    bottom:-20px !important;
    background-color: #314554 !important;
    padding: 5px !important;
    margin: 0px;
    margin-top:-20px;
}

html.dark-mode .list-group,
html.dark-mode .scrollbox,
html.dark-mode .list-group-item,
html.dark-mode .sortable-list,
html.dark-mode .sortable-item,
body.dark-mode .list-group,
body.dark-mode .scrollbox,
body.dark-mode .list-group-item,
body.dark-mode .sortable-list,
body.dark-mode .sortable-item {
    background-color: #314554 !important;
}

body.dark-mode .list-group {
    margin: 0px;
}

body.dark-mode .table th {
    background-color: #314554 !important;
}

html.dark-mode #map,
html.dark-mode #map .gm-style,
html.dark-mode #map .gm-style > div,
body.dark-mode #map,
body.dark-mode #map .gm-style,
body.dark-mode #map .gm-style > div {
  background-color: #15232d !important;
}

html.dark-mode .gm-style .gm-style-iw-c,
html.dark-mode .gm-style .gm-style-iw-d,
body.dark-mode .gm-style .gm-style-iw-c,
body.dark-mode .gm-style .gm-style-iw-d {
  background: #243746 !important;
  color: #dce5ec !important;
}

html.dark-mode .gm-style .gm-style-iw-d,
body.dark-mode .gm-style .gm-style-iw-d {
  overflow-x: none;
  overflow-y: auto !important;
  scrollbar-color: #4b6678 #243746;
  scrollbar-width: thin;
}

html.dark-mode .gm-style .gm-style-iw-d::-webkit-scrollbar,
body.dark-mode .gm-style .gm-style-iw-d::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

html.dark-mode .gm-style .gm-style-iw-d::-webkit-scrollbar-track,
body.dark-mode .gm-style .gm-style-iw-d::-webkit-scrollbar-track {
  background: #243746;
}

html.dark-mode .gm-style .gm-style-iw-d::-webkit-scrollbar-thumb,
body.dark-mode .gm-style .gm-style-iw-d::-webkit-scrollbar-thumb {
  background: #3a5364;
  border-radius: 8px;
}

html.dark-mode .gm-style .gm-style-iw-tc::after,
body.dark-mode .gm-style .gm-style-iw-tc::after {
  background: #243746 !important;
}

html.dark-mode .gm-style .gm-ui-hover-effect,
body.dark-mode .gm-style .gm-ui-hover-effect {
  filter: invert(1) grayscale(1);
}

html.dark-mode .gm-style [id^="div-infowindow-"],
body.dark-mode .gm-style [id^="div-infowindow-"] {
  background: #243746 !important;
  color: #dce5ec !important;
}

html.dark-mode .gm-style [id^="div-infowindow-"] table,
html.dark-mode .gm-style [id^="div-infowindow-"] td,
html.dark-mode .gm-style [id^="div-infowindow-"] h4,
html.dark-mode .gm-style [id^="div-infowindow-"] h5,
body.dark-mode .gm-style [id^="div-infowindow-"] table,
body.dark-mode .gm-style [id^="div-infowindow-"] td,
body.dark-mode .gm-style [id^="div-infowindow-"] h4,
body.dark-mode .gm-style [id^="div-infowindow-"] h5 {
  background: transparent !important;
  color: #dce5ec !important;
}

html.dark-mode .gm-style [id^="div-infowindow-"] .text-muted,
body.dark-mode .gm-style [id^="div-infowindow-"] .text-muted {
  color: #91a2ae !important;
}

/* Global dark mode scrollbars */
html.dark-mode,
body.dark-mode {
    scrollbar-color: #4b6678 #243746;
    scrollbar-width: thin;
}

html.dark-mode ::-webkit-scrollbar,
body.dark-mode ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

html.dark-mode ::-webkit-scrollbar-track,
body.dark-mode ::-webkit-scrollbar-track {
    background: #243746;
}

html.dark-mode ::-webkit-scrollbar-thumb,
body.dark-mode ::-webkit-scrollbar-thumb {
    background: #4b6678;
    border-radius: 8px;
}

html.dark-mode ::-webkit-scrollbar-thumb:hover,
body.dark-mode ::-webkit-scrollbar-thumb:hover {
    background: #5c7a8e;
}

/* Floor plan SVG dark mode fixes */
body.dark-mode #floorplans svg .white,
html.dark-mode #floorplans svg .white {
    fill: #314554 !important;
}

body.dark-mode #floorplans svg .white:hover,
html.dark-mode #floorplans svg .white:hover {
    fill: #3a5364 !important;
}

body.dark-mode #floorplans svg .line,
html.dark-mode #floorplans svg .line {
    stroke: #b8c7d3 !important;
}

body.dark-mode #floorplans svg circle.area,
html.dark-mode #floorplans svg circle.area {
    stroke: #b8c7d3 !important;
}

body.dark-mode #floorplans svg text,
html.dark-mode #floorplans svg text {
    fill: #dce5ec !important;
}

/* Broiler stat tiles dark mode */
html.dark-mode .broiler-stat-tile,
body.dark-mode .broiler-stat-tile {
    background: #314554 !important;
}

html.dark-mode .broiler-stat-tile .stat-label,
body.dark-mode .broiler-stat-tile .stat-label {
    color: #91a2ae !important;
}

html.dark-mode .broiler-stat-tile .stat-value,
body.dark-mode .broiler-stat-tile .stat-value {
    color: #dce5ec !important;
}