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: #6bc0d0;
   --text: #d6dce6;
   --background: #282A2E;
   --background-elevated: #323844;

   /* These should be less important: */
   --background-hover: rgba(0, 0, 0, 0.1);
   --background-light: #AAA;
   --border-bright: rgba(0, 0, 0, 0.35);

   --border-dim: #15171b;
   --border-bright: rgba(0, 0, 0, 0.36);

   --text-bright: #FFF;
   --text-special: var(--primary);

   --scrollbar-background: #000;
   --scrollbar-border: var(--primary);
}

h1, h2, h3, h4 {
  color: var(--text);
}

/* left scrollbar */
.TeamSidebar, .TeamSidebar .StoplightContainer, .TeamSidebar .TeamSidebar-addArea {
   background-color: var(--background) !important;
   box-shadow: var(--background) 1px 1px 25px;
   z-index: 1;
}

.TeamSidebarItem.unreads .TeamSidebarItem-indicator {
   background-color: var(--primary) !important;
   opacity: 1;
}

.TeamSidebarItem-unreadHighlights {
   background-color: var(--border-bright) !important;
   color: var(--text-bright) !important;
}

#msgs_scroller_div::-webkit-scrollbar-track, #client_body::before, .client_container,
#search_terms, #client_body, #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{
  background: var(--background)  !important;
}

#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 {
  border-bottom: 1px solid 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_container .day_divider .day_divider_label, .day_divider .day_divider_label,
#convo_container .convo_flexpane_divider .reply_count {
  color: var(--text) !important;
  background-color: var(--background-elevated) !important;
  border: 1px solid var(--border-bright) !important;
  border-radius: 1rem;
}
#convo_container .convo_flexpane_divider .reply_count {
   border-radius: 10px;
   padding: 0px 10px;
}

.mention_day_container_div .day_divider:before {
   background-color: transparent !important;
}

.day_container .day_msgs {
  border-top: 1px solid var(--border-dim) !important;
}

textarea, input[type="text"], #file_comment_textarea {
   background-color: var(--background) !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;
   padding-right: 20px !important;
   border-left: 1px solid transparent !important; /* reserve space for hover */
   border-right: 1px solid transparent !important;
}

ts-message:hover {
   background: var(--background-hover) !important;
   /*border: 1px solid var(--border-bright) !important*/
}

/*#msgs_unread_divider + ts-message:hover, ts-message:first-child {
  margin-top: 1px !important;
}
ts-message:last-child {
  margin-bottom: 1px !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,
#team_menu,
#col_channels,
#col_channels_footer,
pre,
ts-message .action_hover_container .btn_msg_action,
#messages_container.has_top_messages_banner:before,
.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,
#flex_contents .heading,
#flex_contents .heading a,
#flex_contents .subheading,
.search_result_with_extract,
#search_filters a,
.menu,
.menu #menu_items_scroller,
.btn_outline {
  background: var(--background-elevated) !important;
}

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{
  color: var(--text) !important;
  border-color: 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 #555 !important;
}

.ql-placeholder {
   color: var(--text);
}

.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);
}

.comment .mention, .feature_name_tagging_client .comment .mention, .feature_name_tagging_client ts-message .mention, ts-message .mention,
span.match {
  border: 1px solid var(--border-bright);
  background-color: var(--background-elevated) !important;
  padding: 2px 4px;
  margin: 2px;
  border-radius: 10px;
}

.mention > .mention {
   /* I'm assuming this is a Slack bug */
   border: none;
}

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) !important;
}
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;
}

.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;
  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-bright))
                   drop-shadow(-1px  0 0 var(--background-bright))
                   drop-shadow(-0  1px 0 var(--background-bright))
                   drop-shadow( 0 -1px 0 var(--background-bright));
   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 {
   background: transparent;
   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;
}

/* channel list */
body .channels_list_holder ul li {
  height: 1.8rem !important;
  border-radius: 0 15px 15px 0;
}

body .channels_list_holder ul li .primary_action {
   border: 1px solid rgba(0, 0, 0, 0.01) !important;
   background-color: transparent !important;
}

/*body #channels_scroller.show_which_channel_is_active ul li.active .primary_action {*/
li.active {
   background-color: var(--background) !important;
   border: solid var(--border-bright);
   border-width: 1px 1px 1px 0;
}

.im_name_background {
   display: none;
}

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;
}

body .channels_list_holder ul li:hover {
   background-color: var(--background-hover);
   border-color: var(--border-dim) !important;
}

/* threads */
ts-message .reply_bar:hover {
  background: var(--background) !important;
  border: 1px solid var(--border-dim) !important;
}

/* 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);
}

#archives_return, .messages_banner {
   color: var(--text);
   background-color: var(--background-elevated);
   border: 1px solid var(--border-bright);
   border-bottom: 0px;
   border-radius: 10px 10px 0 0;
}

/* preferences page */
#fs_modal, .modal, .modal-header, .modal-footer {
   background-color: var(--background-elevated);
}

#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);
}


/* 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);
}

.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;
}

/* 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;
}

/* 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 */
}

/* 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);
}

/* Custom */
.p-channel_sidebar__name {
    color: #aab1be;
}
.p-channel_sidebar__badge, .p-channel_sidebar__banner--mentions {
    background: #759633;
}
.day_container .day_divider .day_divider_label, .day_divider .day_divider_label, #convo_container .convo_flexpane_divider .reply_count {
    border: 1px solid #15171b;
}
.divider_label {
    color: #e0224c;
}
.feature_name_tagging_client .app_preview_link_slug, .feature_name_tagging_client .internal_member_link, .feature_name_tagging_client .internal_user_group_link, .feature_name_tagging_client ts-mention {
    background-color: #282a2e !important;
    color: #aadbe4 !important;
}
.app_preview_link_slug, .internal_member_link, .internal_user_group_link, ts-mention {
    background: #363a4c;
    color: #0576b9;
}
.comment .mention, .feature_name_tagging_client .comment .mention, .feature_name_tagging_client ts-message .mention, ts-message .mention, span.match {
    border: 1px solid var(--border-bright);
    background-color: #473467 !important;
    color: #d2b9ff !important;
}
#client_body:not(.onboarding):before, .channel_header, #col_messages, #footer {
    box-shadow: none;
}
#threads_msgs_scroller_div {
    font-size: 15px;
    background: #1f2126;
    height: calc(100% - 16px);
    margin-top: 8px;
    overflow-y: scroll;
}
ts-thread {
    background: #1f2126;
}
ts-thread .thread_messages {
    background: #1f2126;
    border: 1px solid #131417;
}
#threads_msgs_scroller_div .threads_caught_up_divider .divider_label {
    background: #282a2e;
    color: #a4abb8;
}
.reply_input_container .ql-container {
    background-color: #1f2126;
    border: 1px solid #282a2e;
}
.feature_name_tagging_client #edit_topic_inner:before {
    background: #1f2126;
    border: 1px solid #1c1e21;
}
ts-message:hover:not(.standalone):not(.multi_delete_mode):not(.highlight):not(.new_reply) {
    background: #F9F9F9;
    box-shadow: none;
}
#msgs_div .unread_divider.no_unreads hr {
    border-top-color: #631c2b !important;
}
.p-emoji_picker__footer {
    background: #323844;
}
.p-emoji_picker__group_tab--active {
    background: #282a2e;
}
.p-emoji_picker__group_tab:hover {
    background: #141619;
}
.p-emoji_picker__preview_text {
    background: #323844;
    color: #d2d8e2;
}
.p-emoji_picker__content:hover .p-emoji_picker__skintone_btn_container {
    border: 1px solid #3c4556;
    background: #282a2e;
}
#flex_contents .heading_text {
    color: #d6dce6;
}
.c-scrollbar:hover .c-scrollbar__bar, .c-scrollbar__bar:active {
    opacity: 0.25;
}
.feature_name_tagging_client .rxn.user_reacted .emoji_rxn_count {
    color: #35a3e4;
}
.feature_name_tagging_client .rxn.user_reacted {
    border-color: rgb(5, 118, 185) !important;
}
.flex_pane_showing #col_flex {
    border-left: none;
}
#convo_container .convo_flexpane_divider, #file_preview_scroller .convo_flexpane_divider {
    color: #717274;
    border-top: 1px solid #282a2e;
}
#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 {
    color: #b0b5be;
}
#edit_topic_inner:before {
    background: #222327;
}
.lazy_filter_select.single.filter_in_list_style .lfs_list_container .lfs_item, .lazy_filter_select.single.filter_in_list_style .lfs_value .lfs_item {
    color: var(--text);
}
.c-member__display-name, .c-team__display-name, .c-usergroup__handle {
    color: var(--text);
}
#details_tab .feature_sli_channel_insights .channel_created_section .creator_link, #details_tab .feature_sli_channel_insights .channel_purpose_section .channel_purpose_text {
    color: var(--text);
}
.channel_prefs__muting_checkbox_label:not(.subtle_silver) {
    color: var(--text) !important;
}
.highlight_yellow_bg {
    background-color: #495e5f !important;
    box-shadow: inset 2px 0 0 0 #a4d02c;
    padding-left: 10px;
}
#channel_browser .channel_browser_row_header {
    color: var(--text);
}
#channel_browser .channel_browser_creator_name {
    color: var(--text);
}
#footer_archives_preview {
    background-color: #333944;
    border-top: 1px solid #495467;
}
.c-archive_footer__title {
    color: var(--text);
}
#message_edit_container .message_input {
    background: #373944;
}
#edit_topic_inner:before {
    background: #1f2025;
}
.app_preview_link_slug, .internal_member_link, .internal_user_group_link, ts-mention {
    background: #202227;
}
.email_container.email_reset .email_inline_collapsed_content .email_header .file_header_meta,
.email_container.email_reset .email_inline_collapsed_content .email_header .file_header_title,
.file_container .email_content,
.email_container.email_reset .email_header .email_header_meta,
.email_container.email_reset .email_header .email_header_title,
{
    color: var(--text);
}
#msgs_div .unread_divider .divider_label, #unread_msgs_div .unread_divider .divider_label {
    background: #292a2f;
    color: #e0224c;
}
#msgs_div .unread_divider.no_unreads .divider_label {
    background: #292a2f !important;
    color: #631c2b !important;
}
.app_preview_link_slug:hover, .internal_member_link:hover, .internal_user_group_link:hover, ts-mention:hover {
    background: #373944;
}