body.body_dark {
    .forum-post-widget {
        .post-filter-widget {
            .single-filter-item {
                svg,
                path {
                    fill: darkgrey;
                }
            }
        }
    }

    .communities-boxes {
        .com-box {
            .com-box-content {
                .title {
                    a {
                        color: #fff;

                        &:hover {
                            color: var(--bbpc_brand_color);
                        }
                    }
                }

                .total-post {
                    color: #8b8b8b;
                }
            }
        }
    }

    .more-communities {
        border-color: #272727;
    }

    .single-forum-post-widget {
        .post-info {
            div {
                color: #848d95;
            }

            .post-category {
                a {
                    color: #848d95;

                    &:hover {
                        color: var(--bbpc_brand_color);
                    }
                }
            }
        }
    }

    .community-area {
        .nav-tabs {
            .nav-item {
                button {
                    &.active {
                        color: #fff;
                    }
                }
            }
        }
    }

    input.frmx-search-input.input_focused {
        background: #fff;
    }

    .bbpc-not-found-text {
        color: black;
    }

    .bbpc-hc-wrap {
        .bbpc-hc-grid {
            background: #2a2a2a;
            border-color: #2a2a2a;
        }

        .bbpc-hc-card {
            background: #1a1a1a;

            &:hover {
                background: #222;
            }
        }

        .bbpc-hc-body {
            .bbpc-hc-title {
                color: #fff;
            }
            .bbpc-hc-desc {
                color: var(--black_400);
            }
        }
    }

    .forum-with-topics {
        .topic-table {
            .topic-contents {
                h3 {
                    a {
                        color: #fff !important;

                        &:hover {
                            color: var(--bbpc_brand_color) !important;
                        }
                    }
                }

                .title {
                    p {
                        color: var(--black_400);
                    }
                }
            }
        }

        .forum-card {
            .card-body {
                .card-title {
                    h3 {
                        a {
                            color: #fff !important;

                            &:hover {
                                color: var(--bbpc_brand_color) !important;
                            }
                        }
                    }
                }

                &:not(.card-title) {
                    color: var(--black_400);
                }
            }
        }
    }

    // Style 3 dark mode
    .bbpc-sf-list {
        .bbpc-sf-list-forum-title a {
            color: #fff;
        }

        .bbpc-sf-list-forum-desc {
            color: var(--black_400);
        }

        .bbpc-sf-list-item {
            background: var(--black_50);

            .bbpc-sf-list-title a {
                color: #fff;

                &:hover {
                    color: var(--bbpc_brand_color);
                }
            }

            .bbpc-sf-list-excerpt {
                color: var(--black_400);
            }
        }
    }

    // Style 4 dark mode
    .bbpc-sf-grid {
        .bbpc-sf-grid-topics {
            .bbpc-sf-grid-topic {
                background: var(--black_50);

                h3 a {
                    color: #fff;

                    &:hover {
                        color: var(--bbpc_brand_color);
                    }
                }

                p {
                    color: var(--black_400);
                }
            }
        }
    }

    // TinyMCE (Visual/Code editor) chrome.
    // The iframe body itself is themed via JS (assets/frontend/js/frontend.js)
    // since an iframe's document doesn't inherit the parent page's CSS.
    // Colors reuse the existing --black_* scale (see el-widgets/_variables.scss)
    // rather than introducing new dark palette variables.
    .wp-editor-wrap,
    .wp-editor-container {
        border-color: var(--black_750);
        background: var(--black_900);
    }

    .mce-tinymce,
    .mce-panel,
    .mce-toolbar-grp,
    .mce-statusbar {
        background: var(--black_800) !important;
        border-color: var(--black_750) !important;
    }

    .mce-btn,
    .mce-btn-group {
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
    }

    .mce-ico,
    .mce-txt,
    .mce-path-item,
    .mce-path-item:hover {
        color: var(--black_150) !important;
    }

    .mce-btn.mce-active,
    .mce-btn:hover {
        background: var(--black_750) !important;
    }

    .mce-menu,
    .mce-floatpanel {
        background: var(--black_800) !important;
        border-color: var(--black_750) !important;

        .mce-menu-item {
            background: transparent;

            .mce-text,
            .mce-ico {
                color: var(--black_150) !important;
            }

            &:hover,
            &.mce-selected {
                background: var(--black_750) !important;
            }
        }
    }

    // Quicktags ("Code" view) toolbar + textarea.
    .quicktags-toolbar {
        background: var(--black_800) !important;
        border-color: var(--black_750) !important;

        input.ed_button {
            background: transparent !important;
            border: none !important;
            color: var(--black_150) !important;
        }
    }

    textarea.wp-editor-area {
        background: var(--black_900) !important;
        color: var(--black_75) !important;
        border-color: var(--black_750) !important;
    }

    .media-modal,
    .media-modal-backdrop {
        filter: invert(1) hue-rotate(180deg);
    }

    .media-modal img,
    .media-modal video,
    .media-modal .dashicons {
        filter: invert(1) hue-rotate(180deg);
    }

    // WP link modal ("Insert/edit link"), classic wplink dialog.
    // Explicitly themed (rather than inverted) to match the editor's
    // dark palette and keep proper contrast on inputs, the results
    // list, and the scrollbar. Colors reuse the existing --black_*
    // scale (see el-widgets/_variables.scss), not new ones.
    #wp-link-backdrop {
        background: rgba(0, 0, 0, 0.6);
    }

    #wp-link-wrap {
        background: var(--black_800);
        border-color: var(--black_750);
        color: var(--black_150);

        #link-modal-title {
            background: var(--black_900);
            border-color: var(--black_750);
            color: var(--bs-white);

            #wp-link-close:before {
                color: var(--black_150);
            }

            #wp-link-close:hover:before {
                color: var(--bs-white);
            }
        }

        .howto {
            color: var(--black_400);
        }

        label span:first-child {
            color: var(--black_150);
        }

        input[type="text"],
        input[type="search"] {
            background: var(--black_900);
            border-color: var(--black_750);
            color: var(--black_75);

            &:focus {
                border-color: var(--bbpc_brand_color);
                box-shadow: none;
            }
        }

        #search-panel {
            border-color: var(--black_750);
        }

        .query-results,
        #search-results,
        #most-recent-results {
            background: var(--black_900);
            border-color: var(--black_750);

            &::-webkit-scrollbar {
                width: 10px;
            }

            &::-webkit-scrollbar-track {
                background: var(--black_900);
            }

            &::-webkit-scrollbar-thumb {
                background: var(--black_700);
                border-radius: 5px;

                &:hover {
                    background: var(--black_600);
                }
            }
        }

        .query-notice {
            background: var(--black_750);
            border-color: var(--black_750);

            .query-notice-default {
                color: var(--black_150);
            }
        }

        .query-results li {
            border-color: var(--black_750);

            .item-title {
                color: var(--black_75);
            }

            .item-info {
                color: var(--black_400);
            }

            &:hover,
            &.unselectable:hover {
                background: var(--black_750);
            }

            &.selected {
                background: var(--black_750);
                border-left-color: var(--bbpc_brand_color);

                .item-title,
                .item-info {
                    color: var(--bs-white);
                }
            }
        }

        .submitbox {
            background: var(--black_900);
            border-color: var(--black_750);
        }

        .button {
            background: var(--black_750);
            border-color: var(--black_700);
            color: var(--black_75);
            box-shadow: none;
            text-shadow: none;

            &:hover {
                background: var(--black_750);
                border-color: var(--black_600);
                color: var(--bs-white);
            }
        }

        .button-primary {
            background: var(--bbpc_brand_color);
            border-color: var(--bbpc_brand_color);
            color: var(--bs-white);

            &:hover {
                filter: brightness(1.1);
            }
        }
    }

    .mce-floatpanel {
        background: var(--bs-white) !important;
    }

    .all-answers .forum-comment.bbp-private-reply .frmx-reply-card {
        background: var(--bs-white) !important;
    }

}