@media (prefers-color-scheme: dark) {

  .loader {
    color: $dark-theme-color;
  }

  .widget-header-minimize, .widget-header-close {
    background: $dark-background-color;
    color: $light-text-color;
    border: 1px solid $white;
  }
  #ocrcc-chatbox {
    .btn-icon {
      color: $light-text-color;
    }


    .message-window {
      background-color: $dark-background-color;
      border: 1px solid $white;
    }

    .notices {
      color: transparentize($light-text-color, 0.3);
    }

    .message {
      &.from-bot {
        color: transparentize($light-text-color, 0.3);
        font-size: 0.9rem;
      }

      &.from-me {
        .text {
          background-color: $theme-color;
          color: $light-text-color;
          border: 1px solid $theme-color;
        }
      }

      &.from-support {
        .text {
          background-color: $dark-theme-color;
          color: $light-text-color;
          border: 1px solid $dark-theme-color;
        }
      }
    }

    .input-window {
      input[type="text"] {
        background-color: $dark-theme-color;
        color: $light-text-color;
        border: 1px solid $white;
      }

      ::placeholder {
        color: transparentize($light-text-color, 0.3);
      }

      input[type="submit"] {
        background-color: $theme-color;
        color: $light-text-color;
        border: 1px solid $white;
      }
    }
  }
}
