.h1, .h2, .h3 {
	font-weight: normal;
}

.sqlexplorer-screen {
	background-color: var(--lumo-base-color); 
}

.sqlexplorer-left {
	background-color: var(--lumo-shade-10pct); 
}

.sqlexplorer .green {
	color: #76aa2e;
}

.sqlexplorer [disabled] .green {
	color: var(--lumo-disabled-text-color);
}

.sqlexplorer .red {
	color: #E84855;
}

.sqlexplorer [disabled] .red {
	color: var(--lumo-disabled-text-color);
}

.v-panel-caption, .v-window-outerheader, .v-window-header, .v-window-maximizebox, .v-window-closebox, .v-window-restorebox, .v-menubar > .v-menubar-menuitem-checked {
	background: #0072C6;
	color: white;
}

.standout {
	color: #0072C6;
	font-weight: 900;
}

.badge {
	margin-bottom: 3px;
	padding: 1px 9px 2px;
	font-size: 12.025px;
	font-weight: bold;
	white-space: nowrap;
	color: #ffffff;
	background-color: #999999;
	-webkit-border-radius: 9px;
	-moz-border-radius: 9px;
	border-radius: 9px;
}

.badge:hover {
	color: #ffffff;
	text-decoration: none;
	cursor: pointer;
}

.badge-error {
	background-color: #b94a48;
}

.badge-error:hover {
	background-color: #953b39;
}

.badge-warning {
	background-color: #f89406;
}

.badge-warning:hover {
	background-color: #c67605;
}

.badge-success {
	background-color: #468847;
}

.badge-success:hover {
	background-color: #356635;
}

.badge-info {
	background-color: #3a87ad;
}

.badge-info:hover {
	background-color: #2d6987;
}

.badge-inverse {
	background-color: #333333;
}

.badge-inverse:hover {
	background-color: #1a1a1a;
}

.ace_marker-layer .errormarker {
	border-bottom: 2px dotted red;
	position: absolute;
}

.aceeditor-suggestpopup-description {
	background: lightgray;
	width: 400px;
}

.v-label-marked {
	color: red;
	font-weight: bold;
}

.v-table-header, .v-grid-header tr:first-child th {
	background-image: -webkit-linear-gradient(#DEDEDE, #E0E0E0);
	background-image: -moz-linear-gradient(#DEDEDE, #E0E0E0);
	background-image: linear, false, zip(#DEDEDE #E0E0E0);
	font-weight: bold;
}

.v-textfield-align-center {
	text-align: center;
}

input.v-widget.v-textfield[type="text"] {
	width: 170px;
}

.input-long {
	width: 16em;
}

.v-slot.v-slot-initial-load-wrapper {
	margin: 5px auto;
	border: 2px solid #287ece;
	background-color: white;
	padding: 10px;
}

.wizard-label {
	background-image: url(../symmetric/icons/wand.png);
	background-repeat: no-repeat;
	padding-left: 25px;
}

.wizard-item-label {
	margin: auto 15px;
	border: none;
	background: transparent;
}

.info-header-layout {
	width: 100%;
}

.shortcut-layout .info-header-layout, .presets .info-header-layout {
	padding: 5px 5px;
	border: solid 1px white;
	margin: 4px 0px;
}

.shortcut-layout .info-header-layout:hover, .presets .info-header-layout:hover {
	cursor: pointer;
	box-shadow: 5px 5px 5px var(lumo);
	border: solid 1px gray;
}

.shortcut-layout .info-header-layout:hover .shortcut-layout .info-header {
	color: #ef8030;
}

.info-header {
	color: var(--lumo-secondary-text-color);
	font-weight: bold;
	font-size: 1.1em;
}

.shortcut-layout .info-header {
	color: #ef8030;
	font-size: 1em;
}

.info-header-icon {
	color: var(--lumo-secondary-text-color);
}

.shortcut-layout .info-header-icon {
	font-size: 1.4em;
}

.info-secondary-header {
	color: #ef8030;
	font-weight: bold;
	font-size: 1.1em;
}

.info-secondary-header-icon {
	color: #ef8030;
	font-size: 1.5em;
}

.info-header-summary {
	color: var(--lumo-secondary-text-color);
	font-size: 0.8em;
	margin:auto;
}

.healthy {
	color: #81C784;
}

.unhealthy {
	color: red;
}

.unmatched {
	color: #daa400;
}

.stopped {
	color:#7f8c8d;
}

[theme="dark"] .stopped {
	color: var(--lumo-secondary-text-color);
}

.paused {
	color:#f5b041;
}

.health-link {
	width: 100%;
	text-align: justify;
	border: solid 1px var(--lumo-base-color);
	padding: 2px 5px;
	margin: 2px;
}

.health-link:hover {
	border: solid 1px var(--lumo-secondary-text-color);
	box-shadow: 2px 2px 2px var(--lumo-secondary-text-color);
}

.health-link.healthy:hover {
	color: #57D15D;
}

.health-link.unhealthy:hover {
	color: #cc0000;
}

.info-header-layout .speed-header {
	text-align: right;
}

.speed-header {
	color: #ef8030;
	font-size: 1.2em;
	font-weight: bold;
	flex-shrink: 2;
	text-align: center;
}

.summary-header {
	font-size: 1.2em;
	font-weight: bold;
	flex-shrink: 2;
	text-align: center;
}

.speed-label {
	text-align: center;
	width: 100%;

}

.speed-horizontal {
	width: 100%;
	justify-content: center;
}

.speed-unit {
	font-size: 0.8em;
	color: var(--lumo-secondary-text-color);
}

.grid-border .v-gridlayout-slot {
	background: white;
	color: #474747;
	border-radius: 3px;
	border: 1px solid #c9c9c9;
	box-shadow: 3px 3px 3px #b2b2b2;
}

.successGreen {
	color: green;
	font-weight: bold;
}

.success {
	padding: 2px 2px 2px 20px;
}

.failure {
	padding: 2px 2px 2px 20px;
}

.successful, .v-label.successful, .v-label-success, .info-header-summary .successful {
	color: #81C784;
}

.unsuccessful, .v-label.unsuccessful, .v-label-failure, .info-header-summary .unsuccessful {
	color: #E53935;
}

.caution, .v-label.caution, .info-header-summary .caution, .duration-unit.caution {
	color: #f89406;
}


.attention, .v-label.attention, .info-header-summary .attention {
	color: #2196F3;
	margin:auto;
}

pre {
	white-space: pre-wrap;
	white-space: -moz-pre-wrap;
	white-space: -pre-wrap;
	white-space: -o-pre-wrap;
	word-wrap: break-word;
}

.errors-table {
	font-size: 14px;
}

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

.link-box {
	border: solid 1px var(--lumo-base-color);
}

.link-box:hover {
	border: solid 1px gray;
	box-shadow: 2px 2px 2px grey;
}

.v-label.processingLarge {
	color: blue;
}

.v-slot.v-slot-dashboard-jobs-header {
	color: #0072C6;
	border-bottom: thin solid gray;
	padding: 3px 0px;
}

.v-grid .v-progressbar-wrapper, .v-progressbar-wrapper {
	height: 16px;
	position: relative;
}

.stats .v-progressbar-wrapper {
	height: 24px;
	min-width: 300px;
}

.v-progressbar-wrapper span {
	position: absolute;
	display: block;
	width: 100%;
}

.v-progressbar-indicator {
	border-radius: none;
	border: none;
}

.v-grid .v-progressbar-indicator, .v-progressbar-indicator {
	border-radius: none;
	border: none;
	background-image: -webkit-linear-gradient(#81C784, #81C784);
	background-image: -moz-linear-gradient(#81C784, #81C784);
	background-image: linear, false, zip(#81C784 #81C784);
	background-color: #81C784;
}

.v-grid .cancelled .v-progressbar-indicator {
	border-radius: none;
	border: none;
	background-image: -webkit-linear-gradient(#DFDFDF, #DFDFDF);
	background-image: -moz-linear-gradient(#DFDFDF, #DFDFDF);
	background-image: linear, false, zip(#DFDFDF #DFDFDF);
	background-color: #DFDFDF;
}

.stats .stats-values {
	font-size: 0.9em;
	color: gray;
}

.stats .stats-values span {
	color: #ef8030;
	font-weight: bold;
}

.v-button.wide {
	width: 190px;
}

.v-margin-left.sm-margin {
	padding-left: 5px;
}

.v-margin-top.sm-margin {
	padding-top: 5px;
}

.v-margin-right.sm-margin {
	padding-right: 5px;
}

.v-margin-bottom.sm-margin {
	padding-bottom: 5px;
}

.v-grid.dashboard .v-grid-cell {
	padding: 0 7px;
	font-size: 12px;
	color: #5f5e5e;
}

.v-grid.dashboard .v-grid-header th {
	font-size: 11px;
	text-align: center;
}

.center {
	text-align: center !important;
}

.small {
	padding: 0 7px;
	font-size: 11px;
}

.slider-label {
	line-height: 30px;
}

.v-horizontallayout.v-horizontallayout-wizard-toolbar {
	padding: 2px;
	margin-left: 262px;
}

.v-horizontallayout.v-horizontallayout-wizard-toolbar .v-slot {
	padding: 4px;
}

.v-slot.v-slot-wizard-label {
	border-top-left-radius: 4px;
	border-bottom-left-radius: 4px;
	color: #287ece;
	font-size: 11.05px;
	text-transform: uppercase;
	font-weight: bold;
	letter-spacing: 0.03em;
	padding: 0.3em 0.9em 0.3em;
	text-shadow: 0 1px 0 white;
}

.v-slot.v-slot-wizard_summary_header {
	margin-top: 35px;
	margin-left: 25px;
}

.v-widget.wizard_summary_header span {
	font-weight: bold;
}

.wizard_summary_item, .wizard_summary_item_warn {
	margin-left: 25px;
	font-weight: bold;
	font-size: 24px;
}

.wizard_summary_item span {
	color: green;
	margin-right: 10px;
}

.wizard_summary_item_warn span {
	color: red;
	margin-right: 10px;
}

.wizard_summary_item_sm {
	margin-left: 25px;
	font-weight: bold;
	font-size: 16px;
}

.wizard_summary_item_sm span {
	color: green;
}

.v-grid-header th.grid-title {
	font-size: 16px;
	font-weight: bold;
	color: #0072C6;
	text-align: center;
	text-transform: uppercase;
}

.quick-wizard-node {
	font-size: 36px;
	font-weight: 900;
	color: darkgreen;
	text-transform: capitalize;
}

span.wizard-welcome-question {
	font-size: 24px;
}

.warningLabel {
	font-size: 13px;
	color: #ff0000;
}

.wizard-layout {
	min-height: 400px;
}

.vrule {
	height: 100%;
	border-left: 1px solid #c0c0c0;
	margin-left: 5px;
	margin-right: 6px;
}

.v-grid-cell-focused:before {
	border: 0px;
}

.sym_permission_layout_text {
	text-align: center;
}

.sym_permission_title_sm {
	font-weight: bold;
	font-size: 16px;
	margin-bottom: 10px;
}

.sym_permission_title_md {
	font-weight: bold;
	font-size: 18px;
	margin-bottom: 20px;
}

.tag_layout {
	border-style: solid;
	border-width: 1px;
	border-color: var(--lumo-contrast-20pct);
	background-color: var(--lumo-contrast-5pct);
}

.tag_label {
	padding-right: 15px;
}

.filter_list_layout > .v-spacing {
	height: 30px;
}

.mouse_pointer {
	cursor: pointer;
}

.violation-display {
	border: 3px solid red;
	padding: 25px;
}

.violation-display span.v-icon {
	font-size: 40px;
	color: red;
}

.violation-type {
	line-height: 50px;
	margin-right: 20px;
	margin-left: 20px;
	font-size: 24px;
	font-weight: bolder;
	color: red;
}

.violation-message {
	line-height: 50px;
}

.violation-direction {
	font-size: 12px;
	font-style: italic;
	text-align: center;
}

.top_bar {
	background-color: var(--lumo-base-color);
	padding-bottom: 10px;
}

.shade {
	background-color: var(--lumo-shade-20pct);
}

.diagram-node-drag {
	background-color: var(--lumo-base-color) !important;
	color: var(--lumo-secondary-text-color) !important;
}

.dashboard_panel_content {
	height: 100%;
	overflow-y: auto;
	background-color: var(--lumo-base-color);
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
}

.load-detail-panel {
	margin-bottom: 3px;
	border: 1px solid var(--lumo-secondary-text-color);
	border-radius: 8px;
}

.dashboard_tabs {
	max-width: 540px;
}

.progressBarLabel {
	position: absolute;
	top: 1px;
	left: 0;
	z-index: 1;
}

.progressBarText {
	padding: 0 7px;
	font-size: 11px;
	text-align: center;
}

.progressBarParent {
	position: relative;
}

.stat-label {
	text-align: center;
	font-size: 22px;
	color: #ef8030;
}

.design-horizontal-outer-div{
	box-sizing: border-box;
	width: 85vw !important;
	height: 50vw !important;
}

.design-container-div-style{
	box-sizing: border-box;
	width: 70vw !important;
}

.html-testing{
	border: 1px solid red;
}

.v-verticallayout.v-layout.v-vertical.v-widget.stat.v-verticallayout-stat .v-label {
	font-size: 16px;
	color: gray;
}

.v-verticallayout.v-layout.v-vertical.v-widget.stat.v-verticallayout-stat .v-label span {
	font-size: 0.7em;
}

.v-caption-callout {
	font-size: 17px;
}

.v-label-callout, .callout {
	font-size: 17px;
	margin-left: 22px;
	margin-bottom: 10px;
}

.v-slot-chart-donut-percent {
	margin-top: -70px;
}

.chart-donut-percent {
	font-size: 18px;
}

.chart-donut-divder {
	border-top: 2px solid #E0E0E0;
	padding-top: 15px;
}

.list-item {
	flex-grow: 4;
	padding: 2px 5px;
	margin: 2px;
}

.list-item-active {
	border: solid 1px gray;
	box-shadow: 2px 2px 2px grey;
}

.list-item-active.healthy {
	color: #81C784;
}

.list-item-active-alt.healthy {
	color: #81C784;
}

.list-item-active-alt.healthy .fa {
	color: #ef8030;
}

.rating-poor {
	font-size: 36px;
	font-weight: 900;
	color: var(--lumo-error-color);
}

.rating-fair {
	font-size: 36px;
	font-weight: 900;
	color: var(--lumo-warning-color);
}

.rating-good {
	font-size: 36px;
	font-weight: 900;
	color: var(--lumo-primary-color);
}

.rating-excellent {
	font-size: 36px;
	font-weight: 900;
	color: var(--lumo-success-color);
}

.side-menu {
	padding: 5px 5px 5px 10px;
	margin-left: 10px;
	color: var(--lumo-contrast-70pct);
}

.side-menu > vaadin-button {
	height: 20px;
	padding-left: 0;
	font-weight: 400;
	color: var(--lumo-contrast-70pct);
}

.side-menu > vaadin-button.selected {
	color: var(--lumo-primary-color);
}

.side-menu-header {
	padding: 10px 0 5px 0;
	font-weight: 700;
}

.screen-title {
	width: 100%;
	padding: 5px;
	background-color: var(--lumo-primary-color);
	color: var(--lumo-primary-contrast-color);
}

.screen-layout {
	background: var(--lumo-base-color);
}

.screen-description {
	padding-bottom: 0px;
	margin-bottom: 15px;
}

.tab-layout {
	margin-top: 15px;	
}

.form {
	margin-right: 15px;	
}

.help {
	margin-left: 15px;
	margin-right: 15px;
}

vaadin-tab {
	border: solid 1px var(--lumo-shade-50pct);
	border-top-right-radius: 5px;
	border-top-left-radius: 5px;
	border-bottom-style: none;
	margin-right: 5px;
}

vaadin-tab[selected] {
	border-color: var(--lumo-primary-color-50pct);
}

vaadin-tabsheet.no-padding::part(content) {
	padding: 0;
}

vaadin-button {
	cursor: pointer;	
}

.menu-item {
	color: var(--lumo-shade-70pct);
}

.menu-item-selected {
	color: var(--lumo-primary-color);
}

.remote-terminal-content > vaadin-text-area {
	overflow-y: auto;
}

.bold {
	font-weight: bold;
}

html {
	background-color: unset;
}

.thin-border {
	border-style: solid;
	border-width: 1px;
	border-color: var(--lumo-contrast-20pct);
}

.dialog-content {
	margin: 0;
	padding: 0 16px;
}

td.tableblock {
	border-style: solid;
}

.duration-unit {
	font-size: 13px;
	color: var(--lumo-secondary-text-color);
	font-weight: 800;
}

.duration-value {
	color: #4b33ca;
	font-size: 0.8em;
	background: #e4f3fe;
	/*background: #f7f7fc;*/
    padding:5px 10px;
	font-weight:700;
	margin: 3px 0px;
	min-height:50px;
	border-radius:5px;
}

.monitor-badge {
	text-align:center;
	margin:5px;
	color:white;
	border-radius:5px;
}
.monitor-badge iron-icon {
	margin-top:10px;	
}

.monitor-title {
	font-size: .9em;
	font-weight: 600;
}

.monitor-count {
	font-size:30px;
	line-height: 1em;
}

.monitor-count-label {
	font-size: 10px;
}

.spaced {
	margin:5px;
}

.tag {
	text-align:center;
	padding:3px 15px;
	font-size: 13px;
	border-radius:10px;
}

.tag-sm {
	text-align:center;
	padding:5px 7px;
	font-size: 12px;
	border-radius:2px;
	margin:3px;
}

.tag-lg {
	text-align:center;
	height:100px;
	width:100px;
	font-size: 0.8em;
	border-radius:5px;
	margin:5px;
}

.tag-lg iron-icon {
	margin-top:10px;	
}

.tag-lg-title {
	font-size:1.2em;
	font-weight: 600;	
	line-height: 1em;
	padding-bottom: .2em;
	text-overflow: ellipsis;
	white-space: normal;
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
}

.tag-lg-title.three-line {
	line-clamp: 3;
	-webkit-line-clamp: 3;
}

.tag-lg-title.four-line {
	line-clamp: 4;
	-webkit-line-clamp: 4;
}

.tag-lg-label {
	font-size:.9em;
	padding: 0px 3px;
	color: var(--lumo-secondary-text-color);
	line-height:1em;
}

.value-numeric {
	color: #4b33ca;
	font-size: 14px;
	padding:5px 2px;
	font-weight:600;
	margin: 3px 0px;
}

[theme="dark"] .value-numeric {
	color: #9484df;
}

[theme="dark"] .value-numeric-sm {
	color: #9484df;
}

.value-basic {
	font-size: 11px;
	color: var(--lumo-secondary-text-color);
	padding:5px 2px;
	font-weight:500;
	margin: 3px 0px;
	/*min-height:50px;*/
}

.value-basic span {
	margin-left:5px;
}

.value-unit {
	font-size: 13px;
	color: var(--lumo-secondary-text-color);
}

.value-strong {
	font-weight:600;	
}

.healthy-n {
	border: 1px solid #3a6138;
	color: #3a6138;
	background-color:#effaf1;
}

.healthy-1 {
	color: #3a6138;
	background-color:#effaf1;
	cursor: pointer;
}

.healthy-2 {
	border: 1px solid #d4ede0;
	border-radius: 16px;
	color: #55b685;
	background-color: #f1f9f5;
	cursor: pointer;
}

.error-n {
	border: 1px solid #b94a48;
	color: #b94a48;;
	background-color:#ffe8e6;
}

.error-1 {
	color: #b94a48;;
	background-color:#ffe8e6;
	cursor: pointer;
}

.error-2 {
	border: 1px solid #b94a4880;
	border-radius: 16px;
	color: #b94a48;
	background-color: #ffe8e6;
	cursor: pointer;
}

.error-sm {
	color: #b94a48;;
	background-color:#ffe8e6;
	border-radius:0px;
	padding: 3px 5px;
}

.empty-n {
	border: 1px solid #dadada;
	color: #dadada;
	background-color:#FFFFFF;
}

.empty-1 {
	color: #969696;
	background-color:#ededed;
}

.info-n {
	border: 1px solid #6697ff;
	color: #6697ff;
	background-color:#ebf1ff;
	margin: auto;
}

.info-1 {
	color: #6697ff;
	background-color:#ebf1ff;
	cursor: pointer;
}

.info-2 {
	border: 1px solid #6697ff80;
	border-radius: 16px;
	color: #6697ff;
	background-color: #ebf1ff;
	cursor: pointer;
}

.info-sm {
	color: #6697ff;
	background-color:#ebf1ff;
	border-radius:0px;
	padding: 3px 5px;
}

.data-load-1 {
	color: #ef8030;
	background-color:#ffddc4;
	margin: auto;
}

.warn-n {
	border: 1px solid #eaad15;
	color: #eaad15;
	background-color:#fcdbc2;
}

.warn-1 {
	color: #eaad15;
	background-color:#fcf6e7;
	cursor: pointer;
}

.warn-2 {
	border: 1px solid #eaae1580;
	border-radius: 16px;
	color: #eaad15;
	background-color: #fcf6e7;
	cursor: pointer;
}

.warn-sm {
	color: #eaad15;
	background-color:#fcf6e7;
	border-radius:0px;
	padding: 3px 5px;
}

[theme="dark"] .healthy-1 {
	color: var(--lumo-success-text-color);
	background-color: var(--lumo-success-color-10pct);
}

[theme="dark"] .healthy-2 {
	border: 1px solid var(--lumo-success-color-50pct);
	color: #5ec26a;
	background-color: var(--lumo-success-color-10pct);
}

[theme="dark"] .error-1, [theme="dark"] .error-sm {
	color: var(--lumo-error-text-color);
	background-color: var(--lumo-error-color-10pct);
}

[theme="dark"] .error-2 {
	border: 1px solid var(--lumo-error-color-50pct);
	color: var(--lumo-error-text-color);
	background-color: var(--lumo-error-color-10pct);
}

[theme="dark"] .empty-1 {
	color: var(--lumo-tertiary-text-color);
	background-color: var(--lumo-contrast-10pct);
}

[theme="dark"] .info-n {
	border-color: var(--lumo-primary-text-color);
}

[theme="dark"] .info-n, [theme="dark"] .info-1, [theme="dark"] .info-sm {
	color: var(--lumo-primary-text-color);
	background-color: var(--lumo-primary-color-10pct);
}

[theme="dark"] .info-2 {
	border: 1px solid var(--lumo-primary-color-50pct);
	color: var(--lumo-primary-text-color);
	background-color: var(--lumo-primary-color-10pct);
}

[theme="dark"] .warn-1, [theme="dark"] .warn-sm {
	color: var(--lumo-warning-text-color);
	background-color: var(--lumo-warning-color-10pct);
}

[theme="dark"] .warn-2 {
	border: 1px solid #F4A50080;
	color: var(--lumo-warning-text-color);
	background-color: var(--lumo-warning-color-10pct);
}

vaadin-grid.dashboard-node-summary {
	background-color:white;
}

vaadin-grid.dashboard-node-summary::part(row) {
	min-height:60px;
}

.secondary {
	color: #ef8030;
}

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

.node-image {
	min-height: 32px;
}

.dashboard-node-summary [part="row"] {
	min-height: 56px;
}

.grid-no-borders  {
        border: none !important;
}
.dashboard_screen .dashboard_vertical_layout {
	padding-left:3px;
	padding-right:3px;
	-webkit-border-radius: 5%;
	-moz-border-radius: 5%;
	border-radius: 5%;
}

.circle {
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	background-color: var(--lumo-contrast-10pct);
}

[theme="dark"] .circle.contrast-in-dark-mode {
	background-color: var(--lumo-contrast);
}

.circle2 {
	padding:3px;
	margin:0px 5px;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	border: thin solid gray;
	background-color: var(--lumo-contrast-10pct);
}

.square {
	-webkit-border-radius: 10%;
	-moz-border-radius: 10%;
	border-radius: 10%;
	background-color: var(--lumo-contrast-10pct);
}

.circle-primary {
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	background-color: var(--lumo-primary-color-10pct);
}

.circle iron-icon {
	color: var(--lumo-contrast-70pct);
}

.center-component {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.top-right {
    position: absolute;
    top: 0px;
    right: 0px;
}

.svg-contrast {
	filter: invert(9%) sepia(40%) saturate(743%) hue-rotate(176deg) brightness(99%) contrast(91%);
}

[theme="dark"] .svg-contrast {
	filter: invert(91%) sepia(1%) saturate(3504%) hue-rotate(196deg) brightness(107%) contrast(101%);
}

[disabled] .svg-contrast {
	filter: invert(87%) sepia(9%) saturate(206%) hue-rotate(172deg) brightness(92%) contrast(93%);
}

[theme="dark"] [disabled] .svg-contrast {
	filter: invert(42%) sepia(21%) saturate(616%) hue-rotate(175deg) brightness(86%) contrast(87%);
}

.svg-less-contrast {
	filter: invert(39%) sepia(7%) saturate(1207%) hue-rotate(175deg) brightness(96%) contrast(86%);
}

[theme="dark"] .svg-less-contrast {
	filter: invert(72%) sepia(14%) saturate(396%) hue-rotate(173deg) brightness(97%) contrast(84%);
}

[disabled] .svg-less-contrast {
	filter: invert(87%) sepia(9%) saturate(206%) hue-rotate(172deg) brightness(92%) contrast(93%);
}

[theme="dark"] [disabled] .svg-less-contrast {
	filter: invert(42%) sepia(21%) saturate(616%) hue-rotate(175deg) brightness(86%) contrast(87%);
}

.svg-primary {
	filter: invert(36%) sepia(55%) saturate(2056%) hue-rotate(198deg) brightness(93%) contrast(105%);
}

.svg-success {
	filter: invert(40%) sepia(16%) saturate(2391%) hue-rotate(94deg) brightness(94%) contrast(84%);
}

.svg-warning {
	filter: invert(78%) sepia(75%) saturate(1622%) hue-rotate(357deg) brightness(101%) contrast(106%);
}

[theme="dark"] .svg-warning {
	filter: invert(85%) sepia(22%) saturate(5863%) hue-rotate(354deg) brightness(92%) contrast(110%);
}

.svg-error {
	filter: invert(15%) sepia(86%) saturate(4824%) hue-rotate(357deg) brightness(92%) contrast(93%);
}

[theme="dark"] .svg-error {
	filter: invert(17%) sepia(89%) saturate(3244%) hue-rotate(352deg) brightness(100%) contrast(95%);
}

.blue-tinted-background {
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	background-color: var(--lumo-primary-color-10pct);
	margin: 8px;
}

.subtle-border {
	border-style: solid;
	border-color: var(--lumo-contrast-20pct);
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	border-width: thin;
	margin: 8px;
	padding: 12px;
}

.subtle-border-disabled {
	border-style: dashed;
	border-color: var(--lumo-contrast-20pct);
	background-color: var(--lumo-contrast-5pct);
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	border-width: thin;
	margin: 8px;
	padding: 12px;
}

.large-text-field-subtle-border::part(input-field) {
	background-color: var(--lumo-base);
	border-style: solid;
	border-color: var(--lumo-contrast-20pct);
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	border-width: thin;
	margin: 8px;
	padding: 4px 12px;
}

.large-text-field-subtle-border::part(label) {
	margin-left: 8px;
	padding-bottom: 0;
}

.contrast {
	color: var(--lumo-contrast);
}

.contrast[disabled] {
	color: var(--lumo-disabled-text-color);
}

.less-contrast {
	color: var(--lumo-contrast-70pct);
}

.less-contrast[disabled] {
	color: var(--lumo-disabled-text-color);
}

:root {
	--warning-color: hsl(48, 100%, 50%);
	--warning-text-color: hsl(32, 100%, 30%);
	--lumo-required-field-indicator: "*";
	--lumo-required-field-indicator-color: red;
}

[theme="dark"] {
	--warning-color: hsl(43, 100%, 48%);
	--warning-text-color: hsl(45, 100%, 60%);
}

.warning-badge {
	color: var(--warning-text-color) !important;
	background-color: hsla(48, 100%, 50%, 0.25) !important;
}

[theme="dark"] .warning-badge {
	background-color: hsla(40, 100%, 50%, 0.2) !important;
}

.less-contrast-badge {
	color: var(--lumo-contrast-70pct) !important;
	background-color: var(--lumo-contrast-20pct) !important;
}

vaadin-grid[theme~="dbTree"] vaadin-grid-tree-toggle {
    pointer-events: none;
}

vaadin-grid[theme~="dbTree"] vaadin-grid-tree-toggle::part(toggle) {
    pointer-events: auto;
}

label {
	margin-bottom: 0;
}

twin-col-select .twincolselect-container {
	height: 250px;
	flex-grow: 1;
}

twin-col-select div.twincolselect-item[checked] { 
	background: var(--lumo-primary-color);
	color: var(--lumo-tint-80pct);
}

twin-col-select div.twincolselect-item:focus {
    box-shadow: inset 0 0 0 2px var(--lumo-base-color);
    outline: unset;
   	background: var(--lumo-primary-color-10pct);
}

twin-col-select div.twincolselect-item {
  padding-top: var(--lumo-space-xs);
  padding-bottom: var(--lumo-space-xs);
}

twin-col-select div.twincolselect-item[disabled] {
    pointer-events: none;
}

twin-col-select  {
	min-width: 400px;
}

twin-col-select .twincolselect-errorlabel {
	color: var(--lumo-error-text-color);
    font-size: var(--lumo-font-size-xs);
    line-height: var(--lumo-line-height-xs);
    will-change: max-height;
    transition: 0.4s max-height;
    max-height: 5em;
    align-self: flex-end;
}

twin-col-select .twincolselect-label-styles {
	align-self: flex-start;
    color: var(--lumo-secondary-text-color);
	font-weight: 500;
	font-size: var(--lumo-font-size-s);
	transition: color 0.2s;
	line-height: 1;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	position: relative;
	max-width: 100%;
	box-sizing: border-box;
    padding-right: 1em;
    padding-bottom: 0.5em;	
    margin-left: calc(var(--lumo-border-radius-m) / 4);    
}

twin-col-select .twincolselect-label-styles::after {
    content: var(--lumo-required-field-indicator, "\2022");
    transition: opacity 0.2s;
    opacity: var(--tcs-required-dot-opacity);
    color: var(--lumo-primary-text-color);
    right: 0;
    width: 1em;
    margin-left: 4px;
    text-align: center;
}

twin-col-select .options {
	width: 100%;
	height: 100%;
	overflow-y: auto;
}

twin-col-select .value {
	width: 100%;
	height: 100%;
	overflow-y: auto;
}

twin-col-select vaadin-vertical-layout.options:focus {
    box-shadow: 0 0 0 2px var(--lumo-primary-color-50pct);
    outline: unset;
}

twin-col-select vaadin-vertical-layout.value:focus {
    box-shadow: 0 0 0 2px var(--lumo-primary-color-50pct);
    outline: unset;
}

vaadin-dialog-overlay[modeless].show-backdrop::part(backdrop) {
	display: block;
}

vaadin-dialog-overlay[modeless].show-in-foreground {
	z-index: 300 !important;
}

vaadin-dialog-overlay.second-layer {
	top: 70px;
}

vaadin-dialog-overlay.base-color-footer::part(footer) {
	background-color: var(--lumo-base-color);
}

.config-canvas-option {
	color: var(--lumo-contrast);
	cursor: pointer;
}

.config-canvas-option vaadin-icon {
	filter: invert(9%) sepia(40%) saturate(743%) hue-rotate(176deg) brightness(99%) contrast(91%);
}

[theme="dark"] .config-canvas-option vaadin-icon {
	filter: invert(91%) sepia(1%) saturate(3504%) hue-rotate(196deg) brightness(107%) contrast(101%);
}

.config-canvas-option.selected {
	-webkit-border-radius: var(--lumo-border-radius-m);
	-moz-border-radius: var(--lumo-border-radius-m);
	border-radius: var(--lumo-border-radius-m);
	background-color: var(--lumo-contrast-10pct);
	cursor: default;
}

.dashboard-option {
	height: 20px;
	padding: 0 8px;
	font-size: var(--lumo-font-size-xs);
	color: var(--lumo-contrast-70pct);
	cursor: pointer;
}

.dashboard-option.selected {
	-webkit-border-radius: var(--lumo-border-radius-s);
	-moz-border-radius: var(--lumo-border-radius-s);
	border-radius: var(--lumo-border-radius-s);
	color: var(--lumo-primary-color);
	background-color: var(--lumo-primary-color-10pct);
	cursor: default;
}

vaadin-details-summary::part(content) {
	flex-grow: 1;
}

vaadin-details-summary::part(toggle) {
    margin-right: 10px;
}

div.positionable {
	position: absolute;
	align-self: flex-start;
	background-color: var(--lumo-base-color);
	-webkit-border-radius: var(--lumo-border-radius-l);
	-moz-border-radius: var(--lumo-border-radius-l);
	border-radius: var(--lumo-border-radius-l);
	box-shadow: 0 0 0 1px var(--lumo-shade-5pct), var(--lumo-box-shadow-xs);
	z-index: 3;
}

vaadin-radio-group.hide-label {
	padding: 2px 0 0 0;
}

vaadin-radio-group.hide-label vaadin-radio-button > label {
	display: none;
}

vaadin-grid::part(disabled) {
	color: var(--lumo-disabled-text-color);
	--disabled-filter: grayscale(1);
}

vaadin-grid::part(align-center) {
	text-align: center;
}

vaadin-grid::part(centerSmall) {
	padding: 0 7px;
	font-size: 11px;
	text-align: center;
}

vaadin-grid::part(highlight), vaadin-grid::part(v-grid-cell-highlight) {
	background-color: var(--lumo-contrast-10pct) !important;
}

vaadin-grid::part(marked), vaadin-grid::part(v-grid-row-marked) {
	color: red;
	font-weight: bold;
}

vaadin-grid::part(unsuccessful) {
	color: #E53935;
}

vaadin-grid::part(v-grid-row-ignored) {
	color: darkgray;
	font-weight: bold;
}

vaadin-grid::part(v-grid-row-strong) {
	font-weight: bold;
}

vaadin-grid::part(cancelled) vaadin-progress-bar {
	border-radius: none;
	border: none;
	background-image: -webkit-linear-gradient(#DFDFDF, #DFDFDF);
	background-image: -moz-linear-gradient(#DFDFDF, #DFDFDF);
	background-image: linear, false, zip(#DFDFDF #DFDFDF);
	background-color: #DFDFDF;
}

vaadin-list-box.shade-selection vaadin-item[selected] {
	background-color: var(--lumo-shade-10pct);
}

vaadin-list-box.shade-selection vaadin-item[selected]:hover {
	background-color: var(--lumo-primary-color-10pct);
}

vaadin-list-box.big-checkmark vaadin-item::part(checkmark)::before {
	font-size: var(--lumo-icon-size-l);
}

.arrow {
    position: absolute;
    top: 20px;
    left: 50px;
    transform: translate(-50%, -50%);
    transform: rotate(-90deg);
    cursor: pointer;
}

.arrow span {
    display: block;
    width: 12px;
    height: 12px;
    border-bottom: 4px solid #ef8030;
    border-right: 4px solid #ef8030;
    transform: rotate(45deg);
    margin-top: -8px;
    animation: animate 2s infinite;
}

.arrow span:nth-child(2) {
    animation-delay: -0.2s;
}

.arrow span:nth-child(3) {
    animation-delay: -0.4s;
}

.animated-arrow {
	margin-top:-40px;
}
@keyframes animate {
    0% {
        opacity: 0;
        transform: rotate(45deg) translate(-10px, -10px);
    }
    50% {
        opacity: 1;
    }
    100% {
        opacity: 0;
        transform: rotate(45deg) translate(10px, 10px);
    }
}

.pipeline_action {
	color: #9484df;
	height: 26px;
	width: 26px;
	padding:5px;
	border: 1px solid #9484df;
	margin-left:-10px;
	-webkit-border-radius: var(--lumo-border-radius-l);
	-moz-border-radius: var(--lumo-border-radius-l);
	border-radius: var(--lumo-border-radius-l);
	box-shadow: 0 0 0 1px var(--lumo-shade-5pct), var(--lumo-box-shadow-xs);
}

.pipeline_action_inactive {
	color: var(--lumo-disabled-text-color);
	height: 26px;
	width: 26px;
	padding:5px;
	border: 1px solid var(--lumo-disabled-text-color);
	margin-left:-10px;
	-webkit-border-radius: var(--lumo-border-radius-l);
	-moz-border-radius: var(--lumo-border-radius-l);
	border-radius: var(--lumo-border-radius-l);
	box-shadow: 0 0 0 1px var(--lumo-shade-5pct), var(--lumo-box-shadow-xs);
}

.uppercase {
	text-transform: upppercase;
}

.inactive {
	color: #bdbdbd;
}

.borders {
	border:thin solid black;
}

.read-only-text-label {
	color: var(--vaadin-input-field-label-color, var(--lumo-secondary-text-color));
    font-weight: var(--vaadin-input-field-label-font-weight, 500);
    font-size: var(--vaadin-input-field-label-font-size, var(--lumo-font-size-s));
}