html {
  /* default font-size is 16px - this is set in the default browser stylesheet */ 
  font-size: 13px;  
  line-height: 1.1; 
} 

body { 
  --dms-highlight: #5B788F;
  --dms-headerBackgroundColour: #a3a3a3;	
  --dms-headerTextColour: #FFFFFF;
  --dms-defaultFont: 'Roboto', sans-serif;
  --dms-defaultFontSize: 14px;
  
  font-family: var(--dms-defaultFont);
	font-size: var(--dms-defaultFontSize);
  -webkit-font-smoothing: antialiased;
	overflow-y: hidden;  
}
#hdr {
  background-color: #FFFFFF;
  color: #525252;
	
	/* test */
	height: auto;
	display: inline-block;
}

#ftr {
  background-color: #525252;
  color: #FFFFFF;
}
#ftrMenu input, #ftrMenu select, #hwlist, #applist  {
  color: #525252;
}
#hdr_projectname { 
  font-size: 18px; 
}
#hdr_companyname {  
  font-size: 11px; 
}
#userlanguage {
  color: #525252;
}
#hdr_menu {
	color: #FFFFFF;
  background-color: #a3a3a3;	
}
.dashboardhdritem {
	font-weight: 300;
	font-size: 10px;
}
#colour_ref {
  color: #FFFFFF;	
  background-color: #525252;
}

.fa-chevron-right, .fa-chevron-down, .toolbar-button {
  color: #525252;
}
.toolbar-button {
	color: #FFFFFF;
	padding: 0;
	border: none;
	background: none;	
	background-color: transparent;
}

.placeholder { 
  /* non - html5, jquery.placeholder.js  */
  color: #aaa;
}
.button-disabled {
  color: #aaa;
}
input[type="button"]:disabled {
  opacity: 0.65; 
}

/* bootstrap */

.dropdown-menu{
  --bs-dropdown-link-hover-bg: rgb(from var(--dms-highlight) r g b / .2) !important;
}

.btn-group-xs > .btn, .btn-xs {
	padding: 1px 5px;
	font-size: 12px;
	line-height: 1.5;
	border-radius: 3px;
}

.dropdown-menu {
	box-shadow: 0 6px 12px rgba(0,0,0,.175)
}

.dropdown-item:active {
	background-color: #5B788F;
}
/*
.btn svg path:not(.btn-outline-secondary svg line)  {
	fill: #525252 ;
}
.btn svg line:not(.btn-outline-secondary svg line) {
	stroke: #525252 ;
}
*/
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open .dropdown-toggle.btn-primary {  
	background-color: #5B788F;
  border-color: #0A0A0A;
	outline-color: #0A0A0A;
	box-shadow: 0 0 0 0.2rem rgba(100, 100, 100, 0.25);
	transition: all 200ms ease-in-out;
}
.btn-primary:hover {
	color: #FFFFFF;
	background-color: #7aabd1;
}
.btn-primary:active:focus {
	box-shadow:0 0 0 0.35rem  rgba(100, 100, 100, 0.25);
}
.btn-primary, .btn-primary:disabled {
  background-color: #5B788F;	
  border-color: #0A0A0A;
  
  --bs-btn-active-border-color: hsl(from #7aabd1 h s calc(l - 20));
  --bs-btn-active-bg: hsl(from #7aabd1  h s calc(l - 10));  
}
.btn-default:hover {
	background-color: #F4F4F4;
}
.btn-default:focus {
	box-shadow: 0 0 0 0.25rem rgba(100, 100, 100, 0.25);
}

.btn-close:focus {
	box-shadow: 0 0 0 0.25rem rgba(100, 100, 100, 0.25);
}

.toast-container {
  color: #525252;
}
.toast-header {
  background-color: #525252;
  color: #FFFFFF;
}
.btn-close-toast {
  /* filter: invert(0.5) hue-rotate(175deg) sepia(1) saturate(5) */
  
  filter: brightness(0) saturate(100%) invert(100%) sepia(6%) saturate(23%) hue-rotate(185deg) brightness(105%) contrast(106%);
}
.modus-header {
  background-color: #525252;
  color: #FFFFFF;  
}

.form-check-input:checked {
	background-color: #5B788F;
	border-color: #5B788F;
}
.form-control:focus, .form-select:focus, .form-check-input:checked:focus {
  border-color: #0A0A0A;
  box-shadow: 0 0 0 0.3rem rgba(100, 100, 100, 0.25);  /* rgba(40, 167, 69, 0.25); */
}
.form-check-input:focus {
  border-color: #0A0A0A;
	box-shadow: 0 0 0 0.25rem rgba(100, 100, 100, 0.25); /* rgba(40, 167, 69, 0.25); */
}
.form-switch .form-check-input:focus:not(:checked)  {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%280, 0, 0, 0.25%29'/%3e%3c/svg%3e");
}

.hdr_toolbarbtn, .hdr_toolbarbtn svg path {
	fill: #525252 ;
	color: #525252;
}
.hdr_toolbarbtn:hover, .hdr_toolbarbtn:focus, .hdr_toolbarbtn:active, .hdr_toolbarbtn.active, dropdown-toggle#hdr_userbtn-primary {  
  color: #FFFFFF;
	background-color: #5B788F!important;
  border-color: #0A0A0A;
	box-shadow: 0 0 0 0.2rem rgba(100, 100, 100, 0.25);
	transition: all 200ms ease-in-out;	
  --bs-bg-opacity: 0;
}
.hdr_toolbarbtn:active:focus {
	box-shadow:0 0 0 0.35rem  rgba(100, 100, 100, 0.25);
}

#ftrMenu .hdr_toolbarbtn, #ftrMenu .hdr_toolbarbtn svg path, #ftrMenu .hdr_toolbarbtn:hover  {
  color: #FFFFFF;
}


body {
  font-family: Arial, Helvetica, sans-serif
}

#hdr_topleft {
	height: 80px;
	padding-top: 0px;
}

#hdr_projectname { 
  padding-top: 16px;
}