F/* 
    Created on : Aug 19, 2019, 10:41:57 AM
    Author     : dshurtleff

	--lumo-border-radius-m: .5em;  //more rounded 
*/

:root {
  --main-bg-color: white;
  --main-text-color: black;
  --button-primary-bg-color: #e41736;  
  --lumo-primary-color: hsl(214, 90%, 52%);
  --lumo-clickable-cursor: pointer;  
}

body {
	background-image: url(../image/prism.png);		
	margin: 0px;
	font-family: 'Arial';
}

a {
	color: black
}

a:visited {
	color: black
}

a:hover {
	color: #1676f3;
}

@media print {
	.pageBreak {
		page-break-after: always;
	}
	.hidePrint{
		display: none;
	}	
}	

.hide {
	display: none;
}

.hover-pointer:hover {
	cursor: pointer;
}

.show-action-button {
	display: block;
}

.admin-menu-group {
    background-color: beige; 
}

.center-login {
  margin: auto;
  width: 70%;
  padding: 10px;
}

.tag-badge {
  padding: 5px;
  border-radius: 5px 5px 5px 5px;
  background-color: #2196F3;
  text-align: center;
  color: white;
}

.button-primary {
	background-color: var(--button-primary-bg-color);
	color: white;
}

.button-primary-disabled {
	
}

.align-text-right {
	text-align: right;
}

.dialog-title {
	background-color: #383636;
	color: white;
    text-align: center;
    font-weight: bold;
    margin-bottom: 10px;	
}

.highlight-background {
	background-color: yellow;
}

.warning-icon {
	color: gold;
}

.spacer-toolbar-item {
	margin-left: 5px;
	margin-right: 5px;
}

.grid-title-center {
	background-color: lightgrey;
	text-align: center;
	font-weight: bold;
}

.grid-item-success-highlight {
	background-color: #3c7f4e;
	color: white;
	text-align: center;
	font-weight: bold;
}

.grid-item-fail-highlight {
	background-color: #893b36;
	color: white;
	text-align: center;
	font-weight: bold;
}

.grid-expander {
	font-size: 20px;
}

.button-menu {
	position: absolute;
    top: 37px;
    left: 0px;
    z-index: 99;
    border: 1px solid lightgray;
    background-color: white;
	text-align: left;
    color: black;
}

.suggestions-menu {
	position: absolute;
    z-index: 99;
    border: 1px solid lightgray;
    width: 100%;
    background-color: white;
	text-align: left;
    color: black;
}

.api-entity-table{
	border: 1px black solid;
	border-collapse: collapse;
	border-spacing: 0;
}
.api-entity-table td,th {
	padding-left: 5px;
	padding-right: 5px;
}
.api-entity-table th {
	color: white;			
	background-color: #383636;
	border-bottom: 3px solid #1676f3;
}
.api-entity-table td {
	border: 1px lightgray solid;	
	padding: 5px;
}
.api-entity-table tr:nth-child(odd) {
	background-color: #eeeeee
}
.api-entity-table tr:nth-child(even) {
	background-color: white;
}

.detail-table {
	border: 1px solid #c5c5c5;
	width: 100%;
}

.detail-table th {
	padding: 5px;
	text-align: left;
	background-color: lightslategrey;
}

.detail-table td {
	padding: 5px;
	text-align: left;
}

.detail-table tr:nth-child(odd) {background-color: #cacaca;}
.detail-table tr:nth-child(even) {background-color: #f2f2f2;}

.detail-section {
	position: sticky;
    top: 0px;
    background-image: linear-gradient(#484848, grey);
	color: white; 
	font-size: 20px; 
	text-shadow: 2px 2px 2px #000;
}

.detail-subsection {
	background-color: #c0dcf5;
}

.form-field-shift {
	margin-left: 0px;
}

.alert {
	position: relative;
    padding: .75rem 1.25rem;
    margin-bottom: 1rem;
    border: 1px solid transparent;
    border-radius: .25rem;
}

.alert-warning {
	color: #856404;
    background-color: #fff3cd;
    border-color: #ffeeba;
}

.alert-info {
	color: #004085;
    background-color: #cce5ff;
    border-color: #b8daff;
}

.alert-danger {
	color: #721c24;
    background-color: #f8d7da;
    border-color: #f5c6cb;
}

.alert-success {
	color: #155724;
    background-color: #d4edda;
    border-color: #c3e6cb;
}

.panel-closebutton {
	float: right;
	padding: 5px;
	padding-left: 12px;
	padding-right: 12px;
	background-color: #d40000;
	margin-right: 5px;
	margin-top: -3px;  
	border-radius: 4px 4px 4px 4px;
}

.panel-closebutton:hover {
	cursor: pointer;
	background-color: red;
	box-shadow: 0px 0px 5px red;
}

.panel-collapsebutton {
	float: right;
	background-color: #828282;
	margin-right: 5px;
	margin-top: -3px; 
	height: 29px;
	border-radius: 4px 4px 4px 4px;
}

.panel-collapsebutton:hover {
	cursor: pointer;
	background-color: #a7a7a7;
	box-shadow: 0px 0px 5px #a7a7a7;
}

.regex-tester-message {
	padding: 5px;
}

.regex-tester-error {
	background-color: #ffcdcd;
}

.regex-tester-matched {
	background-color: lightgreen;
}

.regex-tester-unmatched {
	background-color: lightgray;
}

.dl-tooltip {
  position: relative;				
  display: inline-block;				
}

.dl-tooltip .dl-tooltiptext {
  visibility: hidden;
  width: 120px;
  background-color: grey;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px 10px;
  position: absolute;
  z-index: 1;
  bottom: 100%;
  left: 50%;
  margin-left: -60px;

  /* Fade in tooltip - takes 1 second to go from 0% to 100% opac: */
  opacity: 0;
  transition: opacity 1.5s;
}

.dl-tooltip .dl-tooltiptext::after {
  content: " ";
  position: absolute;
  top: 100%; /* At the bottom of the tooltip */
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: grey transparent transparent transparent;
}

.dl-tooltip:hover .dl-tooltiptext {
  visibility: visible;
  z-index: 1;
  opacity: 1;
}

.data-feed-status-unknown {
    background: radial-gradient(circle, rgb(218 218 218) 0%, rgb(165 165 165) 27%, rgb(31 31 31) 80%);
    padding: 10px;
    border: 1px solid #5f5f5f;
    border-radius: 21px;
    display: inline-block
}

.data-feed-status-healthy {
    background: radial-gradient(circle, rgba(96,232,86,1) 0%, rgb(57 218 32) 27%, rgba(34,54,35,1) 80%);
    padding: 10px;
    border: 1px solid green;
    border-radius: 21px;
    display: inline-block;
}

.data-feed-status-unhealthy {
	background: radial-gradient(circle, rgb(255 208 0) 0%, rgb(191 197 0) 27%, rgb(175 121 0) 80%);
    padding: 10px;
    border: 1px solid #c97c02;
    border-radius: 21px;
    display: inline-block;
}

.data-feed-status-failure {
    background: radial-gradient(circle, rgb(198 25 25) 0%, rgb(157 0 0) 27%, rgb(142 37 37) 80%);
    padding: 10px;
    border: 1px solid #890000;
    border-radius: 21px;
    display: inline-block;	
}

.floating-window-background {
	background-color: var(--main-bg-color);
	color: var(--main-text-color);
}