/* This stylesheet is meant specifically for styles that apply to Orion Web Resources */

.HeaderBar
{
    padding: 10px;
    border-bottom: solid 1px #D5D5D5;
    position: relative;
} 

/* Make the h1 and h2 tags inside header bars have the right padding */
.HeaderBar h1, .HeaderBar h2
{
	padding: 0;
	margin: 0;
}

.HeaderBar h1
{
    font-size: 14px;
	font-weight: bold;
}
.HeaderBar h1 a {
    color: #333333;
}

.HeaderBar h2
{
	font-weight: normal;
	font-size: 10px;
	text-transform: uppercase;
}

.EditResourceButton
{
	float: right;
	margin-left: 5px;
}

.EditResourceButton img
{
	border: 0px;
}

.bottom
{
    text-align: right;
    margin: 15px;
}

.resource-dragdrop-placeholder {
    border: none;
    background: #FFF;
    opacity:.5;
    outline: 2px dashed #aaa;
    margin-bottom: 10px;
    padding: 0;
}

.resource-colresize-helper {
    margin: 0 5px;
    z-index: 10 !important;
    background: rgba(32, 74, 99, .2);
}

.resource-colresize-helper:before {
    content: "";
    background: rgba(32, 74, 99, .2);
    position: absolute;
    height: 100%;
    right: 0;
}
.resource-colresize-helper:after {
    content: "";
    border-right: 2px dashed #204A63;
    position: absolute;
    height: 100%;
    right: 4px;
}
.ui-resizable-handle.ui-resizable-e {
    cursor: col-resize;
    width: 10px;
    opacity: 1 !important;
}
.ui-resizable-handle.ui-resizable-e:hover {
    background: rgba(32, 74, 99, .3);
}
.sw-dashboard--editing .ui-resizable-handle.ui-resizable-e:after {
    content: "";
    border-right: 2px dashed #AAA;
    position: absolute;
    width: 0;
    height: 100%;
    left: 4px;
    opacity: 1;
}
.ui-resizable-handle.ui-resizable-e:hover:after {
    content: "";
    border-right: 2px dashed #204A63;
    position: absolute;
    width: 0;
    height: 100%;
    left: 4px;
}

.ResourceWrapper,
.ResourceWrapper table
{
	width: 100%;
}

.ResourceWrapper table thead,
.ResourceWrapper table thead tr,
.ResourceWrapper table thead tr td,
.ResourceWrapper table thead tr th,
.ResourceWrapper table tr.HeaderReport,
.ResourceWrapper table tr .ReportHeader
{
    background-color: #ECEDEE;
	text-transform: uppercase;
}

.ResourceWrapperPanel {
    transition: box-shadow ease .5s;
}
.ResourceWrapperPanel.sw-widget__dragging {
    box-shadow: 4px 4px 20px #777;
}
.ResourceWrapperPanel:hover {
    z-index: 1;
}
.ResourceWrapper:hover .sw-widget__edit-button {
    transform: rotateY(0);
}

/*UIF-443 when there are nested resources, make it seem like only one is there*/
div.ResourceWrapper div.ResourceWrapper
{
    width: auto !important;
    -webkit-box-shadow: none;
    box-shadow: none;
}
div.ResourceWrapper div.ResourceWrapper .ResourceContent
{
    padding: inherit;
}

.ResourceContent {
    padding: 10px;
    background: #ffffff;
}

.ResourceIcon 
{
    padding: 0px;
    margin: 0px 0px -3px 0px;
}

.ReportHeader
{
	font-size: 10px;
	font-weight : normal;
    clear: left;
}

.ReportFooter
{
	font-weight : normal;
    margin-top: 5px;
}

.ResourcePagerControl
{
    text-align: left;
    font-size: 9pt;
}

.ResourcePagerControl a, .ResourcePagerControl a:active, .ResourcePagerControl a:visited
{
    color: #336699;
}
.ResourcePagerControl a:hover
{
    color: #F99D1C;
}

.ResourcePagerControl .ResourcePagerInfo
{
    text-align: right;
    margin-top: 2px;
}

.ResourcePagerControl .pageSize
{
    margin-left: 5px;
}

.ReportFooter .SmallInput
{
    width: 25px;
    text-align: right;
}

.Report thead
{
	background-color: #E0E0E0;
	font-size: 11px!important;
}

.ResourceWrapper table tbody tr td, .ResourceWrapper table tbody tr th
{
    margin-bottom: 0;
    margin-top: 0
}

.ResourceWrapper table tbody tr th
{
	text-align: left;
}

.ResourceWrapper table tbody tr td a img
{
	vertical-align: middle;
}

table.LayoutTable thead,
table.LayoutTable thead tr,
table.LayoutTable thead tr td,
table.LayoutTable tr td,
table.LayoutTable tbody tr td
{
	border: 0px;	
}

.SWTreeView table tbody tr td, .ResourceWrapper table tbody tr th
{
	border-bottom: 0px groove #d8d6d1;
	text-align: left;
    font-size: 8pt;
    margin-bottom: 0px;
    margin-top: 0px
}

.NodeManagementIcons {
    margin: 0 0 7px 0 !important;
}
.NodeManagementIcons a
{
	white-space: nowrap;
    font-size: 8pt;
    border: solid 1px transparent;
    padding: 4px 5px;
    display: block;
    float: left;
    margin: 0 !important;
    color: #0079aa;
}

.NodeManagementIcons a:hover
{
    color: #2d5c77 !important;
    background: none;
    border-color: #2d5c77;
}

.NodeManagementIcons img, td.Property.NodeManagementIcons img
{
	border: none;
	vertical-align: text-bottom;
}

/* Styles for the green, yellow, red percent bars in resources */
.GreenBar
{
	background-image: url('/NetPerfMon/images/Bar.Green.gif');
	background-position: bottom;
	height: 10px;
	background-repeat: repeat-x;
	background-color: #00b84a;
}

.YellowBar
{
	background-image: url('/NetPerfMon/images/Bar.Yellow.gif');
	background-position: bottom;
	height: 10px;
	background-repeat: repeat-x;
	background-color: #f1d200;
}

.RedBar
{
	background-image: url('/NetPerfMon/images/Bar.Red.gif');
	background-position: bottom;
	height: 10px;
	background-repeat: repeat-x;
	background-color: #e22323;
}

.BarBackground
{
	background-color: #eae9e7;
	height: 10px;
	background-image: url('/NetPerfMon/images/Bar.Background.gif');
}

.TopologyRow
{
	padding: 5px 1px 5px 5px;
	border-bottom: none!important;
	background-image: url(/Orion/images/TopologyItems/Arrows/row_bg.gif);
	background-repeat: repeat-x;
	background-position: center center;
	text-align: left; 
}

.AltTopologyRow
{
	padding: 5px 1px 5px 5px;
	background-image: url(/Orion/images/TopologyItems/Arrows/row_bg.gif);
	background-repeat: repeat-x;
	background-position: center center;
	border-bottom: none!important;
	text-align: left; 
}

.TopologyFooter
{
	padding: 5px 5px 5px 5px;
	border-bottom: none!important;
    background-color: #ECEDEE;
}

.selectedSearchStr
{
	background-color: #ffe89e!important;
}

.topologyDiv
{
	font-size: 8pt;
	display: block;
	float: left;
	vertical-align: middle;
}

.MultiChartInfo a, .MultiChartInfo a:active, .MultiChartInfo a:visited 
{
	 color:#336699; 
}

.MultiChartInfo a:hover  
{
	color:#F99D1C; 
}

div.MultiChartInfo  
{
	background-color:#ecedee; 
	padding:10px; 
}

.MultiChartInfo ul 
{ 
	list-style-type:square; 
	padding:0px; 
	margin:0px 0px 5px 15px; 
}

/* web resources that are asking for edit */

.sw-resource-wantedit { background-color: #fff; padding-right: 196px; background-position: top right; background-repeat: no-repeat; }
.sw-resource-wantedit-nowatermark { padding-right: 0; }
.sw-resource-wantedit > div { background: #ecedee url(/orion/images/ResourceWatermarks/Watermark.spacer.gif) top right repeat-y; min-height: 113px; }
.sw-resource-wantedit > div > div { padding: 10px 5px 10px 10px; }
.sw-resource-wantedit-nowatermark > div { background: #ecedee; padding-right: 0; min-height: 0; }
.sw-resource-wantedit li { list-style-position: outside; line-height: 20px; margin: 0; padding: 0; }
.sw-resource-wantedit ol, .sw-resource-wantedit ul { margin: 0; padding: 0 0 0 15px; }
.sw-resource-wantedit ul > li { list-style-type: square; }
.sw-resource-wantedit .sw-resource-wantedit-link { margin-top: 12px; }

/* allow undo of heavy-handed rules */

.sw-text-reset table thead, .sw-text-reset table tbody tr td, .sw-text-reset table tbody tr th,
.sw-text-reset-small table thead, .sw-text-reset-small table tbody tr td, .sw-text-reset-small table tbody tr th { font-size: inherit; }

.sw-no-row-lines table, .sw-no-row-lines table td { border-bottom: 0px none!important;}

/* Resource search box */

.sw-resource-searchcontrol 
{
    float: right;
}
.sw-resource-searchcontrol .sw-resource-searchbox 
{
    float: left;
    margin: -2px 5px 0px 0px;
}
.sw-resource-searchcontrol .sw-resource-searchbutton
{
    margin-top: -2px;
}

/* Custom query resource */
.sw-custom-query-table-container {
    position: relative;
    min-height: 75px;
    clear: both;
}
.sw-custom-query-table .HeaderRow td.Sortable {
    cursor: pointer;
}

.sw-custom-query-table-loading {
    text-align: center;
    background-color: rgba(255, 255, 255, 0.6);
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
}
.sw-custom-query-table-loading-table {
    display: table;
    width: 100%;
    height: 100%;
}
.sw-custom-query-table-loading-cell {
    display: table-cell;
    vertical-align: middle;
}
.sw-custom-query-table-loading-cell img {
    display: block;
    margin: 0 auto;
    padding-top: 10px;
    padding-bottom: 5px;
}

/* Demo Edit */
body.demo .sw-custom-query-table tbody td.column0 {
    word-break: break-all;
    word-wrap: break-word;
}
/* End- Demo Edit */

.HeaderRow tr 
{
    white-space: nowrap;
}

.rowSeparator
{
	border-collapse: collapse;
}

.rowSeparator tr:not(:first-child):not(:last-child)
{
    border-bottom: #ecedee;
    border-bottom-style: solid;
    border-bottom-width: 1px;
}

.blueLink a
{
	color: #336699;
	text-decoration: none;
}

.blueLink a:hover
{
	color: #f99d1c;
	text-decoration: underline;
}

.property-smaller
{
    font-size:8pt;
}

.ResourceDragAndDropPh
{
    width: 100%;
    text-align: center;
    display: none;
    position: absolute;
    top: 3px;
}

.ResourceDragAndDropIcon
{
    cursor: move;
}

.drag-and-drop-enabled .ResourceDragAndDropPh
{
    display: block;
}
/*in case .ResourceWrapper contains another .ResourceWrapper we should hide d&d icon */
.drag-and-drop-enabled .ResourceWrapper .ResourceWrapper .ResourceDragAndDropPh
{
    display: none;
}
.sw-orion .drag-and-drop-enabled .ResourceDragAndDropPh {
    display: none;
}

.colHeader
{
    background-color: #204a63;
    color: #fff;
    padding: 5px 0 0 10px;
}
 .imgButton 
 {
     text-align: right;
     white-space: nowrap;
     padding-right: 5px;
 }
.divColumn
 { 
     float: left;
     margin-right: 5px; 
     margin-left: 5px;
      margin-top:5px;
     border: 1px solid #ecedee;      
     overflow:auto;height:100%
 }
.addDivColumn
 { 
     float: left; 
     margin-right: 5px; 
     margin-left: 5px;
     margin-top:5px;
     border: 1px dashed darkgrey; 
     overflow:auto;    
     height:100%
  }
.resList
 {
     margin-left: 10px;
 }
.resSpan
{
    padding: 5px 0 4px 10px
}
.wtable tr td 
{ 
    padding: 5px 5px 0 0!important;
    text-align:left; 
    vertical-align: bottom!important
}
.wtable tr td div,.wtable tr td span
{
    display:inline-block;
}

.resizeable-tooltip-container {
    z-index: 4001;
    white-space: normal;
    border: 1px solid #333333;
    margin-right: 15px;  
    background-color: #333333;
    padding: 4px;
    display: inline-flex;
    flex-direction: column;
}

.resizeable-tooltip-line
{
    font-style: normal;
    font-size: 12px;
    white-space: nowrap;
    color: #e0e0e0;
    text-align: left;
    padding: 2px;
    display: flex;
}

.resizeable-tooltip-emphasis {
    font-weight: bold;
    display: flex;
    padding: 0 4px;
}