:root {
	--primary-color: #00456E;
	--secondary-color: #00A2D2;
	--tertiary-color: #575756;
}

body .ui-datatable thead th {
    background: #efefef !important;
}

body .ui-datatable .ui-widget-content:hover {
	background: rgba(0, 0, 0, .02);			
}


body .ui-datatable .ui-datatable-data>tr.selected {
  background-color: #cce5ff !important;
}

.btn-success {
	background-color: var(--secondary-color) !important;
	border-color: var(--secondary-color) !important;
}

.btn-success:hover {
	background-color: #2196f3 !important;
	border-color: #2196f3 !important;
}

.label-rounded {
	border-radius: 4px !important;				
}

.btn-dark {
	border-radius: 4px !important;
}

.btn-success:not(.btn-rounded):not(.btn-circle):not(.floating-btn) {
    border-radius: 4px !important;
}

.btn-success:hover:not(.btn-rounded):not(.btn-circle):not(.floating-btn) {
    border-radius: 4px !important;
}

.btn-info:not(.btn-rounded):not(.btn-circle):not(.floating-btn) {
    border-radius: 4px !important;
}

.btn-info:hover:not(.btn-rounded):not(.btn-circle):not(.floating-btn) {
    border-radius: 4px !important;
}

.btn-primary:not(.btn-rounded):not(.btn-circle):not(.floating-btn) {
    border-radius: 4px !important;
}

.btn-primary:hover:not(.btn-rounded):not(.btn-circle):not(.floating-btn) {
    border-radius: 4px !important;
}

.btn-dark:not(.btn-rounded):not(.btn-circle):not(.floating-btn) {
    border-radius: 4px !important;
}

.btn-dark:hover:not(.btn-rounded):not(.btn-circle):not(.floating-btn) {
    border-radius: 4px !important;
}

.btn-danger:not(.btn-rounded):not(.btn-circle):not(.floating-btn) {
    border-radius: 4px !important;
    background-color: #f62d51 !important;
}

.btn-danger:hover:not(.btn-rounded):not(.btn-circle):not(.floating-btn) {
    border-radius: 4px !important;
}






.label-danger {
  background-color: #DC2626 !important;
}

div.card-radius .card-header {
	border-top-left-radius: 12px;
  	border-top-right-radius: 12px;	
}

video {
	width: 100%;
	max-height: 100%;		
}

.navbar-header {
	border-width: 0px !important;
}

.ui-widget {
	font-size: .875rem;
	font-family: "Nunito Sans",sans-serif;
}

body .ui-widget {
	font-size: .875rem;
	font-family: "Nunito Sans",sans-serif;
}

body .ui-widget:hover {
	text-decoration: none;
}		


body .ui-commandlink, body .ui-link {
	color: inherit !important;
}

body .btn {
	color: white !important;
}

a {
	color: #3e5569;
}        		

body .p-datepicker .ui-inputfield {
	padding: 0 !important;
	border: none !important;
	width: 100%;
}        

body .ui-selectcheckboxmenu .ui-selectcheckboxmenu-label-container {
	padding: inherit !important;
}

body .ui-selectcheckboxmenu {
    border: 1px solid #e9ecef;
    border-radius: 0; 
    min-height: 1.5em;

}

.ui-selectcheckboxmenu-multiple-container {
	min-height: inherit;
}

body .ui-selectcheckboxmenu .ui-selectcheckboxmenu-multiple-container.ui-inputfield {
	padding: 0px;
}        

body .ui-dialog .ui-dialog-titlebar {
	color: #fff;
	font-weight: bold;
}

.ui-dialog.ui-widget-content .ui-dialog-titlebar {
	padding: 9px 15px;
	border-bottom: 1px solid #eee;
	background-color: #00466d;
}   

body .ui-commandlink.btn, body .ui-link.btn {
	color: #fff;
}

body .ui-commandlink.btn:hover, body .ui-link.btn:hover {
	color: #fff;
}      

body .ui-button.btn-info {
	background-color: #00466d;
	border-color: #00466d;
	border-radius: 4px !important;
}  

body .ui-button.btn-dark {
	background-color: #343a40;
	border-color: #343a40;
}


body .ui-button.btn-info:hover {
	background-color: #0346ff;
	border-color: #0041f5;
}  

body .ui-button.btn-dark:hover {
	background-color: #23272b;
	border-color: #1d2124;
}

body .ui-button.btn-secondary {
	background-color: var(--secondary-color);
	border-color: var(--secondary-color);
}

body .ui-button.btn-secondary:hover {
	background-color: #2196f3;
	border-color: #2196f3;
}

body .btn-sighra-secondary {
	background-color: var(--secondary-color);
	border-color: var(--secondary-color);
	color: #fff;
}

body .btn-sighra-secondary:hover {
	background-color: #2196f3;
	border-color: #2196f3;
	color: #fff;
}


body .ui-messages > div {
  padding: 0.5rem;
  margin: 0.5rem 0;
  border-radius: 4px;
}		

body .ui-messages .ui-messages-info .ui-messages-info-icon {
	margin: -0.5rem 0.5rem 0 0 !important;
}

body .ui-messages .ui-messages-error .ui-messages-error-icon {
	margin: -0.5rem 0.5rem 0 0 !important;
}

body .ui-messages .ui-messages-warn .ui-messages-warn-icon {
	margin: -0.5rem 0.5rem 0 0 !important;
}

body .ui-messages .ui-messages-fatal .ui-messages-fatal-icon {
	margin: -0.5rem 0.5rem 0 0 !important;
}


.ui-messages-info-icon, .ui-messages-warn-icon, .ui-messages-error-icon, .ui-messages-fatal-icon {
	margin-top: -8px;
	margin-right: 8px;
}

body .ui-inputfield  {
	padding: .375rem .75rem;	
	font-size: .875rem;
	color: #4F5467;
	border: 1px solid #e9ecef;
	border-radius: 2px;
	transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;				
}     

body .ui-dialog .ui-dialog-content {
	padding: 1rem 0.5rem 0.5rem 1rem;
}		


body .ui-chkbox .ui-chkbox-box {
	width: 1.0rem;
	height: 1.0rem;			
} 

body .ui-icon {
	font-size: 0.7rem;
}

body .ui-chkbox .ui-chkbox-box .ui-chkbox-icon {
	margin-left: -0.4rem;
}

body .ui-tree .ui-tree-container .ui-treenode .ui-treenode-content.ui-state-highlight {
	background: none !important;
}

body .ui-tree {
	border: none !important;
	padding: 0;
}
		
@media screen and (max-width: 768px) {
	
	.modal-lg { 
  		width: 90% !important;
  		max-width: none; 
  	}
  	
  	.modal-md { 
  		width: 90% !important;
  		max-width: none; 
  	}
  	
  	.modal-sm { 
  		width: 90% !important;
  		max-width: none; 
  	}
  	
}		

@media screen and (min-width: 1024px ) {
	
	.modal-lg { 
  		width: 75% !important;
  		max-width: none; 
  	}
  	
  	.modal-md { 
  		width: 60% !important;
  		max-width: none; 
  	}
  	
  	.modal-sm { 
  		width: 50% !important;
  		max-width: none; 
  	}
  	
}

.diaDisponivel { background: #81c784; }
.diaNaoDisponivel { background: #ef9a9a; }
.ui-datepicker-calendar .ui-state-disabled { opacity: .2; }
   
body .ui-datepicker .ui-datepicker-calendar td.ui-datepicker-today {
	background: inherit !important;
}     
        
        
.loading-icon {
   font-size: 3rem;
   color: var(--primary-color);
}

.video-mosaic {
	display: grid;
	gap: 1px;
	grid-template-columns: repeat(3, 1fr);
	min-height: 200px;
	background-color: #323232;
	color: #000;
}

.video-mosaic-item {
	background-color: #000;
	color: #fff;
	border-radius: 5px;
	padding: 10px;
	font-size: 150%;
	
}

.video-mosaic-alerta {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	background-color: #323232;
	justify-content: center;
	row-gap: 0.3em;
	column-gap: 0.3em;
	padding: 0.7em;
}	

.video-mosaic-alerta2 {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	background-color: #323232;
	justify-content: center;
	row-gap: 0.3em;
	column-gap: 0.3em;
	padding: 0.7em;
	height: 100%
}	
	
[draggable] {
user-select: none;
}		

.video-alerta {
	text-align: center;
	cursor: move;
}

.video-alerta.over {
	border: 3px dotted #666;
}

.video-js {
	width: 100% !important;
	border-radius: 5px;
}

.chat-list {
	margin: 0px;
}

.chat-list .chat-item {
	margin-top: none !important;
}

.chat-list .chat-item .chat-content {
	padding-left: 0px !important;
}

.chat-list .chat-item .chat-time {
	margin-left: 0px !important;
}

.videoOverlay {
    background-color: #00456e;
    color: white;
    z-index: 1000;
    border-radius: 5px;
    position: absolute;
    text-align: center;
    margin: 5px;
    padding: 5px;
}	

body .ui-paginator {
	border: 0px;
}

.ui-datatable {
	border-radius: 15px;
}

.ui-datatable-tablewrapper {
    border-radius: 15px 15px 0px 0px;
}

body .ui-datatable .ui-paginator.ui-paginator-bottom {
    border-radius: 0px 0px 15px 15px !important;
}

.page-wrapper {
	display: block;
}

.bg-sighra-primary {
/* 	background-color: #00456E !important;*/
	background: linear-gradient(to right, #00456E, #000000);
}

.bg-sighra-secondary {
/*	background-color: var(--secondary-color) !important;*/
	background: linear-gradient(to right, #00456E, var(--secondary-color));
}

.bg-sighra-tertiary {
/*	background-color: #343a40 !important;*/
	background: linear-gradient(to right, #000000, #575756);
}

.card-radius {
	border-radius: 15px;
}

.btn-radius {
	border-radius: 4px;
}

.bg-sighra-danger {
/*	background-color: #bf0603 !important;*/
	background: linear-gradient(to right, #991B1B, #DC2626);				
}

.bg-sighra-offline {
/*	background-color: #bf0603 !important;*/
	background: linear-gradient(to right, #000000, #575756);				
}



#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; 
}

#main-wrapper[data-layout="vertical"] .topbar .navbar-collapse[data-navbarbg="skin1"], #main-wrapper[data-layout="vertical"] .topbar[data-navbarbg="skin1"], #main-wrapper[data-layout="horizontal"] .topbar .navbar-collapse[data-navbarbg="skin1"], #main-wrapper[data-layout="horizontal"] .topbar[data-navbarbg="skin1"] {
  background: linear-gradient(to right, #00456E, #000000) !important;
}

.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;
/*	background: linear-gradient(to right, #00456E, #000000);*/
	background: linear-gradient(to right, #00456E, var(--secondary-color));
}

.bg-crit-20 {
	background-color: #fdcc55 !important;
	background: linear-gradient(to right, #FDD835, #fdcc55);
}

.bg-crit-30 {
	/*background-color: #dc0000 !important;*/
	background-color: #fd8c00 !important;
	background: linear-gradient(to right, #fd8c00, #FFA726);
}

.bg-crit-99 {
/*	background-color: #bf0603 !important;*/
	background: linear-gradient(to right, #991B1B, #DC2626);
}

.crit-1 {
	color: var(--blue-400);
	font-weight: bold;
}

.crit-10 {
	color: #00456E;
	font-weight: bold;
}

.crit-20 {
	color: #FDD835;
	font-weight: bold;
}

.crit-30 {
	color: #fd8c00;
	font-weight: bold;
}

.crit-99 {
	color: #991B1B;
	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: #00456E;
	color: white !important;
	font-weight: bold;
}

.crit-status-20 {
	background-color: #FDD835;   
	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: #991B1B;
	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: 1000;
	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: var(--secondary-color) !important;
    border-color: var(--secondary-color) !important;
    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;
}

body.no-scroll {
	overflow: hidden;
}		

body .ui-dialog {
  border-radius: 8px;
}


body .ui-dialog.ui-confirm-dialog .ui-dialog-content > span {
  margin: 1rem 0rem 0rem 0rem !important;
}


.ui-autocomplete {
 	border: none !important;
    padding: 0; /* Remove unnecessary padding */
    background: none;	
}

.ui-autocomplete-input {
    width: 100%;                 /* Full width inside input-group */
}


/* Remove PrimeFaces-specific button styles */
.ui-button, 
.ui-button.ui-widget {
    border: none !important;
    padding: 0 !important;
    box-shadow: none !important;
}

/* Ensure PrimeFaces buttons behave like Bootstrap buttons */
.ui-button-text-only {
    width: auto;
    padding: 0.375rem 0.75rem; /* Bootstrap button padding */
    font-size: 1rem;
    line-height: 1.5;
    border-radius: 0.25rem; /* Bootstrap border radius */
    color: #fff;
    border: 1px solid transparent;
}

/* Align buttons inside Bootstrap input groups */
.input-group > .ui-button {
    margin-left: -1px; /* Prevent double borders */
    border-radius: 0 0.25rem 0.25rem 0; /* Adjust corner radius */
}

.ui-icon {
	font-size: inherit !important;
}

.ui-autocomplete-input.ui-state-disabled {
    background-color: #e9ecef !important; /* Bootstrap's disabled background */
    opacity: 1 !important; /* Remove PrimeFaces default transparency */
    color: #6c757d !important; /* Bootstrap's disabled text color */
    cursor: not-allowed; /* Consistent disabled cursor */
}

/* Optional: Override the wrapper for extra consistency */
.ui-autocomplete.ui-state-disabled {
    background: none !important;
    border: none !important;
    padding: 0 !important;
}

/* Ensure no extra styling for hover/focus on disabled input */
.ui-autocomplete-input.ui-state-disabled:hover,
.ui-autocomplete-input.ui-state-disabled:focus {
    box-shadow: none !important;
    outline: none !important;
}

.ui-dataview-header {
	visibility: hidden;				
}

.ui-dataview-layout-options {
	visibility: hidden;
} 

body .ui-dataview .ui-dataview-header {
	padding: 0 !important;				
}


#modalMotorista .ui-dialog-content {
	overflow-x: hidden;
}

#modalJustificativa .ui-dialog-content {
	overflow-x: hidden;
}

.carousel-item {
    height: 400px !important;				
}

.carousel-item img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Ensures images fill the area without distortion */
}

/*
.overlay-btn {
    background-color: #00456e;
    color: white;
    z-index: 1000;
    border-radius: 5px;
    position: absolute;
    text-align: center;
    margin: 5px;
    padding: 5px;
}

.overlay-btn:hover {
    background: rgba(0, 0, 0, 0.9);
}*/

.overlay-btn {
    position: absolute;
    background: rgba(0, 0, 0, 0.4);
    color: white;
    border: none;
    padding: 10px 20px;
    border-radius: 5px;
    font-size: 16px;
    margin: 5px;
    padding: 5px;
    cursor: pointer;
    transition: background 0.3s ease;
    left: 50%;
    transform: translateX(-50%);
    width: 80%;
    text-align: center;
}

.overlay-btn:hover {
    background: rgba(0, 0, 0, 0.9);
}


.bottom-overlay {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(0, 0, 0, 0.6);
    color: white;
    width: 80%;
    text-align: center;
    padding: 10px;
    font-size: 14px;
    border-radius: 5px 5px 0 0;
}


/* Upper Right Overlay Button */
.overlay-top-right {
    position: absolute;
    top: 10px;
    right: 10px;
    background: rgba(0, 0, 0, 0.7);
    color: white;
    border: none;
    padding: 8px 12px;
    border-radius: 5%;
    font-size: 16px;
    cursor: pointer;
    transition: background 0.3s ease;
}

.overlay-top-right:hover {
    background: rgba(0, 0, 0, 0.9);
}


.no-volume::-webkit-media-controls-volume-slider,
.no-volume::-webkit-media-controls-mute-button {
    display: none !important;
}

.no-volume::-webkit-media-controls {
    overflow: hidden;
}

 .vjs-volume-panel, .vjs-volume-control, .vjs-mute-control {
    display: none !important;
}