custom.css

/*
Copyright 2017 Bryan Keller (https://github.com/widget-)

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/

:root {
    /* Modify these to change your theme colors: */
    --primary: #DDD;
    --text: #BBB;
    --background: #111;
    --background-elevated: #222;
    --special: #00CED1;
 
    /* These should be less important: */
    --background-hover: rgba(255, 255, 255, 0.1);
    --background-light: #AAA;
    --background-bright: #FFF;
 
    --border-dim: #666;
    --border-bright: var(--primary);
 
    --text-bright: #BBB;
    --text-special: var(--special);
 
    --scrollbar-background: #000;
    --scrollbar-border: var(--primary);
 }
 
 h1, h2, h3, h4 {
   color: var(--text);
 }
 
 body {
     background: var(--background);
     color: var(--text);
 }
 hr {
     border: 0;
     border-bottom: 1px solid var(--background-elevated);
 }
 
 .popover_mask {
    background-color: rgba(0, 0, 0, 0.3);
 }
 
 /* Team Picker */
 .TeamSidebar, .TeamSidebar .StoplightContainer, .TeamSidebar .TeamSidebar-addArea {
    background-color: var(--background) !important;
    box-shadow: var(--background) 1px 1px 25px;
    color: var(--text);
    z-index: 1;
 }
 
 
 /* Channel selector */
 /*.TeamSidebar, .TeamSidebar .StoplightContainer, .TeamSidebar .TeamSidebar-addArea {*/
 /*nav.p-channel_sidebar {*/
 div.client_channels_list_container {
    background-color: var(--background-elevated) !important;
    box-shadow: var(--background-elevated) 1px 1px 25px;
    color: var(--text);
    z-index: 1;
 }
 
 nav.p-channel_sidebar {
    background-color: var(--background-elevated);
    color: var(--text);
 }
 
 #team_menu,
 body:not(.loading) #team_menu:hover,
 body:not(.loading) #team_menu:active {
    background-color: var(--background-elevated) !important;
 }
 
 .p-channel_sidebar__channel,
 .p-channel_sidebar__link,
 .p-channel_sidebar__channel:link,
 .p-channel_sidebar__link:link,
 .p-channel_sidebar__channel:visited,
 .p-channel_sidebar__link:visited,
 .p-channel_sidebar__channel:hover,
 .p-channel_sidebar__link:hover {
    color: var(--text) !important;
 }
 
 /* Channel with unread messages */
 .p-channel_sidebar__channel--unread:not(.p-channel_sidebar__channel--muted):not(.p-channel_sidebar__channel--selected) .p-channel_sidebar__name,
 .p-channel_sidebar__link--unread:not(.p-channel_sidebar__link--selected) .p-channel_sidebar__name,
 .p-channel_sidebar__link--invites:not(.p-channel_sidebar__link--dim) .p-channel_sidebar__name,
 .p-channel_sidebar__section_heading_label--clickable:hover,
 .p-channel_sidebar__quickswitcher:hover {
    color: var(--text-bright) !important;
 }
 
 /*broken*/
 __TODO-highlight-indicator {
    background-color: var(--border-bright) !important;
    opacity: 1;
 }
 
 #msgs_scroller_div::-webkit-scrollbar-track, .client_container,
 #search_terms, #footer, ts-message, .channel_header, ts-jumper ts-jumper-container,
 ts-jumper input[type="text"],
 .supports_custom_scrollbar:not(.slim_scrollbar) #col_channels:hover #channels_scroller::-webkit-scrollbar-track,
 #channel_header_info, #channel_topic_text, #channel_topic_text code, #edit_topic_inner:before,
 .p-message_pane .c-message_list.c-virtual_list--scrollbar>.c-scrollbar__hider, .p-message_pane .c-message_list:not(.c-virtual_list--scrollbar)
 {
   background: var(--background) !important;
   border-color: var(--border-dim);
 }
 .p-message_pane .c-message_list.c-virtual_list--scrollbar>.c-scrollbar__hider:before, .p-message_pane .c-message_list:not(.c-virtual_list--scrollbar):before {
     background: var(--background);
 }
 .p-message_pane__limited_history_foreword {	
     color: var(--text);
     background: var(--background-elevated);
 }
 
 .c-message--focus:not(.c-message--highlight):not(.c-message--standalone):not(.c-message--pinned):not(.c-message--ephemeral):not(.c-message--custom_response):not(.c-message--starred):not(.c-message--sli_highlight), .c-message--hover:not(.c-message--highlight):not(.c-message--standalone):not(.c-message--pinned):not(.c-message--ephemeral):not(.c-message--custom_response):not(.c-message--starred):not(.c-message--sli_highlight), .c-message:hover:not(.c-message--highlight):not(.c-message--standalone):not(.c-message--pinned):not(.c-message--ephemeral):not(.c-message--custom_response):not(.c-message--starred):not(.c-message--sli_highlight) {
     background-color: var(--background-hover);
 }
 .c-message--light .c-message__sender .c-message__sender_link {
     color: var(--text);
 }
 .c-message_list__day_divider__line {
     border-top: 1px solid var(--border-dim);
 }
 
 .c-message__body {
     color: var(--text);
 }
 
 .c-message_list__day_divider__label__pill {
     background: var(--background-elevated);
     color: var(--text-bright);
 }
 .attachment_group .inline_attachment.message_unfurl .attachment_source .attachment_source_name a, .attachment_group .inline_attachment.message_unfurl .attachment_source .attachment_source_name span
 {
     color: var(--text);
 }
 .c-message_group {
     background-color: unset;
     border: 1px solid var(--border-dim);
 }
 .c-message_group:hover {
     border-color: var(--border-dim);
 }
 
 .msg_inline_attachment_column.column_border {
     background-color: var(--border-dim);
 }
 
 /* this styles only the brighter variant of attachment borders */
 .c-message_attachment__border[style="background-color: rgb(208, 208, 208)"], .c-message_attachment__border:not([style]) {
     background-color: var(--background-elevated) !important;
 }
 
 
 .c-member_slug--link {
     background: var(--background-elevated);
 }
 
 .channel_header, #col_messages, #footer {
    box-shadow: none;
 }
 /* buttons */
 .btn.disabled, .btn.disabled:active, .btn.disabled:hover, .btn:disabled, .btn:disabled:active, .btn:disabled:hover {
     background-color: var(--background-light) !important;
 }
 .btn_outline.hover, .btn_outline:focus, .btn_outline:hover {
     background: var(--background-hover) !important;
 }
 .btn_basic:focus, .btn_basic:hover {
     color: var(--text-special);
 }
 
 /* channel list */
 .p-channel_sidebar__channel,
 .p-channel_sidebar__link {
   border-radius: 0 15px 15px 0;
   height: 24px !important;
 }
 
 .p-channel_sidebar__channel a {
   color: var(--text);
 }
 
 .p-channel_sidebar__channel--selected,
 .p-channel_sidebar__link--selected,
 .p-channel_sidebar__channel--selected:link,
 .p-channel_sidebar__link--selected:link,
 .p-channel_sidebar__channel--selected:visited,
 .p-channel_sidebar__link--selected:visited,
 .p-channel_sidebar__channel--selected:hover,
 .p-channel_sidebar__link--selected:hover {
    background-color: var(--background) !important;
    border: solid var(--border-bright);
    border-width: 1px 1px 1px 0;
 }
 
 .p-channel_sidebar__channel:hover,
 .p-channel_sidebar__link:hover{
    background-color: var(--background-hover) !important;
    border-color: transparent;
    color: var(--text) !important;
    height: 24px !important;
 }
 
 .p-channel_sidebar__close_container {
    background: none !important;
 }
 
 .p-channel_sidebar__channel--selected:hover,
 .p-channel_sidebar__link--selected:hover {
    border: solid var(--border-dim);
    border-width: 1px 1px 1px 0;
 }
 
 /*broken*/
 li.active[class] span,
 #channels_scroller.show_which_channel_is_active[class] ul li.active .primary_action .prefix,
 #channels_scroller.show_which_channel_is_active[class] ul li.active .primary_action,
 #channels_scroller.show_which_channel_is_active[class] ul li.active .primary_action.im_name > *:not(.unread_highlights) {
    color: var(--text-special) !important;
    background-color: transparent;
    opacity: 1;
 }
 
 /*"more unreads" bottom*/
 .p-channel_sidebar__banner--top {
    background-color: var(--background);
    border: 1px solid var(--border-bright);
    border-top: none;
    border-radius: 0 0 15px 15px;
 }
 
 /*"more unreads" bottom */
 .p-channel_sidebar__banner--bottom {
    background-color: var(--background);
    border: 1px solid var(--border-bright);
    border-bottom: none;
    border-radius: 15px 15px 0 0;
 }
 
 /*"unread mentions"*/
 .p-channel_sidebar__badge,
 .p-channel_sidebar__banner--mentions {
    /*inverted because important*/
    background-color: var(--border-bright) !important;
    border-color: var(--text-bright);
    color: var(--text-bright);
 }
 
 /*also add border to unread count for individual channels*/
 .p-channel_sidebar__badge {
    border: 1px solid;
 }
 
 /* new scrollbar */
 .p-channel_sidebar div.c-custom_scrollbar__thumb_vertical, .p-channel_sidebar div.c-scrollbar__bar {
   background: var(--background-elevated);
   border: 1px solid var(--scrollbar-border);
 }
 
 #channels_scroller.show_which_channel_is_active[class] li.active .presence.active i.presence_icon,
 #channels_scroller.show_which_channel_is_active[class] li.active .slackbot_icon,
 #channels_scroller.show_which_channel_is_active[class] li.active .presence.away i.presence_icon {
   color: inherit !important;
 }
 
 #client_body::before, #client_body:not(.onboarding):before {
   border-bottom: 1px solid var(--border-dim) !important;
   background: var(--background);
   box-shadow: none;
 }
 
 #client_body, #messages_container.has_top_messages_banner:before {
    background: var(--background) !important;
 }
 
 ts-message, .channel_title .channel_name, ts-jumper input[type="text"],
 ts-jumper ol li .member_real_name, ts-jumper ol li .view_name, ts-jumper ol li .channel_name {
   color: var(--text) !important;
 }
 
 .light_theme ts-message .message_content a.message_sender, #msg_input::-webkit-input-placeholder,
 ts-jumper input[type="text"]::-webkit-input-placeholder {
   color: var(--text) !important;
 }
 
 #msg_input, #primary_file_button {
   background: transparent !important;
   color: var(--text) !important;
   border-color: var(--border-dim) !important;
 }
 
 .day_divider .day_divider_label,
 #convo_container .convo_flexpane_divider .reply_count {
   color: var(--text) !important;
   background-color: var(--background) !important;
   border: 1px solid var(--border-bright) !important;
   border-radius: 1rem;
 }
 
 .mention_day_container_div .day_divider .day_divider_label {
    border: 1px solid var(--border-dim) !important;
 }
 
 #convo_container .convo_flexpane_divider .reply_count {
    border-radius: 10px;
    padding: 0px 10px;
 }
 
 .mention_day_container_div .day_divider:before {
    background-color: transparent !important;
    border-color: var(--border-dim);
 }
 
 .day_container .day_msgs {
   border-top: 1px solid var(--border-bright) !important;
   padding-right: 10px;
   padding-left: 2px;
 }
 
 textarea, input[type="text"], #file_comment_textarea {
     background-color: var(--background-elevated) !important;
    border-color: var(--border-dim) !important;
    color: var(--text) !important;
 }
 textarea:focus, input[type="text"]:focus, #file_comment_textarea {
    border-color: var(--border-bright) !important;
    color: var(--text-bright) !important;
 }
 
 ts-message {
    border-radius: 5px;
    margin: 1px 5px !important;
    box-shadow: none !important;
 }
 
 ts-message:hover {
    background: var(--background-hover) !important;
 }
 
 #messages_container::after {
    background: none !important;
 }
 
 .bot_label {
    padding: 0 4px !important;
    border-radius: 3px !important;
    background: var(--background) !important;
    border: 1px solid var(--border-bright);
 }
 
 
 .file_container:after{
    background-image: -webkit-linear-gradient(top,rgba(255,255,255,0) 0,#333 100%) !important;
 }
 .rxn,
 #col_channels,
 #col_channels_footer,
 pre,
 ts-message .action_hover_container .btn_msg_action,
 .file_container,
 .file_container .CodeMirror .CodeMirror-code>div:before, .file_container .CodeMirror .sssh-line:before, .file_container .sssh-code .CodeMirror-code>div:before, .file_container .sssh-code .sssh-line:before,
 #col_flex,
 .search_message_result,
 .search_result_with_extract,
 #search_filters a,
 .menu,
 .menu #menu_items_scroller,
 .btn, .btn_outline {
   background: var(--background-elevated) !important;
 }
 
 
 #flex_contents .heading,
 #flex_contents .heading a,
 #flex_contents .heading_text,
 #flex_contents .subheading,
 #flex_contents .toolbar_container {
    background: var(--background) !important;
    color: var(--text) !important;
    border-color: var(--border-dim);
 }
 
 pre,
 ts-message .action_hover_container .btn_msg_action,
 .file_container .CodeMirror .CodeMirror-code>div pre, .file_container .CodeMirror .sssh-line pre, .file_container .sssh-code .CodeMirror-code>div pre, .file_container .sssh-code .sssh-line pre,
 .search_message_result .search_message_result_meta a,
 .search_message_result .search_message_result_meta .date_links a,
 .flexpane_redesign #flex_contents .heading_text,
 #flex_contents .subheading,
 #search_filters.files #filter_files, #search_filters.messages #filter_messages,
 .menu ul li a,
 .btn, .btn_outline, .menu {
   color: var(--text) !important;
   border-color: border: 1px solid var(--border-dim) !important;
 }
 
 .btn:hover:after {
    border-color: var(--border-bright);
 }
 
 .action_hover_container {
   border: 1px solid var(--border-dim) !important;
 }
 .ts_tip_float.btn_msg_action:not(:last-child) {
   border-right: 1px solid var(--border-dim) !important;
 }
 .ts_tip_float.btn_msg_action:hover {
   background-color: var(--background) !important;
 }
 
 #quick_switcher_btn{
   /*border-top-color: #333 !important;*/
   background-color: transparent;
 
 }
 
 .rxn,
 .search_result_with_extract,
 .flexbox_client.flexpane_redesign.flex_pane_showing #col_flex,
 .flexpane_redesign #flex_contents .heading,
 #flex_contents .subheading,
 .search_segmented_control,
 .menu{
  border-color: var(--border-dim) !important;
 }
 
 .search_result_with_extract {
   box-shadow: 0 1px 10px var(--background-elevated) !important;
 }
 
 .ql-placeholder {
    color: var(--text) !important;
 }
 
 .ql-container.texty_single_line_input {
   background-color: var(--background-elevated);
   color: var(--text);
 }
 
 .ql-container .ql-editor p {
   color: var(--text);
 }
 
 #quick_switcher_btn:active, #quick_switcher_btn:focus, #quick_switcher_btn:hover {
    background-color: var(--background-elevated);
    border-color: var(--background-elevated);
 }
 
 .feature_name_tagging_client ts-message .mention, ts-message .mention,
 span.match {
   border: 1px solid var(--border-bright) !important;
   background-color: var(--background-elevated) !important;
   font-weight: bold;
   padding: 2px 4px;
   margin: 2px;
   border-radius: 10px;
 }
 
 .mention > .mention {
    /* I'm assuming this is a Slack bug */
    border: none;
 }
 
 .mention_rxn {
    border-radius: 5px;
    margin: 1px 5px;
 }
 
 .mention_rxn .mention_rxn_summary .app_preview_link,
 .mention_rxn .mention_rxn_summary .member_preview_link,
 .mention_rxn .mention_rxn_summary .mention_rxn_summary_members {
    color: var(--text);
 }
 
 #member_mentions h3 a {
    color: var(--text-special);
 }
 
 pre.special_formatting{
   background: var(--background-elevated) !important;
 }
 
 code {
   color: var(--text-special) !important;
   background-color: var(--background-elevated) !important;
   border-color: var(--border-dim) !important;
 }
 
 .supports_custom_scrollbar:not(.slim_scrollbar) #archive_msgs_scroller_div::-webkit-scrollbar-thumb,
 .supports_custom_scrollbar:not(.slim_scrollbar) #msgs_scroller_div::-webkit-scrollbar-thumb,
 .supports_custom_scrollbar:not(.slim_scrollbar) #col_channels:hover #channels_scroller::-webkit-scrollbar-thumb {
    /* scrollbar draggy bit */
   color: transparent !important;
   border: 1px solid var(--scrollbar-border) !important;
   background-color: transparent !important;
 }
 .supports_custom_scrollbar:not(.slim_scrollbar) #archive_msgs_scroller_div::-webkit-scrollbar-track,
 .supports_custom_scrollbar:not(.slim_scrollbar) #msgs_scroller_div::-webkit-scrollbar-track,
 .supports_custom_scrollbar:not(.slim_scrollbar) #col_channels:hover #channels_scroller::-webkit-scrollbar-track {
    /* scrollbar endcaps */
   color: transparent !important;
   border: 1px solid var(--border-dim) !important;
   background-color: transparent !important;
 }
 
 a, a:link, a:visited{
   color: var(--text-special);
 }
 ts-message a .mention{
   color: var(--text-special) !important;
 }
 a:hover{
   color: var(--text-special) !important;
 }
 
 #msgs_scroller_div #end_display_div p {
   color: var(--text);
 }
 
 .channels_list_holder ul li a.channel_name,
 .channels_list_holder ul li:not(.unread) .group_name,
 .channels_list_holder ul li .im_name,
 .channels_list_holder ul li .mpim_name,
 .channels_list_holder ul li>a:link,
 ts-message a.timestamp{
   color: #aaa !important;
 }
 #channels_scroller.show_which_channel_is_active ul li.active .im_name{
   color: #fff !important;
 }
 
 #msgs_div .unread_divider.no_unreads .divider_label
 {
  background: #000 !important;
  color: #aaa !important;
 }
 
 #msgs_div .unread_divider.no_unreads hr{
   border-top-color: #888 !important;
 }
 
 .flexpane_redesign #member_mentions {
   background-color: var(--background);
 }
 
 #details_tab .channel_page_section {
   background-color: var(--background-elevated);
 }
 
 #details_tab .channel_page_section .section_title {
    color: var(--text);
 }
 
 .greigh {
    /* greigh = label?? */
    color: var(--text) !important;
 }
 
 .pinned_item .pin_member_name a, .pinned_item {
      color: var(--text) !important;
 }
 
 .pinned_item .pinned_message_text .pin_truncate_fade {
    background: -webkit-gradient(linear,left bottom,left top,color-stop(0,var(--background-elevated)),color-stop(1,rgba(255,255,255,0)));
 }
 
 .tab_container .file_list_item .contents .member, .tab_container .file_list_item .contents .service_link, .tab_container .file_list_item .contents .share_info, .tab_container .file_list_item .contents .time {
    color: var(--text-special);
 }
 
 .tab_container .file_list_item:focus, .tab_container .file_list_item:hover {
    background-color: var(--background-hover);
 }
 
 /* files */
 .file_container.generic_container .file_header_meta .meta_hover {
    background-color: transparent !important;
 }
 
 .file_preview_action.btn.ts_tip, .file_preview_link.btn.file_comment_link {
    border: 1px solid var(--border-bright) !important;
    background-color: var(--background-hover) !important;
    color: var(--text) !important;
 }
 .file_preview_action.btn.ts_tip:hover, .file_preview_link.btn.file_comment_link:hover {
    background-color: var(--background) !important;
 }
 .p-file_details__name {
     color: var(--text);
 }
 /* user profile popup */
 #member_preview_scroller, #member_preview_web_container,
 .menu_member_header, .menu_member_footer {
    background-color: var(--background-elevated);
    border-color: var(--border-dim);
    color: var(--text);
 }
 
 /* user mentions for other people */
 .app_preview_link_slug.ts_tip,
 .internal_member_link.ts_tip,
 .internal_user_group_link.ts_tip,
 ts-mention.ts_tip
 {
    color: var(--text-bright);
    background: var(--background-elevated);
    border: 1px solid var(--border-dim);
    padding: 2px 4px;
    margin: 2px;
    border-radius: 10px;
 }
 .app_preview_link_slug.ts_tip:hover,
 .internal_member_link.ts_tip:hover,
 .internal_user_group_link.ts_tip:hover,
 ts-mention.ts_tip:hover
 {
    color: var(--text-bright) !important;
    border: 1px solid var(--border-bright);
 }
 
 /* emojis */
 .rxn[data-emoji] {
    /*background-color: var(--background-light) !important;
    transition: background-color 200ms ease-in;*/
    height: 28px;
 }
 
 .rxn[data-emoji]:hover {
    /*background-color: var(--background-bright) !important;*/
 }
 
 .rxn[data-emoji] .emoji_rxn_count {
    font-size: 0.9rem;
    /*color: black !important;*/
 }
 
 .rxn .emoji-sizer {
   background-color: transparent !important;
   border-radius: 7px;
   width: 24px;
   height: 24px;
   margin: 0 0 0 -2px !important;
   border: 1px solid transparent; /* looks silly but it makes the outline work */
 }
 
 .emoji-sizer {
    /* outline for black-on-transparent emojis */
    -webkit-filter: drop-shadow( 1px  0 0 var(--background))
                    drop-shadow(-1px  0 0 var(--background))
                    drop-shadow(-0  1px 0 var(--background))
                    drop-shadow( 0 -1px 0 var(--background));
    margin: 0 !important;
 }
 
 .ts_icon.ts_icon_smile_o {
    color: var(--text);
 }
 
 .emoji_menu_ng #emoji_input_container,
 #emoji_menu #emoji_menu_items_scroller,
 #emoji_menu #emoji_menu_footer,
 #emoji_menu #emoji_input_container {
    background-color: transparent;
 }
 
 .menu .p-emoji_picker__input_container,
 .menu .p-emoji_picker__list_container,
 .menu .p-emoji_picker__heading,
 .menu .p-emoji_picker__footer {
    background: transparent;
    color: var(--text);
 }
 
 .p-emoji_picker__group_tab {
    border: 1px solid transparent;
    border-bottom-width: 2px;
 }
 
 .menu .p-emoji_picker__group_tab--active {
    background-color: var(--background);
    color: var(--text-special);
    border-color: var(--border-bright);
    border-width: 1px 1px 2px 1px;
    border-style: solid;
 }
 .p-emoji_picker__group_tab:hover {
    background-color: var(--background-elevated);
    border-color: var(--border-dim);
 }
 .p-emoji_picker__group_tab .emoji-sizer {
    filter: none;
    -webkit-filter: none;
 }
 .p-emoji_picker__group_tab:hover .emoji-sizer {
    color: var(--text);
 }
 .p-emoji_picker__preview_text {
    background-color: var(--bacground-elevated);
    color: var(--text);
 }
 
 #emoji_menu h3, #emoji_menu #emoji_preview_text {
    background-color: var(--background-elevated);
    color: var(--text);
 }
 
 #emoji_menu a.emoji_grouping_tab .emoji-sizer {
    -webkit-filter: none;
 }
 
 .emoji_menu_ng #emoji_menu_header .emoji_grouping_tab.active {
    background-color: transparent;
    border-color: var(--border-bright);
    border-width: 1px 1px 3px 1px;
    border-style: solid;
 }
 
 .light_theme .emoji-only {
    line-height: 3rem;
    font-size: 3rem;
    margin-top: 3px !important;
 }
 
 /* menus */
 .menu ul li a, .menu ul li:not(.disabled) a {
    border: 1px solid var(--background-elevated) !important;
 }
 
 .menu ul li.highlighted a, .menu ul li:hover:not(.disabled) a {
    background: var(--background-elevated) !important;
    border-color: var(--border-bright) !important;
 }
 
 .menu .section_header .header_label {
   color: var(--text) !important;
   background-color: var(--background-elevated) !important;
 }
 
 .menu .section_header hr {
   border-color: transparent;
 }
 
 /* threads */
 ts-message .reply_bar:hover {
   background: var(--background) !important;
   border: 1px solid var(--border-dim) !important;
 }
 ts-message.active .edited, ts-message.active .reply_bar .last_reply_at, ts-message.active .timestamp, ts-message.active.automated .message_body, ts-message.message--focus .edited, ts-message.message--focus .reply_bar .last_reply_at, ts-message.message--focus .timestamp, ts-message.message--focus.automated .message_body, ts-message:hover .edited, ts-message:hover .reply_bar .last_reply_at, ts-message:hover .timestamp, ts-message:hover.automated .message_body {
     color: var(--text-bright);
 }
 #threads_msgs .inline_message_input_container.with_file_upload,
 #reply_container.upload_in_threads .inline_message_input_container {
   background: var(--background);
    border-color: var(--border-dim);
 }
 .c-message__reply_bar--focus, .c-message__reply_bar:hover, .c-message__reply_bar--focus .c-message__reply_bar_view_thread, .c-message__reply_bar:hover .c-message__reply_bar_view_thread
 {
     background-color: var(--background-elevated);
 }
 .p-threads_view {
     background-color: var(--background);
 }
 .p-threads_view_header__permalink {
     color: var(--primary) !important;
 }
 .p-threads_view__default_background {
     background-color: var(--background-elevated);
 }
 .p-threads_view__divider_line {
     border-color: var(--border-dim);
 }
 .p-threads_view__divider_label {
     background-color: var(--background-elevated);
     color: var(--text);
 }
 .p-threads_view_root {
     border-color: var(--border-dim);
 }
 .p-threads_view_reply {
     border-color: var(--border-dim);
 }
 .p-threads_view__footer {
     border-color: var(--border-dim);
 }
 .p-threads_view_reply {
     background-color: var(--background-hover);
 }
 .p-threads_footer__input--legacy .p-message_input_file_button {
     background-color: var(--background-elevated);
 }
 /* editor in thread reply */
 #convo_tab .message_input, #convo_tab textarea#msg_text {
    color: var(--text) !important;
 }
 .inline_message_input_container .ql-container.focus,
 .inline_message_input_container .ql-container:active {
    border-color: var(--border-dim) !important;
 }
 #file_reply_container .reply_container_info .reply_broadcast_buttons_container .reply_broadcast_label_container,
 #reply_container .reply_container_info .reply_broadcast_buttons_container .reply_broadcast_label_container,
 .reply_input_container .reply_container_info .reply_broadcast_buttons_container .reply_broadcast_label_container,
 #convo_tab #convo_tab_header {
    color: var(--text) !important;
 }
 
 /** Until 3.3.5 **/
 #message_edit_container .message_input {
     background: var(--background-elevated);
 }
 
 /** With 3.3.6 **/
 .p-threads_footer__input .p-message_input_field {
     background: var(--background-elevated);
 }
 button.c-button-unstyled.p-message_input_plus {
     background-color: var(--background-hover);
 }
 .p-threads_flexpane__separator_count {
     margin-right: 12px;
     color: var(--text);
 }.p-threads_flexpane__separator_line {
     border-bottom-color: var(--border-dim);
 }
 .p-threads_flexpane__header_channel_name {
      color: var(--text-special);
 }
 /* other */
 .special_formatting_quote .quote_bar {
    background: var(--border-bright) !important;
 }
 
 #details_toggle.active:hover, #recent_mentions_toggle.active:hover,
 #stars_toggle.active:hover {
    background-color: var(--background-hover);
    color: var(--text);
 }
 
 #details_toggle.active, #recent_mentions_toggle.active,
 #sli_recap_toggle.active, #stars_toggle.active {
   background-color: var(--background-elevated);
   border: 1px solid var(--border-bright);
   color: var(--border-bright);
 }
 
 .star_item,
 .current_status_input_for_team_menu .current_status_presets {
    border-color: var(--border-dim);
 }
 
 .messages_banner, .p-archives_banner {
    color: var(--text);
    background-color: var(--background-elevated);
    border: 1px solid var(--border-bright);
    border-bottom: 0px;
    border-radius: 10px 10px 0 0;
 }
 
 #threads_msgs_scroller_div, ts-thread {
    background-color: var(--background);
 }
 
 ts-thread .thread_header .thread_channel_name a {
    color: var(--text-special);
 }
 
 #convo_tab .thread_participants, ts-thread .thread_participants {
    color: var(--text);
 }
 
 ts-thread .thread_messages,
 .reply_input_container .ql-container {
    background-color: var(--background);
    border-color: var(--border-dim);
 }
 
 #threads_msgs_scroller_div ts-thread ts-message {
    margin: 0 !important;
    border-radius: 10px;
 }
 .p-message_pane .p-message_pane__top_banners:not(:empty)+div .c-message_list.c-virtual_list--scrollbar>.c-scrollbar__hider:before, .p-message_pane .p-message_pane__top_banners:not(:empty)+div .c-message_list:not(.c-virtual_list--scrollbar):before
 {
     box-shadow: 0 32px var(--background);
 }
 ts-thread .collapse_inline_thread_container:hover,
 ts-thread .view_all_replies_container:hover {
    background-color: var(--background-elevated);
 }
 
 
 /* preferences page and modals in general*/
 #fs_modal, .modal, .modal-header, .modal-footer {
    background-color: var(--background-elevated);
 }
 
 #fs_modal .fs_modal_btn:hover {
     color: var(--text);
     background-color: var(--background-hover);
 }
 #fs_modal, #fs_modal h1, #fs_modal h2,
 #fs_modal h3, #fs_modal h4, #fs_modal h5,
 .modal, .modal h1, .modal h2, .modal h3,
 .modal h4, .modal h5 {
    color: var(--text);
 }
 
 #fs_modal .fs_modal_file_viewer_header {
    background: transparent;
 }
 #fs_modal .fs_modal_file_viewer_content .viewer {
    background: var(--background);
 }
 .fs_modal_file_viewer_header .control_btn {
    color: var(--text) !important;
 }
 
 .section_rollup:hover:not(.is_active) {
    background: var(--background-hover);
    color: inherit;
 }
 
 #fs_modal #fs_modal_sidebar a {
   padding: 10px;
   background: transparent;
   border: 1px solid rgba(0, 0, 0, 0.01);
   border-radius: 10px;
 }
 
 #fs_modal #fs_modal_sidebar a:hover {
   border-color: var(--border-dim);
 }
 
 #fs_modal #fs_modal_sidebar a.is_active {
   border-color: var(--border-bright);
 }
 #fs_modal.prefs_modal legend {
     color: var(--text);
 }
 
 
 #threads_msgs_scroller_div .threads_caught_up_divider .divider_line,
 #threads_msgs_scroller_div .threads_caught_up_divider .divider_label {
    background-color: var(--background-elevated);
    border: 1px solid var(--border-dim);
    color: var(--text);
 }
 .c-sidebar_menu__list_item {
     color: var(--text);
 }
 .c-keyboard_key {
     color: var(--text);
     background: var(--background);
 }
 
 /* unreads */
 .unread_empty_state {
    color: var(--text);
 }
 
 .unread_group_header,
 .sli_briefing, .sli_briefing__header, .sli_briefing__title,
 .sli_briefing_view__footer_title, .bottom_mark_all_read {
    background-color: var(--background);
    color: var(--text);
    border-color: var(--border-dim);
 }
 .unread_group_header button {
    color: var(--text-special);
 }
 
 
 /* scroller for threads & unreads */
 #threads_msgs_scroller_div:not(.loading):before {
    background: var(--background);
 }
 
 /* putting this on so many elements might cause performance issues but #yolo */
 div::-webkit-scrollbar-track {
   display: none !important;
 }
 div::-webkit-scrollbar-thumb {
    color: transparent !important;
    border: 1px solid var(--scrollbar-border) !important;
    background-color: transparent !important;
 }
 
 #threads_msgs_scroller_div:not(.loading):before {
    background: none;
 }
 
 /* thread side panel */
 
 #mentions_scroller {
    background: var(--background) !important;
    color: var(--text) !important;
 }
 
 
 /* global (left sidebar) */
 
 #channel_scroll_down, #channel_scroll_up {
    background-color: var(--background) !important;
    border: 0 1px 1px 1px solid var(--border-bright) !important;
 }
 
 #team_menu, #quick_switcher_btn, #team_menu_overlay, #col_channels_overlay {
    border-color: transparent !important;
 }
 
 /* CodeMirror syntax highlighting */
 .cm-s-default .cm-header {color: #66f}
 .cm-s-default .cm-quote {color: #0f0}
 .cm-negative {color: #f44}
 .cm-positive {color: #2f2}
 .cm-s-default .cm-keyword {color: #f0a}
 .cm-s-default .cm-atom {color: #7ff}
 .cm-s-default .cm-number {color: #5fa}
 .cm-s-default .cm-def {color: #37f}
 .cm-s-default .cm-variable-2 {color: #09f}
 .cm-s-default .cm-variable-3 {color: #0fa}
 .cm-s-default .cm-comment {color: #f80}
 .cm-s-default .cm-string {color: #f33}
 .cm-s-default .cm-string-2 {color: #f50}
 .cm-s-default .cm-meta,.cm-s-default .cm-qualifier {color: #aaa}
 .cm-s-default .cm-builtin {color: #96f}
 .cm-s-default .cm-bracket {color: #ffa}
 .cm-s-default .cm-tag {color: #5f0}
 .cm-s-default .cm-attribute {color: #33f}
 .cm-s-default .cm-hr {color: #ccc}
 .cm-s-default .cm-link {color: #33f}
 
 /* Snippets */
 select {
    background-color: var(--background);
    color: var(--text);
    border-color: var(--border-dim);
 }
 
 #select_share_channels .lazy_filter_select .lfs_value .lfs_item.selected {
     color: var(--text);
 }
 
 .CodeMirror, .CodeMirror .CodeMirror-gutters, .CodeMirror-gutter {
    background-color: var(--background) !important;;
    border-color: var(--border-bright);
    color: var(--text);
 }
 
 .CodeMirror .CodeMirror-line {
    background-color: var(--background);
 }
 
 .CodeMirror-cursor {
    border-left-color: var(--text);
 }
 
 .CodeMirror-selected {
   background-color: rgba(255, 255, 255, 0.2) !important;
 }
 
 .modal div, .modal span, .modal label {
   color: var(--text);
 }
 
 .lazy_filter_select .lfs_list_container,
 .lazy_filter_select .lfs_list .lfs_item.active {
   background-color: var(--background-elevated);
 }
 
 .lfs_list::-webkit-scrollbar-track {
   display: none;
 }
 
 .lfs_list::-webkit-scrollbar-thumb {
    color: transparent !important;
    border: 1px solid var(--scrollbar-border) !important;
    background-color: transparent !important;
 }
 
 .c-input_character_count__characters-remaining {
     background-color: var(--background);
 }
 .c-dialog__footer .p-create_gdoc_dialog__footer_share_inputs, .c-dialog__footer .p-snippet_dialog__footer_share_inputs {
     color: var(--text);
 }
 
 /* profile */
 #fs_modal #fs_modal_footer {
    background-color:var(--background-elevated)
 }
 
 #contents_container::-webkit-scrollbar-track {
   display: none;
 }
 
 #contents_container::-webkit-scrollbar-thumb {
    color: transparent !important;
    border: 1px solid var(--scrollbar-border) !important;
    background-color: transparent !important;
 }
 
 /* scroll border fix */
 .client_channels_list_container {
    border-right: none;
 }
 
 .flex_pane_showing #col_flex {
    border-color: var(--border-dim);
 }
 
 /* setting menu fix */
 #fs_modal.prefs_modal .global_notification_block {
    background: transparent;
    border: none;
 }
 #fs_modal.prefs_modal .global_notification_block.selected {
    background: transparent;
    border: 1px solid var(border-bright);
 }
 .notification_example.mac {
   color: #555459; /* default color - leave unthemed */
 }
 .p-prefs_modal__radiogroup label.p-prefs_modal__radiogroup--selected {
     background: var(--background);
 }
 .p-prefs_modal__radiogroup .p-prefs_modal__radio_decorator {
     background-color: var(--background-elevated);
 }
 /* global jumper */
 ts-jumper, ts-jumper.active {
   background-color: rgba(32,32,32,0.6);
 }
 ts-jumper ts-jumper-container {
   box-shadow: 0 5px 20px rgba(0,0,0,1);
 }
 
 /* app badge */
 .c-app_badge, .c-app_label {
     color: var(--text-bright);
     background-color: var(--background-elevated);
 }
 
 /* tabs */
 .c-tabs__tab.c-tabs__tab--active, .c-tabs__tab:active, .c-tabs__tab:focus {
     color: var(--text);
 }
 
 /* modal content */
 .c-fullscreen_modal__header,
 .c-fullscreen_modal__content {
     background-color: var(--background-elevated);
 }
 .c-fullscreen_modal__back:hover, .c-fullscreen_modal__close:hover {
     background-color: var(--background-hover);
 }
 .c-fullscreen_modal__body {
     color: var(--text);
 }
 
 .ts_toggle .ts_toggle_secondary_label {
     color: var(--text);
 }
 /* modal transition */
 #fs_modal_bg, .fs_modal_bg {
     background: var(--background-elevated);
 }
 /* new search modal */
 .c-search_autocomplete footer,
 .c-search,
 .c-search__tabs,
 .c-search__input_box { background-color: unset; box-shadow: inset 0 -1px 0 0 var(--border-dim); }
 
 .c-search,
 .c-search__tabs,
 .c-search__input_and_close__close { color: unset; }
 .p-message_limit_banner {
     color: unset;
     background-color: unset;
 }
 .p-search_filter__title_text {
     background-color: var(--background);
 }
 .p-search_filter__dates {
     background-color: var(--background-elevated) !important;
 }
 .c-search_autocomplete__suggestion_content .c-channel_name .c-deprecated-icon, .c-search_autocomplete__suggestion_content .c-search_autocomplete__suggestion_icon, .c-search_autocomplete__suggestion_content .c-search_autocomplete__suggestion_text .filetype_description,
 .c-search_autocomplete__suggestion_content .c-search_autocomplete__suggestion_text .token
 { 
     color: var(--text);
 }
 
 .token {
     background-color: var(--background-elevated) !important;
 }
 .c-search_modal .popover>div { background-color: var(--background); }
 
 .c-search_autocomplete__suggestion_content {
     color: var(--text-bright);
 }
 .c-team__display-name, .c-unified_member__display-name, .c-usergroup__handle {
     color: var(--text);
 }
 
 .c-search_message__body {
     color: var(--text);
 }
 .p-search_filter__datepicker_trigger:hover {
     color: var(--text);
 }
 .c-input_select_options_list__empty_state {
     color: var(--text);
 }
 
 /* channel options */
 .channel_option_item .title {
     color: var(--text);
 }
 
 .channel_option_item:hover {
     background: var(--background-hover);
 }
 
 .channel_options_modal .c-fullscreen_modal__title {
     color: var(--text);
 }
 .c-fullscreen_modal__back:hover, .c-fullscreen_modal__close:hover {
     background-color: var(--background-hover);
     color: var(--text-bright);
 }
 /* channel invite */
 #channel_invite_modal #channel_invite_container:not(.keyboard_active).not_scrolling .channel_invite_row:not(.disabled):hover, #channel_invite_modal .channel_invite_row.highlighted:not(.disabled) {
     background: var(--background-hover);
 }
 
 .c-unified_member__secondary-name--medium {
     color: var(--text);
 }
 .channel_modal .btn_large {
     border: 1px solid;
 }
 #channel_invite_modal #channel_invite_container .channel_invite_row.disabled {
     background-color: var(--background-light);
 }
 /* channel browsing */
 #channel_browser .channel_browser_row_header {
     color: var(--text);
 }
 #channel_browser .channel_browser_divider {
     color: var(--text);
     background: var(--background-hover);
 }
 #channel_browser .channel_browser_row {
     background-color: var(--background);
 }
 #channel_browser #channel_list_container:not(.keyboard_active).not_scrolling .channel_browser_row:hover, #channel_browser .channel_browser_row.highlighted {
     background: var(--background-elevated);
     border-color: var(--border-dim);
 }
 .sk_black {
     color: var(--text);
 }
 .c-base_entity__metadata, .c-base_entity__subtext {
     color: var(--text-bright);
 }
 
 /* app browsing */
 .p-apps_browser__app_limit_meter b {
     color: var(--text);
 }
 .p-apps_browser__app_info {
     color: var(--text);
 }
 .p-apps_browser__app_limit_meter__blank_app_box {
     background-color: var(--background-hover);
 }
 .p-apps_browser__app--selected {	
     background: var(--background-hover);
 }
 /** menus **/
 
 .c-menu_item__header {
     background: var(--background-hover);
     color: var(--text);
 }
 
 .sidebar_menu_list_item {
     color: var(--text-bright);
 }
 
 .sidebar_menu_list_item:not(.is_active):hover {
     background-color: var(--background-elevated);
 }
 
 /* (message action) menu */
 .c-menu {
     background-color: var(--background-elevated);
     color: var(--text-bright);
     border: 1px solid var(--border-dim);
 }
 button:not(.c-menu_item__button--danger) > .c-menu_item__label {
     color: var(--text-bright);
 }
 .c-menu_item__button--danger .c-menu_item__description {
     color: var(--text);
 }
 .c-message_actions__container {
     background: var(--background-elevated);
 }
 hr.c-menu_separator__separator {
     border-color: var(--background-hover);
 }
 .c-message_actions__button:active {
     background: var(--background-hover);
     border-radius: .375rem;
 }
 
 /** menus end **/
 
 .c-menu_item__icon {
     color: var(--background-light);
 }
 .c-icon {
     color: var(--text);
 }
 /* sidebar in general */
 .p-flexpane_header {
     border-bottom: 1px solid var(--border-dim);
 }
 
 /* member detail view */
 #member_preview_scroller .member_data_table tr, #member_preview_web_container .member_data_table tr, #team_list .member_data_table tr, .menu_member_header .member_data_table tr {
     color: var(--text-bright);
 }
 #member_preview_scroller .member_details .member_name_and_presence .member_name, #member_preview_web_container .member_details .member_name_and_presence .member_name, .menu_member_header .member_details .member_name_and_presence .member_name, .menu_member_header .member_details .member_current_status, .menu_member_header .member_details .member_timezone_value {
     color: var(--text) !important;
 }
 .menu_member_header .member_details .member_current_status a, .menu_member_header .member_details .member_timezone_value a {
     color: var(--text-special);
 }
 
 .member_details_over_image {
     text-shadow: 0 0 8px var(--background);
 }
 
 .member_details_over_image .member_name {
     color: var(--background-light) !important;
 }
 
 /* workspace directory */
 .searchable_member_list_filter .faux_input {
     color: var(--text);
 }
 
 #member_preview_scroller .member_data_table .current_status_cell .current_status_container:not(.active) .current_status_cover.without_status_set .current_status_placeholder, .statuses_container .current_status_container:not(.active) .current_status_cover.without_status_set .current_status_placeholder {
     color: var(--text);
 }
 
 #member_preview_scroller .member_data_table a:not(.current_status_preset_option):not(.current_status_presets_edit_link):not(.member_details_manage_link), #member_preview_web_container .member_data_table a:not(.current_status_preset_option):not(.current_status_presets_edit_link):not(.member_details_manage_link), #team_list .member_data_table a:not(.current_status_preset_option):not(.current_status_presets_edit_link):not(.member_details_manage_link), .menu_member_header .member_data_table a:not(.current_status_preset_option):not(.current_status_presets_edit_link):not(.member_details_manage_link) {
     color: var(--text);
     font-weight: 400!important;
 }
 .p-member_profile_field__label {
     color: var(--text);
 }
 .p-member_profile_flexpane .p-member_profile_field {
     border-top-color: var(--background-hover);
 }
 /* snippet / file container / download bar */
 .c-snippet__code .CodeMirror-code>div:before {
     background-color: var(--background);
 }
 .c-file_container--gradient:after {
     background: linear-gradient(180deg,hsla(0,0%,100%,0),var(--background));
 }
 .c-file__title {
     color: var(--text);
 }
 .c-file_container, .c-file__slide--meta {
     background-color: var(--background-elevated);
 }
 .c-file_container {
     border: 1px solid var(--border-dim);
 }
 .c-file__action_button, .c-file__action_button:link, .c-file__action_button:visited {
     color: var(--text);
     background-color: var(--background);
 }
 .p-flexpane_header {
     background: var(--background);
 }
 .p-downloads_list__shift_hint {
     background: linear-gradient(180deg,hsla(0,0%,100%,0),var(--background)); 
 }
 .p-download_item {
     border: 1px solid var(--border-dim);
 }
 .p-download_item__container .p-download_item__name_row {
     color: var(--text);
 }
 .p-download_item__actions {
     background: var(--background-hover);
 }
 .c-message_attachment {
     color: var(--text-bright);
 }
 .c-message_kit__file__meta {
     color: var(--text);
 }
 .c-file_container--has_thumb .c-file__actions:before {
     background-image: none;
 }
 .c-pillow_file__swap .c-pillow_file__slide {
     background: var(--background);
 }
 .c-pillow_file__icon--slide:after {
     color: var(--background);
     border-color: var(--background);
 }
 .c-pillow_file__content--collapsed:after {
     background: linear-gradient(0deg,var(--background),hsla(0,0%,100%,0) 40px);
     border: 1px solid;
 }
 .c-pillow_file__snippet__content .CodeMirror-code>div:before {
     color: var(--text);
 }
 /* file drafts */
 ts-rocket, ts-rocket.post_body {
     color: var(--text);
 }
 
 .modal-backdrop {
     background: var(--background-elevated);
 }
 
 nav {
     background-color: var(--background-elevated);
 }
 
 /* calendar */
 .pickmeup  {
     background-color: var(--background-elevated);
 }
 
 .pmu-disabled {
     background: var(--background-elevated);
 }
 
 .pmu-days * { 
    border: 1px solid var(--border-dim);
 }
 /* history loading */
 .p-degraded_list__loading {
     background: var(--background-elevated);
 }
 /* scrollbar */
 .c-scrollbar__bar {
     background: var(--scrollbar-background);
     border: 1px solid var(--scrollbar-border);
 }
 /* actions */
 .c-button--outline {
     background: var(--background-elevated);
     color: var(--text);
 }
 .c-button--outline:active {
     background: var(--background-light);
     color: var(--text-bright);
 }
 .c-button--outline-primary {
     background: var(--background-elevated);
 }
 .c-message_attachment__pretext {
     color: var(--text);
 }
 .c-button--disabled {
     background-color: var(--background-light);
 }
 .c-select_button {
     background-color: var(--background-elevated);
 }
 .c-select_button:active {
     background-color: var(--background-hover);
 }
 /* dialogs */
 .c-dialog__header {
     background: var(--background-elevated);
 }
 .c-dialog__title {
     color: var(--text);
 }
 .c-dialog__content, .c-dialog__footer {
     background: var(--background);
 }
 .c-dialog__footer--overflow {
     border-top-color: var(--border-dim);
 }
 .c-dialog__cancel {
     background: var(--background-elevated);
 }
 /* unread message divider badge */
 .c-message_list__unread_divider__label {
     background: var(--background-elevated);
 }
 
 .c-message_list__unread_divider__separator {
     border-color: var(--background-bright);
 }
 
 /* message editor */
 .c-message__editor__input {
     background: var(--background-elevated);
 }
 .c-message--highlight, .c-message--highlight_yellow_bg {
     background: var(--background);
 }
 
 .c-message__editor__input--legacy {
     background-color: var(--background-elevated);
 }
 /* new filelist */
 #client-ui .file_list_item.file_list_item--redesign {
     border: 1px solid var(--border-dim);
 }
 #client-ui .file_list_item .monospace {
     color: var(--text);	
 }
 .c-pillow_file_container {
     background: var(--background);
 }
 .c-input_select {
     background: var(--background-elevated);
     color: var(--text);
 }
 .p-search_filter__dates, .p-search_filter .p-file_list__file_type_select, .p-search_filter__select .c-input_select {
     border: 1px solid var(--border-dim);
 }
 .p-file_list__filters {
     background: var(--background-elevated);
 }
 .p-file_list__file.c-pillow_file_container--full_width {
     border-color: var(--border-dim);
 }
 .c-pillow_file_container--full_width:focus, .c-pillow_file_container--full_width:focus-within, .c-pillow_file_container--full_width:hover {
     background-color: var(--background-elevated);
 }
 
 .c-action_buttons.c-file__actions {
     border-color: var(--border-dim);
 }
 .c-action_buttons__button {
     background-color: var(--background-elevated);
 }
 .c-action_buttons__button:focus {
     background-color: var(--background-hover);
 }
 .c-action_buttons__button:hover .c-action_buttons__icon {
     color: var(--text);
 }
 /* side lists */
 #client-ui .searchable_member_list .team_list_item:hover {
     background: var(--background-hover);
 }
 #client-ui .member_file_filter_menu .searchable_member_list_scroller .team_list_item .c-unified_member__name {
     color: var(--text);
 }
 .c-pillow_file__title {
     color: var(--text);
 }
 .active .tab_container .file_list_item {
     background-color: var(--background);
 }
 .c-pillow_file__description {
     color: var(--text-bright);
 }
 .c-input_select_options_list_container:not(.c-input_select_options_list_container--always-open)
 {
     background-color: var(--background);
     border-color: var(--border-dim);
 }
 .p-file_list__file_type_select .c-input_select__selected_value--placeholder {
     color: var(--text);
 }
 .c-input_select_options_list__option {
     color: var(--text);
 }
 #stars_scroller {
     background-color: var(--background);
 }
 .p-starred_item {
     border-bottom-color: var(--border-dim);
 }
 .p-file_flexpane--list {
     background-color: var(--background-elevated);
 }
 .p-activity_flexpane__item {
     border-bottom-color: var(--border-dim);
 }
 .p-activity_flexpane__top_anchor_hack_item {
     border-bottom-color: var(--border-dim);
 }
 /* whats' new */
 #whats_new_tab #whats_new_scroller {
     background: var(--background);
 }
 #whats_new_tab p {
     color: var(--text);
 }
 .indifferent_grey {
     color: var(--text)!important;
 }
 /* overriding indifferent grey here to highlight whats'new links */
 #whats_new_tab .indifferent_grey {
     color: var(--text-special)!important;
 }
 /* browse apps */
 .c-filter_input, .p-apps_browser__category_header {
     background: var(--background-elevated);
 }	
 .p-apps_browser__category_header {
     color: var(--text);
 }
 .charcoal_grey {
     color: var(--text) !important;
 }
 
 /* people mentioning */
 .tab_complete_ui .tab_complete_ui_header {
     background: var(--background);
 }
 .tab_complete_ui {
     background: var(--background-elevated);
 }
 .tab_complete_ui ul.type_members .unify_broadcast {
     color: var(--text);	
 }
 .c-mrkdwn__broadcast--mention, .c-mrkdwn__broadcast--mention:hover, .c-mrkdwn__highlight, .c-mrkdwn__mention, .c-mrkdwn__mention:hover, .c-mrkdwn__user_group--mention, .c-mrkdwn__user_group--mention:hover {
     background: var(--background-elevated);
 }
 .c-member_slug--mention, .c-member_slug--mention:hover {
     background: var(--background-hover);
 }
 
 /* message thumbs up */
 .c-reaction {
     background: var(--background);
     border: 1px solid var(--border-dim); 	
 }
 .c-reaction--reacted:hover {
     background: var(--background-elevated);
 }
 .c-reaction_add {
     background: var(--background);
 }
 .c-reaction_add:hover {
     background: var(--background-hover);
 }
 .c-reaction__count {
     color: var(--text-bright);
 }
 
 /* tooltips */
 .ts_tip .ts_tip_tip {
     color: var(--text);
 }
 
 /* "only visible to you" highlight */
 .c-message--ephemeral, .c-message--sli_highlight_negative {
     background: var(--background-hover);
 }
 
 /* "jump to.." */
 ts-jumper .p-jumper__help {
     background: var(--background);
 }
 
 /* share alert dialog */
 .c-alert--inline, .c-alert--nested_box {
     color: var(--text);
 }
 /* user groups */
 
 #user_groups_container .mention {
     background-color: var(--background-hover);
 }
 /* share channel */
 .p-file_details__share_channel {
     color: var(--text);
 }
 
 /* share message */
 .c-message_attachment__author--distinct {
     color: var(--text);
 }
 .c-message_attachment__author_name, .c-message_attachment__author_name.c-link--button, .c-message_attachment__author_name.c-link--button:active, .c-message_attachment__author_name.c-link--button:focus, .c-message_attachment__author_name.c-link--button:hover {
     color: var(--text);
 }
 
 /* 3.3.1 emoji picker */
 .c-menu.p-emoji_picker, .c-menu.p-emoji_picker div, .c-menu.p-emoji_picker h3 {
     background: var(--background);
 }
 .p-emoji_picker__group_tab--active {
     background: var(--background-elevated);
 }
 .p-emoji_picker__content:hover .p-emoji_picker__skintone_btn_container {
     border-color: var(--border-dim);
     background-color: var(--background);
 }
 
 /* 3.3.1 body part */
 #client_body:not(.onboarding):not(.feature_global_nav_layout):before {
     background: var(--background);
     box-shadow: none;
     content: none;
 }
 /* 3.3.1 search modal */
 .c-search_modal:not(.c-search_modal--primarysearch) .c-search__input_box {
     background: var(--background);
 }
 .c-search__input_and_close {
     border-bottom: 1px solid var(--border-dim);
 }
 .c-search_autocomplete__suggestion_item {
     color: var(--text);
 }
 .p-message_limit_banner__graphic .c-icon--eye-closed {
     color: var(--text);
 }
 .c-search_filter_section__title:after {
     border-bottom-color: var(--border-dim);
 }
 .token {
     color: var(--text-bright) !important;
 }
 /* notification muter */
 .channel_prefs_body__section_header_title {
     color: var(--text);
 }
 .channel_prefs_notifications_table {
     color: var(--text);
 }
 .notification_prefs_icon:before {
     color: var(--text);
 }
 .channel_prefs__muting_checkbox_label:not(.subtle_silver) {
     color: var(--text) !important;
 }
 /* message dialogs */
 .c-message__sender {
     color: var(--text);
 }
 .c-message--standalone {
     border: 1px solid var(--border-dim);
 }
 /* message not allowed */
 #msg_input_message {
     background-color: var(--bacground-elevated);
 }
 
 .internal_im_link,
 .c-button.c-button--outline {
     color: var(--text) !important;	
     border-color: var(--border-dim);
 }
 
 /* unread counter */
 .p-channel_sidebar__channel--unread:not(.p-channel_sidebar__channel--muted):not(.p-channel_sidebar__channel--selected) .p-channel_sidebar__name {
     color: var(--primary) !important;
 }
 
 /* help modal */
 .p-help_modal__footer {
     background-color: var(--background);
 }
 .p-help_modal__list__item:focus, .p-help_modal__list__item:hover, .p-help_modal__list__item__focus {
     background: var(--background-hover);
     border: 1px solid var(--border-dim);
 }
 
 /* App channel */
 .channel_header .channel_header__tabs .channel_header__tab.--active {
     color: var(--text);
 }
 .channel_header .channel_header__tabs .channel_header__tab:hover {
     color: var(--background-light);
 }.p-app_space {
     background-color: var(--background-elevated);
 }
 .p-app_space_profile__info {
     background-color: var(--background-elevated);
 }.p-app_space__header {
     color: var(--text);
 }
 
 /* file upload */
 .p-multi_file_upload__container .p-galler_scroller__wrapper {
     background: var(--background);
 }
 .c-pillow_file {
     background: var(--background-elevated);
 }
 .c-dialog__footer .p-file_upload_dialog__footer_share_inputs {
     color: var(--text);
 }
 
 /* option list */
 
 .c-select_options_list__wrapper {
     background-color: var(--background-elevated);
     border: 1px solid var(--border-dim);
 }
 .c-select_options_list__option {
     color: var(--text);
 }
 
 ::-webkit-scrollbar {
     width: 12px;
     background: var(--scrollbar-background);
 }
 
 /** Slack 4 **/
 strong {
     color: var(--text) !important;
 }
 .c-alert--boxed {
     color: var(--text);
 }
 .c-multi_select_input {
     background-color: var(--background-elevated);
 }
 .c-token {
     background-color: var(--background);
 }
 .c-fullscreen_modal__content--with_footer .c-fullscreen_modal__footer {
     background-color: var(--background);
 }
 
 .p-classic_nav {
     background-color: var(--background);
 }
 
 .p-file_drag_drop__container {
     background-color: var(--background);
 }
 
 .p-workspace__input .p-message_input_field {
     background-color: var(--background);
     border-color: var(--border-dim);
 }
 .p-classic_nav__model__title__info.p-classic_nav__no_drag {
     color: var(--text);
 }
 .p-classic_nav__team_header {
     background-color: var(--background-elevated);
 }
 .p-team_sidebar__icon--active, .p-team_sidebar__icon--active:hover {
     box-shadow: 0 0 0 3px rgb(19,30,39), 0 0 0 6px var(--border-dim);
 }
 .c-menu_item__link_icon, .c-menu_item__shortcut {
     color: var(--text-bright);
 }
 .p-classic_nav__model__title__info__topic--focus-within .p-classic_nav__model__title__info__topic__text:before, .p-classic_nav__model__title__info__topic:hover .p-classic_nav__model__title__info__topic__text:before {
     background: var(--background-elevated);
 }
 .p-classic_nav__model__title__name--dim {
     color: var(--text);
 }
 .p-message_pane__foreword__description, .p-message_pane__limited_history_alert {
     color: var(--text);
 }
 
 /* sidebars default in general */
 .p-workspace--classic-nav .p-workspace__secondary_view {
     background-color: var(--background);
     border-color: var(--border-dim);
 }
 
 /* channel detail view */
 .p-channel_details_section.p-channel_details__channel_details_section {
     background-color: var(--background-elevated);
 }
 .p-channel_details__heading {
     color: inherit;
 }
 .p-channel_details__created_link, .p-channel_details__created_link:hover {
     color: inherit;
 }
 .c-message_kit__pillow {
     background-color: var(--background-elevated);
 }
 @keyframes fade-background-highlight 
 { 
     0% { background: var(--background-light); }
   100% { background: transparent; } 
 }
 .p-highlights_section__group_title_line {
     border-color: var(--border-dim);
 }
 .p-highlights_section__group_title_label {
     background-color: var(--background-elevated);
 }
 .p-classic_nav__right__search__placeholder {
     color: var(--text);
 }
 .p-pinned_items__empty_list .p-pinned_items__empty_list_action {
     color: var(--text);
 }
 
 /* create channel */
 .p-channel_create_modal__label_title {
     color: var(--text);
 }
 .p-channel_create_modal, .p-channel_create_modal__label_title, .p-channel_create_modal__private_toggle_copy_body, .p-channel_create_modal__private_toggle_copy_title, .p-channel_create_modal__share, .p-channel_name_input__label_title, .p-invite_users_input__label_title {
     color: var(--text);
 }
 .p-channel_create_modal__input_subtext {
     color: var(--text);
 }
 .p-invite_users_input__input_subtext {
     color: var(--text);
 }
 .c-toggle__input {
     background-color: var(--background-light);
 }
 
 /* workspace directory */
 .p-member_directory__member_row {
     background-color: var(--background-elevated);
     border-color: var(--border-dim);
 }
 .p-member_directory__member_row:focus, .p-member_directory__member_row:focus-within, .p-member_directory__member_row:hover {
     background-color: var(--background-hover);
 }
 /* autocomplete lists */
 .c-texty_autocomplete {
     background-color: var(--background-elevated);
 }
 .c-texty_autocomplete__result_highlight {
     background-color: var(--background);
 }
 /* new post */
 .p-docs_header {
     background-color: var(--background);
 }
 .meta-info-text {
     color: var(--text);
 }
 
 .c-sk-modal {
     background-color: var(--background);
 }
 .c-sk-modal_header {
     background-color: var(--background);
 }
 .c-sk-modal_content {
     background-color: var(--background);
 }
 .c-sk-modal_footer {
     background-color: var(--background);
 }
 /* tooltips */
 .c-tooltip__tip {
     color: var(--text);
 }
 .p-classic_nav__tip_shortcut, .p-classic_nav__tip_sub {
     color: var(--text-bright);
 }
 /* team context menu */
 .c-menu_item__button, .c-menu_item__button:link, .c-menu_item__button:visited {
     color: var(--text);
 }
 text.p-classic_nav__team_messages_progress_bar_text {
     fill: var(--text);
 }
 .p-shared_channels_team_menu_item__label--new {
     background-color: var(--background-hover);
 }