/* Standard DLE TinyMCE comment editor. */
#dle-comments-form textarea#comments {
    display: block;
    box-sizing: border-box;
    width: 100%;
    min-height: 200px;
    padding: 14px 15px;
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 8px;
    outline: none;
    resize: vertical;
    background: #17181c;
    color: #f3f3f3;
    font: 15px/1.55 Arial, Helvetica, sans-serif;
}

#dle-comments-form textarea#comments::placeholder {
    color: #8c919c;
}

#dle-comments-form textarea#comments:focus {
    border-color: rgba(216, 27, 96, .85);
    box-shadow: 0 0 0 3px rgba(216, 27, 96, .16);
}

#dle-comments-form.fhd-comment-editor-loading textarea#comments {
    cursor: progress;
    opacity: .72;
}

#dle-comments-form .tox.tox-tinymce {
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 8px;
    background: #17181c;
    box-shadow: none;
}

#dle-comments-form .tox .tox-editor-header,
#dle-comments-form .tox .tox-toolbar-overlord,
#dle-comments-form .tox .tox-toolbar,
#dle-comments-form .tox .tox-toolbar__primary {
    background: #1e2025;
}

#dle-comments-form .tox .tox-editor-header {
    padding: 5px 7px;
    border-bottom: 1px solid rgba(255, 255, 255, .09);
    box-shadow: none;
}

#dle-comments-form .tox .tox-toolbar__group {
    margin: 0 2px;
    padding: 0 3px 0 1px;
    border-color: rgba(255, 255, 255, .10);
}

#dle-comments-form .tox .tox-tbtn {
    width: 32px;
    height: 32px;
    margin: 1px;
    border-radius: 6px;
    background: transparent;
    color: #e1e3e8;
}

#dle-comments-form .tox .tox-tbtn svg {
    fill: currentColor;
}

#dle-comments-form .tox .tox-tbtn:hover,
#dle-comments-form .tox .tox-tbtn:focus,
#dle-comments-form .tox .tox-tbtn--enabled,
#dle-comments-form .tox .tox-tbtn--enabled:hover {
    color: #fff;
    background: rgba(216, 27, 96, .22);
}

#dle-comments-form .tox .tox-tbtn--enabled,
#dle-comments-form .tox .tox-tbtn--enabled:hover {
    background: #b71954;
}

#dle-comments-form .tox .tox-edit-area,
#dle-comments-form .tox .tox-edit-area__iframe {
    background: #17181c;
}

#dle-comments-form .tox .tox-edit-area::before {
    border: 1px solid transparent;
}

#dle-comments-form .tox.tox-tinymce:focus-within {
    border-color: rgba(216, 27, 96, .85);
    box-shadow: 0 0 0 3px rgba(216, 27, 96, .16);
}

#dle-comments-form .tox.tox-tinymce:focus-within .tox-edit-area::before {
    border-color: rgba(216, 27, 96, .85);
}

/* DLE's quote and spoiler tools use TinyMCE's auxiliary dialog layer. */
.tox-tinymce-aux .tox-menu,
.tox-tinymce-aux .tox-collection,
.tox-tinymce-aux .tox-dialog,
.tox-tinymce-aux .tox-dialog__header,
.tox-tinymce-aux .tox-dialog__footer,
.tox-tinymce-aux .tox-collection__group,
.tox-dialog-wrap .tox-dialog,
.tox-dialog-wrap .tox-dialog__header,
.tox-dialog-wrap .tox-dialog__footer {
    border-color: rgba(255, 255, 255, .12) !important;
    background: #202125 !important;
    color: #f3f3f3 !important;
}

.tox-dialog-wrap__backdrop {
    background: rgba(10, 12, 16, .78) !important;
}

.tox-dialog-wrap .tox-dialog,
.tox-dialog-wrap .tox-dialog__content-js,
.tox-dialog-wrap .tox-dialog__body-iframe,
.tox-dialog-wrap iframe {
    background: #202125 !important;
}

.tox-dialog-wrap .tox-dialog__body-iframe {
    padding: 0;
}

.tox-tinymce-aux .tox-collection__item,
.tox-tinymce-aux .tox-dialog__title,
.tox-tinymce-aux .tox-label,
.tox-tinymce-aux .tox-button--naked,
.tox-dialog-wrap .tox-dialog__title,
.tox-dialog-wrap .tox-label,
.tox-dialog-wrap .tox-button--naked {
    color: #f3f3f3 !important;
}

.tox-tinymce-aux .tox-collection__item:hover,
.tox-tinymce-aux .tox-collection__item--active,
.tox-tinymce-aux .tox-button--secondary:hover,
.tox-dialog-wrap .tox-button--secondary:hover {
    background: rgba(216, 27, 96, .20) !important;
}

.tox-tinymce-aux .tox-textfield,
.tox-tinymce-aux .tox-textarea,
.tox-tinymce-aux .tox-listboxfield .tox-listbox--select,
.tox-dialog-wrap .tox-textfield,
.tox-dialog-wrap .tox-textarea,
.tox-dialog-wrap .tox-listboxfield .tox-listbox--select {
    border-color: rgba(255, 255, 255, .16) !important;
    background: #17181c !important;
    color: #f3f3f3 !important;
}

.tox-tinymce-aux .tox-button,
.tox-dialog-wrap .tox-button {
    border-color: #b71954 !important;
    background: #b71954 !important;
    color: #fff !important;
}

.tox-tinymce-aux .tox-button:hover,
.tox-tinymce-aux .tox-button:focus,
.tox-dialog-wrap .tox-button:hover,
.tox-dialog-wrap .tox-button:focus {
    border-color: #d81b60 !important;
    background: #d81b60 !important;
}

/* The bulk-comment form is supplied by DLE outside of the comment card. */
#dlemasscomments .mass_comments_action {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 9px 10px;
    margin-top: 14px;
    color: #e1e3e8;
}

#dlemasscomments .mass_comments_action label {
    margin: 0;
    color: #e1e3e8;
    font-weight: 600;
}

#dlemasscomments .mass_comments_action select {
    min-height: 40px;
    padding: 0 34px 0 12px;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 8px;
    background: #17181c;
    color: #f3f3f3;
    box-shadow: none;
}

#dlemasscomments .mass_comments_action .bbcodes {
    min-height: 40px;
    padding: 0 17px;
    border: 1px solid #b71954;
    border-radius: 8px;
    background: #b71954;
    color: #fff;
    font-weight: 700;
    line-height: 1;
    text-shadow: none;
}

#dlemasscomments .mass_comments_action .bbcodes:hover,
#dlemasscomments .mass_comments_action .bbcodes:focus-visible {
    border-color: #d81b60;
    background: #d81b60;
    color: #fff;
}

@media (max-width: 560px) {
    #dle-comments-form .tox .tox-editor-header {
        padding: 4px;
    }

    #dle-comments-form .tox .tox-tbtn {
        width: 30px;
        height: 30px;
    }
}