﻿#filterContainer {
    position: relative;
}

#threadContainer {
    position: relative;
    overflow: visible;
    border: 1px solid transparent;
}

#threadHeader {
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex-align: baseline;
    align-items: baseline;
    padding: 1px 5px;
    background-color: transparent;
    border: 1px solid transparent;
    color: fuchsia; /*[{Environment-CommandBarTextInactive-Background}]*/
}

    #threadHeader:enabled {
        color: lawngreen; /*[{Environment-CommandBarTextActive-Background}]*/
    }

        #threadHeader:enabled:hover {
            border-color: lawngreen; /*[{Environment-CommandBarBorder-Background}]*/
            background-color: fuchsia; /*[{DetailsView-CommandBarMouseOverBackground-Background}]*/
            color: lawngreen; /*[{Environment-CommandBarTextHover-Background}]*/
        }

        #threadHeader:enabled:active {
            background-color: fuchsia; /*[{Environment-CommandBarMouseDownBackgroundBegin-Background}]*/
            color: lawngreen; /*[{Environment-CommandBarTextMouseDown-Background}]*/
            border-color: fuchsia; /*[{Environment-CommandBarBorder-Background}]*/
        }

        #threadHeader:enabled.notDefault {
            border-color: lawngreen; /*[{Environment-CommandBarSelectedBorder-Background}]*/
            background-color: fuchsia; /*[{Environment-CommandBarSelected-Background}]*/
            color: lawngreen; /*[{Environment-CommandBarTextHover-Background}]*/
        }

            #threadHeader:enabled.notDefault:hover {
                border-color: lawngreen; /*[{Environment-CommandBarHoverOverSelectedIconBorder-Background}]*/
                background-color: fuchsia; /*[{DetailsView-CommandBarHoverOverSelected-Background}]*/
                color: lawngreen; /*[{Environment-CommandBarTextHoverOverSelected-Background}]*/
            }

        /* reset the default IE button:active animation */
        #threadHeader:enabled:active * {
            position: relative;
        }

    #threadHeader:disabled > .icon svg .icon-vs-bg {
        fill: fuchsia; /*[{Environment-CommandBarTextInactive-Background}]*/
    }

    #threadHeader:disabled > .icon svg .icon-vs-out {
        fill: transparent;
    }

#threadFlyout {
    position: absolute;
    right: 0px;
    overflow: auto;
    display: -ms-grid;
    visibility: hidden;
    z-index: 9999;
    border: 1px solid black; /*[1px solid {Environment-CommandBarMenuBorder-Background}]*/
    background-color: aquamarine; /*[{Environment-CommandBarMenuBackgroundGradientBegin-Background}]*/
    color: fuchsia; /*[{Environment-CommandBarTextActive-Background}]*/
    -ms-grid-row: 2;
    margin-top: -1px;
}

    #threadFlyout > * {
        display: inline-block;
    }

    #threadFlyout.flyoutActive {
        visibility: visible;
    }

#jmcView {
    -ms-grid-row: 1;
    padding: 3px 6px;
}

#nativeFoldingView {
    -ms-grid-row: 2;
    padding: 3px 6px;
}

#asyncView {
    -ms-grid-row: 3;
    padding: 3px 6px;
}

    #jmcView.hasFocus, #asyncView.hasFocus, #nativeFoldingView.hasFocus {
        background-color: lightgreen; /*[{SearchControl-PopupControlMouseOverBackgroundGradientBegin-Background}]*/
        color: black; /*[{SearchControl-PopupCheckboxMouseDownText-Background}]*/
    }

#jmcIcon, #asyncIcon, #nativeFoldingIcon {
    background-repeat: no-repeat;
}

    #jmcIcon svg, #asyncIcon svg, #nativeFoldingIcon svg {
        vertical-align: middle;
    }

#threadFilterHeader {
    -ms-grid-row: 4;
    margin: 3px 0px;
    padding: 0px 8px;
}

#threadFilterList {
    -ms-grid-row: 5;
    list-style-type: none;
    /* This value will be changed in javascript so that it always fits in the window */
    max-height: 0px;
    /* We supply a min height in case the user makes the window super small, in that case they will see it clip */
    min-height: 2em;
    overflow-y: scroll;
    margin: 0px;
    padding: 0px;
}

    #threadFilterList > li {
        white-space: nowrap;
        margin: 3px 0px;
        padding: 0px 20px 0px 6px;
    }

        #threadFilterList > li.hasFocus {
            background-color: lightgreen; /*[{SearchControl-PopupControlMouseOverBackgroundGradientBegin-Background}]*/
            color: black; /*[{SearchControl-PopupCheckboxMouseDownText-Background}]*/
        }

#threadFilterFooter {
    -ms-grid-row: 6;
    -ms-grid-column-align: end;
    padding: 9px 9px;
}

    #threadFilterFooter > button {
        margin-left: 3px;
    }

        #threadFilterFooter > button:active {
            background-color: fuchsia; /*[{Environment-CommandBarMouseDownBackgroundBegin-Background}]*/
            color: lawngreen; /*[{Environment-CommandBarTextMouseDown-Background}]*/
        }

    /* reset the default IE button:active animation */
    #threadFilterFooter button:active * {
        position: relative;
    }
