/* ==UserStyle==
@name           Microsoft Teams Babey Cleanup
@namespace      teams.microsoft.com
@version        1.0.0
==/UserStyle== */

@-moz-document domain(teams.microsoft.com) {

/* ########### LEFT LIST SIDEBAR GENERAL ##########  */

/* rules here are "standard" desktop and also override the 1350+px breakpoint due to specificity */
@media (min-width:965px) {
    /* left rail should always be "full" width */
    .app-left-rail-width,
    .app-rail-common>div,
    .fullscreen-layout .ts-left-rail-wrapper,
    .left-rail-item,
    .ts-left-rail-wrapper {width:32rem;}
    
    /* adjust team "more actions" popup to display over the artificial first column */
    .popover.leftrail-override-position[tam-team-id] {left:17.2rem!important;}

    /* adjust channel "more actions" popup to account for wide mode */
    .popover.leftrail-override-position {left:34.4rem!important;}
}




/* ########### LEFT LIST SIDEBAR (Teams Pane) ####### */

/* channel list top header */
.ts-channel-list .ts-tree-header {margin-top:0;}

/* per-team wrapper */
.ts-channel-list .team.match-parent {margin-bottom:0;border-top:1px solid rgba(128,128,128,0.2);}

/* per-team grid arrangement */
.ts-channel-list .team.match-parent .team {width:100%;position:relative;min-height:2.4rem;padding-left:45%;}
.ts-channel-list .team.match-parent .team .channel-list-team-header {position:absolute;width:45%;left:0;top:0;}
.ts-channel-list .team.match-parent .team .channels {position:relative;}

/* per-team header */
.ts-channel-list .channel-list-team-header {height:auto;padding-top:0;padding-bottom:0;}
.ts-channel-list .channel-list-team-header > a {height:auto;padding-top:0.2rem;padding-bottom:0.2rem;padding-left:0.8rem;padding-right:0.2rem!important;}
.ts-channel-list .channel-list-team-header .team-icon {display:none;height:2.2rem;width:2.2rem;border-radius:0;}
.ts-channel-list .channel-list-team-header .header-text.truncate {padding-right:0;margin-top:0;font-size:1.1rem;line-height:2.0rem;}
.ts-channel-list .channel-list-team-header:hover .header-text.truncate {padding-right:2.2rem;}

/* per-team header expander/collapser arrow */
.channel-list-team-header .expand-collapse-icon-teams {display:none;width:2.2rem;height:2.2rem;padding-top:0;padding-bottom:0;left:0;top:0.2rem;opacity:1.0;}
.channel-list-team-header .expand-collapse-icon-teams .app-svg {width:2.2rem;height:2.2rem;}

/* per-team "more actions" collapsed icon */
.channel-list-team-header .icons-more {width:2.2rem;height:2.2rem;position:absolute;top:.2rem;right:.2rem;}
.channel-list-team-header .icons-more .app-svg {width:2.2rem;height:2.2rem;}

/* per-team "more actions" ellipsis hover toggler */
.channel-list-team-header .team-more-btn.icons-more {display:none;}
.channel-list-team-header:hover .team-more-btn.icons-more {display:block;}



/* per-channel item */
.ts-channel-list a.channel-anchor {height:2.4rem;padding-top:.2rem;padding-bottom:.2rem;padding-left:.4rem;padding-right:1.2rem;font-size:1.4rem;line-height:2.0rem;}
.ts-channel-list a.channel-anchor .name-channel-type .truncate {padding-right:0;}
.ts-channel-list a.channel-anchor:hover .name-channel-type .truncate {padding-right:2.2rem;}

/* per-channel "more actions" collapsed icon */
.ts-channel-list .channels .icons-more {width:2.2rem;height:2.2rem;position:absolute;top:.2rem;right:1.2rem;}
.ts-channel-list .channels .icons-more .app-svg {width:2.2rem;height:2.2rem;}

/* per-channel "more actions" ellipsis hover toggler */
.ts-channel-list a.channel-anchor .icons-more {display:none;}
.ts-channel-list a.channel-anchor:hover .icons-more {display:block;}

/* per-channel "favorite" icon */
.ts-channel-list .show-fav-icon {margin:0;width:2.2rem;height:2.2rem;}
.ts-channel-list .show-fav-icon .app-svg {width:2.2rem;height:2.2rem;}

/* per-channel "important" icon */
.ts-channel-list .important-icon {margin:0;width:2.2rem;height:2.2rem;}
.ts-channel-list .important-icon .app-svg {width:2.2rem;height:2.2rem;}

/* per-channel "more channels" row */
.ts-channel-list .open-channel-mgr .channel-list-show-icon-on-hover {width:2.2rem;height:2.2rem;}
.ts-channel-list .open-channel-mgr .channel-list-show-icon-on-hover .app-svg {width:2.2rem;height:2.2rem;top:.2rem;}


/* channel list bottom actions bar */
.ts-channel-list:not(.popover)>.simple-scrollbar {height:calc(100vh - 9.6rem);margin-bottom:3.6rem;}
.ts-channel-list .team-operations-container {padding-top:0.2rem;padding-bottom:0.2rem;}



/* ########### MAIN CONTENT VIEWPORT (Teams Pane) ########## */

/* ensure messages/input span full width of viewport */
.message-list-common:not(.chat-style) .ts-message-list-container,
.message-list-common:not(.chat-style) virtual-repeat > .list-wrap > .item-wrap,
.ts-add-message.is-not-chat .ts-new-message {max-width:none;}

/* normalize "date dividers" (previously used negative margins) */
.message-list-common:not(.chat-style) .message-list-divider.date-separator {height:auto;margin-top:0;}

/* shrink vertical space around each thread */
.message-list-common:not(.chat-style) thread .ts-message {padding-top:.2rem;padding-bottom:.2rem;}

/* adjust thread shadow to fit new spacing */
.message-list-common:not(.chat-style) thread .ts-message::before {top:.2rem;bottom:.2rem;box-shadow:0 0 .4rem -0.1rem rgba(128,128,128,0.4);}

/* make "see more" area taller to prevent overlay issues */
.message-list-common:not(.chat-style) .ts-see-more-button {height:auto;padding-bottom:1.2rem;}

/* per-thread "reply section" spacing shrinkage */
.message-list-common:not(.chat-style) .thread-action-reply-message {margin-bottom:0;}
.message-list-common:not(.chat-style) .ts-reply-message .icons-reply.ts-sym {height:auto;}

/* relocate reply button for threads with no replies */
.message-list-common:not(.chat-style) .ts-message:not(.has-replies):not(.reply-is-visible) .thread-action-reply-message {visibility:hidden;width:auto;padding-left:0;position:absolute;bottom:-1.4rem;left:6.8rem;}
.message-list-common:not(.chat-style) .ts-message:not(.has-replies):not(.reply-is-visible) .thread-action-reply-message .icons-reply.ts-sym {height:2.2rem;padding:0 1rem 0 0;border:1px solid rgba(128,128,128,0.20);border-radius:.3rem;cursor:pointer;}
.message-list-common:not(.chat-style) .ts-message:not(.has-replies):not(.reply-is-visible) .thread-action-reply-message .icons-reply.ts-sym svg {width:2.2rem;height:2.2rem;}
.message-list-common:not(.chat-style) .ts-message:not(.has-replies):not(.reply-is-visible) .thread-action-reply-message .icons-reply.ts-sym span {display:none;}
.message-list-common:not(.chat-style) .ts-message:not(.has-replies):not(.reply-is-visible) .thread-action-reply-message .icons-reply.ts-sym::after {content:"Reply (Start Thread)";display:inline-block;position:relative;top:-.7rem;cursor:pointer;}

/* show hidden reply button when we hover =) */
.message-list-common:not(.chat-style) .ts-message-list-item:hover .ts-message:not(.has-replies):not(.reply-is-visible) .thread-action-reply-message {visibility:visible;}

/* allow display overflow items to show when we mouseover a thread with no replies */
.message-list-common:not(.chat-style) .ts-message-list-item:hover {overflow:visible;z-index:100;}








/* ########### LEFT LIST SIDEBAR (Chat Pane) ####### */

/* chat list vertical item spacing */
.chat-list .recipient-group-list-item {height:auto;}
.chat-list .recipient-group-list-item a {height:auto;}
.chat-list .recipient-group-list-item a.cle-item {grid-template-rows:2.6rem auto;}
.chat-list .recipient-group-list-item:hover .cle-action {margin-bottom:0;grid-row:1;grid-column:6;}
.chat-list .left-rail-item-hover.menu-open {height:auto;}

/* chat list basic content */
.chat-list .cle-title {margin:0;}
.chat-list .cle-timestamp {margin:0;}
.chat-list .cle-preview {display:none;}
.chat-list .cle-action {grid-row:auto;height:2.2rem;width:2.2rem;margin-bottom:0;}
.chat-list .cle-action .app-svg {width:2.2rem;height:2.2rem;}

/* chat list unread indicator */
.chat-list .left-rail-unread::before {width:1rem;height:1rem;top:0.83rem;background:#e97548;}

/* chat list avatar/status icons */
.chat-list .cle-avatar {width:2.6rem;height:2.6rem;}
.chat-list .cle-avatar .profile-img-parent {display:none;}
.chat-list .cle-avatar .ts-skype-status {width:100%;top:.3rem;text-align:center;}

.chat-list .group-chat-icon,
.chat-list .meeting-chat-icon,
.chat-list .mute-chat-icon,
.chat-list .new-chat-icon {width:2.2rem;height:2.2rem;top:.2rem;}

.chat-list .group-chat-icon .app-svg,
.chat-list .meeting-chat-icon .app-svg,
.chat-list .mute-chat-icon .app-svg,
.chat-list .new-chat-icon .app-svg {width:2.2rem;height:2.2rem;}

/* chat list markers (right side) */
.chat-list .cle-markers {grid-row:1;grid-column:5;margin:.3rem 0 0 0;}
.chat-list .cle-marker {grid-template-rows:2.2rem;}


/* ########### MAIN CONTENT VIEWPORT (Chat Pane 2019) ########## */

/* ensure message content spans full width of viewport */
.chat-style .ts-message-list-container,
.chat-style virtual-repeat > .list-wrap > .item-wrap,
.ts-add-message .ts-new-message {max-width:none;}

/* align self-chats to the left */
.chat-style .self .ts-message-thread-body {padding-left:4.2rem;justify-content:normal;}
.chat-style tombstone .self {justify-content:normal;}

/* "other person" icon next to messages */
.chat-style .thread-body > .media-left {padding-top:.2rem;padding-bottom:0;}
.chat-style .ts-message .thread-body-status > .ts-skype-status {top:1.9rem;}



/* ---- BEGIN per-message spacing-ish ------ */

/* strip background bubbles */
.chat-style .message-body {background-color:transparent;}
.chat-style .self .message-body {background-color:transparent;}

/* padding above message where sender is different than previous message */
.chat-style thread .ts-message {padding-top:.4rem;margin-top:.4rem;border-top:1px solid rgba(128...