.page-wrapper {
	display: block;
}

.bg-sighra-primary {
	background-color: #00466d !important;
}

.bg-sighra-secondary {
	background-color: #00A2D2 !important;
}

.bg-sighra-tertiary {
	background-color: #343a40 !important;
}

.card-radius {
	border-radius: 15px;
}

.bg-sighra-danger {
	background-color: #bf0603 !important;				
}


#main-wrapper[data-layout="horizontal"][data-boxed-layout="boxed"] .top-navbar, #main-wrapper[data-layout="horizontal"][data-boxed-layout="boxed"] .scroll-sidebar, #main-wrapper[data-layout="horizontal"][data-boxed-layout="boxed"] .page-wrapper {
  max-width: 100% !important;
  margin: 0 auto;
  position: relative; 
}

.sidebar-nav ul .sidebar-item .sidebar-link {
    white-space: normal !important;
}

.listaCheckBox{
    position: relative;    
    display: block;
    min-height: 1.5rem;
}

.chkFiltro > div.ui-chkbox-box span{
	color: #444466;
	border-radius: 1px;
    height: 14px;
    width: 14px;		    
}   

.chkFiltro > div.ui-chkbox-box > .ui-icon-check {
    background-position: -64px -145px;
}
   
.chkFiltroStatusAlerta > div.ui-chkbox-box span {
	background-color: #d0d048;
}	

.chkFiltroStatusAlarme > div.ui-chkbox-box span {
   background-color: #C11E07; 
}

.chkFiltroStatusParado > div.ui-chkbox-box span {
   background-color: #8c8c8c; 
}

.chkFiltroStatusOK > div.ui-chkbox-box span {
   background-color: #75A53A; 
}

.chkFiltroJornadaAlerta > div.ui-chkbox-box span {
   background-color: #d0d048; 
}

.chkFiltroJornadaAlarme > div.ui-chkbox-box span {
   background-color: #C11E07; 
}

.chkFiltroJornadaOK > div.ui-chkbox-box span {
   background-color: #75A53A; 
}

.chkFiltroJornadaDisponivel > div.ui-chkbox-box span {
   background-color: #CF9456; 
}

.chkFiltroJornadaHoraExtra > div.ui-chkbox-box span {
   background-color: #ff7e23; 
}

.chkFiltroJornadaForaTrabalho > div.ui-chkbox-box span {
   background-color: #8c8c8c; 
}

.chkFiltroJornadaIntersticio > div.ui-chkbox-box span {
   background-color: #5d3ab8; 
}

.cardCinza{
  background: #AAAAAA;
}

.cardAlerta {
	background: #d0d048;
	color: #ffffff;
}

.cardAlarme {
	background: #C11E07;
	color: #ffffff;
}

.cardTelemetria {
	background: #5d3ab8;
	color: #ffffff;
}

.cardAlerta .card-body, .cardAlarme .card-body, .cardTelemetria .card-body {
	padding: 0.5rem !important;	
}

.iconInfracao{
    display: inline-block;
    border-radius: 25px;
    padding: 0.0em 0.55em;
}

.iconAlerta {
	background: #d0d048;
    box-shadow: 0px 0px 2px #82800a;
}
    
.iconAlarme {
	background: #C11E07;
    box-shadow: 0px 0px 2px #820a0a;
}

.iconTelemetria {
	background: #cf2df6;
    box-shadow: 0px 0px 2px #820a82;
}

.col-centered {
    float: none;
    margin: 0 auto;
}

.card-eq-height {
	height: 90%;
}

.corJornadaLaranja{
	background-color: #ff7e23;
}
.corJornadaPreto{
	background-color: #000000;	
}
.corJornadaMarrom{
	background-color: #731d1d;	
}
.corJornadaVermelho{
	background-color: #C11E07;
}
.corJornadaAzul{
	background-color: #3232ff;
}
.corJornadaAmarelo{
	background-color: #d0d048;
}
.corJornadaBranco{
	background-color: #ffffff;
}
.corJornadaVerde{
	background-color: #00a200;
}
.corJornadaPrata{
	background-color: #c6c6c6;
}
.corJornadaCinza{
	background-color: #8c8c8c;
}
.corJornadaDourado{
	background-color: #b29600;
}
.corJornadaRoxo{
	background-color: #5d3ab8;
}

.filtroTipoMacro {
	height: 23px !important;
	font-size: 12px !important;
    text-align: center !important;
    width: 150px !important;
}

.filtroTipoMacro > .ui-selectonemenu-label {
	height: 20px !important;
	width: 130px !important;
	padding-top: 2px !important;
}

.filtroData > input {
	height: 23px !important;
	font-size: 12px !important;
    text-align: center !important;
    width: 100px !important;
    float: left;
}


.filtroData > button {
	height: 23px !important;
    width: 23px !important;
}

.filtroData > button > .ui-button-text {
	height: 23px !important;
    width: 23px !important;
}

.filtroDataHora > input {
	height: 23px !important;
	font-size: 12px !important;
    text-align: center !important;
    width: 150px !important;
    vertical-align: text-bottom;
}

.filtroDataHora > button {
	height: 23px !important;
    width: 23px !important;
}

.filtroDataHora > button > .ui-button-text {
	height: 23px !important;
    width: 23px !important;
}

.motivoTratamento {
	height: 23px !important;
	font-size: 12px !important;
    width: 100% !important;
}

.motivoTratamento > .ui-selectonemenu-label {
	height: 20px !important;
	width: 100% !important;
	padding-top: 2px !important;	
}

.observacoesTratamento {
	width: 100% !important;
	height: 50px !important;
	padding-top: 2px !important;	
}

.historicoTratamento {
	width: 100% !important;
	height: 80px !important;
	padding-top: 2px !important;	
}

.cardHeaderTrataInfracao{
	height: 47px;
}
    
.tituloCardJornada{
	float: left;
}    

.cardTrataAlerta{
	background-color: #d0d048 !important; 
	color: black !important;
}

.cardTrataAlarme{
	background-color: #C11E07 !important; 
	color: black !important;
}

.cardTrataTelemetria{	
	background-color: #5d3ab8 !important; 
	color: black !important;
}

.card .card-tratamento {
    border: 1px solid;
    border-color: rgba(0, 0, 0, 0.11);
    border-radius: 5px;
}

.card-tratamento-header {
    background-color: rgba(0, 0, 0, 0.11) !important;
    border-color: rgba(0, 0, 0, 0.11) !important;
	padding: 5px;	
}
	
.ui-selectonemenu-panel .ui-selectonemenu-list {
	z-Index: 2000;
}

.inputText{
    height: 23px !important;
    font-size: 12px !important;
    text-align: center !important;
    width: 150px !important;
    vertical-align: text-bottom;	
	cursor: text;
    background: none #ffffff;
    border: 1px solid #cccccc;
    border-radius: 3px;
}

input[type="radio"] {
  display: none;
}

input[type="radio"] + label:before {
  content: "";
  /* create custom radiobutton appearance */
  display: inline-block;
  width: 15px;
  height: 15px;
  padding: 3px;
  margin-right: 5px;
  /* background-color only for content */
  background-clip: content-box;
  border: 1px solid #bbbbbb;
  background-color: #e7e6e7;
  border-radius: 50%;
}

input[type="radio"]:checked + label:before {
  background-color: #2962ff;
}

*,
*:before,
*:after {
  box-sizing: border-box;
}

.sound-signal label {
  display: inline-flex;
  align-items: center;
}

.btn-primary {
    color: #fff !important;
    background-color: #2962ff !important;
    border-color: #2962ff !important;
}

.mt-n10{
	margin-top: -10px !important;
}

.page-wrapper {
     min-height: 250px;
}

@media screen and (max-width: 600px) {
	.ml-sm-n20{
		margin-left: -40px !important;
	}
}

.btn-circle.btn-sm, .btn-group-sm > .btn-circle.btn {
	width: 25px;
	height: 25px;
	font-size: 12px;
	padding: 3px 3px;
}

.table-ranking {
	margin-bottom: 0rem;				
}

.table-ranking td, th {
    text-align: left;
}
.table-ranking th:first-child, td:first-child
{
  position:sticky;
  left:0px;
 
}
.table-ranking td:first-child
 {
  background-color: #f8f9fa;
 }
.table-ranking td:nth-child(2)
 {
  background-color: #f8f9fa;
 }
.table-ranking td {
	padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

.table-ranking thead th {
    border-bottom: 0px;
}

.h-90{
	height: 90% !important;				
}

.map {
  position: relative;
  /*border: 1px solid black;*/
  border-radius: 8px;
  height: 400px;  /* or as desired */
  width: 100%;  /* This means "100% of the width of its container", the .col-md-8 */
}

.card-equal {
	background-color: #FFFFFF;
	padding: 0;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.3);				
}

.card-dashboard {
	max-height: 200px;
}

.card-body-dashboard {
	height: 300px;				
} 

#graficoRankingInfracoes tspan {
	font-size: 9px!important;
}

/*.form-control:focus {
	border-color: #ced5db233236239;
}*/

.form-group {
    margin-bottom: 0.25rem;
}

/*
select.form-control{
	padding: 0px;				
}
*/

.col-form-label{
	padding-top: 0px;				
}

.bg-cinza {
	background-color: #f7f7f7 !important; 
} 

/*.card-header {
    padding-left: 7px;			
}*/

.lblCheckBox {
	font-size: small;				
}

.modal-header{
	background-color: #ffffff;
}

.col-form-labell{
	text-align:center;
}

.button-ativo{
	margin-left: 380px;
	margin-top: -28px;

}

.top-form{
	margin-top:40px;
}

.card-dados{
	background: #eee;
	border-radius: 5px;
}

.vertical { 
  border-left: 2px solid #eee; 
  height: 140px; 
  position:absolute; 
  left: 50%; 
} 


.fieldset-form {
	padding: 5px;
	border:1px solid #ccc;	
}

.fieldset-form-left {
	margin-left: -4px;
}

/*.fieldset-form-legend {
	width: 70%;
}*/

.center{
	text-align: center;
	
}

.table-overflow{	
  	height: 200px;
    overflow-y: scroll;
    
}

.mdi-fw {
	margin-left: 1px;
	text-align: center;
    width: 1.25em;	
}

.overflow-hidden {
	overflow: hidden !important;
}

.d-contents {
	display: contents;
}

.label-selecao-grupo {
    width: 80%;
    display: block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;				
}

.lista-selecao-grupo {
	overflow-y: hidden;				
}

.lista-selecao-grupo:hover {
	overflow-y: scroll;		
	z-index: 9999;			
}

.logo-img {
	margin-left: calc(22rem - 100%);
}	

html[dir="ltr"] body .m-t-60 {
  margin-top: 60px; 
}

/* width */
::-webkit-scrollbar {
  width: 10px;
}

/* Track */
::-webkit-scrollbar-track {
  box-shadow: inset 0 0 1px #c3c3c3;
  border-radius: 10px;
}
 
/* Handle */
::-webkit-scrollbar-thumb {
  background: #c9c9c9; 
  border-radius: 10px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #808080; 
}

.jsgrid-grid-body, .jsgrid-grid-header {
    overflow-y: hidden !important;
}

.jsgrid-no-wrap-cell{
	white-space: normal;				
}

.ranking-faixa {
	background-color: #ffffcd;				
}

.ranking-pontuacao {
	background-color: #cde0ff;				
}

@media (max-width: 767px) {
	.no-border-left-xs{
		border-left: none !important;				
	}				
}

.conteudo-grid-ranking {
	font-size: 11px;				
}

#graficoInfracoes1 {
  float: right;
}
.legend-donut {
  float: right;
  list-style-type: none;
  margin-top: 45px;
}
span.colorDot {
  font-size: 20pt;
}
.jqplot-grid-canvas{
	display: none;
}

.list-group-item.active {
    z-index: 2;
    color: #fff;
    background-color: #b2d8e8;
    border-color: #b2d8e8; 
}

.my-custom-list-item{
    position: relative;
    display: flex;
    align-items: stretch;
    width: 100%;
    margin-bottom: -2px;	
}

/*
.active span {
    background: none !important;
}*/

.btn-movimentacao {
	margin-bottom: 4px;
}



.ui-diagram-element {
	width: 12em;
	height: 5em;    
    text-align: center;    
    border-radius: 4px;
    border: 1px solid transparent;
    background-color: #3D6EFF;
    color: #ffffff;			
   	text-align: center;      	
}		

.ui-diagram-element:hover {
        border-color: #f44336;
}

.ui-diagram-element-select {		        
	border-color: #f44336;
}

.ui-diagram-fail {
	background-color: #C34A2C;
 	color: #ffffff;
}

.flow-label_1 {
	font-size: 12px;
    font-weight: bold;
    color: #f8f9fa;
    
}

.flow-label_2 {
	font-size: 12px;
    font-weight: bold;
    color: #f8f9fa;
    
}

.flow-label_3 {
	font-size: 12px;
    font-weight: bold;
    color: #f8f9fa;
    
}

.ui-diagram-entrada_0 {
    background-color: #FF7e23;
    color: #ffffff;		       
}

.ui-diagram-entrada_1 {
    background-color: #075e54;
    color: #ffffff;		       
}

.ui-diagram-entrada_2 {
    background-color: #0C5FA1;
    color: #ffffff;		       
}

.ui-diagram-entrada_3 {
    background-color: #5d3ab8;
    color: #ffffff;		       
}

.ui-diagram-entrada_4 {
    background-color: #AA0707;
    color: #ffffff;		       
}

.ui-diagram-entrada_5 {
    background-color: #2d8aef;
    color: #ffffff;		       
}

.ui-diagram-entrada_6 {
    background-color: #00899e;
    color: #ffffff;		       
}		    

.ui-diagram-entrada_7 {
    background-color: #00a200;
    color: #ffffff;		       
}

.ui-diagram-entrada_8 {
    background-color: #be1e4a;
    color: #ffffff;		       
}

.ui-diagram-entrada_9 {
    background-color: #d34826;
    color: #ffffff;		       
}

.ui-diagram-entrada_10 {
    background-color: #78D3CA;
    color: #ffffff;		       
}

.ui-diagram-entrada_11 {
    background-color: #263f6a;
    color: #ffffff;		       
}

.ui-diagram-entrada_12 {
    background-color: #e32119;
    color: #ffffff;		       
}

.ui-diagram-entrada_13 {
    background-color: #9B74A2;
    color: #ffffff;		       
}

.ui-diagram-entrada_14 {
    background-color: #0096d6;
    color: #ffffff;		       
}

.ui-diagram-entrada_15 {
    background-color: #ddb321;
    color: #ffffff;		       
}

.ui-diagram-entrada_16 {
    background-color: #680021;
    color: #ffffff;		       
}

.ui-diagram-entrada_17 {
    background-color: #50212d;
    color: #ffffff;		       
}


.video-wrapper {
	display: grid;
    gap: 1px;
	grid-template-columns: 33% 33% 33%;
    min-height: 200px;
	background-color: #fff;
	color: #000;
}

.video-box {
	background-color: #000;
	color: #fff;
	border-radius: 5px;
	padding: 5px;
	font-size: 150%;
}

.video-event-wrapper {
	display: grid;
    gap: 1px;
	grid-template-columns: 50% 50%;
    min-height: 200px;
	background-color: #fff;
	color: #000;
}

.bg-online {
	background-color: #307351 !important;
}

.text-online {
	color: #307351 !important;
	font-weight: bold;
}

.bg-crit-1 {
	background-color: var(--blue-400) !important;
}

.bg-crit-10 {
	background-color: #00466d !important;
}

.bg-crit-20 {
	background-color: #fdcc55 !important;
}

.bg-crit-30 {
	/*background-color: #dc0000 !important;*/
	background-color: #fd8c00 !important;
}

.bg-crit-99 {
	background-color: #bf0603 !important;
}

.crit-1 {
	color: var(--blue-400);
	font-weight: bold;
}

.crit-10 {
	color: #00466d;
	font-weight: bold;
}

.crit-20 {
	color: #fdcc55;
	font-weight: bold;
}

.crit-30 {
	color: #fd8c00;
	font-weight: bold;
}

.crit-99 {
	color: #bf0603;
	font-weight: bold;
}

.crit-status-1 {
	background-color: var(--blue-400);
	/* border-color: #6c757d; 
	color: #6c757d !important;*/
	color: white !important;
	font-weight: bold;
}
.crit-status-10 {
	background-color: #00466d;
	color: white !important;
	font-weight: bold;
}

.crit-status-20 {
	background-color: #fdcc55;   
	color: white !important;
	font-weight: bold;
}

.crit-status-30 {
	background-color: #fd8c00;        	
	color: white !important;
	font-weight: bold;
}

.crit-status-99 {
/*	background-color: #8d0801;*/
	background-color: #bf0603;
	color: white !important;
	font-weight: bold;
}


.mosaico-alerta {
    display: grid;
    width: 100%;
    grid-template-columns: repeat(3, 1fr);
    background-color: #323232;
    margin: 0;
    padding: 0.1rem;
}

.mosaico-alerta-item {
    width: auto;
    text-align: center;
    margin-top: 0px;
    margin-left: 0px;    
    min-height: 1rem;
    padding: 0.1rem;
}

.mosaico-alerta-item.over {
	border: 3px dotted #666;
}

.mosaico-alerta-poster {
    width: auto;
    text-align: center;
    color: gray;
	background-color: #383838;
    
    margin: 2px;
        
    min-height: 224px;
    padding: 2rem;
    
  	display: flex;
  	justify-content: center;
  	align-items: center;    
}    
.mosaico-video {
	width: 100%;
	object-fit: contain !important; /* Adjust as needed (cover, contain, fill, etc.) */	
	height: 224px;
	margin: 0;
	padding: 0;
}

.mosaico-alerta-overlay {
	background-color: #00456e;
	color: white;
	z-index: 2147483647;
	border-radius: 5px;
	position: absolute;
	text-align: center;
	margin: 5px;
	padding: 5px;
}

.hidden {
	display: none;
}

.grid-mapa {
	font-size: 12px;
}

/* Ensure the button is always on top */
.floating-btn {
    position: fixed; /* Position the button relative to the viewport */
    bottom: 20px;    /* Distance from the bottom of the viewport */
    right: 20px;     /* Distance from the right of the viewport */
    width: 60px;     /* Width of the button */
    height: 60px;    /* Height of the button */
    background-color: #00466d; /* Background color */
    color: white;    /* Text color */
    border: none;    /* Remove default border */
    border-radius: 50%; /* Make the button circular */
    font-size: 24px; /* Font size of the button text */
    box-shadow: 0 4px 8px rgba(0,0,0,0.2); /* Add shadow for floating effect */
    display: flex;   /* Center the text */
    align-items: center; /* Center the text vertically */
    justify-content: center; /* Center the text horizontally */
    cursor: pointer; /* Pointer cursor on hover */
    transition: background-color 0.3s, box-shadow 0.3s; /* Smooth transition */
}

/* Optional: Add hover effect */
.floating-btn:hover {
    background-color: #0056b3; /* Darker background on hover */
    color: white;
    box-shadow: 0 6px 12px rgba(0,0,0,0.3); /* Larger shadow on hover */
}



.w-30 {
  width: 30% !important;
}

.w-35 {
  width: 35% !important;
}

.w-40 {
  width: 40% !important;
}

.w-45 {
  width: 45% !important;
}

.w-55 {
  width: 55% !important;
}

.w-60 {
  width: 60% !important;
}

.w-65 {
  width: 65% !important;
}

.w-70 {
  width: 70% !important;
}

.w-80 {
  width: 80% !important;
}

.w-85 {
  width: 85% !important;
}

.w-90 {
  width: 90% !important;
}

.w-95 {
  width: 95% !important;
}