html.dark {
  div[ng-app="dashboardApp"] {
    .dashboard-dropdown {
      border: none;
      background: @darkGray750;
       li a:hover, li:focus, li:hover, li a:focus {
         background: none !important;
         outline: blue;
      }
    }

    div[alert-widget] {
      .header {
        border-bottom: solid 1px @darkGray600;
      }
    }

    .widget .header h4 {
      color: #D1D2D3;
    }

    .widget .header .filter-wrapper {
      label, input, select {
        color: #D1D2D3;
      }
    }

    .chosen-container-single a.chosen-single,
    .widget .header input[type="text"],
    .chosen-container .chosen-drop {
      border: 1px solid @darkGray600 !important;
    }

    .chosen-container-single.chosen-container-active {
      background: none;
    }

    .chosen-results {
      .highlighted {
        background: @darkGray750 !important;
        color: @darkTextColor !important;
      }
    }

    .handle i:hover {
      background: @darkGray600;
    }

    .open a.option-menu.dashboard-dropdown,
    .open a.option-menu.dashboard-dropdown:after,
    a.option-menu.dashboard-dropdown:hover,
    a.option-menu.dashboard-dropdown:hover:after{
      background: @darkGray600 !important;
    }

    .widget.empty {
      &:hover {
        background: @darkGray750;
      }
      .btn-transparent {
        color: #D1D2D3;
        border: none;
        &:hover {
          background: none;
        }
      }
    }
  }
  .widget-panel {
    &:hover {
      border: 2px solid @darkBlue200;
      padding: 18px;
    }
    &-img{
      &-alert {
        background-image: url(/images/widgets/dark/alerts_widget.png);
      }
      &-single-alert {
        background-image: url(/images/widgets/dark/single_alert_widget.png);
      }
      &-pie {
        background-image: url(/images/widgets/dark/pie_widget.png);
      }
      &-table {
        background-image: url(/images/widgets/dark/table_widget.png);
      }
      &-bar {
        background-image: url(/images/widgets/dark/bar_widget.png);
      }
      &-gauge {
        background-image: url(/images/widgets/dark/gauge_widget.png);
      }
      &-changes {
        background-image: url(/images/widgets/dark/changes_widget.png);
      }
      &-new {
        background-image: url(/images/widgets/dark/newly_bootstrapped_widget.png);
      }
      &-decommissioned {
        background-image: url(/images/widgets/dark/decommissioned_widget.png);
      }
      &-files-changes {
        background-image: url(/images/widgets/dark/files_changes_widget.png);
      }
      &-not-kept {
        background-image: url(/images/widgets/dark/not_kept_widget.png);
      }
      &-compliance {
        background-image: url(/images/widgets/dark/compliance_widget.png);
      }
    }
  }
  .addWidgetModal{
    .tabs {
      border-bottom: 1px solid rgba(255, 255, 255, 0.12);
      a {
        color: rgba(255, 255, 255, 0.6);
        &.selected {
          color: @darkBlue200;
          border-bottom: 2px solid @darkBlue200;
        }
      }
      &-content {
        h3 {
          color: @darkTextColor;
        }
        .disabled {
          h3, img {
            opacity: 0.5;
          }
        }
      }
    }
  }
  .widget-compliance {
    &-table {
      a, a:hover {
        color: @darkTextColor;
      }
    }
    table {
      th {
        font-weight: bold;
        color: @darkTextColor;
      }
      tbody {
        tr {
          &:nth-child(even) {
            td {
              background: #3F444A;
            }
          }
        }
      }
      .bi-exclamation-triangle-fill {
        color: #DA7972;
      }
      .bi-exclamation-circle-fill {
        color: #FEF59F;
      }
    }
    &-all {
      i {
        color: #45B26B;
      }
    }
  }
  .singleAlert {

    &-summary, &-summary span {
      color: @Gray300;
    }
    &.high {
      .singleAlert-summary, .singleAlert-summary span {
        color: @Red200;
      }
    }

    &.ok {
      .singleAlert-summary {
        color: @Green200;
      }
    }
    .widget-overlay {
      > div {
        color: @darkBlue200;
      }
    }
  }
  .alerts-container {
    border-color: rgba(255, 255, 255, 0.12);
  }
}
