/home2/mshostin/crm.ms-hostingladz.com/assets/scss/_dark.scss
.h1, .h2, .h3, .h4, .h5, .h6,
h1, h2, h3, h4, h5, h6 {
  color: $headings-color
}

.text-muted {
  color: $gray-400 !important;
}

/* add hover effect to element */
.hoverable {
  &:hover{
    // cursor: pointer;
    background-color: $darken-40;
  }
}

/* customize dropdown hover backgroud */
.dropdown-toggle {
  &:hover,
  &:focus {
    background-color: $body-bg
  }
}

/* force bg-white on dark mode */
.bg-white {
  background: $darken-40 !important;
}
/* opposite background color with theme */
.bg-inverse {
  background: $gray-100;
}
.bg-gradient {
  background: $primary linear-gradient(0deg, darken($primary, 10%), $primary) repeat-x !important
}

svg.navbar-brand-img {
  fill : $primary;
}

.navbar-light {
  .navbar-nav {
    .nav-link {
      color: $headings-color;
      &:hover {
        background: $light;
      }
    }
  }
}

.navbar-dark {
  .navbar-nav {
    .nav-link {
      color: $gray-100;
    }
  }
  .dropdown-menu {
    background: $dark;
    border-color: transparent;

    .nav-link {
      color: $gray-100;
    }
  }
  svg.navbar-brand-img {
    fill : $white
  }
  .searchform {
    ::placeholder,
    .form-control {
      color: $white;  
    }
    color: $white;  
  }
}

/* inverse navbar */
.navbar-inverse {
  .navbar-nav {
    .nav-link {
      color: $gray-600;
      &:hover,
      &:focus,
      &.active  {
        background-color: $primary;
        color: $white;
      }
    }
  }
  .dropdown-menu {
    background: $white;
    border-color: transparent;
  }
  svg.navbar-brand-img {
    fill : $primary;
  }
  &.bg-inverse {
    .navbar-nav {
      .searchform {
        ::placeholder,
        .form-control {
          color: $white;  
        }
        color: $white;  
      }
    }
  }
}

/* nav-link color for secondary-nav */
.vertical {
  &.secondary {
    .sidebar-left {
      .primary-nav {
        &.navbar-dark,
        &.navbar-inverse {
          .nav-link {
            &:hover,
            &:focus,
            &.active  {
              background-color: $card-bg;
              // color: $primary;
            }
          }
        }
        &.navbar-light {
          .nav-link {
            &:hover,
            &:focus,
            &.active  {
              background-color: $primary;
              color: $gray-100;
            }
          }
        }
      }
    }
  }
}

.secondary-nav {
  &.navbar-light {
    .navbar-nav {
      .nav-link {
        color: $gray-500;

        &:hover,
        &:focus,
        &.active  {
          background-color: $primary;
          color: $white;
        }
      }
    }
  }
}
/* horizontal navbar */
.horznav  {
  &.navbar-dark {
    &.bg-primary,
    &.bg-gradient {
      .nav-link {
        &:hover,
        &:focus,
        &.active  {
          background-color: lighten($primary, 10%);
          color: $white;
        }
      }
      .dropdown-menu {
        background: $primary;
      }
    }
    &.bg-gradient {
      background: $primary linear-gradient(-90deg, darken($primary, 10%), $primary) repeat-x !important
    }
  }
}
/* tabs */
.nav-tabs {
  .nav-link {
    color: $gray-500;
    &:hover,
    &:focus,
    &.active  {
      border-color: $primary;
      color: $white;
    }
  }
}

/* wrapper */
.headerbg {
  .navbar-toggler-icon {
    color: $white;
  }
  .wrapper {
    &:before {
      background: darken($gray-900, 5%);
    }
  }
}

.vertnav {
  .dropdown-toggle::after {
    color: $gray-500;
  }
}

.custom-select {
  background: $card-bg;
}

/* quill */
.ql-toolbar {
  &.ql-snow {
    border-color: $input-border-color;
  }
  .ql-picker-label {
    color: $body-color;
  }
  .ql-stroke {
    stroke: $body-color;
  }
  .ql-fill {
    fill : $body-color;
  }
}
.ql-container {
  &.ql-snow {
    border-color: $input-border-color;
  }
}


/* table */
.table {
  color: $body-color;
  thead {
    th {
      color: $gray-500;
    }
  }
  tbody {
    tr {
      th {
        color: $headings-color;
      }
    }
  }
}
/* fix table color on dark mode */
.table-primary,
.table-warning,
.table-success,
.table-danger,
.table-info {
  td {
    color: $body-bg;
  }
}
.table-hover {
  tbody {
    tr {
      &:hover {
        background-color: $table-hover-bg;
      }
    }
  }
}

.modal{
  &.fade.modal-slide {
     .modal-dialog {
       background: $body-bg;
     }
  }
  &.fade.modal-full {
    &.show {
      background: rgba(red($body-bg), green($body-bg), blue($body-bg), 0.9);
    }
  }
}

/* Calendar */
.fc-bootstrap {
  th,
  td {
    border-color: $border-color;
    background: $card-bg;
  }
  td {
    &.fc-today {
      background: $body-bg;
    }
  }
  .fc-toolbar {
    .btn {
      color: $body-color;
      background-color: $card-bg;
      border-color: $border-color;

      &.active {
        color: $headings-color;
        background-color: $primary;
        border-color: $primary;
      }
    }
  }
  .fc-event {
    color: $card-bg;
    background-color: $green;
    border-color: $green;
    &:hover {
      color: $card-bg;
    }
  }
}

/* gauge */
.gauge-container > .gauge .dial {
  stroke: $border-color;
}
.gauge-container > .gauge .value {
  stroke: $primary;
  color: $border-color;
}

.gauge-container.g3 > .gauge .dial {
  fill: $border-color;
}

.gauge-container.g4 > .gauge .value-text {
  fill: $body-color;
}
.gauge-container.g4 .value-text {
  color: $body-color;
}

/* file manager */
.file-panel {
  .selected {
    background-color: $secondary;
  }
}

@include media-breakpoint-down(md) {
  .horizontal {
    .horznav {
      .dropdown-menu {
        background-color: transparent !important;
      }
      .navbar-toggler-icon {
        color: $white;
      }
      .navbar-slide {
        background: $card-bg;
      }
      &.bg-gradient {
        .navbar-slide {
          background: $primary linear-gradient(0deg, darken($primary, 10%), $primary) repeat-x !important
        }
      }
      &.bg-inverse {
        .navbar-toggler-icon {
          color: $gray-600;
        }
        .navbar-slide {
          background: $gray-100;
        }
      }
      &.bg-primary {
        .navbar-slide {
          background: $primary;
        }
      }
    }
  }
}
Path: home2/mshostin/crm.ms-hostingladz.com/assets/scss