@import url('https://fonts.googleapis.com/css2?family=Barlow:wght@400;500&family=Open+Sans&display=swap');

:root
{
  --IANivelAlertaAlto: rgba(251, 186, 168, 1);
  --IANivelAlertaBaixo: rgb(215, 255, 215, 1);
  --IANivelAlertaExtremo: rgba(255, 20, 0, 0.5);
  --IANivelAlertaIgnorar: rgba(255, 255, 255, 1);
  --IANivelAlertaMedio: rgba(255, 232, 118, 0.6);
  --LinhaAlarme: rgba(246, 64, 50, 0.85);
  --LinhaAtencao: rgba(255, 173, 50, 0.85);  
  --NivelAlertaIgnorar: rgb(195, 195, 195); 
  --NivelAlertaMedio: rgba(255, 173, 50, 0.85);
  --NivelAlertaMedioOpaco: rgba(255, 173, 50, 0.5);  
  --azul: #09a5c7;
  --caminhaoAmarelo: rgba(190,179,37,0.6);
  --caminhaoAzul: rgba(7,8,151,0.6);
  --caminhaoLaranja: rgba(243,179,10,0.6);
  --caminhaoMarom: rgba(128,67,1,0.6);
  --caminhaoPreto: rgba(40,40,40,0.6);
  --caminhaoRoxo:  rgba(137,5,148,0.6);
  --caminhaoVerde: rgba(0,167,3,0.6);
  --caminhaoVerdeClaro: rgba(180,243,39,0.6);
  --caminhaoVermelho: rgba(212,2,53,0.6);
  --cinzaclaro: #dbdbdb;
  --cinzaescuro: #545454;
  --cinzinha: #ececec;
  --default: rgba(245,229,2,0.6);
  --degradeDireita: rgb(32,89,132);
  --degradeEsquerda: rgb(5,219,227);
  --linhaGridAtiva: rgba(144, 255, 155, 0.85);
  --linhaGridJornadaMarcacaoAdicionada: rgba(144, 255, 155, 0.85);  
  --linhaGridJornadaMarcacaoAdicionadaOpaco: rgba(144, 255, 155, 0.5);
  --linhaGridSMAtrasada: rgba(244, 67, 54, 0.85);
  --linhaGridSMAtrasadaOpaco: rgba(244, 67, 54, 0.5);
  --linhaGridSMComProblemasNaInicializacao: rgba(156, 39, 176, 0.85);
  --linhaGridSMComProblemasNaInicializacaoOpaco: rgba(156, 39, 176, 0.5);
  --linhaGridSMComAdequacao: rgba(232, 71, 213, 0.85);
  --linhaGridSMComAdequacaoOpaco: rgba(232, 71, 213, 0.5);  
  --linhaGridSMComManutencao: rgba(253, 236, 1, 0.85);
  --linhaGridSMComManutencaoOpaco: rgba(253, 236, 1, 0.5);    
  --linhaStatusIntegracaoAlerta: rgba(255, 193, 7, 0.85);  
  --linhaStatusIntegracaoOK: rgba(144, 255, 155, 0.85);
  --linhaStatusIntegracaoParado: rgba(244, 67, 54, 0.85);
  --linhaTipoNaoRastrear: rgba(133, 132, 132, 0.9);
  --nivelGridManutencao: rgba(123, 236, 252, 0.85);
  --nivelGridManutencaoOpaco: rgba(123, 236, 252, 0.5);
  --nivelGridTipoNaoRastrear: rgba(133, 132, 132, 0.9);
  --nivelGridTipoNaoRastrearOpaco: rgba(133, 132, 132, 0.6);
}

html, body
{
  margin: 0;
  padding: 0;
  height: 100vh;
  width: 100vw;
}

header
{
  margin: 0;
}

.barraDegradeATS
{
  background-image: linear-gradient(to right, rgb(32, 89, 132) , rgb(5, 219, 227)); 
}

.barraDegradeKMM
{
  background-color: #424449;
}

.ImagemFundo
{
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus 
{
  transition: background-color 50000s, color 50000s, background-image 50000s, appearance 50000s;
}

.Invisivel
{
  padding:0px !important;
  min-width:0px !important;
  max-width:0px !important;
}

.Branco
{
  color: white !important;
}

.AzulLogin
{
  background-color: #2c396f !important;
}

.PretoLogin 
{ 
  background: linear-gradient(to right, #000000, #1a1a1a) !important;
}

.LogoLogisticaBranca
{
  background-image: url(/ATS/img/LogoLogisticaBranca.png);
}

.LogoJornadaBranca
{
  background-image: url(/ATS/img/LogoJornadaBranca.png);
}

.LogoPaginaInicial
{
  background-image: none;
}

.LogoPaginaLogin
{
  background-image: url("/ATS/img/Plano Fundo Login.svg");
}

.CelulaVermelha
{
  background-color: #ff3333;
}

.CelulaLaranja
{
  background-color: orange;
}

.CelulaVerde
{
  background-color: #00ab00;
}

.b-fa:before,
.b-icon:before 
{
    font-family : 'Font Awesome 6 Pro';
    font-weight : 400;
}

.b-grid-header-text-content
{
  color: var(--cinzaescuro) !important;
}

.pesquisa
{
  margin: 0 4px;
  padding-top: 2px;
}

.painelNivelAlertaIgnorar .b-panel-header
{
  background-color: var(--NivelAlertaIgnorar);
}

.b-stripe .b-grid-row.b-even.linhaGridManutencao
{
  background-color: var(--nivelGridManutencao); 
}

.b-stripe .b-grid-row.b-odd.linhaGridManutencao
{
  background-color: var(--nivelGridManutencaoOpaco); 
}

.b-grid-row.b-selected, .b-grid-cell.b-selected {
  background-color: inherit;
  outline: 2px solid blue;
  outline-offset: -2px;
}

.b-stripe .b-grid-row.b-even.linhaGridSMComProblemasNaInicializacao
{
  background-color: var(--linhaGridSMComProblemasNaInicializacao);
}

.b-stripe .b-grid-row.b-odd.linhaGridSMComProblemasNaInicializacao
{
  background-color: var(--linhaGridSMComProblemasNaInicializacaoOpaco);
}

.b-stripe .b-grid-row.b-even.linhaGridSMAtrasada
{
  background-color: var(--linhaGridSMAtrasada);
}

.b-stripe .b-grid-row.b-odd.linhaGridSMAtrasada
{
  background-color: var(--linhaGridSMAtrasadaOpaco);
}

.b-stripe .b-grid-row.b-even.linhaGridSMComAdequacao
{
  background-color: var(--linhaGridSMComAdequacao);
}

.b-stripe .b-grid-row.b-odd.linhaGridSMComAdequacao
{
  background-color: var(--linhaGridSMComAdequacaoOpaco);
}

.b-stripe .b-grid-row.b-even.linhaGridSMComManutencao
{
  background-color: var(--linhaGridSMComManutencao);
}

.b-stripe .b-grid-row.b-odd.linhaGridSMComManutencao
{
  background-color: var(--linhaGridSMComManutencaoOpaco);
}

.b-grid-row.linhaGridAtiva
{
  background-color: var(--linhaGridAtiva);
}

.IgnicaoLigada
{
  color: limegreen;
}

.IgnicaoDesligada
{
  color: rgba(155, 155, 155, 1);
}

.IgnicaoDesconhecida
{
  color: gray;
}

.b-stripe .b-grid-row.b-selected .b-grid-cell.b-selected {
    background-color: inherit;
}

.b-stripe .b-grid-row.b-even.linhaGridMarcacaoJornadaInativa
{
  background-color:	rgba(246, 64, 50, 0.85);
}

.b-stripe .b-grid-row.b-odd.linhaGridMarcacaoJornadaInativa
{
  background-color: rgba(246, 64, 50, 0.5)
}

.b-stripe .b-grid-row.b-even.linhaGridMarcacaoJornadaAdicionada
{
  background-color: var(--linhaGridJornadaMarcacaoAdicionada);
}

.b-stripe .b-grid-row.b-odd.linhaGridMarcacaoJornadaAdicionada
{
  background-color: var(--linhaGridJornadaMarcacaoAdicionadaOpaco);
}

.b-stripe .b-grid-row.b-even.linhaJornadaAtiva
{
  background-color: var(--linhaJornadaAtiva);
}

.b-stripe .b-grid-row.b-odd.linhaJornadaAtiva
{
  background-color: var(--linhaJornadaAtivaOpaco);
}


.b-grid-row.linhaStatusIntegracaoOK
{
  background-color: var(--linhaStatusIntegracaoOK);
}

.b-grid-row.linhaStatusIntegracaoAlerta
{
  background-color: var(--linhaStatusIntegracaoAlerta);
}

.b-grid-row.linhaStatusIntegracaoParado
{
  background-color: var(--linhaStatusIntegracaoParado);
}

.b-stripe .b-grid-row.b-even.linhaTipoNaoRastrear
{
  background-color: var(--nivelGridTipoNaoRastrear); 
}

.b-stripe .b-grid-row.b-odd.linhaTipoNaoRastrear
{
  background-color: var(--nivelGridTipoNaoRastrearOpaco); 
}

.b-stripe .b-grid-row.b-even.caminhaoAzul
{
  background-color: var(--caminhaoAzul);
}

.b-stripe .b-grid-row.b-odd.caminhaoAzul
{
  background-color: var(--caminhaoAzul);
}

.b-stripe .b-grid-row.b-even.caminhaoAmarelo
{
  background-color: var(--caminhaoAmarelo);
}
.b-stripe .b-grid-row.b-odd.caminhaoAmarelo
{
  background-color: var(--caminhaoAmarelo);
}

.b-stripe .b-grid-row.b-even.caminhaoLaranja
{
  background-color: var(--caminhaoLaranja);
}
.b-stripe .b-grid-row.b-odd.caminhaoLaranja
{
  background-color: var(--caminhaoLaranja);
}

.b-stripe .b-grid-row.b-even.caminhaoMarom
{
  background-color: var(--caminhaoMarom);
}
.b-stripe .b-grid-row.b-odd.caminhaoMarom
{
  background-color: var(--caminhaoMarom);
}

.b-stripe .b-grid-row.b-even.caminhaoPreto
{
  background-color: var(--caminhaoPreto);
}
.b-stripe .b-grid-row.b-odd.caminhaoPreto
{
  background-color: var(--caminhaoPreto);
}

.b-stripe .b-grid-row.b-even.caminhaoRoxo
{
  background-color: var(--caminhaoRoxo);
}
.b-stripe .b-grid-row.b-odd.caminhaoRoxo
{
  background-color: var(--caminhaoRoxo);
}

.b-stripe .b-grid-row.b-even.caminhaoVerde
{
  background-color: var(--caminhaoVerde);
}
.b-stripe .b-grid-row.b-odd.caminhaoVerde
{
  background-color: var(--caminhaoVerde);
}

.b-stripe .b-grid-row.b-even.caminhaoVerdeClaro
{
  background-color: var(--caminhaoVerdeClaro);
}
.b-stripe .b-grid-row.b-odd.caminhaoVerdeClaro
{
  background-color: var(--caminhaoVerdeClaro);
}

.b-stripe .b-grid-row.b-even.caminhaoVermelho
{
  background-color: var(--caminhaoVermelho);
}
.b-stripe .b-grid-row.b-odd.caminhaoVermelho
{
  background-color: var(--caminhaoVermelho);
}

.b-stripe .b-grid-row.b-even.default
{
  background-color: var(--default);
}
.b-stripe .b-grid-row.b-odd.default
{
  background-color: var(--default);
}

.iconeColorido
{
  --fa-primary-color: #9e9e9e; 
  --fa-primary-opacity: 1; 
  --fa-secondary-color: #3f4146; 
  --fa-secondary-opacity: 1; 
  min-width: 1.5em; 
  text-align: center; 
  margin-right: 0.5em;
}

.iconeBranco
{
  --fa-primary-color: white; 
  --fa-secondary-color: #09a5c7;
}

.iconeBarra
{
  font-size: 1.4em;
  max-height: 48px;
}

.avatarUsuario
{
  vertical-align: middle;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  margin: 0 0.7em;
  align-self: center;
}

.b-tabpanel-tab.b-active {
    border-bottom: 4px solid #fc3e00;
}

.b-menuitem.b-contains-focus, .b-menuitem:focus
{
  border-left: 5px solid #fc3e00;
  padding-left: 7.8px;
}

.tabClose:hover
{
  color: red;
}

.iconeMonitor
{
  margin: 1em 1em 0 0;
  flex-direction: column;
}

.iconeMonitor i
{
  font-size: 1.3em;
}

.iconeMonitor label
{
  font-size: 0.6em;
  font-weight: 600;
  color: black;
  margin-top: 0.5em;
  margin-inline-start: 0 !important;
}

.countDownMonitor
{
  max-width: 48px;
  font-size: 1em;
  font-weight: 600;
  padding-top: 10px;
}

.tempoTMA
{
  font-size: 2em;
  font-weight: bold;
  background-color: rgba(192, 192, 192, 0.8);
}

.tempoTMA > .b-field-inner span
{
  padding: 0;
}


.b-panel.b-floating > .b-panel-body-wrap > .b-panel-content {
  border-radius: 0;
}

.b-tabpanel-body.b-card-container {
  border-radius: 0;
}

.b-panel-header 
{ background-color: var(--cinzaescuro) !important; /* cinza escuro */ 
color: #ffffff !important; /* texto branco */ 
border: none !important;
 box-shadow: none !important; }

.painelNivelAlerta .b-panel-header
{
  background-color: var(--CorNivelAlerta);
}

.popupCinza > .b-panel-header
{
  background-color: var(--cinzaescuro) !important;
}

/* IA */

.b-stripe .b-grid-row.b-odd.rowRiscoExtremoIA{
  background-color: var(--IANivelAlertaExtremo);
}

.b-stripe .b-grid-row.b-odd.rowRiscoAltoIA{
  background-color: var(--IANivelAlertaAlto);
}

.b-stripe .b-grid-row.b-odd.rowRiscoMedioIA{
  background-color: var(--IANivelAlertaMedio);
}

.b-stripe .b-grid-row.b-odd.rowRiscoBaixoIA{
  background-color: var(--IANivelAlertaBaixo);
}

.b-stripe .b-grid-row.b-odd.rowIgnorarIA{
  background-color: var(--IANivelAlertaIgnorar);
}

.b-stripe .b-grid-row.b-even.rowRiscoExtremoIA{
  background-color: var(--IANivelAlertaExtremo);
}

.b-stripe .b-grid-row.b-even.rowRiscoAltoIA{
  background-color: var(--IANivelAlertaAlto);
}

.b-stripe .b-grid-row.b-even.rowRiscoMedioIA{
  background-color: var(--IANivelAlertaMedio);
}

.b-stripe .b-grid-row.b-even.rowRiscoBaixoIA{
  background-color: var(--IANivelAlertaBaixo);
}

.b-stripe .b-grid-row.b-even.rowIgnorarIA{
  background-color: var(--IANivelAlertaIgnorar);
}

.b-grid-row.linhaGridAtencao
{
  background-color: var(--LinhaAtencao);
}

.b-grid-row.linhaGridAlarme
{
  background-color: var(--LinhaAlarme);
}

.ItemMenuATS
{
  min-width: inherit;
}

.b-mask
{
  background-color: rgba(84, 84, 84, 0.5) !important;
}

.b-mask-text
{
  background-color: var(--cinzaescuro) !important;
  color: white !important;
  border: none !important;
}

.b-label, .x-label, .b-fieldlabel, .b-label-cell 
{ 
  color: inherit !important; 
  font-weight: bold !important; 
  text-decoration: none !important; 
  border: none !important; 
  box-shadow: none !important; 
  background: none !important; 
} 

.b-field-inner::after, .b-field-inner::before, .b-input-wrap::after, .b-input-wrap::before 
{ 
  content: none !important; 
  display: none !important; 
  border: none !important; 
  box-shadow: none !important; 
  background: none !important; 
} 

.painelNivelAlerta .b-panel-header 
{ 
  background-color: var(--CorNivelAlerta) !important; 
  color: #ffffff !important; 
} 

.painelNivelAlertaIgnorar .b-panel-header 
{ 
  background-color: var(--NivelAlertaIgnorar) !important; 
  color: #333 !important; 
}

.b-tabpanel-tab.b-active 
{ 
  background-color: white !important; 
  color: black !important; 
  font-weight: bold !important; 
  border-bottom: none !important; 
  box-shadow: none !important; 
} 

.b-card.b-active > .b-panel-header 
{ 
  background-color: white !important; 
  color: black !important; 
  font-weight: bold !important; 
  border: none !important; 
  box-shadow: none !important; 
} 
  
.b-tabpanel-tab.b-active 
{ 
  border-bottom-color: transparent !important; 
}

.b-grid-row.b-selected,.b-grid-cell.b-selected 
{
  outline: 2px solid var(--cinzaescuro) !important;
  outline-offset: -2px;
}

.b-grid-cell.b-selected 
{
  background-color: var(--cinzaclaro) !important;
  color: black  !important;
  font-weight: bold !important;
}

.b-grid-row:hover 
{
  background-color: var(--cinzaclaro) !important;
}

.botaoComSombra 
{ 
  background-color: #ececec !important; 
  border: none !important; 
  color: #000 !important; 
  font-weight: bold !important; 
  border-radius: 4px; 
  box-shadow: none !important; 
}

.botaoComSombra:hover
{
  background-color: #cccccc !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2) !important;
}

/* Forçar a flecha do collapse ficar na mesma cor do texto do header */
.b-panel-header .b-panel-collapse-revealer,
.b-panel-header .b-icon-collapse-down,
.b-panel-header .b-icon-collapse-up,
.b-panel-header .b-collapse-tool,
.b-panel-header .b-collapserset-1,
.b-widget.b-tool.b-icon-collapse-down,
.b-widget.b-tool.b-icon-collapse-up {
    color: #ffffff !important;           /* branco - mesma cor do texto */
    background-color: transparent !important;
    filter: none !important;
}

/* Caso a flecha use ::before ou ::after (muito comum) */
.b-panel-header .b-panel-collapse-revealer::before,
.b-panel-header .b-panel-collapse-revealer::after,
.b-icon-collapse-down::before,
.b-icon-collapse-up::before {
    color: #ffffff !important;
}

/* Versão ainda mais forte (use se a de cima não resolver) */
.b-dock-top .b-panel-header .b-tool,
.b-panel.b-dock-top .b-panel-collapse-revealer {
    color: #ffffff !important;
    background: transparent !important;
}

/* === BOTÃO "X" DE FECHAR (CLOSE TOOL) - VERSÃO FORTE === */
.b-tool.b-icon-close,
.b-tool.b-close,
.b-icon-close,
.b-panel-header .b-tool,
.b-popup .b-tool.b-icon-close,
.b-window .b-tool.b-icon-close,
.b-dock-top .b-tool.b-icon-close,
.b-header .b-tool.b-icon-close {
    color: #ffffff !important;
    background-color: transparent !important;
    filter: none !important;
}

/* Para o pseudo-elemento ::before (onde o Font Awesome realmente desenha o X) */
.b-tool.b-icon-close::before,
.b-icon-close::before,
.b-tool.b-close::before,
.b-widget.b-tool.b-icon-close::before {
    color: #ffffff !important;
    content: "\f00d" !important;   /* força o X do Font Awesome */
}

/* Regra ainda mais específica para quando o header tem classes do Bryntum */
.b-panel-header .b-tool,
.b-dock-top > .b-panel-header .b-tool,
div[class*="b-panel"] > .b-panel-header .b-tool {
    color: #ffffff !important;
}

/* Caso tenha hover ou estado ativo */
.b-tool.b-icon-close:hover,
.b-tool:hover {
    color: #ffffff !important;
    background-color: rgba(255,255,255,0.1) !important;
}

*:not(.b-fa):not(.b-icon):not([class*="fa-"])
{
  font-family: 'Open Sans', sans-serif !important;
}

/* Títulos - Barlow Medium */
.b-panel-header
{
  font-family: 'Barlow', sans-serif !important;
  font-weight: 500 !important;
}

/* Subtítulos - Barlow Regular */
.b-tabpanel-tab
{
  font-family: 'Barlow', sans-serif !important;
  font-weight: 400 !important;
}

/* Corpo e textos dos grids - Open Sans */
.b-grid-cell,
.b-grid-header,
.b-grid-header-text,
.b-grid-header-text-content,
.b-grid-header-container
{
  font-family: 'Open Sans', sans-serif !important;
}
