@media (prefers-color-scheme: dark) {
    .white {
        background-color: #111 !important;
        color: #fff;
    }

    .blue.darken-3 {
        background-color: #1E5DA6 !important;
    }

    /* like in btn-delete-text */
    .btn-flat {
        color: #666;
    }

    .btn-switch-type {
        background-color: #333;
        color: #5CA8FF;
    }
    .btn-switch-type:hover {
        background-color: #444 !important;
        color: #5CA8FF;
    }
    .btn-switch-type.active {
        background-color: #3392FF !important;
        color: #fff;
    }
    .btn-switch-type.active:hover {
        background-color: #5CA8FF !important;
        color: #fff;
    }

    .btn-switch-language {
      color: #fff;
    }

    .language-select:after {
      border: solid #fff;
      border-width: 0 2px 2px 0;
    }

    /* like in textarea */
    .card-content {
        border: 1px solid #444 !important;
        background-color: #222 !important;
        color: #fff;
    }

    .file-dropzone {
        background: #222;
        border: 1px solid #444;
        margin-top: 1rem;
    }

    select, select#locales{
        color: #fff;
        background: #111;
    }

    option {
        color: #fff;
        background: #222;
    }

    textarea {
        border: 1px solid #444 !important;
        background-color: #222 !important;
        color: #fff;
    }
    /* like in file dropzone */
    .textarea-container {
        margin-top: 1rem;
    }

    .code {
        border: 1px solid #444;
        background: #222;
        color: #fff;
    }
    code[class*="language-"], pre[class*="language-"] {
        color: #fff;
        text-shadow: 0 1px #000;
    }

    .token.atrule,
    .token.attr-value,
    .token.keyword {
        color: #40b5e8;
    }

    .language-css .token.string,
    .style .token.string,
    .token.entity,
    .token.operator,
    .token.url {
        color: #eecfab;
        background: hsla(0,0%,15%,.5);
    }

    .token.attr-name,
    .token.builtin,
    .token.char,
    .token.inserted,
    .token.selector,
    .token.string {
        color: #acd25f;
    }

    .token.boolean,
    .token.constant,
    .token.deleted,
    .token.number,
    .token.property,
    .token.symbol,
    .token.tag {
        color: #ff8bcc;
    }

    .token.class-name, .token.function {
        color: #ff7994;
    }
}