#toolSelectionControl {
    overflow: visible;
    display: -ms-inline-grid;
    -ms-grid-rows: auto 0px;
}

#toolSelectionDropdown {
    position: relative;
    -ms-grid-row: 1;
    padding-left: 4px;
}

    #toolSelectionDropdown.flyoutActive {
        border: 1px solid magenta; /*[1px solid {Environment-CommandBarMenuBorder-Background}]*/
        color: fuchsia; /*[{Environment-CommandBarTextActive-Background}]*/
        background-color: aquamarine; /*[{Environment-CommandBarMenuBackgroundGradientBegin-Background}]*/
        /* Since we are hiding the bottom border we add 1px of margin so we don't change the element height */
        border-bottom-style: hidden;
        margin-bottom: 1px;
    }

    #toolSelectionDropdown > .button-image {
        background-repeat: no-repeat;
        height: 1.333em;
        width: 1.333em;
    }

#toolSelectionFlyout {
    position: absolute;
    -ms-grid-row: 2;
    margin-top: -1px;
    display: none;
    overflow: auto;
    border: 1px solid black; /*[1px solid {Environment-CommandBarMenuBorder-Background}]*/
}

    #toolSelectionFlyout.flyoutActive {
        display: block;
    }

    #toolSelectionFlyout > li {
        display: block;
    }

        #toolSelectionFlyout > li > .flyoutItem {
            display: -ms-grid;
            -ms-grid-columns: auto 1fr;
            width: 100%;
            padding-left: 7px;
            background-color: aqua; /*[{Environment-CommandBarMenuIconBackground-Background}]*/
        }

            #toolSelectionFlyout > li > .flyoutItem.hasFocus {
                outline: none;
                background-color: aqua; /*[{Environment-CommandBarMenuItemMouseOver-Background}]*/
            }

            #toolSelectionFlyout > li > .flyoutItem.disabled {
                background-color: aqua; /*[{Environment-CommandBarMenuIconBackground-Background}]*/
            }

            #toolSelectionFlyout > li > .flyoutItem > span {
                -ms-grid-column: 2;
                display: block;
                padding: 3px 12px 3px 6px;
                background-color: aquamarine; /*[{Environment-CommandBarMenuBackgroundGradientBegin-Background}]*/
                color: fuchsia; /*[{Environment-CommandBarTextActive-Background}]*/
            }

            #toolSelectionFlyout > li > .flyoutItem.hasFocus > span {
                background-color: lightgreen; /*[{Environment-CommandBarMenuItemMouseOver-Background}]*/
                color: black; /*[{Environment-CommandBarMenuItemMouseOver-Foreground}]*/
            }

            #toolSelectionFlyout > li > .flyoutItem.disabled > span {
                background-color: lightgreen; /*[{Environment-CommandBarMenuBackgroundGradientBegin-Background}]*/
                color: black; /*[{Environment-CommandBarTextInactive-Background}]*/
            }

            #toolSelectionFlyout > li > .flyoutItem > div.button-image {
                -ms-grid-column: 1;
                background-repeat: no-repeat;
                height: 1.333em;
                width: 1.333em;
            }

            #toolSelectionFlyout > li > .flyoutItem > input {
                -ms-grid-column: 1;
                /* Match size of checkboxes to the settings icon*/
                width: 14px; 
                margin-left: 1px;
            }

                #toolSelectionFlyout > li > .flyoutItem > input::-ms-check {
                    border-width: 0px;
                    color: fuchsia; /*[{Environment-CommandBarCheckBox-Background}]*/
                    background-color: aquamarine; /*[{Environment-CommandBarSelectedIcon-Background}]*/
                }

            #toolSelectionFlyout > li > .flyoutItem.hasFocus > input::-ms-check {
                color: fuchsia; /*[{Environment-CommandBarCheckBoxMouseOver-Background}]*/
                background-color: aquamarine; /*[{Environment-CommandBarHoverOverSelectedIcon-Background}]*/
            }

            #toolSelectionFlyout > li > .flyoutItem > input:disabled::-ms-check {
                color: fuchsia; /*[{Environment-CommandBarCheckBoxDisabled-Background}]*/
                background-color: aquamarine; /*[{Environment-CommandBarSelectedIconDisabled-Background}]*/
            }

            #toolSelectionFlyout > li > .flyoutItem > input:focus {
                outline: none;
            }

            #toolSelectionFlyout > #toolSettingsItem > .flyoutItem > #settingsText {
                position: relative;
            }

            #toolSelectionFlyout > #toolSettingsItem > .flyoutItem > #settingsText::before {
                content: '';
                display: block;
                position: absolute;
                top: 0px;
                left: 3px;
                width: calc(100% - 6px);
                height: 1px;
                border-top: 1px solid aquamarine; /*[1px solid {Environment-CommandBarMenuSeparator-Background}]*/
            }