﻿.monaco-editor.tfs-extension-default 
{
    font-size: 12px;
    line-height: 15px;
}
.monaco-editor.tfs-extension-large
{
    font-size: 14px;
    line-height: 18px;
}

html, body
{
    height: 100%;
}
body 
{
    margin: 0;
}

.code-editor-host 
{
    height: 100%;
    overflow: hidden;
}

.code-editor-host *
{
    box-sizing: content-box;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
}

.code-editor-host A
{
    color: inherit;
    text-decoration: inherit;
    cursor: inherit;
}

.code-editor-host A:hover
{
    color: inherit;
    text-decoration: inherit;
}

.code-editor-host A:visited
{
    color: inherit;
}

.code-editor-host A:active
{
    color: inherit;
}

.code-editor-host .icon
{
    display: inherit;
    width: inherit;
    height: inherit;
    overflow: inherit;
    vertical-align: inherit;
}

.code-editor-host.with-error
{
    position: absolute;
    top: 65px;
    left: 0;
    right: 0;
    bottom: 0;
    height: auto;
}

.errors-host 
{
    height: 100%;
}

.errors-host .error-message 
{
    position: absolute;
    left: 5px;
    right: 5px;
    top: 0;
    height: 40px;
    padding: 2px 5px;
    overflow: hidden;
    background-color: #ffffcc;
    border: 1px solid #D56B01;
    font: 14px Segoe UI, Tahoma, Arial, Verdana;
}

/* Discussion Thread Styles */
.code-editor-host > .monaco-editor .zone-widget 
{
    left: 0;
    right: 18px;
    width: auto;
    z-index: auto;
}
.code-editor-host > .monaco-diff-editor .zone-widget 
{
     z-index: auto;
}
.code-editor-host .monaco-diff-editor .modified .monaco-editor .zone-widget 
{
    left: 0;
    right: 30px;
    width: auto;
}
.code-editor-host .monaco-editor .zone-widget .container 
{
    margin-right: 0;
}
.monaco-discussion-container 
{
    overflow: hidden;
}

.monaco-discussion-container A
{
    color: #007acc;
    text-decoration: none;
    cursor: pointer;
}

.monaco-discussion-container A:hover
{
    color: #007acc;
    text-decoration: underline;
}

.monaco-discussion-container A:visited
{
    color: #007acc;
}

.monaco-discussion-container A:active
{
    color: #007acc;
}

.monaco-discussion-container .icon
{
    display: inline-block;
    width: 16px;
    height: 16px;
    overflow: hidden;
    vertical-align: middle;
}

.monaco-discussion-container.content *
{
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
}
.monaco-discussion-container.filler 
{
    background-color: #f6f6f6;
}

.code-editor-host .add-comment-gutter 
{
    height: 16px;
    width: 16px;
    left: 2px;
    cursor: pointer;
    z-index: 100;
    top: -1000px;
}

.code-editor-host .add-comment-selection,
.code-editor-host .get-line-link
{
    cursor: pointer;
    z-index: 200;

    white-space: nowrap;
    background-color: #ffffff;
    border: 1px solid #aaa;
    box-shadow: 2px 2px 1px #aaa;
    font: 12px Segoe UI, Tahoma, Arial, Verdana;
}

.code-editor-host .add-comment-selection:hover,
.code-editor-host .get-line-link:hover 
{
    background-color: #d4e5f5;
}

.code-editor-host .add-comment-selection .add-comment-background-icon
{
    height: 16px;
    width: 16px;
    display: inline-block;
    margin: 1px 4px;
}

.code-editor-host > .vs .commented-text
{
    background-color: rgba(199, 224, 244, 0.7);    /* $itemCommentColor */
    border-bottom: 1px solid rgba(0, 120, 212, .5);    /* $itemCommentBorder */
}

.code-editor-host .vs-whitespace.commented-text
{
    display: inline;
}

.code-editor-host > .hc-black .commented-text
{
    color: #ffffff;     /* $white */
    background-color: #106ebe;  /* $primary-dark-1 */
}

.code-editor-host .search-hit-highlighted-line
{
    background-color: rgba(255,255,0,0.6);
}
.code-editor-host .search-selected-hit
{
    background-color: rgba(245,139,31,0.8);
}

.code-editor-host > .hc-black .search-hit-highlighted-line
{
    background-color: transparent;
    border: dotted 1px rgb(255, 255, 0);
}

.code-editor-host .vc-line-inline-adornment.vc-adornment-style-plain,
.code-editor-host .vc-line-adornment.vc-adornment-style-plain
{
    /* When over a white background, this is equivalent to rgb(248, 238, 199), but 
        with an alpha of 0.3 the user's selection will show through instead of being 
        invisible. Calculated using http://stackoverflow.com/a/12228643:
        
        (248 - 255 + (255*.3)) / .3 = 231.66667
        (238 - 255 + (255*.3)) / .3 = 198.333
        (199 - 255 + (255*.3)) / .3 = 68.333

    */
    background-color: rgba(231, 198, 68, 0.3);
}

.code-editor-host > .hc-black .vc-line-inline-adornment.vc-adornment-style-plain,
.code-editor-host > .hc-black .vc-line-adornment.vc-adornment-style-plain
{
    background: none;
    border: 1px dotted rgb(248, 238, 199);
}

.code-editor-host .vc-line-inline-adornment.vc-adornment-style-error,
.code-editor-host .vc-line-adornment.vc-adornment-style-error {
	background: rgba(255,0,0,0.2);
}

.code-editor-host > .hc-black .vc-line-inline-adornment.vc-adornment-style-error,
.code-editor-host > .hc-black .vc-line-adornment.vc-adornment-style-error {
    background: none;
    border: 1px dotted red;
}

.code-editor-host > .hc-black .search-selected-hit
{
    background-color: rgba(255,255,255,0.25);
    border: solid 2px rgb(255, 255, 0);
}

/* Hidden page available to test different drops of the editor */
.edit-code-editor-url-main-content 
{
    font: 14px Segoe UI, Tahoma, Arial, Verdana;
}
.edit-code-editor-url-main-content  #urltext
{
	width: 400px;
}
.edit-code-editor-url-main-content  button 
{
	margin-left: 5px;
}

/*  This is a temporary fix to remove the Find watermark in the Find input box for IE11 (it's overlapping option buttons).
    This targets the Monaco Sprint 86 release, and is not an issue for Chrome and Edge browsers. */
.monaco-findInput > .monaco-inputbox > .wrapper .placeholder-shim {
    display: none !important;
}

.code-editor-host .monaco-editor .char-insert,
.code-editor-host .monaco-editor .line-insert {
    background: rgba(51, 153, 51, 0.1);
}
.code-editor-host .monaco-editor .char-delete,
.code-editor-host .monaco-editor .line-delete {
    background: rgba(172, 0, 0, 0.1);
}

/* Monaco 0.8.3 added green/red background coloring over the line numbers, which makes them harder
    to read and misaligns when adding discussions. This removes that gutter background coloring */
.code-editor-host .monaco-editor .inline-added-margin-view-zone,
.code-editor-host .monaco-editor .inline-deleted-margin-view-zone,
.code-editor-host .monaco-editor .margin-view-overlays .line-insert,
.code-editor-host .monaco-editor .margin-view-overlays .line-delete {
    background: rgba(0, 0, 0, 0);
}

/* Override default 'vs' theme teal line numbers for contrast requirements. Also subdue 'hc-black' a bit. */
.code-editor-host .monaco-editor.vs .line-numbers {
    color: #666666; /* $secondary-dark-3 */
}
.code-editor-host .monaco-editor.hc-black .line-numbers {
    color: #a6a6a6; /* $secondary-dark-1 */
}

/* Fix Monaco "tree" styles after inadvertent spillover from generically named TFS "tree" styles. */
.monaco-editor .suggest-widget > .tree {
    padding: 0;
}

/* Fixes 'Bug #1123329: Monaco context menu item is blurry (Chrome)'.  Can be removed after Monaco or Chrome fixes on their side. */
.code-editor-host .monaco-menu .monaco-action-bar.vertical .action-item .action-label:focus {
    text-shadow: 0.15px 0.15px;
}

/* In high contrast, replace the light gray background on hover by a stronger color 
    Also fixes visibility of focused context menu item in High Contrast #1206437 */
@media screen and (-ms-high-contrast: active) {
    .code-editor-host .monaco-menu .monaco-action-bar.vertical .action-item {
        -ms-high-contrast-adjust: none;
    }

    .code-editor-host .monaco-menu .monaco-action-bar.vertical .action-item:hover:not(.disabled),
    .code-editor-host .monaco-menu .monaco-action-bar.vertical .action-item .action-label:focus {
        color: HighlightText;
        background-color: Highlight;
    }
}

/* Hack to fix color contrast for monaco F1 menu. Fixed permanently in Monaco ver. 14.4 or greater. */
.monaco-quick-open-widget .monaco-tree .monaco-tree-row.focused .monaco-highlighted-label,
.monaco-quick-open-widget .monaco-tree .monaco-tree-row.focused .results-group, {
    color: #0066BF !important;
}
.vs-dark .monaco-quick-open-widget .monaco-tree .monaco-tree-row.focused .monaco-highlighted-label,
.vs-dark .monaco-quick-open-widget .monaco-tree .monaco-tree-row.focused .results-group {
    color: #49B1FF !important;
}
.hc-black .monaco-quick-open-widget .monaco-tree .monaco-tree-row.focused .monaco-highlighted-label,
.hc-black .monaco-quick-open-widget .monaco-tree .monaco-tree-row.focused .results-group {
	color: #F38518 !important;
}
