.dark-mode {
  .spt-main,
  .mat-mdc-table,
  .mat-elevation-z8 th, .mat-mdc-elevation-specific.mat-elevation-z8 th,
  .card {
    background: #2b3a44 !important;
  }

  .navbar-primary {
    background: #6a7277 !important;
  }

  h6, .h6, h5, .h5, h4, .h4, h3, .h3, h2, .h2, h1, .h1,
  .mat-mdc-select,
  .mat-mdc-select-arrow svg,
  .mat-mdc-icon-button,
  .mat-mdc-row,
  .mat-mdc-header-row,
  .toggle p,
  .form-label,
  .mat-mdc-tab .mdc-tab__text-label, .mat-mdc-tab:hover .mdc-tab__text-label,
  .spt-dl dt,
  .spt-dl dd,
  .form-control,
  .form-control::placeholder,
  .spt-main,
  select,
  label a,
  .form-label a,
  .card-body,
  .search-select .show-name p {
    color: #fff !important;
  }
  .search-select .show-name p {
    background: transparent;
  }

  .mat-mdc-paginator-icon {
    fill: #fff;
  }

  .toggle:before, .toggle:after,
  #btn-sidebar::after {
    background: #fff;
  }

  .spt-dl dt,
  .spt-dl dd,
  .mat-mdc-cell,
  .spt-container .card:not(.contacts .card, .tasks .card, .post .card),
  #btn-sidebar::before, #btn-sidebar::after,
  .mat-elevation-z8 th, .mat-mdc-elevation-specific.mat-elevation-z8 th {
    border-color: #fff;
  }

  .mat-mdc-icon-button[disabled] .mat-mdc-paginator-icon {
    fill: #3e525f;
  }

  .mat-mdc-tab-list .mat-ripple,
  .changing-list {
    background: #4e697b;
  }

  .mat-mdc-table .mat-mdc-row:hover .mdc-data-table__cell,
  .toggle,
  .mat-mdc-tab-list .mdc-tab-indicator--active .mat-ripple {
    background: #3e525f;
  }

  .spt-icon-details {
    border-color: #3e525f;
  }

  .form-control,
  select {
    background: #1d262d !important;
  }

  .modal-content {
    background-color: #6c757d;
  }

  .btn-back {
    background-image: url("../images/icons/icon-back-white.svg");
    background-size: 100% auto;
  }
  table,
  p,
  ul,
  ol,
  dl,
  .post h3,
  .tasks h3 {
    a {
      color: #fff;
      &:hover {
        color: #ddd;
      }
    }
  }
  .btn-link {
    color: #fff;
    &:hover {
      color: #ddd;
    }
  }
  .spt-clear {
    background-color: transparent;
    &:before,
    &:after {
      background: #fff;
    }
  }
}
