/* Águia — visual próximo do painel antigo, sem encolher abas */

/* Abas no tamanho normal (não reduzir) */
#sidebar .nav-tabs > li > a {
  padding: 10px 12px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
}

/* Sidebar altura completa como no antigo */
#sidebar {
  width: 300px !important;
  max-height: calc(100% - 42px) !important;
  height: calc(100% - 42px) !important;
}

@media (min-width: 992px) {
  #sidebar {
    width: 330px !important;
  }
}

#sidebar.collapsed {
  width: 0 !important;
}

/* Remove as "capas" diagonais do header (logo/menu) */
#header.folded .navbar .navbar-brand:before,
#header.folded .navbar .navbar-brand:after,
#header.folded .navbar-nav:before,
#header.folded .navbar-nav:after {
  display: none !important;
  border: 0 !important;
  content: none !important;
}

#header.folded .navbar .navbar-brand {
  width: auto !important;
  max-width: 220px !important;
  border-radius: 0 !important;
}

#header.folded:before {
  display: none !important;
}

/* Widgets de baixo um pouco menos altos — mapa mais visível, abas intactas */
#widgets .widget-body {
  height: 110px !important;
  max-height: 110px !important;
}

.graph-1-wrap,
.graph-1-wrap .graph-1 {
  height: 120px !important;
}

/* Lista de veículos: IMEI / chip sob o nome (só menor; largura normal) */
#ajax-items .name .agon-device-meta,
#sidebar .name .agon-device-meta {
  display: block;
  font-size: 10px !important;
  line-height: 1.2 !important;
  font-weight: 400 !important;
  opacity: 0.7;
  margin-top: 1px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}

/* Zoom reduzido (~85%) nas barras da tela inicial: lista de veículos/eventos/histórico e painel de widgets.
   Sidebar: scale ancorado no canto inferior esquerdo, com altura compensada para continuar ocupando a lateral.
   Widgets: zoom (muda também o espaço ocupado, então o mapa ganha área). Para ajustar, mude --agon-ui-zoom. */
:root {
  --agon-ui-zoom: 0.85;
}

#sidebar {
  transform: scale(var(--agon-ui-zoom));
  transform-origin: left bottom;
  height: calc((100% - 42px) / var(--agon-ui-zoom)) !important;
  max-height: calc((100% - 42px) / var(--agon-ui-zoom)) !important;
}

#widgets {
  zoom: var(--agon-ui-zoom);
}

/* ---- Painel de widgets colado na barra lateral ---------------------------------------------------------------
   O JS (bottomAutoWidth) reserva à esquerda do painel a largura REAL da barra lateral (330 px), mas a barra agora
   é desenhada menor (zoom), então sobrava um vão. Reservamos a largura já com o zoom e alinhamos o painel à esquerda. */
@media (min-width: 501px) {
  #bottombar {
    padding-left: calc(300px * var(--agon-ui-zoom)) !important;
  }
}

@media (min-width: 992px) {
  #bottombar {
    padding-left: calc(330px * var(--agon-ui-zoom)) !important;
  }
}

#sidebar.collapsed ~ #bottombar {
  padding-left: 0 !important;
}

#widgets {
  float: left !important;
}

/* ---- Widget "Sensores": colunas mais estreitas e linhas mais baixas ---------------------------------------- */
#widgets .widget-sensors .table {
  width: 165px !important;
  font-size: 12px;
}

#widgets .widget-sensors .table > tbody > tr > td {
  padding: 3px 5px !important;
  line-height: 1.25;
}

#widgets .widget-sensors .table .icon {
  font-size: 1.4em !important;
  margin-right: 3px !important;
}

/* ---- Notificações (toast) mais discretas ------------------------------------------------------------------ */
#toast-container > div {
  width: 250px !important;
  max-width: 92vw !important;
  padding: 7px 24px 7px 38px !important;
  margin: 0 0 5px 0 !important;
  font-size: 12px;
  line-height: 1.3;
  background-position: 9px center !important;
  background-size: 18px 18px !important;
  border-radius: 3px !important;
  opacity: 0.94;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.35) !important;
}

#toast-container > div:hover {
  opacity: 1;
}

#toast-container .toast-title {
  font-size: 12px;
  font-weight: 600;
}

#toast-container .toast-close-button {
  top: -2px !important;
  right: -2px !important;
  font-size: 16px !important;
}

/* No máximo 3 avisos visíveis ao mesmo tempo; os demais aparecem quando os primeiros somem. */
#toast-container > div:nth-child(n + 4) {
  display: none !important;
}

/* Aba "Usuários" da barra lateral do mapa. */
#sidebar .nav-tabs > li > a {
  padding-left: 8px;
  padding-right: 8px;
}

.agon-user {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-bottom: 1px solid rgba(128, 128, 128, 0.25);
}

.agon-user__main {
  flex: 1 1 auto;
  min-width: 0;
}

.agon-user__name {
  font-weight: 600;
  font-size: 12px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.agon-user__meta {
  font-size: 11px;
  opacity: 0.75;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.agon-user__actions {
  flex: 0 0 auto;
  white-space: nowrap;
}

.agon-users__empty {
  padding: 12px 10px;
  font-size: 12px;
  opacity: 0.75;
}