/* =====================================================================
   SISTEMA DE CONTROLE DE DORMENTES — RUMO
   Paleta oficial: azul escuro predominante, branco, verde claro, amarelo
   ===================================================================== */

:root {
  /* Cores institucionais Rumo */
  --azul-escuro: #003865;
  --azul-escuro-2: #002D51;
  --azul-claro: #32A6E6;
  --verde: #1E9F7F;
  --verde-claro: #7FE06C;
  --amarelo: #FBD300;
  --branco: #ffffff;

  /* Neutros de apoio */
  --cinza-bg: #F2F5F6;
  --cinza-card: #ffffff;
  --cinza-borda: #D7E0E5;
  --cinza-texto: #486272;
  --cinza-texto-claro: #7B919E;

  /* Status */
  --ok: #1E9F80;
  --alerta: #FBD300;
  --erro: #e23b3b;
  --bloqueado: #c0392b;

  /* Tipografia */
  --fonte: 'Cera Pro', Verdana, Geneva, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  /* Sombra e raio */
  --raio: 20px;
  --raio-sm: 12px;
  --sombra: 0 2px 12px rgba(0, 53, 103, 0.08);
  --sombra-hover: 0 6px 24px rgba(0, 53, 103, 0.14);
  --transicao: 0.18s ease;
}

body[data-tema="escuro"] {
  /* Tema escuro: azul escuro predominante, depois branco, verde claro e amarelo */
  --azul-escuro: #071f3a;
  --azul-escuro-2: #03162b;
  --azul-claro: #ffffff;
  --verde: #7FE06C;
  --verde-claro: #7FE06C;
  --amarelo: #FBD300;
  --branco: #f7f9fc;

  --cinza-bg: #03162b;
  --cinza-card: #082a4d;
  --cinza-borda: rgba(255, 255, 255, 0.14);
  --cinza-texto: #d9e8f7;
  --cinza-texto-claro: #a8bbcf;

  --ok: #7FE06C;
  --alerta: #FBD300;
  --erro: #ff6b6b;
  --bloqueado: #ff7777;

  --sombra: 0 2px 16px rgba(0, 0, 0, 0.24);
  --sombra-hover: 0 8px 28px rgba(0, 0, 0, 0.32);
  --chart-borda: rgba(255, 255, 255, 0.18);
  --amarelo-texto: #FBD300;
}

* { margin: 0; padding: 0; box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  font-family: var(--fonte);
  background: var(--cinza-bg);
  color: var(--azul-escuro);
  font-size: 15px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

/* ===================== LAYOUT GERAL ===================== */
.app { display: flex; min-height: 100vh; }

/* ===================== SIDEBAR ===================== */
.sidebar {
  width: 248px;
  background: var(--azul-escuro);
  color: var(--branco);
  display: flex;
  flex-direction: column;
  position: fixed;
  top: 0;
  left: -280px;
  height: 100vh;
  flex-shrink: 0;
  z-index: 100;
  transition: left 0.25s ease;
  box-shadow: 4px 0 24px rgba(0, 0, 0, 0.2);
}
.sidebar.aberta { left: 0; }

.sidebar-logo {
  padding: 26px 24px 22px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.sidebar-logo .marca {
  font-size: 30px;
  font-weight: 800;
  letter-spacing: -1px;
  display: flex;
  align-items: center;
  gap: 1px;
}
.sidebar-logo .marca .o-circ {
  display: inline-block;
  width: 17px; height: 17px;
  border: 3.5px solid var(--branco);
  border-radius: 50%;
  border-right-color: transparent;
  transform: rotate(-45deg);
  margin-left: 2px;
}
.sidebar-logo .sub {
  font-size: 10.5px;
  font-weight: 400;
  color: var(--azul-claro);
  letter-spacing: 0.5px;
  margin-top: 2px;
}

.nav { padding: 14px 12px; flex: 1; overflow-y: auto; }
.nav-section-label {
  font-size: 10.5px;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--cinza-texto-claro);
  padding: 14px 12px 6px;
  font-weight: 600;
}
.nav a {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 11px 13px;
  color: rgba(255, 255, 255, 0.82);
  text-decoration: none;
  border-radius: var(--raio-sm);
  font-size: 14px;
  font-weight: 500;
  transition: var(--transicao);
  margin-bottom: 2px;
}
.nav a:hover { background: rgba(255, 255, 255, 0.08); color: var(--branco); }
.nav a.ativo { background: var(--azul-claro); color: var(--branco); font-weight: 600; }
.nav a .ic { width: 19px; height: 19px; flex-shrink: 0; opacity: 0.95; }

.sidebar-rodape {
  padding: 14px 18px;
  font-size: 11px;
  color: var(--cinza-texto-claro);
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}

/* ===================== CONTEÚDO ===================== */
.conteudo { flex: 1; display: flex; flex-direction: column; min-width: 0; }

.topo {
  background: var(--branco);
  padding: 18px 32px;
  border-bottom: 1px solid var(--cinza-borda);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  position: sticky;
  top: 0;
  z-index: 20;
}
.topo h1 { font-size: 20px; font-weight: 700; letter-spacing: -0.3px; }
.topo .subtitulo { font-size: 13px; color: var(--cinza-texto); font-weight: 400; margin-top: 1px; }
.topo-acoes { display: flex; gap: 10px; align-items: center; }

.pagina { padding: 28px 32px 60px; max-width: 1500px; width: 100%; }

/* ===================== BOTÕES ===================== */
.btn {
  border: none;
  border-radius: var(--raio-sm);
  padding: 10px 18px;
  font-family: var(--fonte);
  font-size: 13.5px;
  font-weight: 600;
  cursor: pointer;
  transition: var(--transicao);
  display: inline-flex;
  align-items: center;
  gap: 7px;
  white-space: nowrap;
  text-decoration: none;
}
.hub-link {
  font-weight: 800;
  letter-spacing: .4px;
}
.btn-primario { background: var(--azul-escuro); color: var(--branco); }
.btn-primario:hover { background: var(--azul-escuro-2); transform: translateY(-1px); }
.btn-secundario { background: var(--branco); color: var(--azul-escuro); border: 1.5px solid var(--cinza-borda); }
.btn-secundario:hover { border-color: var(--azul-claro); color: var(--azul-claro); }
.btn-verde { background: var(--verde); color: var(--branco); }
.btn-verde:hover { background: #18876c; transform: translateY(-1px); }
.btn-perigo { background: #fff; color: var(--erro); border: 1.5px solid #f3c4c4; }
.btn-perigo:hover { background: var(--erro); color: #fff; }
.btn-sm { padding: 6px 12px; font-size: 12px; }
.btn .ic { width: 16px; height: 16px; }

/* ===================== CARDS / KPIs ===================== */
.grid-kpi {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 16px;
  margin-bottom: 24px;
}
.kpi {
  background: var(--cinza-card);
  border-radius: var(--raio);
  padding: 20px 22px;
  box-shadow: var(--sombra);
  border-left: 4px solid var(--azul-claro);
  position: relative;
}
.kpi.verde { border-left-color: var(--verde); }
.kpi.amarelo { border-left-color: var(--amarelo); }
.kpi.escuro { border-left-color: var(--azul-escuro); }
.kpi.vermelho { border-left-color: var(--erro); }
.kpi .rotulo { font-size: 12px; color: var(--cinza-texto); font-weight: 500; text-transform: uppercase; letter-spacing: 0.4px; }
.kpi .valor { font-size: 30px; font-weight: 800; letter-spacing: -1px; margin-top: 6px; }
.kpi .extra { font-size: 12px; color: var(--cinza-texto-claro); margin-top: 4px; }

.card {
  background: var(--cinza-card);
  border-radius: var(--raio);
  box-shadow: var(--sombra);
  padding: 24px;
  margin-bottom: 22px;
}
.card-titulo {
  font-size: 16px;
  font-weight: 700;
  margin-bottom: 18px;
  padding-bottom: 12px;
  border-bottom: 2px solid var(--cinza-bg);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.card-titulo .acento { display: inline-flex; align-items: center; gap: 9px; }
.card-titulo .card-sub { font-size: 12px; font-weight: 500; color: var(--cinza-texto); text-align: right; }
@media (max-width: 640px){ .card-titulo .card-sub { display: none; } }
.card-titulo .acento::before {
  content: '';
  width: 4px; height: 18px;
  background: var(--azul-claro);
  border-radius: 2px;
}

/* ===================== FORMULÁRIO ===================== */
.form-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 16px 18px;
}
.campo { display: flex; flex-direction: column; gap: 5px; }
.campo.full { grid-column: 1 / -1; }
.campo label {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--azul-escuro);
}
.campo label .obrig { color: var(--erro); margin-left: 2px; }
.campo label .dica { font-weight: 400; color: var(--cinza-texto-claro); font-size: 11px; }
.campo input, .campo select, .campo textarea {
  font-family: var(--fonte);
  font-size: 14px;
  padding: 9px 11px;
  border: 1.5px solid var(--cinza-borda);
  border-radius: var(--raio-sm);
  background: var(--branco);
  color: var(--azul-escuro);
  transition: var(--transicao);
  width: 100%;
}
.campo input:focus, .campo select:focus, .campo textarea:focus {
  outline: none;
  border-color: var(--azul-claro);
  box-shadow: 0 0 0 3px rgba(50, 166, 230, 0.16);
}
.campo textarea { resize: vertical; min-height: 64px; }
.campo input::placeholder, .campo textarea::placeholder { color: var(--cinza-texto-claro); }

.form-secao {
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.6px;
  color: var(--azul-claro);
  grid-column: 1 / -1;
  margin-top: 12px;
  padding-top: 14px;
  border-top: 1px dashed var(--cinza-borda);
}
.form-secao:first-child { margin-top: 0; padding-top: 0; border-top: none; }
.form-acoes {
  display: flex;
  gap: 12px;
  justify-content: flex-end;
  margin-top: 24px;
  padding-top: 18px;
  border-top: 2px solid var(--cinza-bg);
}

/* ===================== TABELA ===================== */
.tabela-wrap { overflow-x: auto; border-radius: var(--raio-sm); border: 1px solid var(--cinza-borda); }
table.tabela { width: 100%; border-collapse: collapse; font-size: 13px; white-space: nowrap; }
table.tabela thead th {
  background: var(--azul-escuro);
  color: var(--branco);
  font-weight: 600;
  text-align: left;
  padding: 11px 13px;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.3px;
  position: sticky;
  top: 0;
}
table.tabela tbody td { padding: 10px 13px; border-bottom: 1px solid var(--cinza-borda); }
table.tabela tbody tr:nth-child(even) { background: #fafbfc; }
table.tabela tbody tr:hover { background: #eef6fc; }
table.tabela .acoes-cel { display: flex; gap: 6px; }
.icone-btn {
  border: none; background: transparent; cursor: pointer;
  padding: 4px; border-radius: 5px; color: var(--cinza-texto);
  display: inline-flex; transition: var(--transicao);
}
.icone-btn:hover { background: var(--cinza-bg); color: var(--azul-escuro); }
.icone-btn.del:hover { background: #fde8e8; color: var(--erro); }
.icone-btn .ic { width: 16px; height: 16px; }

/* ===================== BADGES ===================== */
.badge {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 20px;
  font-size: 11.5px;
  font-weight: 600;
  white-space: nowrap;
}
.badge-ok { background: #e3f5ef; color: #137a5f; }
.badge-cura { background: #e0f3fc; color: #0277a8; }
.badge-entregue { background: #eef0f2; color: #4a5b6b; }
.badge-bloqueado { background: #fde8e8; color: var(--bloqueado); }
.badge-reprovado { background: #ffeaea; color: var(--erro); }
.badge-projeto { background: var(--azul-escuro); color: #fff; }
.badge-amarelo { background: #fff6cc; color: #8a7400; }
.badge-bitola-larga { background: #e0f3fc; color: #0277a8; }
.badge-bitola-mista { background: #eaf7df; color: #357a14; }
.badge-bitola-sem { background: #eef0f2; color: #4a5b6b; }

/* ===================== FILTROS ===================== */
.barra-filtros {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: flex-end;
  margin-bottom: 18px;
}
.barra-filtros .campo { gap: 4px; }
.barra-filtros .campo label { font-size: 11px; color: var(--cinza-texto); }
.barra-filtros input, .barra-filtros select { padding: 8px 10px; font-size: 13px; min-width: 150px; }
.busca-rapida { flex: 1; min-width: 200px; }

/* ===================== TOAST ===================== */
.toast-wrap { position: fixed; bottom: 24px; right: 24px; z-index: 1000; display: flex; flex-direction: column; gap: 10px; }
.toast {
  background: var(--azul-escuro);
  color: var(--branco);
  padding: 13px 18px;
  border-radius: var(--raio-sm);
  box-shadow: var(--sombra-hover);
  font-size: 13.5px;
  font-weight: 500;
  display: flex;
  align-items: center;
  gap: 10px;
  animation: slideIn 0.25s ease;
  max-width: 340px;
}
.toast.sucesso { background: var(--verde); }
.toast.erro { background: var(--erro); }
.toast.aviso { background: var(--amarelo); color: var(--azul-escuro); }
.toast .ic { width: 18px; height: 18px; flex-shrink: 0; }
@keyframes slideIn { from { transform: translateX(40px); opacity: 0; } to { transform: translateX(0); opacity: 1; } }

/* ===================== MODAL ===================== */
.modal-overlay {
  position: fixed; inset: 0;
  background: rgba(0, 38, 77, 0.55);
  display: none;
  align-items: center; justify-content: center;
  z-index: 500;
  padding: 20px;
  backdrop-filter: blur(2px);
}
.modal-overlay.aberto { display: flex; }
.modal {
  background: var(--branco);
  border-radius: var(--raio);
  width: 100%;
  max-width: 920px;
  max-height: 90vh;
  overflow-y: auto;
  box-shadow: 0 20px 60px rgba(0, 38, 77, 0.3);
}
.modal-cab {
  padding: 20px 24px;
  border-bottom: 1px solid var(--cinza-borda);
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: sticky;
  top: 0;
  background: var(--branco);
  z-index: 2;
}
.modal-cab h2 { font-size: 17px; font-weight: 700; }
.modal-corpo { padding: 24px; }
.fechar-modal { border: none; background: transparent; cursor: pointer; color: var(--cinza-texto); padding: 4px; border-radius: 6px; }
.fechar-modal:hover { background: var(--cinza-bg); }
.fechar-modal .ic { width: 22px; height: 22px; }

/* ===================== ESTADO VAZIO ===================== */
.vazio {
  text-align: center;
  padding: 60px 20px;
  color: var(--cinza-texto-claro);
}
.vazio .ic { width: 52px; height: 52px; opacity: 0.4; margin-bottom: 14px; }
.vazio h3 { font-size: 16px; color: var(--cinza-texto); font-weight: 600; margin-bottom: 6px; }
.vazio p { font-size: 13.5px; }

/* ===================== DASHBOARD ===================== */
.grid-graficos { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.grid-graficos .card.span2 { grid-column: 1 / -1; }
.chart-box { position: relative; height: 300px; }
.chart-box.alto { height: 360px; }

.legenda-mini { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 10px; font-size: 12px; color: var(--cinza-texto); }
.legenda-mini span { display: inline-flex; align-items: center; gap: 6px; }
.legenda-mini .pt { width: 11px; height: 11px; border-radius: 3px; }

/* ===================== DETALHE ===================== */
.detalhe-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 14px 22px; }
.detalhe-item .rot { font-size: 11px; text-transform: uppercase; letter-spacing: 0.4px; color: var(--cinza-texto-claro); font-weight: 600; }
.detalhe-item .val { font-size: 14px; font-weight: 500; margin-top: 2px; }
.detalhe-secao { font-size: 13px; font-weight: 700; color: var(--azul-claro); text-transform: uppercase; letter-spacing: 0.5px; margin: 22px 0 10px; padding-bottom: 6px; border-bottom: 1px dashed var(--cinza-borda); }
.detalhe-secao:first-child { margin-top: 0; }

/* ===================== RESPONSIVO ===================== */
.menu-toggle {
  display: inline-flex;
  position: relative;
  z-index: 30;
}

.backdrop-mobile {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,38,77,0.4);
  z-index: 90;
}
.backdrop-mobile.ativo { display: block; }

@media (max-width: 980px) {
  .grid-graficos { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
  .topo { padding: 14px 18px; }
  .pagina { padding: 18px 16px 50px; }
  .topo h1 { font-size: 17px; }
  .form-acoes { flex-direction: column; }
  .form-acoes .btn { width: 100%; justify-content: center; }
}

/* utilitários */
.flex { display: flex; }
.gap8 { gap: 8px; }
.gap12 { gap: 12px; }
.mt0 { margin-top: 0; }
.txt-cinza { color: var(--cinza-texto); }
.txt-mini { font-size: 12px; }
.nowrap { white-space: nowrap; }
.right { text-align: right; }
.center { text-align: center; }
.hidden { display: none !important; }


/* ===================== ENSAIOS DE LIBERAÇÃO ===================== */
.series-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 16px;
}
.serie-card {
  border: 1px solid var(--cinza-borda);
  border-radius: var(--raio);
  padding: 18px;
  background: #fff;
  box-shadow: 0 1px 8px rgba(0,53,103,.05);
}
.serie-card.obrigatorio { border-left: 5px solid var(--erro); }
.serie-card.proximo { border-left: 5px solid var(--amarelo); }
.serie-card.andamento { border-left: 5px solid var(--verde); }
.serie-card.liberado { border-left: 5px solid var(--verde-claro); }
.serie-card.semserie { border-left: 5px solid var(--cinza-texto-claro); }
.serie-card-topo {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 14px;
}
.serie-card-topo h3 { font-size: 16px; line-height: 1.25; margin-bottom: 4px; }
.serie-card-topo p { color: var(--cinza-texto); font-size: 12.5px; }
.status-serie {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 4px 10px;
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
  text-transform: uppercase;
  letter-spacing: .25px;
}
.status-serie.obrigatorio { background: #ffeaea; color: var(--erro); }
.status-serie.proximo { background: #fff6cc; color: #8a7400; }
.status-serie.andamento { background: #e3f5ef; color: #137a5f; }
.status-serie.liberado { background: #eaf7df; color: #357a14; }
.status-serie.semserie { background: #eef0f2; color: #4a5b6b; }
.serie-metricas {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  margin-bottom: 15px;
}
.serie-metricas div {
  background: var(--cinza-bg);
  border-radius: 10px;
  padding: 9px 10px;
}
.serie-metricas span { display:block; color: var(--cinza-texto); font-size: 10.5px; text-transform: uppercase; letter-spacing: .25px; font-weight: 700; }
.serie-metricas strong { display:block; margin-top:3px; font-size: 16px; }
.serie-progressos { display: grid; gap: 10px; }
.progress-label { display: flex; justify-content: space-between; gap: 12px; color: var(--cinza-texto); font-size: 12px; font-weight: 700; margin-bottom: 5px; }
.barra-progresso {
  width: 100%;
  height: 10px;
  background: #edf2f7;
  border-radius: 999px;
  overflow: hidden;
}
.barra-progresso.pequena { height: 8px; margin-top: 7px; }
.barra-progresso span { display: block; height: 100%; border-radius: 999px; background: var(--verde); }
.barra-progresso span.obrigatorio { background: var(--erro); }
.barra-progresso span.proximo { background: var(--amarelo); }
.barra-progresso span.andamento { background: var(--verde); }
.barra-progresso span.liberado { background: var(--verde-claro); }
.barra-progresso span.semserie { background: var(--cinza-texto-claro); }
.serie-rodape {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-top: 13px;
  color: var(--cinza-texto-claro);
  font-size: 12px;
}
.lista-alertas { display: grid; gap: 10px; }
.alerta-serie {
  border: 1px solid var(--cinza-borda);
  border-left: 4px solid var(--azul-claro);
  border-radius: 12px;
  padding: 12px;
  display: grid;
  gap: 5px;
  background: #fff;
}
.alerta-serie.obrigatorio { border-left-color: var(--erro); background: #fffafa; }
.alerta-serie.proximo { border-left-color: var(--amarelo); background: #fffdf2; }
.alerta-serie.semserie { border-left-color: var(--cinza-texto-claro); background: #fbfcfd; }
.alerta-serie strong { display:block; font-size: 13.5px; }
.alerta-serie span { display:block; color: var(--cinza-texto); font-size: 12px; margin-top: 2px; }
.alerta-serie small { color: var(--cinza-texto-claro); font-weight: 700; }
.rank-simples { display: grid; gap: 13px; }
.rank-linha { display: grid; gap: 5px; }
.rank-info { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.rank-info strong { font-size: 18px; }
.vazio.compacto { padding: 30px 12px; }

@media (max-width: 700px) {
  .serie-card-topo, .serie-rodape { flex-direction: column; }
  .serie-metricas { grid-template-columns: repeat(2, 1fr); }
}

/* ===================== ALERTAS DE PREENCHIMENTO - PRODUÇÃO ===================== */
.grid-kpi-compacto {
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  margin-bottom: 16px;
}
.grid-kpi-compacto .kpi { padding: 15px 18px; }
.grid-kpi-compacto .kpi .valor { font-size: 24px; }

.preenchimento-cel {
  min-width: 105px;
  display: grid;
  gap: 6px;
}
.barra-preenchimento {
  width: 100%;
  height: 7px;
  background: #edf2f7;
  border-radius: 999px;
  overflow: hidden;
}
.barra-preenchimento span {
  display: block;
  height: 100%;
  border-radius: 999px;
}
.barra-preenchimento span.ok { background: var(--verde); }
.barra-preenchimento span.aviso { background: var(--amarelo); }
.barra-preenchimento span.critico { background: var(--erro); }

.alerta-preenchimento-topo {
  border: 1px solid #f1d38d;
  border-left: 4px solid var(--amarelo);
  border-radius: 12px;
  padding: 12px 14px;
  background: #fffdf2;
  display: grid;
  gap: 4px;
  margin-bottom: 14px;
}
.alerta-preenchimento-topo strong {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13.5px;
}
.alerta-preenchimento-topo strong .ic { width: 17px; height: 17px; }
.alerta-preenchimento-topo span {
  color: var(--cinza-texto);
  font-size: 12.5px;
}

.chips-faltantes {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  max-width: 780px;
}
.chip-faltante {
  display: inline-grid;
  grid-template-columns: auto auto;
  gap: 4px 6px;
  align-items: center;
  border: 1px solid #f1caca;
  background: #fffafa;
  color: var(--bloqueado);
  border-radius: 10px;
  padding: 5px 8px;
  font-size: 11.5px;
  font-weight: 700;
}
.chip-faltante small {
  background: #ffeaea;
  color: var(--erro);
  border-radius: 999px;
  padding: 1px 6px;
  font-size: 10px;
}
.chip-faltante em {
  grid-column: 1 / -1;
  color: var(--cinza-texto);
  font-size: 10.5px;
  font-style: normal;
  font-weight: 500;
}
tr.linha-alerta td { background: #fffafa; }
.tabela-alertas td { vertical-align: top; }
.margem-topo-sm { margin-top: 10px; }

/* Aviso contextual usado em filtros operacionais */
.aviso-info {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: -6px 0 16px;
  padding: 10px 12px;
  border: 1px solid var(--cinza-borda);
  border-left: 4px solid var(--azul-claro);
  border-radius: 14px;
  background: #f7fbff;
  color: var(--cinza-texto);
  font-size: 12.5px;
}
.aviso-info strong { color: var(--azul-escuro); }


/* Lotes vinculados dentro dos cards de Ensaios de Liberação */
.serie-lotes {
  border: 1px solid var(--cinza-borda);
  border-radius: 12px;
  padding: 11px 12px;
  background: #fbfcfd;
  margin-top: 14px;
}
.serie-lotes-topo {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 9px;
}
.serie-lotes-topo strong { font-size: 12.5px; color: var(--azul-escuro); }
.serie-lotes-topo span { font-size: 11.5px; color: var(--cinza-texto); font-weight: 700; }
.lotes-serie-lista {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  max-height: 178px;
  overflow: auto;
  padding-right: 3px;
}
.lote-serie-chip {
  display: grid;
  gap: 2px;
  min-width: 122px;
  border: 1px solid var(--cinza-borda);
  border-radius: 12px;
  padding: 8px 10px;
  background: #fff;
  color: var(--azul-escuro);
  font-size: 11.5px;
}
.lote-serie-chip strong { font-size: 12.5px; }
.lote-serie-chip em {
  color: var(--cinza-texto);
  font-style: normal;
  font-size: 10.8px;
}
.lote-serie-chip small {
  display: inline-flex;
  width: max-content;
  border-radius: 999px;
  padding: 2px 7px;
  background: #fff6cc;
  color: #8a7400;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .2px;
  font-size: 9.5px;
}
.lote-serie-chip.ultimo {
  border: 2px solid var(--amarelo);
  background: linear-gradient(180deg, #fffdf2, #ffffff);
  box-shadow: 0 3px 14px rgba(255,212,1,.22);
}

.serie-liberacao {
  margin-top: 13px;
  border: 1px solid var(--cinza-borda);
  border-left: 4px solid var(--verde-claro);
  border-radius: 12px;
  padding: 10px 12px;
  background: #f8fff2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.serie-liberacao.pendente { border-left-color: var(--amarelo); background: #fffdf2; }
.serie-liberacao strong { display: block; font-size: 12.5px; color: var(--azul-escuro); }
.serie-liberacao span { display: block; margin-top: 2px; color: var(--cinza-texto); font-size: 11.5px; }
.serie-liberacao a,
.link-relatorio {
  color: var(--azul-claro);
  font-weight: 800;
  text-decoration: none;
  white-space: nowrap;
}
.serie-liberacao a:hover,
.link-relatorio:hover { text-decoration: underline; }
.serie-liberacao small { color: var(--cinza-texto-claro); font-size: 11px; font-weight: 700; white-space: nowrap; }

/* Parecer da aba Reprovados */
.parecer-reprovados { margin: 0 0 16px; }
.parecer-card .grid-kpi-compacto { margin-bottom: 12px; }
.parecer-texto {
  border: 1px solid var(--cinza-borda);
  border-left: 4px solid var(--azul-claro);
  border-radius: 12px;
  background: #f7fbff;
  color: var(--cinza-texto);
  padding: 12px 14px;
  font-size: 13.5px;
  line-height: 1.6;
  margin-bottom: 14px;
}
.motivos-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 12px;
}
.motivo-card {
  border: 1px solid var(--cinza-borda);
  border-radius: 14px;
  background: #fff;
  padding: 13px 14px;
  display: grid;
  gap: 8px;
}
.motivo-card.principal {
  border-color: rgba(255,212,1,.75);
  box-shadow: 0 4px 18px rgba(255,212,1,.16);
}
.motivo-card-topo {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}
.motivo-card-topo strong { font-size: 13px; line-height: 1.3; }
.motivo-card-topo span {
  border-radius: 999px;
  background: #fff6cc;
  color: #8a7400;
  padding: 3px 8px;
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  white-space: nowrap;
}
.motivo-card-numero {
  font-size: 25px;
  font-weight: 850;
  color: var(--azul-escuro);
  line-height: 1;
}
.motivo-card-meta {
  color: var(--cinza-texto);
  font-size: 12px;
  font-weight: 650;
}


/* ===================== TEMA ESCURO ===================== */
.tema-toggle {
  min-width: 126px;
  justify-content: center;
}
.tema-toggle .ic { width: 15px; height: 15px; }
body[data-tema="escuro"] {
  background:
    radial-gradient(circle at 12% 0%, rgba(141, 198, 63, 0.16), transparent 28%),
    linear-gradient(135deg, #03162b 0%, #071f3a 54%, #082a4d 100%);
  color: var(--branco);
}
body[data-tema="escuro"] .topo,
body[data-tema="escuro"] .card,
body[data-tema="escuro"] .kpi,
body[data-tema="escuro"] .modal,
body[data-tema="escuro"] .modal-cab,
body[data-tema="escuro"] .serie-card {
  background: linear-gradient(180deg, rgba(8,42,77,0.98), rgba(7,31,58,0.98));
  border-color: var(--cinza-borda);
  color: var(--branco);
}
body[data-tema="escuro"] .topo {
  box-shadow: 0 8px 24px rgba(0,0,0,.18);
}
body[data-tema="escuro"] .topo h1,
body[data-tema="escuro"] .kpi .valor,
body[data-tema="escuro"] .card-titulo,
body[data-tema="escuro"] .campo label,
body[data-tema="escuro"] .detalhe-item .val,
body[data-tema="escuro"] .serie-card-topo h3,
body[data-tema="escuro"] .alerta-serie strong,
body[data-tema="escuro"] .vazio h3 {
  color: var(--branco);
}
body[data-tema="escuro"] .subtitulo,
body[data-tema="escuro"] .kpi .rotulo,
body[data-tema="escuro"] .kpi .extra,
body[data-tema="escuro"] .card-titulo .card-sub,
body[data-tema="escuro"] .campo label .dica,
body[data-tema="escuro"] .barra-filtros .campo label,
body[data-tema="escuro"] .txt-cinza,
body[data-tema="escuro"] .detalhe-item .rot,
body[data-tema="escuro"] .serie-card-topo p,
body[data-tema="escuro"] .serie-metricas span,
body[data-tema="escuro"] .progress-label,
body[data-tema="escuro"] .serie-rodape,
body[data-tema="escuro"] .alerta-serie span,
body[data-tema="escuro"] .alerta-serie small,
body[data-tema="escuro"] .vazio,
body[data-tema="escuro"] .vazio p,
body[data-tema="escuro"] .legenda-mini,
body[data-tema="escuro"] .aviso-info,
body[data-tema="escuro"] .chip-faltante em {
  color: var(--cinza-texto-claro);
}
body[data-tema="escuro"] .btn-primario {
  background: var(--verde-claro);
  color: var(--azul-escuro-2);
}
body[data-tema="escuro"] .btn-primario:hover {
  background: var(--amarelo);
  color: var(--azul-escuro-2);
}
body[data-tema="escuro"] .btn-secundario,
body[data-tema="escuro"] .btn-perigo {
  background: rgba(255,255,255,.06);
  color: var(--branco);
  border-color: var(--cinza-borda);
}
body[data-tema="escuro"] .btn-secundario:hover {
  border-color: var(--verde-claro);
  color: var(--verde-claro);
  background: rgba(141,198,63,.10);
}
body[data-tema="escuro"] .tema-toggle {
  background: rgba(141,198,63,.16);
  border-color: rgba(141,198,63,.55);
  color: var(--verde-claro);
}
body[data-tema="escuro"] .tema-toggle:hover {
  background: rgba(255,212,1,.12);
  border-color: var(--amarelo);
  color: var(--amarelo);
}
body[data-tema="escuro"] .campo input,
body[data-tema="escuro"] .campo select,
body[data-tema="escuro"] .campo textarea {
  background: rgba(3,22,43,.82);
  color: var(--branco);
  border-color: var(--cinza-borda);
}
body[data-tema="escuro"] .campo input::placeholder,
body[data-tema="escuro"] .campo textarea::placeholder { color: rgba(217,232,247,.55); }
body[data-tema="escuro"] .campo input:focus,
body[data-tema="escuro"] .campo select:focus,
body[data-tema="escuro"] .campo textarea:focus {
  border-color: var(--verde-claro);
  box-shadow: 0 0 0 3px rgba(141,198,63,.18);
}
body[data-tema="escuro"] table.tabela thead th {
  background: #03162b;
  color: var(--branco);
}
body[data-tema="escuro"] table.tabela tbody td {
  border-bottom-color: var(--cinza-borda);
  color: var(--cinza-texto);
}
body[data-tema="escuro"] table.tabela tbody tr:nth-child(even) { background: rgba(255,255,255,.035); }
body[data-tema="escuro"] table.tabela tbody tr:hover { background: rgba(141,198,63,.10); }
body[data-tema="escuro"] .tabela-wrap { border-color: var(--cinza-borda); }
body[data-tema="escuro"] .icone-btn { color: var(--cinza-texto-claro); }
body[data-tema="escuro"] .icone-btn:hover { background: rgba(255,255,255,.08); color: var(--verde-claro); }
body[data-tema="escuro"] .card-titulo,
body[data-tema="escuro"] .form-acoes,
body[data-tema="escuro"] .detalhe-secao,
body[data-tema="escuro"] .form-secao { border-color: var(--cinza-borda); }
body[data-tema="escuro"] .card-titulo .acento::before { background: var(--verde-claro); }
body[data-tema="escuro"] .kpi { border-left-color: var(--branco); }
body[data-tema="escuro"] .kpi.verde { border-left-color: var(--verde-claro); }
body[data-tema="escuro"] .kpi.amarelo { border-left-color: var(--amarelo); }
body[data-tema="escuro"] .kpi.escuro { border-left-color: var(--verde-claro); }
body[data-tema="escuro"] .kpi.vermelho { border-left-color: var(--erro); }
body[data-tema="escuro"] .serie-metricas div,
body[data-tema="escuro"] .barra-progresso,
body[data-tema="escuro"] .barra-preenchimento {
  background: rgba(255,255,255,.08);
}
body[data-tema="escuro"] .alerta-serie,
body[data-tema="escuro"] .alerta-preenchimento-topo,
body[data-tema="escuro"] .aviso-info {
  background: rgba(255,212,1,.08);
  border-color: rgba(255,212,1,.35);
}
body[data-tema="escuro"] .alerta-serie.obrigatorio,
body[data-tema="escuro"] .alerta-serie.proximo,
body[data-tema="escuro"] .alerta-serie.semserie,
body[data-tema="escuro"] .chip-faltante,
body[data-tema="escuro"] tr.linha-alerta td {
  background: rgba(255,255,255,.045);
}
body[data-tema="escuro"] .chip-faltante {
  border-color: rgba(255,107,107,.45);
  color: #ffb3b3;
}
body[data-tema="escuro"] .chip-faltante small { background: rgba(255,107,107,.18); color: #ffb3b3; }
body[data-tema="escuro"] .badge-projeto { background: var(--verde-claro); color: var(--azul-escuro-2); }
body[data-tema="escuro"] .badge-ok,
body[data-tema="escuro"] .badge-bitola-mista { background: rgba(141,198,63,.18); color: var(--verde-claro); }
body[data-tema="escuro"] .badge-cura,
body[data-tema="escuro"] .badge-bitola-larga { background: rgba(255,255,255,.12); color: var(--branco); }
body[data-tema="escuro"] .badge-entregue,
body[data-tema="escuro"] .badge-bitola-sem { background: rgba(255,255,255,.10); color: var(--cinza-texto); }
body[data-tema="escuro"] .badge-amarelo { background: rgba(255,212,1,.18); color: var(--amarelo); }
body[data-tema="escuro"] .badge-bloqueado,
body[data-tema="escuro"] .badge-reprovado { background: rgba(255,107,107,.18); color: #ffb3b3; }
body[data-tema="escuro"] .status-serie.proximo { background: rgba(255,212,1,.18); color: var(--amarelo); }
body[data-tema="escuro"] .status-serie.andamento { background: rgba(141,198,63,.18); color: var(--verde-claro); }
body[data-tema="escuro"] .status-serie.liberado { background: rgba(141,198,63,.24); color: var(--verde-claro); }
body[data-tema="escuro"] .status-serie.obrigatorio { background: rgba(255,107,107,.18); color: #ffb3b3; }
body[data-tema="escuro"] .status-serie.semserie { background: rgba(255,255,255,.10); color: var(--cinza-texto); }

body[data-tema="escuro"] .serie-lotes,
body[data-tema="escuro"] .serie-liberacao,
body[data-tema="escuro"] .parecer-texto,
body[data-tema="escuro"] .motivo-card {
  background: rgba(255,255,255,.045);
  border-color: var(--cinza-borda);
}
body[data-tema="escuro"] .lote-serie-chip {
  background: rgba(3,22,43,.70);
  border-color: var(--cinza-borda);
  color: var(--branco);
}
body[data-tema="escuro"] .lote-serie-chip.ultimo {
  border-color: var(--amarelo);
  background: rgba(255,212,1,.10);
  box-shadow: 0 3px 16px rgba(255,212,1,.12);
}
body[data-tema="escuro"] .serie-lotes-topo strong,
body[data-tema="escuro"] .serie-liberacao strong,
body[data-tema="escuro"] .lote-serie-chip strong,
body[data-tema="escuro"] .motivo-card-topo strong,
body[data-tema="escuro"] .motivo-card-numero {
  color: var(--branco);
}
body[data-tema="escuro"] .serie-lotes-topo span,
body[data-tema="escuro"] .serie-liberacao span,
body[data-tema="escuro"] .serie-liberacao small,
body[data-tema="escuro"] .lote-serie-chip em,
body[data-tema="escuro"] .parecer-texto,
body[data-tema="escuro"] .motivo-card-meta {
  color: var(--cinza-texto-claro);
}
body[data-tema="escuro"] .lote-serie-chip small,
body[data-tema="escuro"] .motivo-card-topo span {
  background: rgba(255,212,1,.18);
  color: var(--amarelo);
}
body[data-tema="escuro"] .motivo-card.principal {
  border-color: rgba(255,212,1,.65);
  box-shadow: 0 4px 18px rgba(255,212,1,.10);
}

body[data-tema="escuro"] .modal-overlay { background: rgba(0,0,0,.68); }
body[data-tema="escuro"] .fechar-modal { color: var(--cinza-texto-claro); }
body[data-tema="escuro"] .fechar-modal:hover { background: rgba(255,255,255,.08); color: var(--branco); }
@media (max-width: 768px) {
  .tema-toggle span { display: none; }
  .tema-toggle { min-width: auto; padding-left: 10px; padding-right: 10px; }
}
body[data-tema="escuro"] .sidebar {
  background: linear-gradient(180deg, #03162b, #071f3a 70%, #082a4d);
  border-right: 1px solid var(--cinza-borda);
}
body[data-tema="escuro"] .nav a.ativo {
  background: var(--verde-claro);
  color: var(--azul-escuro-2);
}
body[data-tema="escuro"] .nav a:hover {
  background: rgba(255,255,255,.10);
  color: var(--branco);
}
body[data-tema="escuro"] .sidebar-logo .sub { color: var(--verde-claro); }

body[data-tema="escuro"] .serie-liberacao a,
body[data-tema="escuro"] .link-relatorio { color: var(--verde-claro); }


/* ===================== AUTENTICAÇÃO / SUPABASE ===================== */
.login-page,
.auth-bloqueio {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 28px;
  background:
    radial-gradient(circle at 12% 0%, rgba(141, 198, 63, 0.18), transparent 28%),
    linear-gradient(135deg, var(--azul-escuro-2) 0%, var(--azul-escuro) 58%, #082a4d 100%);
}
.login-card {
  width: min(460px, 100%);
  background: var(--cinza-card);
  border: 1px solid var(--cinza-borda);
  border-radius: 20px;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.28);
  padding: 32px;
  color: var(--azul-escuro);
}
.login-card h1 {
  font-size: 28px;
  line-height: 1.15;
  margin: 10px 0 8px;
}
.login-card p {
  color: var(--cinza-texto);
  margin-bottom: 22px;
}
.login-marca {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  font-weight: 800;
  letter-spacing: -1px;
  font-size: 34px;
  color: var(--azul-escuro);
}
.login-marca .o-circ {
  width: 18px;
  height: 18px;
  background: var(--verde-claro);
  border-radius: 50%;
  display: inline-block;
  transform: translateY(3px);
}
.login-form { display: grid; gap: 15px; }
.login-form .btn { justify-content: center; margin-top: 4px; }
.login-msg {
  margin-top: 16px;
  min-height: 20px;
  font-size: 13px;
  color: var(--cinza-texto);
}
.login-msg.erro { color: var(--erro); font-weight: 700; }
.login-msg.sucesso { color: var(--ok); font-weight: 700; }
.login-msg.info { color: var(--azul-escuro); }
.login-nota {
  margin-top: 22px;
  padding: 13px;
  border: 1px dashed var(--cinza-borda);
  border-radius: var(--raio-sm);
  color: var(--cinza-texto);
  font-size: 12.5px;
  background: var(--cinza-bg);
}
.usuario-auth {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.usuario-pill {
  display: inline-flex;
  flex-direction: column;
  gap: 1px;
  padding: 5px 10px;
  border: 1px solid var(--cinza-borda);
  border-radius: 999px;
  background: var(--cinza-bg);
  line-height: 1.1;
  max-width: 220px;
}
.usuario-nome {
  font-size: 12px;
  font-weight: 800;
  color: var(--azul-escuro);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.usuario-perfil {
  font-size: 10px;
  color: var(--cinza-texto-claro);
  text-transform: uppercase;
  letter-spacing: .4px;
}
.aviso-info.sucesso { border-left-color: var(--ok); }
.aviso-info.erro { border-left-color: var(--erro); }
.aviso-info.aviso { border-left-color: var(--amarelo); }

body[data-tema="escuro"] .login-card,
body[data-tema="escuro"] .login-nota,
body[data-tema="escuro"] .usuario-pill {
  background: linear-gradient(180deg, rgba(8,42,77,0.98), rgba(7,31,58,0.98));
  border-color: var(--cinza-borda);
  color: var(--branco);
}
body[data-tema="escuro"] .login-card h1,
body[data-tema="escuro"] .login-marca,
body[data-tema="escuro"] .login-msg.info,
body[data-tema="escuro"] .usuario-nome {
  color: var(--branco);
}
body[data-tema="escuro"] .login-card p,
body[data-tema="escuro"] .login-nota,
body[data-tema="escuro"] .usuario-perfil {
  color: var(--cinza-texto-claro);
}
@media (max-width: 900px) {
  .usuario-auth { display: none; }
}



/* Exportações */
.exportacoes-grupo{display:flex;gap:8px;align-items:center;margin-left:8px;padding-left:8px;border-left:1px solid var(--borda, #d9e2ec)}
.exportacoes-grupo .btn{min-height:34px}
@media (max-width: 760px){.exportacoes-grupo{width:100%;margin-left:0;padding-left:0;border-left:0}.exportacoes-grupo .btn{flex:1}}

/* ===================== AJUSTES MOBILE — sem alterar o desktop ===================== */
@media (max-width: 820px) {
  html,
  body,
  .app,
  .conteudo {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
  }

  body {
    font-size: 14px;
  }

  .conteudo,
  .pagina,
  .topo,
  .card,
  .modal,
  .tabela-wrap,
  .chart-box,
  .grid-graficos,
  .series-grid {
    min-width: 0;
    max-width: 100%;
  }

  .topo {
    position: sticky;
    top: 0;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 12px;
    padding: 12px 14px;
  }

  .topo > .flex {
    width: 100%;
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center !important;
    gap: 10px !important;
  }

  .topo h1 {
    font-size: 18px;
    line-height: 1.18;
    overflow-wrap: anywhere;
  }

  .topo .subtitulo {
    font-size: 12px;
    line-height: 1.35;
    max-width: 100%;
  }

  .topo-acoes {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    gap: 8px;
  }

  .topo-acoes > .btn,
  .topo-acoes > a.btn {
    flex: 0 0 auto;
  }

  #topoAcoes {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    flex: 1 1 auto;
    min-width: 0;
  }

  #topoAcoes > .btn,
  #topoAcoes > a.btn {
    flex: 0 0 auto;
  }

  .exportacoes-grupo {
    width: auto !important;
    max-width: 100%;
    margin-left: 0 !important;
    padding-left: 0 !important;
    border-left: 0 !important;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    flex: 0 1 auto;
  }

  .exportacoes-grupo .btn {
    flex: 0 0 auto !important;
  }

  .topo .btn {
    min-height: 36px;
    padding: 8px 11px;
    font-size: 12.5px;
  }

  .menu-toggle span {
    display: inline;
  }

  .pagina {
    padding: 16px 14px 44px;
  }

  .card {
    padding: 16px;
    margin-bottom: 16px;
    border-radius: 14px;
  }

  .card-titulo {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
    font-size: 15px;
    margin-bottom: 14px;
  }

  .barra-filtros {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    align-items: end;
    width: 100%;
    max-width: 100%;
  }

  .barra-filtros .campo,
  .barra-filtros .busca-rapida {
    min-width: 0;
    width: 100%;
  }

  .barra-filtros .busca-rapida,
  .barra-filtros .campo:has(#fSemana),
  .barra-filtros .campo:has(#fPeriodoIni),
  .barra-filtros .campo:has(#fPeriodoFim) {
    grid-column: 1 / -1;
  }

  .barra-filtros input,
  .barra-filtros select,
  .campo input,
  .campo select,
  .campo textarea {
    min-width: 0 !important;
    max-width: 100%;
    width: 100%;
    font-size: 14px;
  }

  .barra-filtros > button.btn {
    width: 100%;
    justify-content: center;
    white-space: normal;
  }

  .aviso-info {
    margin: 0 0 14px;
    align-items: flex-start;
    flex-wrap: wrap;
    line-height: 1.45;
  }

  .grid-kpi,
  .grid-kpi-compacto {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .kpi {
    padding: 16px 18px;
  }

  .kpi .valor {
    font-size: 28px;
  }

  .grid-graficos {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .chart-box,
  .chart-box.alto {
    height: 250px;
    width: 100%;
    overflow: hidden;
  }

  canvas {
    max-width: 100% !important;
  }

  .tabela-wrap {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  table.tabela {
    font-size: 12px;
  }

  table.tabela thead th,
  table.tabela tbody td {
    padding: 9px 10px;
  }

  .form-grid,
  .detalhe-grid {
    grid-template-columns: 1fr;
  }

  .form-acoes {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .form-acoes .btn {
    width: 100%;
    justify-content: center;
  }

  .modal-overlay {
    padding: 10px;
    align-items: flex-start;
    overflow-y: auto;
  }

  .modal {
    max-height: calc(100vh - 20px);
    border-radius: 16px;
  }

  .modal-cab,
  .modal-corpo {
    padding: 16px;
  }

  .series-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .serie-card {
    padding: 15px;
  }

  .serie-card-topo,
  .serie-rodape,
  .serie-liberacao,
  .motivo-card-topo {
    flex-direction: column;
    align-items: flex-start;
  }

  .serie-metricas {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .motivos-grid {
    grid-template-columns: 1fr;
  }

  .lotes-serie-lista {
    display: grid;
    grid-template-columns: 1fr;
    max-height: 240px;
  }

  .lote-serie-chip {
    min-width: 0;
    width: 100%;
  }

  .toast-wrap {
    left: 12px;
    right: 12px;
    bottom: 12px;
  }

  .toast {
    max-width: none;
    width: 100%;
  }
}

@media (max-width: 460px) {
  .topo {
    padding: 10px 12px;
  }

  .topo > .flex {
    align-items: start !important;
  }

  .topo h1 {
    font-size: 17px;
  }

  .topo .subtitulo {
    font-size: 12px;
  }

  .topo .btn {
    padding: 8px 10px;
  }

  .hub-link {
    min-width: 58px;
    justify-content: center;
  }

  .pagina {
    padding: 14px 10px 40px;
  }

  .barra-filtros {
    grid-template-columns: 1fr;
  }

  .card {
    padding: 14px;
  }

  .kpi .valor {
    font-size: 26px;
  }

  .serie-metricas {
    grid-template-columns: 1fr;
  }

  .chart-box,
  .chart-box.alto {
    height: 220px;
  }
}


/* ===================== LEITOR IAUDITOR EM ENSAIOS DE LIBERAÇÃO ===================== */
.iauditor-card { border-top: 4px solid var(--azul-claro); }
.iauditor-grid {
  display: grid;
  grid-template-columns: minmax(280px, 1.2fr) minmax(240px, .8fr);
  gap: 18px;
  align-items: stretch;
}
.iauditor-drop {
  border: 2px dashed var(--cinza-borda);
  background: linear-gradient(135deg, rgba(50,166,230,.08), rgba(141,198,63,.08));
  border-radius: var(--raio);
  padding: 20px;
  display: grid;
  grid-template-columns: 58px 1fr;
  gap: 16px;
  cursor: pointer;
  transition: var(--transicao);
  min-height: 150px;
}
.iauditor-drop:hover,
.iauditor-drop.arrastando,
.iauditor-drop:focus {
  border-color: var(--azul-claro);
  box-shadow: 0 0 0 4px rgba(50,166,230,.12);
  outline: none;
}
.iauditor-drop-icone {
  width: 54px;
  height: 54px;
  border-radius: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--azul-escuro);
  color: var(--branco);
}
.iauditor-drop-icone .ic { width: 28px; height: 28px; }
.iauditor-drop strong { display: block; font-size: 16px; color: var(--azul-escuro); margin-bottom: 6px; }
.iauditor-drop p,
.iauditor-orientacao p { color: var(--cinza-texto); font-size: 13.5px; line-height: 1.65; margin-bottom: 12px; }
.iauditor-orientacao {
  border: 1px solid var(--cinza-borda);
  border-radius: var(--raio);
  padding: 18px;
  background: var(--cinza-bg);
}
.iauditor-orientacao h3 { font-size: 15px; margin-bottom: 8px; }
.iauditor-resultado { margin-top: 18px; }
.iauditor-status {
  border: 1px solid var(--cinza-borda);
  border-radius: var(--raio);
  padding: 16px;
  background: var(--branco);
}
.iauditor-status.ok { border-color: rgba(30,159,128,.35); background: rgba(30,159,128,.06); }
.iauditor-status.aviso { border-color: rgba(255,212,1,.55); background: rgba(255,212,1,.12); }
.iauditor-status.erro { border-color: rgba(226,59,59,.35); background: rgba(226,59,59,.08); }
.iauditor-status h3 { font-size: 15px; margin-bottom: 6px; }
.iauditor-status p { color: var(--cinza-texto); font-size: 13.5px; line-height: 1.6; }
.iauditor-meta-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 10px;
  margin: 14px 0;
}
.iauditor-meta-item {
  background: var(--branco);
  border: 1px solid var(--cinza-borda);
  border-radius: var(--raio-sm);
  padding: 10px 12px;
}
.iauditor-meta-item .rot { font-size: 11px; color: var(--cinza-texto-claro); text-transform: uppercase; font-weight: 700; letter-spacing: .4px; }
.iauditor-meta-item .val { margin-top: 3px; color: var(--azul-escuro); font-weight: 700; }
.iauditor-acoes { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
.iauditor-mini-tabela { margin-top: 14px; }
.iauditor-mini-tabela table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.iauditor-mini-tabela th,
.iauditor-mini-tabela td { padding: 8px 9px; border-bottom: 1px solid var(--cinza-borda); text-align: left; vertical-align: top; }
.iauditor-mini-tabela th { color: var(--azul-escuro); font-size: 11px; text-transform: uppercase; letter-spacing: .3px; }
.iauditor-mini-tabela td { color: var(--cinza-texto); }
.iauditor-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 9px;
  border-radius: 999px;
  font-size: 11.5px;
  font-weight: 700;
  background: var(--cinza-bg);
  color: var(--azul-escuro);
  border: 1px solid var(--cinza-borda);
}
.iauditor-chip.ok { background: rgba(30,159,128,.12); border-color: rgba(30,159,128,.32); color: var(--ok); }
.iauditor-chip.aviso { background: rgba(255,212,1,.2); border-color: rgba(255,212,1,.6); color: var(--azul-escuro); }
.iauditor-chip.erro { background: rgba(226,59,59,.12); border-color: rgba(226,59,59,.34); color: var(--erro); }

@media (max-width: 900px) {
  .iauditor-grid { grid-template-columns: 1fr; }
  .iauditor-drop { grid-template-columns: 1fr; }
}

/* ===================== ADMINISTRAÇÃO DE USUÁRIOS ===================== */
.usuarios-page { display: flex; flex-direction: column; gap: 18px; }
.usuarios-page .card { margin-bottom: 0; }

.usuarios-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(280px, .9fr);
  gap: 22px;
  align-items: center;
  overflow: hidden;
  position: relative;
}
.usuarios-hero::after {
  content: '';
  position: absolute;
  inset: auto -80px -110px auto;
  width: 260px;
  height: 260px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(50,166,230,.12), transparent 64%);
  pointer-events: none;
}
.usuarios-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 5px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .4px;
  text-transform: uppercase;
  color: var(--azul-escuro);
  background: rgba(50,166,230,.10);
  border: 1px solid rgba(50,166,230,.22);
  margin-bottom: 12px;
}
.usuarios-hero h2 {
  font-size: 26px;
  line-height: 1.15;
  letter-spacing: -.5px;
  margin-bottom: 8px;
}
.usuarios-hero p {
  color: var(--cinza-texto);
  max-width: 720px;
  font-size: 14px;
  line-height: 1.7;
}
.usuarios-hero-passos {
  display: grid;
  gap: 10px;
}
.usuarios-hero-passos div {
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: 11px;
  align-items: center;
  padding: 11px 13px;
  border: 1px solid var(--cinza-borda);
  border-radius: var(--raio-sm);
  background: linear-gradient(180deg, rgba(255,255,255,.66), rgba(244,246,249,.76));
}
.usuarios-hero-passos strong {
  width: 30px;
  height: 30px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--azul-escuro);
  color: var(--branco);
  font-size: 13px;
}
.usuarios-hero-passos span {
  color: var(--cinza-texto);
  font-size: 13px;
  font-weight: 650;
}

.usuarios-resumo-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  gap: 14px;
}
.usuarios-kpi {
  padding: 18px;
  border-left: 5px solid var(--azul-claro);
}
.usuarios-kpi.admin { border-left-color: var(--azul-escuro); }
.usuarios-kpi.fiscalizacao { border-left-color: var(--verde-claro); }
.usuarios-kpi.consulta { border-left-color: var(--amarelo); }
.usuarios-kpi span {
  color: var(--cinza-texto);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .35px;
  text-transform: uppercase;
}
.usuarios-kpi strong {
  display: block;
  font-size: 32px;
  line-height: 1;
  margin: 9px 0 4px;
  color: var(--azul-escuro);
}
.usuarios-kpi small {
  color: var(--cinza-texto-claro);
  font-size: 12px;
}

.usuarios-layout {
  display: grid;
  grid-template-columns: minmax(320px, .95fr) minmax(320px, 1.05fr);
  gap: 18px;
  align-items: start;
}
.usuarios-alerta {
  display: flex;
  gap: 8px;
  padding: 12px 13px;
  border-radius: var(--raio-sm);
  border: 1px solid rgba(255,212,1,.55);
  background: rgba(255,212,1,.14);
  color: var(--azul-escuro);
  font-size: 13px;
  line-height: 1.5;
}
.usuarios-form label.campo {
  font-size: 12.5px;
  font-weight: 700;
  color: var(--azul-escuro);
}
.usuarios-form .full { grid-column: 1 / -1; }
.usuarios-form input,
.usuarios-form select { margin-top: 5px; }

.usuarios-perfis-lista {
  display: grid;
  gap: 12px;
}
.usuarios-perfil-card {
  border: 1px solid var(--cinza-borda);
  border-radius: var(--raio);
  padding: 15px;
  background: linear-gradient(180deg, rgba(244,246,249,.76), rgba(255,255,255,.92));
  border-left: 5px solid var(--azul-claro);
}
.usuarios-perfil-card.admin { border-left-color: var(--azul-escuro); }
.usuarios-perfil-card.fiscalizacao { border-left-color: var(--verde-claro); }
.usuarios-perfil-card.consulta { border-left-color: var(--amarelo); }
.usuarios-perfil-card > div {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}
.usuarios-perfil-card strong {
  font-size: 15px;
  color: var(--azul-escuro);
}
.usuarios-perfil-card span {
  color: var(--cinza-texto);
  font-size: 12px;
  font-weight: 700;
  text-align: right;
}
.usuarios-perfil-card ul {
  list-style: none;
  display: grid;
  gap: 5px;
}
.usuarios-perfil-card li {
  color: var(--cinza-texto);
  font-size: 12.5px;
  line-height: 1.45;
  padding-left: 17px;
  position: relative;
}
.usuarios-perfil-card li::before {
  content: '✓';
  position: absolute;
  left: 0;
  top: 0;
  color: var(--verde);
  font-weight: 900;
}

.usuarios-lista-card { padding-bottom: 18px; }
.usuarios-lista-topo {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
}
.usuarios-status {
  color: var(--cinza-texto);
  font-size: 13px;
  margin-top: 8px;
}
.usuarios-filtros {
  display: grid;
  grid-template-columns: minmax(240px, 1fr) minmax(160px, 220px) minmax(150px, 200px);
  gap: 12px;
  align-items: end;
  margin-bottom: 16px;
  padding: 14px;
  border-radius: var(--raio);
  border: 1px solid var(--cinza-borda);
  background: var(--cinza-bg);
}
.usuarios-filtros label.campo {
  font-size: 12px;
  font-weight: 800;
  color: var(--azul-escuro);
}
.usuarios-filtros input,
.usuarios-filtros select { margin-top: 5px; }
.usuarios-tabela-wrap { border-radius: var(--raio); }
.usuarios-tabela { min-width: 880px; }
.usuarios-tabela th:first-child,
.usuarios-tabela td:first-child { min-width: 250px; }
.usuarios-identidade {
  display: flex;
  align-items: center;
  gap: 11px;
}
.usuarios-identidade strong {
  display: block;
  color: var(--azul-escuro);
  line-height: 1.2;
}
.usuarios-identidade small {
  display: block;
  color: var(--cinza-texto);
  margin-top: 2px;
  font-size: 12px;
}
.usuarios-avatar {
  width: 36px;
  height: 36px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .4px;
  background: var(--azul-escuro);
  color: var(--branco);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.16);
}
.usuarios-uid {
  display: inline-block;
  max-width: 250px;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
  color: var(--cinza-texto);
  background: rgba(0,53,103,.05);
  border: 1px solid var(--cinza-borda);
  border-radius: 999px;
  padding: 4px 8px;
}
.usuarios-badge-admin { background: var(--azul-escuro); color: var(--branco); }
.usuarios-badge-fiscalizacao { background: #eaf7df; color: #357a14; }
.usuarios-badge-consulta { background: #fff6cc; color: #8a7400; }
.usuarios-badge-ativo { background: #e3f5ef; color: #137a5f; }
.usuarios-badge-inativo { background: #ffeaea; color: var(--erro); }

body[data-tema="escuro"] .usuarios-eyebrow {
  color: var(--verde-claro);
  background: rgba(141,198,63,.12);
  border-color: rgba(141,198,63,.32);
}
body[data-tema="escuro"] .usuarios-hero p,
body[data-tema="escuro"] .usuarios-status,
body[data-tema="escuro"] .usuarios-kpi span,
body[data-tema="escuro"] .usuarios-kpi small,
body[data-tema="escuro"] .usuarios-identidade small,
body[data-tema="escuro"] .usuarios-perfil-card span,
body[data-tema="escuro"] .usuarios-perfil-card li,
body[data-tema="escuro"] .usuarios-hero-passos span {
  color: var(--cinza-texto-claro);
}
body[data-tema="escuro"] .usuarios-hero h2,
body[data-tema="escuro"] .usuarios-kpi strong,
body[data-tema="escuro"] .usuarios-form label.campo,
body[data-tema="escuro"] .usuarios-filtros label.campo,
body[data-tema="escuro"] .usuarios-identidade strong,
body[data-tema="escuro"] .usuarios-perfil-card strong {
  color: var(--branco);
}
body[data-tema="escuro"] .usuarios-hero-passos div,
body[data-tema="escuro"] .usuarios-perfil-card,
body[data-tema="escuro"] .usuarios-filtros {
  background: rgba(255,255,255,.045);
  border-color: var(--cinza-borda);
}
body[data-tema="escuro"] .usuarios-hero-passos strong,
body[data-tema="escuro"] .usuarios-avatar {
  background: var(--verde-claro);
  color: var(--azul-escuro-2);
}
body[data-tema="escuro"] .usuarios-alerta {
  color: var(--amarelo);
  background: rgba(255,212,1,.08);
  border-color: rgba(255,212,1,.35);
}
body[data-tema="escuro"] .usuarios-uid {
  color: var(--cinza-texto-claro);
  background: rgba(255,255,255,.06);
  border-color: var(--cinza-borda);
}
body[data-tema="escuro"] .usuarios-badge-admin { background: rgba(255,255,255,.14); color: var(--branco); }
body[data-tema="escuro"] .usuarios-badge-fiscalizacao,
body[data-tema="escuro"] .usuarios-badge-ativo { background: rgba(141,198,63,.18); color: var(--verde-claro); }
body[data-tema="escuro"] .usuarios-badge-consulta { background: rgba(255,212,1,.18); color: var(--amarelo); }
body[data-tema="escuro"] .usuarios-badge-inativo { background: rgba(255,107,107,.18); color: #ffb3b3; }

@media (max-width: 1100px) {
  .usuarios-resumo-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .usuarios-layout,
  .usuarios-hero { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
  .usuarios-resumo-grid,
  .usuarios-filtros { grid-template-columns: 1fr; }
  .usuarios-lista-topo,
  .usuarios-perfil-card > div,
  .usuarios-alerta {
    flex-direction: column;
    align-items: flex-start;
  }
  .usuarios-perfil-card span { text-align: left; }
  .usuarios-hero h2 { font-size: 22px; }
}

/* ===================== AUDITORIA — UI ORGANIZADA ===================== */
.auditoria-page { display: flex; flex-direction: column; gap: 18px; }
.auditoria-page .card { margin-bottom: 0; }

.auditoria-hero {
  display: grid;
  grid-template-columns: minmax(320px, 1.25fr) minmax(280px, .75fr);
  gap: 22px;
  align-items: stretch;
  overflow: hidden;
  position: relative;
  padding: 24px;
}
.auditoria-hero::after {
  content: '';
  position: absolute;
  inset: auto -90px -120px auto;
  width: 260px;
  height: 260px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(141,198,63,.22), transparent 68%);
  pointer-events: none;
}
.auditoria-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 5px 10px;
  border-radius: 999px;
  background: rgba(0,53,103,.07);
  color: var(--azul-escuro);
  border: 1px solid rgba(0,53,103,.1);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .55px;
  text-transform: uppercase;
  margin-bottom: 12px;
}
.auditoria-eyebrow::before {
  content: '';
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: var(--verde-claro);
}
.auditoria-hero h2 {
  font-size: 27px;
  line-height: 1.15;
  letter-spacing: -.6px;
  color: var(--azul-escuro);
  margin-bottom: 8px;
}
.auditoria-hero p {
  max-width: 720px;
  color: var(--cinza-texto);
  line-height: 1.7;
}
.auditoria-hero-blocos {
  display: grid;
  gap: 10px;
  align-content: center;
}
.auditoria-hero-blocos div {
  display: grid;
  gap: 3px;
  padding: 13px 14px;
  border: 1px solid var(--cinza-borda);
  border-radius: var(--raio-sm);
  background: linear-gradient(180deg, rgba(244,246,249,.72), rgba(255,255,255,.92));
}
.auditoria-hero-blocos strong {
  color: var(--azul-escuro);
  font-size: 13px;
}
.auditoria-hero-blocos span {
  color: var(--cinza-texto);
  font-size: 12px;
  line-height: 1.4;
}

.auditoria-resumo-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  gap: 14px;
}
.auditoria-kpi {
  padding: 18px;
  border-left: 5px solid var(--azul-claro);
}
.auditoria-kpi.criacao { border-left-color: var(--verde-claro); }
.auditoria-kpi.alteracao { border-left-color: var(--amarelo); }
.auditoria-kpi.exclusao { border-left-color: var(--erro); }
.auditoria-kpi.total { border-left-color: var(--azul-escuro); }
.auditoria-kpi span {
  display: block;
  color: var(--cinza-texto);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .35px;
  text-transform: uppercase;
}
.auditoria-kpi strong {
  display: block;
  font-size: 32px;
  line-height: 1;
  margin: 9px 0 4px;
  color: var(--azul-escuro);
}
.auditoria-kpi small {
  color: var(--cinza-texto-claro);
  font-size: 12px;
}

.auditoria-grafico-card {
  padding: 18px;
}
.auditoria-grafico-topo {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 8px;
}
.auditoria-grafico-dica {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  flex: 0 0 auto;
  padding: 7px 10px;
  border-radius: 999px;
  background: rgba(0,151,220,.08);
  border: 1px solid rgba(0,151,220,.18);
  color: var(--azul-escuro);
  font-size: 12px;
  font-weight: 800;
}
.auditoria-grafico-dica::before {
  content: '↔';
  font-weight: 900;
  color: var(--azul-claro);
}
.auditoria-grafico-scroll {
  overflow-x: auto;
  overflow-y: hidden;
  padding: 10px 2px 4px;
  scrollbar-color: var(--azul-claro) transparent;
}
.auditoria-grafico-scroll::-webkit-scrollbar { height: 10px; }
.auditoria-grafico-scroll::-webkit-scrollbar-track {
  background: rgba(0,53,103,.06);
  border-radius: 999px;
}
.auditoria-grafico-scroll::-webkit-scrollbar-thumb {
  background: rgba(0,151,220,.55);
  border-radius: 999px;
}
.auditoria-grafico-barras {
  min-height: 238px;
  display: flex;
  align-items: flex-end;
  gap: 8px;
  padding: 16px 10px 8px;
  border: 1px solid var(--cinza-borda);
  border-radius: var(--raio);
  background:
    linear-gradient(180deg, rgba(0,53,103,.035), rgba(255,255,255,.82)),
    repeating-linear-gradient(to top, transparent 0, transparent 47px, rgba(0,53,103,.07) 48px);
}
.auditoria-grafico-dia {
  width: 50px;
  min-width: 50px;
  height: 204px;
  display: grid;
  grid-template-rows: 24px 1fr 24px;
  gap: 7px;
  align-items: end;
  text-align: center;
}
.auditoria-grafico-valor {
  align-self: start;
  color: var(--azul-escuro);
  font-size: 12px;
  font-weight: 900;
}
.auditoria-grafico-coluna {
  height: 140px;
  width: 100%;
  display: flex;
  align-items: flex-end;
  justify-content: center;
}
.auditoria-grafico-coluna i {
  display: block;
  width: 30px;
  min-height: 3px;
  border-radius: 10px 10px 4px 4px;
  background: linear-gradient(180deg, var(--verde-claro), var(--azul-claro));
  box-shadow: 0 8px 18px rgba(0,53,103,.14);
}
.auditoria-grafico-dia.sem-movimento .auditoria-grafico-valor {
  color: var(--cinza-texto-claro);
  font-weight: 700;
}
.auditoria-grafico-dia.sem-movimento .auditoria-grafico-coluna i {
  background: rgba(0,53,103,.16);
  box-shadow: none;
}
.auditoria-grafico-rotulo {
  align-self: end;
  color: var(--cinza-texto);
  font-size: 11px;
  font-weight: 800;
}
.auditoria-grafico-vazio {
  width: 100%;
  align-self: center;
}

.auditoria-filtros-card { padding-bottom: 18px; }
.auditoria-filtros {
  display: grid;
  grid-template-columns: minmax(260px, 1.4fr) minmax(150px, .75fr) minmax(140px, .65fr) minmax(135px, .65fr) minmax(135px, .65fr) auto;
  gap: 12px;
  align-items: end;
  margin-top: 14px;
}
.auditoria-filtros label.campo {
  font-size: 12px;
  font-weight: 800;
  color: var(--azul-escuro);
}
.auditoria-filtros input,
.auditoria-filtros select { margin-top: 5px; }
.auditoria-filtros-acoes {
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: flex-end;
  white-space: nowrap;
}

.auditoria-lista-card { padding-bottom: 18px; }
.auditoria-lista-topo {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
}
.auditoria-status {
  color: var(--cinza-texto);
  font-size: 13px;
  margin-top: 8px;
}
.auditoria-legenda {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
  color: var(--cinza-texto);
  font-size: 12px;
  font-weight: 700;
}
.auditoria-legenda span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 9px;
  border-radius: 999px;
  background: var(--cinza-bg);
  border: 1px solid var(--cinza-borda);
}
.auditoria-legenda .dot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  display: inline-block;
}
.auditoria-legenda .dot.criacao { background: var(--verde-claro); }
.auditoria-legenda .dot.alteracao { background: var(--amarelo); }
.auditoria-legenda .dot.exclusao { background: var(--erro); }

.auditoria-tabela-wrap { border-radius: var(--raio); }
.auditoria-tabela { min-width: 1100px; }
.auditoria-tabela th:nth-child(1),
.auditoria-tabela td:nth-child(1) { width: 120px; }
.auditoria-tabela th:nth-child(2),
.auditoria-tabela td:nth-child(2) { min-width: 245px; }
.auditoria-tabela th:nth-child(5),
.auditoria-tabela td:nth-child(5) { min-width: 250px; }
.auditoria-tabela th:nth-child(6),
.auditoria-tabela td:nth-child(6) { min-width: 340px; }
.auditoria-row td {
  vertical-align: top;
  padding-top: 14px;
  padding-bottom: 14px;
}
.auditoria-row-insert { box-shadow: inset 4px 0 0 rgba(141,198,63,.85); }
.auditoria-row-update { box-shadow: inset 4px 0 0 rgba(255,212,1,.9); }
.auditoria-row-delete { box-shadow: inset 4px 0 0 rgba(226,59,59,.8); }

.auditoria-data strong {
  display: block;
  color: var(--azul-escuro);
  line-height: 1.25;
}
.auditoria-data span {
  display: block;
  color: var(--cinza-texto);
  font-size: 12px;
  margin-top: 2px;
}
.auditoria-usuario {
  display: flex;
  align-items: center;
  gap: 11px;
}
.auditoria-usuario strong {
  display: block;
  color: var(--azul-escuro);
  line-height: 1.2;
}
.auditoria-usuario small {
  display: block;
  color: var(--cinza-texto);
  margin-top: 2px;
  font-size: 12px;
}
.auditoria-avatar {
  width: 36px;
  height: 36px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .4px;
  background: var(--azul-escuro);
  color: var(--branco);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.16);
}

.auditoria-badge-criacao { background: #eaf7df; color: #357a14; }
.auditoria-badge-alteracao { background: #fff6cc; color: #8a7400; }
.auditoria-badge-exclusao { background: #ffeaea; color: var(--erro); }
.auditoria-badge-neutro { background: #eef0f2; color: #4a5b6b; }
.auditoria-area-producao { background: var(--azul-escuro); color: var(--branco); }
.auditoria-area-reprovados { background: #ffeaea; color: var(--erro); }
.auditoria-area-ensaios { background: #e0f3fc; color: #0277a8; }
.auditoria-area-neutra { background: #eef0f2; color: #4a5b6b; }

.auditoria-registro {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.auditoria-registro span {
  display: inline-flex;
  gap: 4px;
  align-items: center;
  max-width: 100%;
  padding: 5px 8px;
  border-radius: 999px;
  border: 1px solid var(--cinza-borda);
  background: rgba(0,53,103,.04);
  color: var(--cinza-texto);
  font-size: 12px;
  line-height: 1.25;
}
.auditoria-registro b {
  color: var(--azul-escuro);
  font-weight: 900;
}
.auditoria-id {
  display: inline-block;
  max-width: 260px;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
  color: var(--cinza-texto);
  background: rgba(0,53,103,.05);
  border: 1px solid var(--cinza-borda);
  border-radius: 999px;
  padding: 4px 8px;
}

.auditoria-resumo {
  display: grid;
  gap: 6px;
  color: var(--cinza-texto);
  font-size: 13px;
  line-height: 1.45;
}
.auditoria-resumo > strong {
  color: var(--azul-escuro);
  font-size: 13px;
}
.auditoria-resumo > span { display: block; }
.auditoria-campo {
  display: grid;
  grid-template-columns: minmax(90px, 125px) minmax(70px, 1fr) auto minmax(70px, 1fr);
  gap: 7px;
  align-items: baseline;
  padding: 7px 9px;
  border-radius: var(--raio-sm);
  background: rgba(0,53,103,.045);
  border: 1px solid var(--cinza-borda);
}
.auditoria-campo b {
  color: var(--azul-escuro);
  font-size: 12px;
}
.auditoria-campo em {
  font-style: normal;
  color: var(--cinza-texto);
  overflow-wrap: anywhere;
}
.auditoria-campo i {
  font-style: normal;
  color: var(--verde);
  font-weight: 900;
}
.auditoria-mais {
  color: var(--cinza-texto-claro);
  font-size: 12px;
  font-weight: 700;
}

body[data-tema="escuro"] .auditoria-eyebrow {
  color: var(--verde-claro);
  background: rgba(141,198,63,.12);
  border-color: rgba(141,198,63,.32);
}
body[data-tema="escuro"] .auditoria-hero h2,
body[data-tema="escuro"] .auditoria-hero-blocos strong,
body[data-tema="escuro"] .auditoria-kpi strong,
body[data-tema="escuro"] .auditoria-filtros label.campo,
body[data-tema="escuro"] .auditoria-data strong,
body[data-tema="escuro"] .auditoria-usuario strong,
body[data-tema="escuro"] .auditoria-registro b,
body[data-tema="escuro"] .auditoria-resumo > strong,
body[data-tema="escuro"] .auditoria-campo b {
  color: var(--branco);
}
body[data-tema="escuro"] .auditoria-hero p,
body[data-tema="escuro"] .auditoria-hero-blocos span,
body[data-tema="escuro"] .auditoria-kpi span,
body[data-tema="escuro"] .auditoria-kpi small,
body[data-tema="escuro"] .auditoria-status,
body[data-tema="escuro"] .auditoria-legenda,
body[data-tema="escuro"] .auditoria-data span,
body[data-tema="escuro"] .auditoria-usuario small,
body[data-tema="escuro"] .auditoria-resumo,
body[data-tema="escuro"] .auditoria-campo em,
body[data-tema="escuro"] .auditoria-registro span,
body[data-tema="escuro"] .auditoria-id {
  color: var(--cinza-texto-claro);
}
body[data-tema="escuro"] .auditoria-hero-blocos div,
body[data-tema="escuro"] .auditoria-legenda span,
body[data-tema="escuro"] .auditoria-registro span,
body[data-tema="escuro"] .auditoria-id,
body[data-tema="escuro"] .auditoria-campo {
  background: rgba(255,255,255,.045);
  border-color: var(--cinza-borda);
}
body[data-tema="escuro"] .auditoria-avatar,
body[data-tema="escuro"] .auditoria-area-producao {
  background: var(--verde-claro);
  color: var(--azul-escuro-2);
}
body[data-tema="escuro"] .auditoria-badge-criacao { background: rgba(141,198,63,.18); color: var(--verde-claro); }
body[data-tema="escuro"] .auditoria-badge-alteracao { background: rgba(255,212,1,.18); color: var(--amarelo); }
body[data-tema="escuro"] .auditoria-badge-exclusao,
body[data-tema="escuro"] .auditoria-area-reprovados { background: rgba(255,107,107,.18); color: #ffb3b3; }
body[data-tema="escuro"] .auditoria-area-ensaios,
body[data-tema="escuro"] .auditoria-badge-neutro,
body[data-tema="escuro"] .auditoria-area-neutra { background: rgba(255,255,255,.12); color: var(--branco); }
body[data-tema="escuro"] .auditoria-kpi.total { border-left-color: var(--verde-claro); }
body[data-tema="escuro"] .auditoria-grafico-dica {
  background: rgba(141,198,63,.12);
  border-color: rgba(141,198,63,.32);
  color: var(--verde-claro);
}
body[data-tema="escuro"] .auditoria-grafico-barras {
  background:
    linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.018)),
    repeating-linear-gradient(to top, transparent 0, transparent 47px, rgba(255,255,255,.08) 48px);
  border-color: var(--cinza-borda);
}
body[data-tema="escuro"] .auditoria-grafico-valor { color: var(--branco); }
body[data-tema="escuro"] .auditoria-grafico-rotulo { color: var(--cinza-texto-claro); }
body[data-tema="escuro"] .auditoria-grafico-dia.sem-movimento .auditoria-grafico-coluna i {
  background: rgba(255,255,255,.16);
}

@media (max-width: 1180px) {
  .auditoria-resumo-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .auditoria-filtros { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .auditoria-busca,
  .auditoria-filtros-acoes { grid-column: 1 / -1; }
  .auditoria-filtros-acoes { justify-content: flex-start; }
}

@media (max-width: 760px) {
  .auditoria-hero,
  .auditoria-resumo-grid,
  .auditoria-filtros { grid-template-columns: 1fr; }
  .auditoria-lista-topo,
  .auditoria-legenda {
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
  }
  .auditoria-filtros-acoes { flex-direction: column; align-items: stretch; }
  .auditoria-grafico-topo { flex-direction: column; align-items: flex-start; }
  .auditoria-grafico-dica { flex: 1 1 auto; }
  .auditoria-hero h2 { font-size: 22px; }
  .auditoria-campo { grid-template-columns: 1fr; }
  .auditoria-campo i { display: none; }
}

/* =====================================================================
   REFRESH VISUAL RUMO - alinhado ao brandbook: movimento, segurança,
   eficiência e paleta institucional oficial.
   ===================================================================== */
:root {
  --azul-escuro: #003865;
  --azul-escuro-2: #002D51;
  --azul-profundo: #001728;
  --azul-claro: #32A6E6;
  --azul-claro-2: #D6EDFA;
  --verde: #1E9F7F;
  --verde-claro: #7FE06C;
  --verde-suave: #E5F9C2;
  --amarelo: #FBD300;
  --laranja: #F78344;
  --roxo: #9F4BB9;
  --cinza-marca: #BDCCD4;
  --cinza-bg: #F2F5F6;
  --cinza-card: rgba(255,255,255,.94);
  --cinza-borda: #D7E0E5;
  --cinza-texto: #486272;
  --cinza-texto-claro: #78909C;
  --sombra: 0 18px 45px rgba(0, 56, 101, 0.10);
  --sombra-hover: 0 24px 70px rgba(0, 56, 101, 0.18);
  --raio: 22px;
  --raio-sm: 14px;
}

body {
  min-height: 100vh;
  background:
    radial-gradient(circle at 6% 0%, rgba(50,166,230,.18), transparent 30%),
    radial-gradient(circle at 95% 8%, rgba(127,224,108,.20), transparent 28%),
    linear-gradient(135deg, #F8FBFC 0%, #EEF5F8 58%, #E8F5EF 100%);
  color: var(--azul-escuro);
}
body::before {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: -1;
  background:
    repeating-linear-gradient(112deg, transparent 0 58px, rgba(0,56,101,.042) 59px 61px, transparent 62px 108px),
    linear-gradient(90deg, transparent 0%, rgba(50,166,230,.05) 48%, transparent 100%);
  mask-image: linear-gradient(180deg, rgba(0,0,0,.9), rgba(0,0,0,.22));
}

.logo-rumo { display: block; max-width: 100%; height: auto; }
.sidebar-logo .logo-rumo { width: 154px; filter: drop-shadow(0 10px 22px rgba(0,0,0,.18)); }
.sidebar-logo .marca { display: none; }

.sidebar {
  width: 292px;
  left: -320px;
  background:
    radial-gradient(circle at 10% 4%, rgba(127,224,108,.28), transparent 26%),
    radial-gradient(circle at 88% 0%, rgba(50,166,230,.22), transparent 22%),
    linear-gradient(180deg, #003865 0%, #002D51 54%, #001728 100%);
  box-shadow: 16px 0 48px rgba(0, 23, 40, .34);
  overflow: hidden;
}
.sidebar::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, transparent 0 70%, rgba(255,255,255,.07) 70% 70.7%, transparent 70.7% 100%),
    repeating-linear-gradient(135deg, rgba(255,255,255,.07) 0 1px, transparent 1px 30px);
  opacity: .45;
}
.sidebar > * { position: relative; z-index: 1; }
.sidebar.aberta { left: 0; }
.sidebar-logo {
  padding: 30px 28px 24px;
  border-bottom: 1px solid rgba(255,255,255,.14);
}
.sidebar-logo .sub {
  margin-top: 13px;
  color: var(--verde-claro);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .9px;
  text-transform: uppercase;
}
.nav { padding: 18px 14px; }
.nav-section-label {
  color: rgba(255,255,255,.54);
  padding: 18px 14px 7px;
  font-size: 10px;
  font-weight: 800;
}
.nav a {
  min-height: 44px;
  border-radius: 16px;
  color: rgba(255,255,255,.82);
  border: 1px solid transparent;
  position: relative;
  overflow: hidden;
}
.nav a::before {
  content: '';
  position: absolute;
  left: 0;
  top: 10px;
  bottom: 10px;
  width: 4px;
  border-radius: 0 999px 999px 0;
  background: transparent;
}
.nav a:hover {
  background: rgba(255,255,255,.10);
  border-color: rgba(255,255,255,.12);
  color: #fff;
}
.nav a.ativo {
  background: linear-gradient(90deg, rgba(127,224,108,.24), rgba(50,166,230,.16));
  border-color: rgba(127,224,108,.40);
  color: #fff;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.06);
}
.nav a.ativo::before { background: var(--verde-claro); }
.sidebar-rodape {
  display: grid;
  gap: 3px;
  color: rgba(255,255,255,.74);
  border-top: 1px solid rgba(255,255,255,.12);
}
.sidebar-rodape span {
  color: var(--verde-claro);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .8px;
}
.sidebar-rodape strong { color: #fff; font-size: 13px; }
.sidebar-rodape small { color: rgba(255,255,255,.55); font-weight: 700; }

.topo {
  margin: 18px 24px 0;
  border: 1px solid rgba(215,224,229,.88);
  border-radius: 24px;
  background: rgba(255,255,255,.82);
  backdrop-filter: blur(18px);
  box-shadow: var(--sombra);
  overflow: visible;
}
.topo::after {
  content: '';
  position: absolute;
  inset: 0 0 auto 0;
  height: 5px;
  border-radius: 24px 24px 0 0;
  background: linear-gradient(90deg, var(--azul-escuro), var(--azul-claro), var(--verde-claro), var(--amarelo));
}
.topo-identidade { display: grid; gap: 2px; }
.topo-kicker {
  color: var(--verde);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .9px;
  text-transform: uppercase;
}
.topo h1 { font-size: clamp(20px, 2vw, 26px); font-weight: 900; letter-spacing: -.7px; }
.topo .subtitulo { max-width: 860px; }
.topo-acoes { flex-wrap: wrap; }
.hub-link { color: var(--azul-escuro); border-color: rgba(50,166,230,.28); background: rgba(214,237,250,.58); }
.hub-link:hover { background: var(--azul-claro); color: #fff; }

.pagina { padding: 26px 32px 68px; }
.barra-filtros {
  position: relative;
  padding: 18px;
  border-radius: var(--raio);
  border: 1px solid rgba(215,224,229,.92);
  background: rgba(255,255,255,.76);
  box-shadow: 0 10px 28px rgba(0,56,101,.06);
}
.barra-filtros::before {
  content: 'Filtros';
  position: absolute;
  top: -11px;
  left: 18px;
  background: var(--azul-escuro);
  color: #fff;
  border-radius: 999px;
  padding: 3px 12px;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .5px;
  text-transform: uppercase;
}

.card, .kpi, .modal, .serie-card {
  border: 1px solid rgba(215,224,229,.88);
  background: var(--cinza-card);
  box-shadow: var(--sombra);
}
.card {
  position: relative;
  overflow: hidden;
}
.card::before {
  content: '';
  position: absolute;
  inset: 0 0 auto 0;
  height: 4px;
  background: linear-gradient(90deg, var(--azul-escuro), var(--azul-claro), var(--verde-claro));
  opacity: .88;
}
.card:hover, .kpi:hover {
  transform: translateY(-2px);
  box-shadow: var(--sombra-hover);
}
.card, .kpi, .btn, .campo input, .campo select, .campo textarea { transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease, color .18s ease; }
.card-titulo { border-bottom-color: rgba(215,224,229,.75); }
.card-titulo .acento::before {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--verde-claro);
  box-shadow: 0 0 0 6px rgba(127,224,108,.16);
}
.kpi {
  border-left: 0;
  padding: 22px 22px 20px;
  overflow: hidden;
}
.kpi::after {
  content: '';
  position: absolute;
  right: -28px;
  top: -28px;
  width: 92px;
  height: 92px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(50,166,230,.18), rgba(50,166,230,0) 65%);
}
.kpi .rotulo { color: var(--verde); font-weight: 900; }
.kpi .valor { font-size: 34px; color: var(--azul-escuro); }

.btn {
  border-radius: 999px;
  min-height: 38px;
  font-weight: 850;
}
.btn-primario {
  background: linear-gradient(135deg, var(--azul-escuro), var(--azul-escuro-2));
  box-shadow: 0 10px 22px rgba(0,56,101,.18);
}
.btn-primario:hover { background: linear-gradient(135deg, var(--azul-escuro-2), var(--azul-profundo)); }
.btn-verde { background: linear-gradient(135deg, var(--verde), #197F66); }
.btn-secundario { background: rgba(255,255,255,.80); }
.campo label { font-weight: 850; }
.campo input, .campo select, .campo textarea { min-height: 39px; }
.campo input:focus, .campo select:focus, .campo textarea:focus {
  border-color: var(--verde);
  box-shadow: 0 0 0 4px rgba(127,224,108,.20);
}

table.tabela thead th {
  background: linear-gradient(90deg, var(--azul-escuro), var(--azul-escuro-2));
}
table.tabela tbody tr:hover { background: rgba(214,237,250,.58); }
.badge { font-weight: 850; }
.badge-ok { background: #E5F9C2; color: #125F4C; }
.badge-cura { background: #D6EDFA; color: #004379; }
.badge-projeto { background: var(--azul-escuro); }
.badge-amarelo { background: #FFF4B5; color: #635401; }
.badge-bitola-larga { background: #D6EDFA; color: #004379; }
.badge-bitola-mista { background: #E5F9C2; color: #125F4C; }

/* Login */
.login-page {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 26px;
  background:
    radial-gradient(circle at 12% 15%, rgba(127,224,108,.38), transparent 26%),
    radial-gradient(circle at 83% 10%, rgba(50,166,230,.34), transparent 28%),
    linear-gradient(135deg, #003865 0%, #002D51 56%, #001728 100%);
  position: relative;
  overflow: hidden;
}
.login-page::before {
  content: '';
  position: absolute;
  inset: -10%;
  background:
    repeating-linear-gradient(118deg, rgba(255,255,255,.08) 0 1px, transparent 1px 42px),
    linear-gradient(90deg, rgba(255,255,255,.09), transparent 42%);
  transform: rotate(-1deg);
}
.login-card {
  width: min(100%, 470px);
  position: relative;
  z-index: 1;
  background: rgba(255,255,255,.94);
  border: 1px solid rgba(255,255,255,.72);
  box-shadow: 0 28px 90px rgba(0, 23, 40, .36);
  border-radius: 30px;
  padding: 38px;
  overflow: hidden;
}
.login-card::before {
  content: '';
  position: absolute;
  inset: 0 0 auto 0;
  height: 8px;
  background: linear-gradient(90deg, var(--azul-claro), var(--verde-claro), var(--amarelo));
}
.login-marca { margin-bottom: 18px; }
.login-marca img { width: 180px; display: block; }
.login-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
  color: var(--verde);
  font-size: 11px;
  font-weight: 950;
  letter-spacing: .9px;
  text-transform: uppercase;
}
.login-kicker::before {
  content: '';
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--verde-claro);
  box-shadow: 0 0 0 6px rgba(127,224,108,.20);
}
.login-card h1 {
  font-size: 31px;
  line-height: 1.04;
  letter-spacing: -1px;
  color: var(--azul-escuro);
}
.login-card > p { color: var(--cinza-texto); margin: 10px 0 24px; }
.login-form { display: grid; gap: 14px; }
.login-form .btn { width: 100%; justify-content: center; margin-top: 4px; }
.login-msg { margin-top: 14px; }
.login-nota {
  margin-top: 18px;
  background: rgba(214,237,250,.58);
  border: 1px solid rgba(50,166,230,.22);
  border-left: 4px solid var(--azul-claro);
  border-radius: 16px;
  padding: 13px 14px;
  color: var(--cinza-texto);
}
.auth-bloqueio .login-page, .auth-bloqueio { min-height: 100vh; }

body[data-tema="escuro"] {
  --cinza-card: rgba(8, 42, 77, .90);
  --cinza-borda: rgba(255,255,255,.14);
  --cinza-texto: #D9E8F7;
  --cinza-texto-claro: #A8BBCF;
  background:
    radial-gradient(circle at 12% 0%, rgba(127,224,108,.18), transparent 28%),
    radial-gradient(circle at 90% 3%, rgba(50,166,230,.12), transparent 26%),
    linear-gradient(135deg, #03162b 0%, #071f3a 54%, #082a4d 100%);
}
body[data-tema="escuro"] .topo,
body[data-tema="escuro"] .barra-filtros,
body[data-tema="escuro"] .card,
body[data-tema="escuro"] .kpi,
body[data-tema="escuro"] .modal,
body[data-tema="escuro"] .modal-cab,
body[data-tema="escuro"] .serie-card {
  background: rgba(8,42,77,.82);
  border-color: rgba(255,255,255,.14);
  box-shadow: 0 18px 54px rgba(0,0,0,.28);
}
body[data-tema="escuro"] .topo-kicker,
body[data-tema="escuro"] .kpi .rotulo { color: var(--verde-claro); }
body[data-tema="escuro"] .hub-link { background: rgba(255,255,255,.07); color: #fff; border-color: rgba(255,255,255,.16); }
body[data-tema="escuro"] .hub-link:hover { color: var(--azul-profundo); background: var(--verde-claro); }
body[data-tema="escuro"] .kpi .valor { color: #fff; }
body[data-tema="escuro"] .barra-filtros::before { background: var(--verde-claro); color: var(--azul-profundo); }
body[data-tema="escuro"] .card::before { opacity: 1; }
body[data-tema="escuro"] table.tabela tbody tr:hover { background: rgba(127,224,108,.09); }

@media (min-width: 1180px) {
  .topo { margin-left: 32px; margin-right: 32px; }
}
@media (max-width: 768px) {
  .topo { margin: 12px 12px 0; padding: 16px; border-radius: 20px; }
  .pagina { padding: 18px 14px 56px; }
  .topo-acoes { justify-content: flex-start; }
  .hub-link { display: none; }
  .login-card { padding: 32px 24px; border-radius: 24px; }
  .login-marca img { width: 148px; }
}


/* =====================================================================
   AJUSTE GLOBAL DE DENSIDADE / ZOOM OUT — RUMO CONCRETO
   Compacta a interface inteira mantendo o padrão visual Rumo, para que
   filtros, KPIs, gráficos, formulários e tabelas caibam melhor na tela.
   ===================================================================== */
html {
  font-size: 14px;
}

body {
  font-size: 13.4px;
  line-height: 1.42;
}

:root {
  --raio: 18px;
  --raio-sm: 12px;
  --sombra: 0 12px 32px rgba(0, 56, 101, 0.08);
  --sombra-hover: 0 18px 52px rgba(0, 56, 101, 0.14);
}

/* Estrutura principal */
.sidebar {
  width: 260px;
  left: -288px;
}
.sidebar-logo {
  padding: 22px 22px 18px;
}
.sidebar-logo .logo-rumo {
  width: 132px;
}
.sidebar-logo .sub {
  margin-top: 9px;
  font-size: 9.5px;
  letter-spacing: .75px;
}
.nav {
  padding: 12px 10px;
}
.nav-section-label {
  padding: 13px 12px 5px;
  font-size: 9.5px;
}
.nav a {
  min-height: 38px;
  padding: 9px 12px;
  gap: 9px;
  border-radius: 13px;
  font-size: 12.6px;
}
.nav a .ic {
  width: 17px;
  height: 17px;
}
.sidebar-rodape {
  padding: 12px 16px;
}
.sidebar-rodape strong {
  font-size: 12px;
}
.sidebar-rodape small {
  font-size: 10.5px;
}

.topo {
  margin: 12px 24px 0 !important;
  padding: 13px 22px !important;
  border-radius: 20px !important;
  gap: 12px;
}
.topo::after {
  height: 4px;
}
.topo > .flex {
  gap: 11px !important;
  min-width: 280px;
}
.topo-identidade {
  gap: 1px;
}
.topo-kicker {
  font-size: 9.2px;
  letter-spacing: .82px;
}
.topo h1 {
  font-size: clamp(18px, 1.55vw, 23px) !important;
  line-height: 1.08;
  letter-spacing: -.55px;
}
.topo .subtitulo {
  font-size: 12.2px;
  line-height: 1.34;
  max-width: 680px;
}
.topo-acoes {
  gap: 7px;
}
#topoAcoes {
  gap: 7px;
}
.usuario-auth,
.usuario-pill {
  max-width: 180px;
}
.usuario-pill {
  padding: 4px 9px;
}
.usuario-nome {
  font-size: 11.3px;
}
.usuario-perfil {
  font-size: 9.2px;
}

.pagina {
  width: 100%;
  max-width: 1540px;
  padding: 19px 24px 54px !important;
}

/* Botões e campos */
.btn {
  min-height: 34px !important;
  padding: 7px 13px !important;
  font-size: 12.2px !important;
  gap: 6px;
  border-radius: 999px;
}
.btn-sm {
  min-height: 31px !important;
  padding: 6px 11px !important;
  font-size: 11.8px !important;
}
.btn .ic {
  width: 15px;
  height: 15px;
}

.campo {
  gap: 4px;
}
.campo label {
  font-size: 11.2px;
  line-height: 1.18;
}
.campo input,
.campo select,
.campo textarea {
  min-height: 34px !important;
  padding: 7px 10px !important;
  font-size: 12.8px !important;
  border-radius: 11px !important;
}
.campo textarea {
  min-height: 56px;
}
.form-grid {
  grid-template-columns: repeat(auto-fill, minmax(188px, 1fr));
  gap: 12px 14px;
}
.form-secao {
  font-size: 11.8px;
  margin-top: 9px;
  padding-top: 11px;
}
.form-acoes {
  gap: 9px;
  margin-top: 16px;
  padding-top: 14px;
}

/* Filtros */
.barra-filtros {
  padding: 15px 16px 14px !important;
  gap: 10px !important;
  margin-bottom: 15px !important;
  border-radius: 18px !important;
  align-items: end;
}
.barra-filtros::before {
  top: -10px;
  left: 16px;
  padding: 3px 10px;
  font-size: 9.2px;
  letter-spacing: .45px;
}
.barra-filtros .campo {
  min-width: 136px;
  flex: 1 1 136px;
}
.barra-filtros .busca-rapida {
  min-width: 180px;
}
.barra-filtros input,
.barra-filtros select {
  min-width: 0 !important;
  width: 100%;
}
.barra-filtros > .btn {
  align-self: end;
}

/* KPIs */
.grid-kpi {
  grid-template-columns: repeat(auto-fit, minmax(158px, 1fr));
  gap: 12px;
  margin-bottom: 18px;
  align-items: stretch;
}
#kpis.grid-kpi {
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
}
.kpi,
.grid-kpi-compacto .kpi {
  min-width: 0;
  min-height: 108px;
  padding: 15px 16px 14px !important;
  border-radius: 17px !important;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
}
.kpi::after {
  right: -34px;
  top: -38px;
  width: 86px;
  height: 86px;
}
.kpi .rotulo,
.kpi-label {
  font-size: 10.2px !important;
  line-height: 1.18;
  letter-spacing: .48px;
  min-height: 22px;
  max-width: 100%;
}
.kpi .valor,
.kpi-valor {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  margin-top: 6px !important;
  font-size: clamp(21px, 2vw, 29px) !important;
  line-height: 1 !important;
  letter-spacing: -.75px !important;
  white-space: nowrap;
  overflow: visible;
  text-overflow: clip;
  font-variant-numeric: tabular-nums;
}
.kpi .extra {
  margin-top: 5px;
  font-size: 11px;
  line-height: 1.25;
  overflow-wrap: anywhere;
}
.grid-kpi-compacto {
  gap: 11px;
}
.grid-kpi-compacto .kpi {
  min-height: 98px;
}
.grid-kpi-compacto .kpi .valor {
  font-size: clamp(20px, 1.8vw, 26px) !important;
}

/* Cards e gráficos */
.grid-graficos {
  gap: 15px;
}
.card {
  padding: 17px !important;
  margin-bottom: 17px !important;
  border-radius: 18px !important;
}
.card::before {
  height: 3px;
}
.card-titulo {
  font-size: 14.3px !important;
  line-height: 1.22;
  margin-bottom: 13px !important;
  padding-bottom: 9px !important;
  gap: 9px;
}
.card-titulo .acento {
  gap: 8px;
}
.card-titulo .acento::before {
  width: 8px;
  height: 8px;
  box-shadow: 0 0 0 5px rgba(127,224,108,.14);
}
.card-titulo .card-sub,
.card-sub {
  font-size: 11.2px !important;
  line-height: 1.24;
}
.chart-box {
  height: 255px !important;
}
.chart-box.alto {
  height: 315px !important;
}
.legenda-mini {
  gap: 10px;
  margin-top: 8px;
  font-size: 11.2px;
}
.legenda-mini .pt {
  width: 9px;
  height: 9px;
}

/* Tabelas e badges */
.tabela-wrap {
  border-radius: 14px;
}
table.tabela,
.tabela {
  font-size: 12px !important;
  min-width: 940px;
}
table.tabela thead th,
.tabela th {
  padding: 8px 10px !important;
  font-size: 10.4px !important;
  letter-spacing: .25px;
}
table.tabela tbody td,
.tabela td {
  padding: 8px 10px !important;
}
.badge {
  min-height: 20px;
  padding: 3px 8px;
  font-size: 10.2px !important;
  line-height: 1.2;
}
.icone-btn {
  width: 28px;
  height: 28px;
  padding: 4px;
  border-radius: 7px;
}
.icone-btn .ic {
  width: 15px;
  height: 15px;
}

/* Séries, ensaios e blocos auxiliares */
.series-grid {
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 13px;
}
.serie-card {
  padding: 15px !important;
  border-radius: 17px !important;
}
.serie-card-topo h3 {
  font-size: 14.2px;
}
.serie-card-topo p {
  font-size: 11.6px;
}
.status-serie {
  font-size: 10.5px;
  padding: 4px 8px;
}
.serie-metricas {
  gap: 8px;
}
.serie-metricas div {
  padding: 9px;
  border-radius: 11px;
}
.serie-metricas span {
  font-size: 9.6px;
}
.serie-metricas strong {
  font-size: 14.5px;
}
.detalhe-grid {
  grid-template-columns: repeat(auto-fill, minmax(178px, 1fr));
  gap: 11px 18px;
}
.detalhe-item .rot {
  font-size: 10px;
}
.detalhe-item .val {
  font-size: 12.8px;
}
.detalhe-secao {
  font-size: 11.8px;
  margin: 17px 0 8px;
}
.aviso-info,
.usuarios-alerta {
  padding: 10px 12px;
  font-size: 12.2px;
}

/* iAuditor */
.iauditor-grid {
  grid-template-columns: minmax(260px, 1.15fr) minmax(220px, .85fr);
  gap: 14px;
}
.iauditor-drop {
  min-height: 128px;
  padding: 16px;
  grid-template-columns: 48px 1fr;
  gap: 13px;
  border-radius: 17px;
}
.iauditor-drop-icone {
  width: 46px;
  height: 46px;
  border-radius: 15px;
}
.iauditor-drop-icone .ic {
  width: 24px;
  height: 24px;
}
.iauditor-drop strong {
  font-size: 14.4px;
}
.iauditor-drop p,
.iauditor-orientacao p,
.iauditor-status p {
  font-size: 12.2px;
  line-height: 1.5;
}
.iauditor-orientacao,
.iauditor-status {
  padding: 14px;
  border-radius: 16px;
}
.iauditor-meta-grid {
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 8px;
}
.iauditor-meta-item {
  padding: 8px 10px;
}
.iauditor-chip {
  font-size: 10.5px;
  padding: 4px 8px;
}

/* Usuários e auditoria */
.usuarios-page,
.auditoria-page {
  gap: 14px;
}
.usuarios-hero,
.auditoria-hero {
  gap: 16px;
}
.usuarios-hero h2,
.auditoria-hero h2 {
  font-size: clamp(20px, 2.1vw, 24px) !important;
}
.usuarios-hero p,
.auditoria-hero p {
  font-size: 12.8px;
  line-height: 1.55;
}
.usuarios-resumo-grid,
.auditoria-resumo-grid {
  gap: 11px;
}
.usuarios-kpi {
  padding: 14px !important;
}
.usuarios-kpi span {
  font-size: 10.5px;
}
.usuarios-kpi strong {
  font-size: 27px;
  margin: 7px 0 3px;
}
.usuarios-layout {
  gap: 14px;
}
.usuarios-perfil-card {
  padding: 13px;
  border-radius: 16px;
}
.auditoria-filtros,
.auditoria-lista-topo {
  gap: 10px;
}
.auditoria-campo {
  padding: 10px 12px;
}

/* Modal, toast, vazio */
.modal {
  max-width: 880px;
  border-radius: 19px !important;
}
.modal-cab {
  padding: 14px 17px !important;
}
.modal-cab h2 {
  font-size: 15.5px;
}
.modal-corpo {
  padding: 17px !important;
}
.fechar-modal .ic {
  width: 19px;
  height: 19px;
}
.toast-wrap {
  bottom: 18px;
  right: 18px;
}
.toast {
  padding: 11px 14px;
  font-size: 12.4px;
  max-width: 320px;
}
.vazio {
  padding: 44px 18px;
}
.vazio .ic {
  width: 44px;
  height: 44px;
}
.vazio h3 {
  font-size: 14.5px;
}
.vazio p {
  font-size: 12.5px;
}

/* Login também mais proporcional */
.login-page {
  padding: 20px;
}
.login-card {
  width: min(100%, 430px);
  padding: 30px !important;
  border-radius: 24px !important;
}
.login-card::before {
  height: 6px;
}
.login-marca {
  margin-bottom: 14px;
}
.login-marca img {
  width: 150px;
}
.login-kicker {
  font-size: 9.8px;
  margin-bottom: 8px;
}
.login-card h1 {
  font-size: 26px !important;
}
.login-card > p {
  margin: 8px 0 18px;
  font-size: 12.8px;
}
.login-form {
  gap: 11px;
}
.login-nota {
  margin-top: 14px;
  padding: 11px 12px;
  border-radius: 14px;
  font-size: 12.2px;
}

@media (min-width: 1180px) {
  .topo {
    margin-left: 24px !important;
    margin-right: 24px !important;
  }
}

@media (min-width: 1200px) {
  #kpis.grid-kpi {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}

@media (max-width: 1280px) {
  .topo {
    margin-left: 18px !important;
    margin-right: 18px !important;
  }
  .pagina {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }
  .grid-kpi,
  #kpis.grid-kpi {
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  }
  .kpi .valor,
  .kpi-valor {
    font-size: clamp(20px, 2.35vw, 27px) !important;
  }
  .chart-box {
    height: 242px !important;
  }
  .chart-box.alto {
    height: 295px !important;
  }
}

@media (max-width: 980px) {
  .topo {
    flex-direction: column;
    align-items: stretch;
  }
  .topo > .flex {
    width: 100%;
  }
  .topo-acoes {
    width: 100%;
    justify-content: flex-start;
  }
  .grid-graficos {
    grid-template-columns: 1fr;
  }
  #kpis.grid-kpi,
  .grid-kpi {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .iauditor-grid,
  .usuarios-hero,
  .usuarios-layout,
  .auditoria-hero {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 768px) {
  body {
    font-size: 13.2px;
  }
  .topo {
    margin: 10px 10px 0 !important;
    padding: 12px !important;
    border-radius: 18px !important;
  }
  .topo h1 {
    font-size: 18px !important;
  }
  .topo .subtitulo {
    font-size: 12px;
  }
  .pagina {
    padding: 14px 10px 42px !important;
  }
  .barra-filtros {
    padding: 14px !important;
    gap: 9px !important;
  }
  .barra-filtros .campo {
    min-width: 0;
  }
  #kpis.grid-kpi,
  .grid-kpi,
  .grid-kpi-compacto,
  .usuarios-resumo-grid,
  .auditoria-resumo-grid {
    grid-template-columns: 1fr !important;
  }
  .kpi,
  .grid-kpi-compacto .kpi {
    min-height: 98px;
  }
  .kpi .valor,
  .kpi-valor {
    font-size: clamp(24px, 8vw, 34px) !important;
  }
  .card {
    padding: 14px !important;
    border-radius: 16px !important;
  }
  .chart-box,
  .chart-box.alto {
    height: 230px !important;
  }
  .login-card {
    padding: 24px 20px !important;
    border-radius: 22px !important;
  }
  .login-marca img {
    width: 138px;
  }
}

@media (max-width: 460px) {
  .topo .btn span:not(.sr-only) {
    max-width: 110px;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .topo-acoes .btn {
    flex: 0 1 auto;
  }
  .barra-filtros {
    grid-template-columns: 1fr;
  }
  .kpi .valor,
  .kpi-valor {
    font-size: clamp(22px, 9vw, 30px) !important;
  }
  table.tabela,
  .tabela {
    min-width: 820px;
  }
}

/* =====================================================================
   Fluxo de Liberação — automação das séries e ensaios 14/28 dias
   ===================================================================== */
.fluxo-regra-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 14px;
  margin: 14px 0;
}
.fluxo-regra-card {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 16px;
  border-radius: 18px;
  background: var(--branco);
  border: 1px solid var(--cinza-borda);
  box-shadow: var(--sombra-suave);
}
.fluxo-regra-card strong {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--azul-escuro);
}
.fluxo-regra-card span {
  color: var(--cinza-texto);
  font-size: 13px;
  line-height: 1.55;
}
.fluxo-regra-card.alerta {
  border-color: rgba(251, 211, 0, .55);
  background: linear-gradient(135deg, rgba(251, 211, 0, .16), rgba(255,255,255,.92));
}
.fluxo-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
  gap: 16px;
}
.fluxo-card {
  border: 1px solid var(--cinza-borda);
  border-radius: 22px;
  padding: 16px;
  background: var(--branco);
  box-shadow: var(--sombra-suave);
  display: flex;
  flex-direction: column;
  gap: 14px;
  position: relative;
  overflow: hidden;
}
.fluxo-card::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 6px;
  background: var(--azul-claro);
}
.fluxo-card.liberado::before { background: var(--verde); }
.fluxo-card.travado::before { background: var(--erro); }
.fluxo-card.aguardando14::before,
.fluxo-card.aguardando28::before,
.fluxo-card.reteste28::before,
.fluxo-card.pendente::before { background: var(--amarelo); }
.fluxo-card.cura14::before,
.fluxo-card.cura28::before { background: var(--azul-claro); }
.fluxo-card-topo {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
}
.fluxo-card-topo h3 {
  margin: 0;
  color: var(--azul-escuro);
  font-size: 17px;
}
.fluxo-card-topo p {
  margin: 4px 0 0;
  color: var(--cinza-texto);
  font-size: 12.5px;
}
.status-fluxo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.15;
  color: var(--azul-escuro);
  background: rgba(50, 166, 230, .13);
  border: 1px solid rgba(50, 166, 230, .30);
  max-width: 220px;
  text-align: center;
}
.status-fluxo.liberado { color: #06724f; background: rgba(30, 159, 127, .12); border-color: rgba(30, 159, 127, .35); }
.status-fluxo.travado { color: #a52020; background: rgba(226, 59, 59, .12); border-color: rgba(226, 59, 59, .35); }
.status-fluxo.aguardando14,
.status-fluxo.aguardando28,
.status-fluxo.reteste28,
.status-fluxo.pendente { color: #7a5a00; background: rgba(251, 211, 0, .18); border-color: rgba(251, 211, 0, .55); }
.status-fluxo.formando { color: var(--cinza-texto); background: rgba(189, 204, 212, .18); border-color: rgba(189, 204, 212, .55); }
.fluxo-metricas {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.fluxo-metricas div {
  padding: 10px;
  border-radius: 14px;
  background: var(--cinza-bg);
  border: 1px solid var(--cinza-borda);
}
.fluxo-metricas span,
.fluxo-metricas small {
  display: block;
  font-size: 11px;
  color: var(--cinza-texto);
}
.fluxo-metricas strong {
  display: block;
  font-size: 16px;
  color: var(--azul-escuro);
  margin: 2px 0;
}
.fluxo-progressos {
  display: grid;
  gap: 8px;
}
.fluxo-lotes,
.fluxo-ensaios,
.fluxo-decisao {
  display: grid;
  gap: 8px;
}
.fluxo-lotes > strong,
.fluxo-ensaios > strong,
.fluxo-decisao > strong {
  color: var(--azul-escuro);
  font-size: 13px;
}
.fluxo-lotes > div,
.fluxo-ensaios > div {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.ensaio-fluxo-chip {
  display: inline-flex;
  flex-direction: column;
  gap: 2px;
  padding: 8px 10px;
  border-radius: 14px;
  border: 1px solid var(--cinza-borda);
  background: var(--cinza-bg);
  min-width: 150px;
}
.ensaio-fluxo-chip strong { font-size: 12px; color: var(--azul-escuro); }
.ensaio-fluxo-chip em { font-size: 11px; color: var(--cinza-texto); font-style: normal; }
.ensaio-fluxo-chip a { font-size: 11px; font-weight: 800; color: var(--azul-claro); text-decoration: none; }
.ensaio-fluxo-chip.ok { border-color: rgba(30,159,127,.35); background: rgba(30,159,127,.09); }
.ensaio-fluxo-chip.erro { border-color: rgba(226,59,59,.35); background: rgba(226,59,59,.09); }
.ensaio-fluxo-chip.aviso { border-color: rgba(251,211,0,.55); background: rgba(251,211,0,.12); }
.fluxo-decisao {
  padding: 12px;
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(0,56,101,.06), rgba(50,166,230,.07));
  border: 1px solid var(--cinza-borda);
}
.fluxo-decisao span {
  color: var(--azul-escuro);
  font-size: 13px;
  line-height: 1.55;
  font-weight: 700;
}
.fluxo-decisao small {
  color: var(--cinza-texto);
  font-size: 12px;
  line-height: 1.45;
}
.check-filtro .check-inline {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 38px;
  font-size: 13px;
  color: var(--cinza-texto);
}
.check-filtro input[type="checkbox"] {
  width: 16px;
  height: 16px;
  accent-color: var(--azul-claro);
}
.barra-progresso span.aguardando14,
.barra-progresso span.aguardando28,
.barra-progresso span.reteste28,
.barra-progresso span.pendente { background: var(--amarelo); }
.barra-progresso span.travado { background: var(--erro); }
.barra-progresso span.liberado { background: var(--verde); }
.barra-progresso span.formando { background: var(--cinza); }
.barra-progresso span.cura14,
.barra-progresso span.cura28 { background: var(--azul-claro); }

@media (max-width: 980px) {
  .fluxo-metricas { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 520px) {
  .fluxo-grid { grid-template-columns: 1fr; }
  .fluxo-card-topo { flex-direction: column; }
  .fluxo-metricas { grid-template-columns: 1fr; }
}

/* =====================================================================
   Fluxo de Liberação — ajuste compacto e correção de tema escuro
   Remove os ícones gigantes do resumo via JS e reduz escala visual sem
   esconder informações, para caber mais conteúdo na mesma tela.
   ===================================================================== */
body.pagina-fluxo {
  font-size: 12.6px;
}

body.pagina-fluxo .topo {
  margin: 8px 24px 0 !important;
  padding: 10px 18px !important;
  border-radius: 18px !important;
}
body.pagina-fluxo .topo h1 {
  font-size: clamp(17px, 1.35vw, 21px) !important;
}
body.pagina-fluxo .topo .subtitulo {
  font-size: 11.5px;
  line-height: 1.22;
}
body.pagina-fluxo .topo-acoes,
body.pagina-fluxo #topoAcoes {
  gap: 6px;
}
body.pagina-fluxo .btn {
  min-height: 31px !important;
  padding: 6px 11px !important;
  font-size: 11.5px !important;
}
body.pagina-fluxo .btn .ic {
  width: 14px;
  height: 14px;
}

body.pagina-fluxo .pagina {
  max-width: none;
  padding: 12px 18px 38px !important;
}
body.pagina-fluxo .card {
  padding: 12px !important;
  margin-bottom: 12px !important;
  border-radius: 16px !important;
}
body.pagina-fluxo .card-titulo {
  margin-bottom: 9px !important;
  padding-bottom: 7px !important;
  font-size: 13.2px !important;
}
body.pagina-fluxo .card-titulo .card-sub,
body.pagina-fluxo .card-sub {
  font-size: 10.8px !important;
}
body.pagina-fluxo .card > p.txt-cinza {
  font-size: 12px !important;
  line-height: 1.45 !important;
}

body.pagina-fluxo .barra-filtros {
  padding: 12px 13px 11px !important;
  gap: 9px !important;
  margin-bottom: 12px !important;
  border-radius: 15px !important;
}
body.pagina-fluxo .barra-filtros::before {
  top: -9px;
  left: 14px;
  padding: 2px 9px;
  font-size: 8.8px;
}
body.pagina-fluxo .barra-filtros .campo {
  min-width: 122px;
  flex-basis: 122px;
}
body.pagina-fluxo .barra-filtros .busca-rapida {
  min-width: 168px;
}
body.pagina-fluxo .campo label {
  font-size: 10.6px;
}
body.pagina-fluxo .campo input,
body.pagina-fluxo .campo select,
body.pagina-fluxo .campo textarea {
  min-height: 31px !important;
  padding: 6px 9px !important;
  font-size: 12px !important;
  border-radius: 10px !important;
}
body.pagina-fluxo .check-filtro .check-inline {
  min-height: 31px;
  font-size: 11.5px;
}

body.pagina-fluxo .grid-kpi {
  grid-template-columns: repeat(auto-fit, minmax(126px, 1fr));
  gap: 9px;
  margin-bottom: 11px;
}
body.pagina-fluxo .kpi {
  min-height: 82px;
  padding: 10px 11px !important;
  border-radius: 14px !important;
}
body.pagina-fluxo .kpi .rotulo {
  font-size: 9.2px !important;
  min-height: auto;
}
body.pagina-fluxo .kpi .valor {
  font-size: clamp(18px, 1.45vw, 23px) !important;
  margin-top: 4px !important;
}
body.pagina-fluxo .kpi .extra {
  font-size: 10px;
  margin-top: 3px;
}

body.pagina-fluxo .fluxo-regra-grid {
  grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
  gap: 9px;
  margin: 8px 0 12px;
}
body.pagina-fluxo .fluxo-regra-card {
  padding: 10px 12px;
  border-radius: 14px;
  gap: 5px;
}
body.pagina-fluxo .fluxo-regra-card strong {
  font-size: 12px;
  gap: 0;
}
body.pagina-fluxo .fluxo-regra-card span {
  font-size: 11.3px;
  line-height: 1.35;
}

body.pagina-fluxo .fluxo-grid {
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 10px;
}
body.pagina-fluxo .fluxo-card {
  padding: 11px 12px;
  border-radius: 16px;
  gap: 9px;
}
body.pagina-fluxo .fluxo-card::before {
  width: 4px;
}
body.pagina-fluxo .fluxo-card-topo {
  gap: 8px;
}
body.pagina-fluxo .fluxo-card-topo h3 {
  font-size: 14.3px;
  line-height: 1.18;
}
body.pagina-fluxo .fluxo-card-topo p {
  margin-top: 2px;
  font-size: 11px;
  line-height: 1.24;
}
body.pagina-fluxo .status-fluxo {
  padding: 4px 7px;
  font-size: 9.6px;
  max-width: 148px;
}
body.pagina-fluxo .fluxo-metricas {
  gap: 6px;
}
body.pagina-fluxo .fluxo-metricas div {
  padding: 7px;
  border-radius: 11px;
}
body.pagina-fluxo .fluxo-metricas span,
body.pagina-fluxo .fluxo-metricas small {
  font-size: 9.4px;
  line-height: 1.2;
}
body.pagina-fluxo .fluxo-metricas strong {
  font-size: 13.7px;
  margin: 1px 0;
  line-height: 1.08;
}
body.pagina-fluxo .fluxo-progressos {
  gap: 5px;
}
body.pagina-fluxo .progress-label {
  font-size: 10.7px;
  margin-bottom: 3px;
}
body.pagina-fluxo .barra-progresso {
  height: 9px;
}
body.pagina-fluxo .fluxo-lotes,
body.pagina-fluxo .fluxo-ensaios,
body.pagina-fluxo .fluxo-decisao {
  gap: 6px;
}
body.pagina-fluxo .fluxo-lotes > strong,
body.pagina-fluxo .fluxo-ensaios > strong,
body.pagina-fluxo .fluxo-decisao > strong {
  font-size: 11.8px;
}
body.pagina-fluxo .fluxo-lotes > div,
body.pagina-fluxo .fluxo-ensaios > div {
  gap: 6px;
}
body.pagina-fluxo .lote-serie-chip {
  min-width: 104px;
  padding: 6px 8px;
  border-radius: 10px;
  gap: 1px;
}
body.pagina-fluxo .lote-serie-chip strong {
  font-size: 11.4px;
}
body.pagina-fluxo .lote-serie-chip em {
  font-size: 9.7px;
}
body.pagina-fluxo .ensaio-fluxo-chip {
  min-width: 124px;
  padding: 6px 8px;
  border-radius: 11px;
}
body.pagina-fluxo .ensaio-fluxo-chip strong {
  font-size: 10.9px;
}
body.pagina-fluxo .ensaio-fluxo-chip em,
body.pagina-fluxo .ensaio-fluxo-chip a {
  font-size: 9.8px;
}
body.pagina-fluxo .fluxo-decisao {
  padding: 9px 10px;
  border-radius: 12px;
}
body.pagina-fluxo .fluxo-decisao span {
  font-size: 11.7px;
  line-height: 1.38;
}
body.pagina-fluxo .fluxo-decisao small {
  font-size: 10.4px;
  line-height: 1.32;
}

/* Fluxo: tema escuro legível */
body.pagina-fluxo[data-tema="escuro"] .fluxo-card,
body.pagina-fluxo[data-tema="escuro"] .fluxo-regra-card {
  background: rgba(8, 42, 77, .92);
  border-color: rgba(255, 255, 255, .18);
  box-shadow: 0 18px 50px rgba(0, 0, 0, .28);
}
body.pagina-fluxo[data-tema="escuro"] .fluxo-regra-card.alerta {
  background: linear-gradient(135deg, rgba(251, 211, 0, .14), rgba(8,42,77,.92));
  border-color: rgba(251, 211, 0, .45);
}
body.pagina-fluxo[data-tema="escuro"] .fluxo-card-topo h3,
body.pagina-fluxo[data-tema="escuro"] .fluxo-regra-card strong,
body.pagina-fluxo[data-tema="escuro"] .fluxo-lotes > strong,
body.pagina-fluxo[data-tema="escuro"] .fluxo-ensaios > strong,
body.pagina-fluxo[data-tema="escuro"] .fluxo-decisao > strong,
body.pagina-fluxo[data-tema="escuro"] .fluxo-metricas strong,
body.pagina-fluxo[data-tema="escuro"] .ensaio-fluxo-chip strong {
  color: #ffffff;
}
body.pagina-fluxo[data-tema="escuro"] .fluxo-card-topo p,
body.pagina-fluxo[data-tema="escuro"] .fluxo-regra-card span,
body.pagina-fluxo[data-tema="escuro"] .fluxo-metricas span,
body.pagina-fluxo[data-tema="escuro"] .fluxo-metricas small,
body.pagina-fluxo[data-tema="escuro"] .progress-label,
body.pagina-fluxo[data-tema="escuro"] .ensaio-fluxo-chip em,
body.pagina-fluxo[data-tema="escuro"] .fluxo-decisao small,
body.pagina-fluxo[data-tema="escuro"] .txt-cinza {
  color: #c9d8e8 !important;
}
body.pagina-fluxo[data-tema="escuro"] .fluxo-metricas div,
body.pagina-fluxo[data-tema="escuro"] .ensaio-fluxo-chip,
body.pagina-fluxo[data-tema="escuro"] .fluxo-decisao {
  background: rgba(255, 255, 255, .075);
  border-color: rgba(255, 255, 255, .16);
}
body.pagina-fluxo[data-tema="escuro"] .lote-serie-chip {
  background: rgba(3, 22, 43, .92);
  border-color: rgba(255, 255, 255, .18);
  color: #ffffff;
}
body.pagina-fluxo[data-tema="escuro"] .lote-serie-chip.ultimo {
  background: rgba(251, 211, 0, .13);
  border-color: var(--amarelo);
  box-shadow: 0 0 0 1px rgba(251,211,0,.12), 0 8px 18px rgba(0,0,0,.20);
}
body.pagina-fluxo[data-tema="escuro"] .lote-serie-chip strong {
  color: #ffffff;
}
body.pagina-fluxo[data-tema="escuro"] .lote-serie-chip em {
  color: #c9d8e8;
}
body.pagina-fluxo[data-tema="escuro"] .status-fluxo.liberado {
  color: #dfffd4;
  background: rgba(141, 198, 63, .22);
  border-color: rgba(141, 198, 63, .52);
}
body.pagina-fluxo[data-tema="escuro"] .status-fluxo.travado {
  color: #ffd3d3;
  background: rgba(255, 107, 107, .20);
  border-color: rgba(255, 107, 107, .55);
}
body.pagina-fluxo[data-tema="escuro"] .status-fluxo.aguardando14,
body.pagina-fluxo[data-tema="escuro"] .status-fluxo.aguardando28,
body.pagina-fluxo[data-tema="escuro"] .status-fluxo.reteste28,
body.pagina-fluxo[data-tema="escuro"] .status-fluxo.pendente {
  color: #fff4b3;
  background: rgba(251, 211, 0, .18);
  border-color: rgba(251, 211, 0, .55);
}
body.pagina-fluxo[data-tema="escuro"] .status-fluxo.formando,
body.pagina-fluxo[data-tema="escuro"] .status-fluxo.cura14,
body.pagina-fluxo[data-tema="escuro"] .status-fluxo.cura28 {
  color: #ffffff;
  background: rgba(255, 255, 255, .11);
  border-color: rgba(255, 255, 255, .22);
}
body.pagina-fluxo .barra-progresso span.formando {
  background: var(--cinza-texto-claro);
}
body.pagina-fluxo[data-tema="escuro"] .barra-progresso {
  background: rgba(255, 255, 255, .13);
}
body.pagina-fluxo[data-tema="escuro"] .barra-progresso span.cura14,
body.pagina-fluxo[data-tema="escuro"] .barra-progresso span.cura28 {
  background: #7FE06C;
}
body.pagina-fluxo[data-tema="escuro"] .tabela-wrap,
body.pagina-fluxo[data-tema="escuro"] table.tabela tbody td {
  color: #d9e8f7;
}

@media (min-width: 1280px) {
  body.pagina-fluxo .fluxo-grid {
    grid-template-columns: repeat(auto-fit, minmax(295px, 1fr));
  }
}

@media (max-width: 980px) {
  body.pagina-fluxo .fluxo-grid {
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  }
}

@media (max-width: 520px) {
  body.pagina-fluxo .pagina {
    padding: 10px 10px 32px !important;
  }
  body.pagina-fluxo .fluxo-grid {
    grid-template-columns: 1fr;
  }
}

/* =====================================================================
   Painel de séries — fluxo horizontal por lote
   ===================================================================== */
body.pagina-painel-series .painel-series-cabecalho p {
  margin: 0;
  max-width: 1100px;
  font-size: 12.8px;
  line-height: 1.55;
}

body.pagina-painel-series .painel-series-filtros {
  grid-template-columns: minmax(210px, 1.45fr) repeat(8, minmax(120px, 1fr));
  gap: 8px;
}

body.pagina-painel-series .painel-series-card {
  padding: 14px;
}

body.pagina-painel-series .painel-series-topo {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 10px;
}

body.pagina-painel-series .painel-series-topo p {
  margin: 3px 0 0;
}

body.pagina-painel-series .painel-series-contadores {
  border: 1px solid var(--cinza-borda);
  background: rgba(0,56,101,.04);
  color: var(--azul-escuro);
  border-radius: 999px;
  padding: 7px 10px;
  font-size: 11.5px;
  font-weight: 800;
  white-space: nowrap;
}

body.pagina-painel-series .painel-series-legenda {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 0 0 10px;
}

body.pagina-painel-series .legenda-fluxo {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid var(--cinza-borda);
  background: #fff;
  border-radius: 999px;
  padding: 5px 9px;
  font-size: 11px;
  color: var(--cinza-texto);
  font-weight: 700;
}

body.pagina-painel-series .legenda-fluxo b {
  width: 18px;
  height: 18px;
  display: inline-grid;
  place-items: center;
  border-radius: 50%;
  font-size: 11px;
}

body.pagina-painel-series .legenda-fluxo.feito b { background: rgba(30,159,127,.16); color: var(--verde); }
body.pagina-painel-series .legenda-fluxo.atual b { background: rgba(251,211,0,.24); color: #9a7400; }
body.pagina-painel-series .legenda-fluxo.pendente b { background: rgba(189,204,212,.22); color: var(--cinza-texto); }
body.pagina-painel-series .legenda-fluxo.erro b { background: rgba(226,59,59,.14); color: var(--erro); }

body.pagina-painel-series .fluxo-horizontal-wrap {
  overflow: auto;
  max-height: calc(100vh - 285px);
  border-radius: 15px;
  border: 1px solid var(--cinza-borda);
  background: var(--cinza-card);
}

body.pagina-painel-series .tabela-fluxo-lotes {
  min-width: 1660px;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 11.3px;
}

body.pagina-painel-series .tabela-fluxo-lotes thead th {
  position: sticky;
  top: 0;
  z-index: 6;
  background: var(--azul-escuro);
  color: #fff;
  font-size: 10.4px;
  letter-spacing: .02em;
  text-transform: uppercase;
  padding: 9px 8px;
  white-space: nowrap;
  border-right: 1px solid rgba(255,255,255,.14);
}

body.pagina-painel-series .tabela-fluxo-lotes tbody td {
  padding: 7px;
  vertical-align: top;
  border-bottom: 1px solid var(--cinza-borda);
  border-right: 1px solid rgba(226,232,240,.7);
  background: #fff;
}

body.pagina-painel-series .tabela-fluxo-lotes tbody tr:nth-child(even) td {
  background: #f8fbfd;
}

body.pagina-painel-series .tabela-fluxo-lotes .sticky-col {
  position: sticky;
  z-index: 5;
  box-shadow: 10px 0 16px rgba(0, 56, 101, .07);
}

body.pagina-painel-series .tabela-fluxo-lotes thead .sticky-col {
  z-index: 8;
}

body.pagina-painel-series .tabela-fluxo-lotes .lote-col {
  left: 0;
  width: 165px;
  min-width: 165px;
}

body.pagina-painel-series .tabela-fluxo-lotes .serie-col {
  left: 165px;
  width: 250px;
  min-width: 250px;
}

body.pagina-painel-series .tabela-fluxo-lotes tbody .sticky-col {
  background: #fff;
}

body.pagina-painel-series .tabela-fluxo-lotes tbody tr:nth-child(even) .sticky-col {
  background: #f8fbfd;
}

body.pagina-painel-series .fluxo-id,
body.pagina-painel-series .fluxo-serie-info {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

body.pagina-painel-series .fluxo-id strong,
body.pagina-painel-series .fluxo-serie-info strong {
  color: var(--azul-escuro);
  font-size: 12.2px;
  line-height: 1.15;
}

body.pagina-painel-series .fluxo-id span,
body.pagina-painel-series .fluxo-serie-info span,
body.pagina-painel-series .fluxo-serie-info small {
  color: var(--cinza-texto);
  font-size: 10.6px;
  line-height: 1.22;
}

body.pagina-painel-series .tag-lote {
  width: fit-content;
  border-radius: 999px;
  padding: 3px 7px;
  font-size: 9.6px;
  line-height: 1;
  font-weight: 800;
  font-style: normal;
  border: 1px solid transparent;
}

body.pagina-painel-series .tag-lote.ensaio {
  color: #6a5000;
  background: rgba(251,211,0,.22);
  border-color: rgba(251,211,0,.65);
}

body.pagina-painel-series .tag-lote.serie {
  color: var(--azul-escuro);
  background: rgba(0,56,101,.08);
  border-color: rgba(0,56,101,.16);
}

body.pagina-painel-series .etapa-cell {
  width: 135px;
  min-width: 135px;
}

body.pagina-painel-series .etapa-box {
  min-height: 74px;
  display: grid;
  grid-template-columns: 24px 1fr;
  grid-template-rows: auto auto 1fr;
  gap: 2px 6px;
  border: 1px solid var(--cinza-borda);
  border-radius: 12px;
  padding: 7px;
  background: #f6f9fb;
}

body.pagina-painel-series .etapa-box b {
  grid-row: 1 / span 3;
  width: 23px;
  height: 23px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  font-size: 11px;
  font-weight: 900;
  align-self: start;
  margin-top: 1px;
}

body.pagina-painel-series .etapa-box span {
  color: var(--azul-escuro);
  font-size: 10.8px;
  line-height: 1.15;
  font-weight: 900;
}

body.pagina-painel-series .etapa-box small,
body.pagina-painel-series .etapa-box em {
  color: var(--cinza-texto);
  font-size: 9.7px;
  line-height: 1.18;
  font-style: normal;
}

body.pagina-painel-series .etapa-cell.feito .etapa-box {
  background: rgba(30,159,127,.08);
  border-color: rgba(30,159,127,.26);
}

body.pagina-painel-series .etapa-cell.feito .etapa-box b {
  color: #fff;
  background: var(--verde);
}

body.pagina-painel-series .etapa-cell.atual .etapa-box {
  background: rgba(251,211,0,.14);
  border-color: rgba(251,211,0,.55);
  box-shadow: inset 0 0 0 1px rgba(251,211,0,.18);
}

body.pagina-painel-series .etapa-cell.atual .etapa-box b {
  color: #5b4200;
  background: var(--amarelo);
}

body.pagina-painel-series .etapa-cell.pendente .etapa-box {
  opacity: .76;
}

body.pagina-painel-series .etapa-cell.pendente .etapa-box b {
  color: var(--cinza-texto);
  background: rgba(189,204,212,.28);
}

body.pagina-painel-series .etapa-cell.erro .etapa-box {
  background: rgba(226,59,59,.08);
  border-color: rgba(226,59,59,.38);
}

body.pagina-painel-series .etapa-cell.erro .etapa-box b {
  color: #fff;
  background: var(--erro);
}

body.pagina-painel-series .linha-lote-ensaio .lote-col,
body.pagina-painel-series .linha-lote-ensaio .serie-col {
  box-shadow: inset 3px 0 0 var(--amarelo), 10px 0 16px rgba(0, 56, 101, .07);
}

body.pagina-painel-series .status-liberado .fluxo-serie-info span:nth-of-type(2) {
  color: var(--verde);
  font-weight: 900;
}

body.pagina-painel-series .status-travado .fluxo-serie-info span:nth-of-type(2),
body.pagina-painel-series .status-travado .fluxo-id strong {
  color: var(--erro);
}

body.pagina-painel-series[data-tema="escuro"] .painel-series-cabecalho,
body.pagina-painel-series[data-tema="escuro"] .painel-series-card {
  background: rgba(8, 42, 77, .93);
  border-color: rgba(255,255,255,.16);
}

body.pagina-painel-series[data-tema="escuro"] .painel-series-contadores,
body.pagina-painel-series[data-tema="escuro"] .legenda-fluxo,
body.pagina-painel-series[data-tema="escuro"] .fluxo-horizontal-wrap {
  background: rgba(3, 22, 43, .88);
  border-color: rgba(255,255,255,.16);
  color: #eaf4ff;
}

body.pagina-painel-series[data-tema="escuro"] .tabela-fluxo-lotes thead th {
  background: #03172b;
  color: #fff;
  border-right-color: rgba(255,255,255,.16);
}

body.pagina-painel-series[data-tema="escuro"] .tabela-fluxo-lotes tbody td,
body.pagina-painel-series[data-tema="escuro"] .tabela-fluxo-lotes tbody .sticky-col {
  background: rgba(8, 42, 77, .96);
  border-color: rgba(255,255,255,.12);
  color: #eaf4ff;
}

body.pagina-painel-series[data-tema="escuro"] .tabela-fluxo-lotes tbody tr:nth-child(even) td,
body.pagina-painel-series[data-tema="escuro"] .tabela-fluxo-lotes tbody tr:nth-child(even) .sticky-col {
  background: rgba(5, 31, 58, .98);
}

body.pagina-painel-series[data-tema="escuro"] .fluxo-id strong,
body.pagina-painel-series[data-tema="escuro"] .fluxo-serie-info strong,
body.pagina-painel-series[data-tema="escuro"] .etapa-box span {
  color: #fff;
}

body.pagina-painel-series[data-tema="escuro"] .fluxo-id span,
body.pagina-painel-series[data-tema="escuro"] .fluxo-serie-info span,
body.pagina-painel-series[data-tema="escuro"] .fluxo-serie-info small,
body.pagina-painel-series[data-tema="escuro"] .etapa-box small,
body.pagina-painel-series[data-tema="escuro"] .etapa-box em,
body.pagina-painel-series[data-tema="escuro"] .txt-cinza {
  color: #c9d8e8 !important;
}

body.pagina-painel-series[data-tema="escuro"] .etapa-box {
  background: rgba(255,255,255,.07);
  border-color: rgba(255,255,255,.14);
}

body.pagina-painel-series[data-tema="escuro"] .etapa-cell.feito .etapa-box {
  background: rgba(141,198,63,.13);
  border-color: rgba(141,198,63,.38);
}

body.pagina-painel-series[data-tema="escuro"] .etapa-cell.atual .etapa-box {
  background: rgba(251,211,0,.16);
  border-color: rgba(251,211,0,.56);
}

body.pagina-painel-series[data-tema="escuro"] .etapa-cell.pendente .etapa-box {
  background: rgba(255,255,255,.045);
  opacity: .9;
}

body.pagina-painel-series[data-tema="escuro"] .etapa-cell.pendente .etapa-box b {
  color: #d6e6f6;
  background: rgba(255,255,255,.13);
}

body.pagina-painel-series[data-tema="escuro"] .etapa-cell.erro .etapa-box {
  background: rgba(255,107,107,.13);
  border-color: rgba(255,107,107,.48);
}

body.pagina-painel-series[data-tema="escuro"] .tag-lote.serie {
  color: #dceeff;
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.16);
}

body.pagina-painel-series[data-tema="escuro"] .tag-lote.ensaio {
  color: #fff2a8;
  background: rgba(251,211,0,.17);
  border-color: rgba(251,211,0,.58);
}

@media (max-width: 1180px) {
  body.pagina-painel-series .painel-series-filtros {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 680px) {
  body.pagina-painel-series .painel-series-filtros {
    grid-template-columns: 1fr;
  }
  body.pagina-painel-series .painel-series-topo {
    align-items: flex-start;
    flex-direction: column;
  }
}

/* =====================================================================
   Ajuste 2026-05-27 — textos mais compactos nos cards de séries
   ===================================================================== */
body.pagina-fluxo .fluxo-grid {
  grid-template-columns: repeat(auto-fit, minmax(286px, 1fr));
}
body.pagina-fluxo .fluxo-card {
  padding: 10px 11px !important;
  gap: 8px !important;
}
body.pagina-fluxo .fluxo-card-topo {
  gap: 6px !important;
}
body.pagina-fluxo .fluxo-card-topo h3 {
  font-size: 13.5px !important;
  line-height: 1.12 !important;
  letter-spacing: .01em;
}
body.pagina-fluxo .fluxo-card-topo p {
  font-size: 10.2px !important;
  line-height: 1.18 !important;
}
body.pagina-fluxo .status-fluxo {
  padding: 3px 6px !important;
  font-size: 8.6px !important;
  line-height: 1.05 !important;
  max-width: 132px !important;
  min-width: 0 !important;
  overflow-wrap: anywhere;
}
body.pagina-fluxo .fluxo-metricas {
  gap: 5px !important;
}
body.pagina-fluxo .fluxo-metricas div {
  padding: 6px !important;
  border-radius: 10px !important;
  min-width: 0;
}
body.pagina-fluxo .fluxo-metricas span,
body.pagina-fluxo .fluxo-metricas small {
  font-size: 8.7px !important;
  line-height: 1.12 !important;
  overflow-wrap: anywhere;
}
body.pagina-fluxo .fluxo-metricas strong {
  font-size: 12.3px !important;
  line-height: 1.05 !important;
  overflow-wrap: anywhere;
}
body.pagina-fluxo .progress-label {
  font-size: 10px !important;
}
body.pagina-fluxo .fluxo-lotes > strong,
body.pagina-fluxo .fluxo-ensaios > strong,
body.pagina-fluxo .fluxo-decisao > strong {
  font-size: 11px !important;
}
body.pagina-fluxo .lote-serie-chip {
  min-width: 98px !important;
  padding: 5px 7px !important;
}
body.pagina-fluxo .lote-serie-chip strong {
  font-size: 10.6px !important;
}
body.pagina-fluxo .lote-serie-chip em {
  font-size: 8.8px !important;
  line-height: 1.15 !important;
}
body.pagina-fluxo .ensaio-fluxo-chip {
  min-width: 112px !important;
  padding: 5px 7px !important;
}
body.pagina-fluxo .ensaio-fluxo-chip strong {
  font-size: 10.1px !important;
}
body.pagina-fluxo .ensaio-fluxo-chip em,
body.pagina-fluxo .ensaio-fluxo-chip a {
  font-size: 8.9px !important;
}
body.pagina-fluxo .fluxo-decisao span {
  font-size: 10.8px !important;
  line-height: 1.28 !important;
}
body.pagina-fluxo .fluxo-decisao small {
  font-size: 9.5px !important;
  line-height: 1.24 !important;
}

/* Fluxo horizontal: leve compactação para caber mais texto nas etapas */
body.pagina-painel-series .tabela-fluxo-lotes {
  font-size: 10.8px !important;
}
body.pagina-painel-series .etapa-box span {
  font-size: 10.1px !important;
  line-height: 1.08 !important;
}
body.pagina-painel-series .etapa-box small,
body.pagina-painel-series .etapa-box em {
  font-size: 9.1px !important;
  line-height: 1.12 !important;
}

/* =====================================================================
   Ajuste 2026-05-27 — Mapa de séries por projeto
   Projeto → séries → lotes, com próxima sequência sugerida
   ===================================================================== */
body.pagina-fluxo .mapa-projetos-card {
  border-color: rgba(0, 56, 101, .14);
}

body.pagina-fluxo .mapa-projetos-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
  gap: 12px;
}

body.pagina-fluxo .mapa-projeto-card {
  background: #fff;
  border: 1px solid var(--cinza-borda);
  border-radius: 18px;
  padding: 13px;
  box-shadow: 0 10px 25px rgba(0, 56, 101, .07);
  display: flex;
  flex-direction: column;
  gap: 12px;
}

body.pagina-fluxo .mapa-projeto-topo {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
}

body.pagina-fluxo .mapa-projeto-codigo {
  width: fit-content;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  padding: 3px 8px;
  color: var(--azul-escuro);
  background: rgba(0, 56, 101, .08);
  border: 1px solid rgba(0, 56, 101, .16);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .06em;
  text-transform: uppercase;
}

body.pagina-fluxo .mapa-projeto-topo h3 {
  margin: 6px 0 3px;
  color: var(--azul-escuro);
  font-size: 17px;
  line-height: 1.15;
}

body.pagina-fluxo .mapa-projeto-topo p {
  margin: 0;
  color: var(--cinza-texto);
  font-size: 11.5px;
  line-height: 1.3;
}

body.pagina-fluxo .mapa-proxima-serie {
  min-width: 162px;
  border-radius: 16px;
  padding: 10px 11px;
  color: var(--azul-escuro);
  background: linear-gradient(180deg, rgba(251,211,0,.22), rgba(251,211,0,.08));
  border: 1px solid rgba(251,211,0,.62);
  display: flex;
  flex-direction: column;
  gap: 3px;
  text-align: right;
}

body.pagina-fluxo .mapa-proxima-serie span,
body.pagina-fluxo .mapa-proxima-serie small {
  color: #7a5a00;
  font-size: 10px;
  font-weight: 800;
  line-height: 1.15;
}

body.pagina-fluxo .mapa-proxima-serie strong {
  color: var(--azul-escuro);
  font-size: 15px;
  line-height: 1.12;
}

body.pagina-fluxo .mapa-projeto-metricas {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 7px;
}

body.pagina-fluxo .mapa-projeto-metricas div {
  border-radius: 13px;
  padding: 8px;
  background: #f6f9fb;
  border: 1px solid rgba(189,204,212,.55);
  min-width: 0;
}

body.pagina-fluxo .mapa-projeto-metricas span {
  display: block;
  color: var(--cinza-texto);
  font-size: 9.8px;
  font-weight: 800;
  line-height: 1.15;
}

body.pagina-fluxo .mapa-projeto-metricas strong {
  display: block;
  margin-top: 3px;
  color: var(--azul-escuro);
  font-size: 13px;
  line-height: 1.1;
  overflow-wrap: anywhere;
}

body.pagina-fluxo .mapa-series-lista {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

body.pagina-fluxo .mapa-serie-item {
  border: 1px solid var(--cinza-borda);
  border-radius: 14px;
  overflow: hidden;
  background: #fff;
}

body.pagina-fluxo .mapa-serie-item.ultima {
  border-color: rgba(251,211,0,.72);
  box-shadow: inset 3px 0 0 var(--amarelo);
}

body.pagina-fluxo .mapa-serie-item summary {
  cursor: pointer;
  list-style: none;
  display: grid;
  grid-template-columns: minmax(118px, 1.25fr) minmax(96px, .85fr) auto;
  gap: 8px;
  align-items: center;
  padding: 9px 10px;
  background: #f8fbfd;
}

body.pagina-fluxo .mapa-serie-item summary::-webkit-details-marker {
  display: none;
}

body.pagina-fluxo .mapa-serie-item summary::before {
  content: '+';
  width: 20px;
  height: 20px;
  display: inline-grid;
  place-items: center;
  border-radius: 50%;
  color: var(--azul-escuro);
  background: rgba(0,56,101,.08);
  font-size: 13px;
  font-weight: 900;
  grid-column: 1;
  grid-row: 1;
  justify-self: start;
}

body.pagina-fluxo .mapa-serie-item[open] summary::before {
  content: '−';
}

body.pagina-fluxo .mapa-serie-nome {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding-left: 28px;
  min-width: 0;
}

body.pagina-fluxo .mapa-serie-nome strong {
  color: var(--azul-escuro);
  font-size: 12.5px;
  line-height: 1.1;
  overflow-wrap: anywhere;
}

body.pagina-fluxo .mapa-serie-nome em,
body.pagina-fluxo .mapa-serie-meta {
  color: var(--cinza-texto);
  font-size: 10px;
  line-height: 1.15;
  font-style: normal;
  font-weight: 800;
}

body.pagina-fluxo .mapa-serie-item summary .status-fluxo {
  justify-self: end;
  max-width: 150px;
}

body.pagina-fluxo .mapa-serie-detalhes {
  padding: 10px;
  display: flex;
  flex-direction: column;
  gap: 9px;
}

body.pagina-fluxo .mapa-serie-contexto {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

body.pagina-fluxo .mapa-serie-contexto span {
  border-radius: 999px;
  padding: 4px 8px;
  color: var(--cinza-texto);
  background: rgba(189,204,212,.16);
  border: 1px solid rgba(189,204,212,.48);
  font-size: 10px;
  font-weight: 800;
}

body.pagina-fluxo .mapa-lotes-lista {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(128px, 1fr));
  gap: 7px;
}

body.pagina-fluxo .mapa-lote-chip {
  border: 1px solid rgba(0,56,101,.13);
  border-radius: 12px;
  padding: 7px;
  background: rgba(0,56,101,.035);
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

body.pagina-fluxo .mapa-lote-chip strong {
  color: var(--azul-escuro);
  font-size: 11.2px;
  line-height: 1.1;
  overflow-wrap: anywhere;
}

body.pagina-fluxo .mapa-lote-chip em,
body.pagina-fluxo .mapa-lote-chip small {
  color: var(--cinza-texto);
  font-size: 9.6px;
  line-height: 1.15;
  font-style: normal;
}

body.pagina-fluxo[data-tema="escuro"] .mapa-projeto-card,
body.pagina-fluxo[data-tema="escuro"] .mapa-serie-item {
  background: rgba(8, 42, 77, .93);
  border-color: rgba(255,255,255,.14);
}

body.pagina-fluxo[data-tema="escuro"] .mapa-projeto-codigo,
body.pagina-fluxo[data-tema="escuro"] .mapa-projeto-metricas div,
body.pagina-fluxo[data-tema="escuro"] .mapa-serie-item summary,
body.pagina-fluxo[data-tema="escuro"] .mapa-lote-chip,
body.pagina-fluxo[data-tema="escuro"] .mapa-serie-contexto span {
  background: rgba(255,255,255,.07);
  border-color: rgba(255,255,255,.14);
}

body.pagina-fluxo[data-tema="escuro"] .mapa-proxima-serie {
  background: rgba(251,211,0,.15);
  border-color: rgba(251,211,0,.45);
}

body.pagina-fluxo[data-tema="escuro"] .mapa-projeto-topo h3,
body.pagina-fluxo[data-tema="escuro"] .mapa-proxima-serie strong,
body.pagina-fluxo[data-tema="escuro"] .mapa-projeto-metricas strong,
body.pagina-fluxo[data-tema="escuro"] .mapa-serie-nome strong,
body.pagina-fluxo[data-tema="escuro"] .mapa-lote-chip strong {
  color: #fff;
}

body.pagina-fluxo[data-tema="escuro"] .mapa-projeto-topo p,
body.pagina-fluxo[data-tema="escuro"] .mapa-projeto-metricas span,
body.pagina-fluxo[data-tema="escuro"] .mapa-serie-nome em,
body.pagina-fluxo[data-tema="escuro"] .mapa-serie-meta,
body.pagina-fluxo[data-tema="escuro"] .mapa-serie-contexto span,
body.pagina-fluxo[data-tema="escuro"] .mapa-lote-chip em,
body.pagina-fluxo[data-tema="escuro"] .mapa-lote-chip small {
  color: #c9d8e8;
}

@media (max-width: 820px) {
  body.pagina-fluxo .mapa-projetos-grid {
    grid-template-columns: 1fr;
  }
  body.pagina-fluxo .mapa-projeto-topo {
    flex-direction: column;
  }
  body.pagina-fluxo .mapa-proxima-serie {
    width: 100%;
    text-align: left;
  }
  body.pagina-fluxo .mapa-projeto-metricas {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  body.pagina-fluxo .mapa-serie-item summary {
    grid-template-columns: 1fr;
  }
  body.pagina-fluxo .mapa-serie-item summary .status-fluxo {
    justify-self: start;
  }
}

/* =====================================================================
   Dashboard · Quadro de avisos
   ===================================================================== */
.dashboard-avisos {
  margin-top: 6px;
}
.dashboard-aviso-card {
  border: 1px solid rgba(215, 224, 229, .72);
  position: relative;
  overflow: hidden;
}
.dashboard-aviso-card::after {
  content: '';
  position: absolute;
  right: -60px;
  bottom: -70px;
  width: 210px;
  height: 210px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(0, 168, 233, .12), transparent 68%);
  pointer-events: none;
}
.dashboard-aviso-titulo .acento {
  min-width: 0;
  overflow-wrap: anywhere;
}
.dashboard-aviso-corpo {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 12px;
}
.dashboard-aviso-publicado {
  min-height: 92px;
  padding: 16px 18px;
  border-radius: 16px;
  border: 1px solid var(--cinza-borda);
  background: linear-gradient(135deg, rgba(0, 168, 233, .08), rgba(141, 198, 63, .07));
  color: var(--azul-escuro);
  font-size: 14px;
  line-height: 1.65;
  overflow-wrap: anywhere;
}
.dashboard-aviso-publicado.sem-conteudo {
  color: var(--cinza-texto);
  background: var(--cinza-bg);
  border-style: dashed;
}
.dashboard-aviso-publicado p {
  margin: 0 0 10px;
}
.dashboard-aviso-publicado p:last-child {
  margin-bottom: 0;
}
.dashboard-aviso-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  color: var(--cinza-texto);
  font-size: 12px;
}
.dashboard-aviso-editor {
  position: relative;
  z-index: 1;
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px dashed var(--cinza-borda);
}
.dashboard-aviso-editor textarea {
  min-height: 140px;
  line-height: 1.55;
}
.dashboard-aviso-editor-acoes {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-top: 12px;
}
.dashboard-aviso-contador {
  color: var(--cinza-texto-claro);
  font-size: 12px;
}
.btn:disabled {
  opacity: .58;
  cursor: not-allowed;
  transform: none !important;
}

body[data-tema="escuro"] .dashboard-aviso-card {
  border-color: rgba(255, 255, 255, .12);
}
body[data-tema="escuro"] .dashboard-aviso-card::after {
  background: radial-gradient(circle, rgba(141, 198, 63, .16), transparent 68%);
}
body[data-tema="escuro"] .dashboard-aviso-publicado {
  border-color: rgba(255, 255, 255, .13);
  background: linear-gradient(135deg, rgba(141, 198, 63, .13), rgba(255, 255, 255, .06));
  color: var(--branco);
}
body[data-tema="escuro"] .dashboard-aviso-publicado.sem-conteudo {
  background: rgba(255, 255, 255, .06);
  color: var(--cinza-texto);
}
body[data-tema="escuro"] .dashboard-aviso-meta,
body[data-tema="escuro"] .dashboard-aviso-contador {
  color: var(--cinza-texto);
}

@media (max-width: 640px) {
  .dashboard-aviso-editor-acoes {
    align-items: stretch;
    flex-direction: column;
  }
  .dashboard-aviso-editor-acoes .flex {
    width: 100%;
  }
  .dashboard-aviso-editor-acoes .btn {
    flex: 1;
    justify-content: center;
  }
}

/* =====================================================================
   Ajuste 2026-05-28 — amplia verticalmente Etapas dos lotes
   ===================================================================== */
body.pagina-painel-series .painel-series-card {
  min-height: calc(100vh - 150px);
}

body.pagina-painel-series #painelSeriesFluxo {
  min-height: calc(100vh - 245px);
}

body.pagina-painel-series .fluxo-horizontal-wrap {
  height: calc(100vh - 235px);
  min-height: 560px;
  max-height: none;
}

@media (max-height: 760px) {
  body.pagina-painel-series .fluxo-horizontal-wrap {
    height: calc(100vh - 205px);
    min-height: 520px;
  }
}

@media (max-width: 680px) {
  body.pagina-painel-series .fluxo-horizontal-wrap {
    height: calc(100vh - 220px);
    min-height: 460px;
  }
}

/* =====================================================================
   Alinhamento do topo — ações agrupadas à direita
   Mantém o bloco de identidade à esquerda e empurra Tema/Usuário/ações
   para a lateral direita em telas de desktop.
   ===================================================================== */
@media (min-width: 981px) {
  .topo {
    justify-content: space-between !important;
  }

  .topo > .flex {
    flex: 0 1 auto;
  }

  .topo > .topo-acoes {
    margin-left: auto !important;
    flex: 1 1 auto;
    width: auto !important;
    justify-content: flex-end !important;
    align-content: center;
    text-align: right;
  }

  .topo > .topo-acoes > .btn,
  .topo > .topo-acoes > a.btn,
  .topo > .topo-acoes > .usuario-auth {
    flex: 0 0 auto;
  }

  .topo > .topo-acoes > #topoAcoes {
    margin-left: 0 !important;
    flex: 0 1 auto;
    width: auto !important;
    justify-content: flex-end !important;
  }

  .topo > .topo-acoes .exportacoes-grupo {
    flex: 0 0 auto;
  }
}

/* =====================================================================
   Fluxo de Liberação — ações do topo alinhadas à direita
   Agrupa Tema/Usuário/Sair e botões da página no canto direito.
   ===================================================================== */
@media (min-width: 981px) {
  body.pagina-fluxo .topo {
    display: grid !important;
    grid-template-columns: minmax(360px, max-content) minmax(0, 1fr);
    align-items: center;
    column-gap: 28px;
  }

  body.pagina-fluxo .topo > .flex {
    grid-column: 1;
    min-width: 0;
    max-width: 460px;
  }

  body.pagina-fluxo .topo > .topo-acoes {
    grid-column: 2;
    justify-self: end;
    margin-left: auto !important;
    width: min(820px, 100%) !important;
    max-width: 820px;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end !important;
    align-items: center;
    align-content: center;
    gap: 8px;
    text-align: right;
  }

  body.pagina-fluxo .topo > .topo-acoes > #topoAcoes {
    flex: 0 1 auto;
    width: auto !important;
    max-width: 100%;
    margin-left: 0 !important;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end !important;
    align-items: center;
    gap: 8px;
  }

  body.pagina-fluxo .topo > .topo-acoes > .btn,
  body.pagina-fluxo .topo > .topo-acoes > a.btn,
  body.pagina-fluxo .topo > .topo-acoes > .usuario-auth,
  body.pagina-fluxo .topo > .topo-acoes > #topoAcoes > .btn,
  body.pagina-fluxo .topo > .topo-acoes > #topoAcoes > a.btn {
    flex: 0 0 auto;
  }

  body.pagina-fluxo .topo > .topo-acoes .exportacoes-grupo {
    flex: 0 0 auto;
    justify-content: flex-end;
  }
}


/* =====================================================================
   Indicador Semanal — ações do topo alinhadas à direita
   ===================================================================== */
@media (min-width: 981px) {
  body.pagina-semanal .topo {
    display: grid !important;
    grid-template-columns: minmax(430px, max-content) minmax(0, 1fr);
    align-items: center;
    column-gap: 28px;
  }

  body.pagina-semanal .topo > .flex {
    grid-column: 1;
    min-width: 0;
    max-width: 560px;
  }

  body.pagina-semanal .topo > .topo-acoes {
    grid-column: 2;
    justify-self: end;
    margin-left: auto !important;
    width: min(690px, 100%) !important;
    max-width: 690px;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end !important;
    align-items: center;
    align-content: center;
    gap: 8px;
    text-align: right;
  }

  body.pagina-semanal .topo > .topo-acoes > #topoAcoes {
    flex: 0 1 auto;
    width: auto !important;
    max-width: 100%;
    margin-left: 0 !important;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end !important;
    align-items: center;
    gap: 8px;
  }

  body.pagina-semanal .topo > .topo-acoes > .btn,
  body.pagina-semanal .topo > .topo-acoes > a.btn,
  body.pagina-semanal .topo > .topo-acoes > .usuario-auth,
  body.pagina-semanal .topo > .topo-acoes > #topoAcoes > .btn,
  body.pagina-semanal .topo > .topo-acoes > #topoAcoes > a.btn {
    flex: 0 0 auto;
  }

  body.pagina-semanal .topo > .topo-acoes .exportacoes-grupo {
    flex: 0 0 auto;
    justify-content: flex-end;
  }
}

/* =====================================================================
   Produção de Dormentes — ações do topo alinhadas à direita
   ===================================================================== */
@media (min-width: 981px) {
  body.pagina-producao .topo {
    display: grid !important;
    grid-template-columns: minmax(340px, max-content) minmax(0, 1fr);
    align-items: center;
    column-gap: 28px;
  }

  body.pagina-producao .topo > .flex {
    grid-column: 1;
    min-width: 0;
    max-width: 430px;
  }

  body.pagina-producao .topo > .topo-acoes {
    grid-column: 2;
    justify-self: end;
    margin-left: auto !important;
    width: min(760px, 100%) !important;
    max-width: 760px;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end !important;
    align-items: center;
    align-content: center;
    gap: 8px;
    text-align: right;
  }

  body.pagina-producao .topo > .topo-acoes > #topoAcoes {
    flex: 0 1 auto;
    width: auto !important;
    max-width: 100%;
    margin-left: 0 !important;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end !important;
    align-items: center;
    gap: 8px;
  }

  body.pagina-producao .topo > .topo-acoes > .btn,
  body.pagina-producao .topo > .topo-acoes > a.btn,
  body.pagina-producao .topo > .topo-acoes > .usuario-auth,
  body.pagina-producao .topo > .topo-acoes > #topoAcoes > .btn,
  body.pagina-producao .topo > .topo-acoes > #topoAcoes > a.btn {
    flex: 0 0 auto;
  }

  body.pagina-producao .topo > .topo-acoes .exportacoes-grupo {
    flex: 0 0 auto;
    justify-content: flex-end;
  }
}



/* =====================================================================
   Ensaios de Liberação — ações do topo alinhadas à direita
   ===================================================================== */
@media (min-width: 981px) {
  body.pagina-ensaios-liberacao .topo {
    display: grid !important;
    grid-template-columns: minmax(320px, max-content) minmax(0, 1fr);
    align-items: center;
    column-gap: 28px;
  }

  body.pagina-ensaios-liberacao .topo > .flex {
    grid-column: 1;
    min-width: 0;
    max-width: 420px;
  }

  body.pagina-ensaios-liberacao .topo > .topo-acoes {
    grid-column: 2;
    justify-self: end;
    margin-left: auto !important;
    width: min(930px, 100%) !important;
    max-width: 930px;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end !important;
    align-items: center;
    align-content: center;
    gap: 8px;
    text-align: right;
  }

  body.pagina-ensaios-liberacao .topo > .topo-acoes > #topoAcoes {
    flex: 0 0 100%;
    width: 100% !important;
    max-width: 100%;
    margin-left: 0 !important;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end !important;
    align-items: center;
    gap: 8px;
  }

  body.pagina-ensaios-liberacao .topo > .topo-acoes > .btn,
  body.pagina-ensaios-liberacao .topo > .topo-acoes > a.btn,
  body.pagina-ensaios-liberacao .topo > .topo-acoes > .usuario-auth,
  body.pagina-ensaios-liberacao .topo > .topo-acoes > #topoAcoes > .btn,
  body.pagina-ensaios-liberacao .topo > .topo-acoes > #topoAcoes > a.btn {
    flex: 0 0 auto;
  }

  body.pagina-ensaios-liberacao .topo > .topo-acoes .exportacoes-grupo {
    flex: 0 0 auto;
    justify-content: flex-end;
  }
}


/* =====================================================================
   BRAND RUMO OFICIAL — OVERRIDE FINAL 2026-05-29
   Fonte: prompt/skill marca-rumo. Mantém funcionalidades e centraliza a
   aparência nos tokens oficiais da Rumo.
   ===================================================================== */
:root {
  --rumo-azul: #003865;
  --rumo-azul-claro: #32A6E6;
  --rumo-verde: #1E9F7F;
  --rumo-verde-claro: #7FE06C;
  --rumo-amarelo: #FBD300;
  --rumo-laranja: #F78344;
  --rumo-roxo: #9F4BB9;
  --rumo-cinza: #BDCCD4;
  --rumo-cinza-50: #F2F5F6;
  --rumo-cinza-100: #E5EBEE;
  --rumo-cinza-200: #D7E0E5;
  --rumo-cinza-300: #CAD6DD;
  --rumo-texto: #4D626F;
  --rumo-texto-claro: #6F838E;
  --rumo-azul-profundo: #002B4D;
  --rumo-azul-noite: #001E36;
  --rumo-fonte: "Cera Pro", Verdana, Geneva, Tahoma, sans-serif;
  --rumo-raio: 14px;
  --rumo-raio-sm: 10px;
  --rumo-sombra: 0 8px 28px rgba(0, 56, 101, .10);
  --rumo-sombra-hover: 0 18px 48px rgba(0, 56, 101, .18);

  --azul-escuro: var(--rumo-azul);
  --azul-escuro-2: var(--rumo-azul-profundo);
  --azul-profundo: var(--rumo-azul-noite);
  --azul-claro: var(--rumo-azul-claro);
  --azul-claro-2: #D6EDFA;
  --verde: var(--rumo-verde);
  --verde-claro: var(--rumo-verde-claro);
  --verde-suave: #E5F9C2;
  --amarelo: var(--rumo-amarelo);
  --laranja: var(--rumo-laranja);
  --roxo: var(--rumo-roxo);
  --cinza-marca: var(--rumo-cinza);
  --cinza-bg: var(--rumo-cinza-50);
  --cinza-card: rgba(255,255,255,.96);
  --cinza-borda: var(--rumo-cinza-200);
  --cinza-texto: var(--rumo-texto);
  --cinza-texto-claro: var(--rumo-texto-claro);
  --fonte: var(--rumo-fonte);
  --ok: var(--rumo-verde);
  --alerta: var(--rumo-amarelo);
  --raio: var(--rumo-raio);
  --raio-sm: var(--rumo-raio-sm);
  --sombra: var(--rumo-sombra);
  --sombra-hover: var(--rumo-sombra-hover);
}

html, body, button, input, select, textarea, table {
  font-family: var(--rumo-fonte) !important;
}

body {
  background:
    radial-gradient(circle at 8% -4%, rgba(50,166,230,.20), transparent 30%),
    radial-gradient(circle at 95% 2%, rgba(127,224,108,.18), transparent 25%),
    linear-gradient(135deg, #F8FBFC 0%, #F2F5F6 50%, #E8F5EF 100%);
}

body::before {
  background:
    repeating-linear-gradient(112deg, transparent 0 60px, rgba(0,56,101,.045) 61px 63px, transparent 64px 112px),
    linear-gradient(90deg, transparent 0%, rgba(50,166,230,.05) 48%, transparent 100%);
}

.logo-rumo { min-width: 70px; height: auto; }
.sidebar-logo .logo-rumo {
  width: 166px;
  max-width: 100%;
  object-fit: contain;
  filter: none;
}

.sidebar {
  background:
    radial-gradient(circle at 12% 3%, rgba(127,224,108,.22), transparent 26%),
    radial-gradient(circle at 92% 0%, rgba(50,166,230,.18), transparent 25%),
    linear-gradient(180deg, var(--rumo-azul) 0%, var(--rumo-azul-profundo) 58%, var(--rumo-azul-noite) 100%);
}

.sidebar::before {
  background:
    linear-gradient(90deg, transparent 0 68%, rgba(255,255,255,.07) 68% 68.7%, transparent 68.7% 100%),
    repeating-linear-gradient(135deg, rgba(255,255,255,.07) 0 1px, transparent 1px 32px);
}

.nav a.ativo {
  background: linear-gradient(90deg, rgba(127,224,108,.26), rgba(50,166,230,.18));
  border-color: rgba(127,224,108,.42);
}
.nav a.ativo::before { background: var(--rumo-verde-claro); }
.sidebar-logo .sub,
.sidebar-rodape span { color: var(--rumo-verde-claro); }

.topo {
  border-color: rgba(215,224,229,.95);
  background: rgba(255,255,255,.88);
  border-radius: var(--rumo-raio);
}
.topo::after {
  height: 5px;
  background: linear-gradient(90deg, var(--rumo-azul), var(--rumo-azul-claro), var(--rumo-verde), var(--rumo-verde-claro), var(--rumo-amarelo));
}
.topo-kicker { color: var(--rumo-verde); }
.topo h1 { color: var(--rumo-azul); }

.card, .kpi, .modal, .serie-card, .barra-filtros {
  border-color: rgba(215,224,229,.95);
  background: var(--cinza-card);
  border-radius: var(--rumo-raio);
  box-shadow: var(--rumo-sombra);
}
.card::before {
  background: linear-gradient(90deg, var(--rumo-azul), var(--rumo-azul-claro), var(--rumo-verde-claro));
}
.card-titulo .acento::before,
.login-kicker::before {
  background: var(--rumo-verde-claro);
  box-shadow: 0 0 0 6px rgba(127,224,108,.16);
}
.kpi .rotulo { color: var(--rumo-verde); }
.kpi .valor, .card-titulo, .campo label { color: var(--rumo-azul); }

.btn { border-radius: var(--rumo-raio-sm); }
.btn-primario {
  background: linear-gradient(135deg, var(--rumo-azul), var(--rumo-azul-profundo));
  color: #fff;
}
.btn-primario:hover { background: linear-gradient(135deg, var(--rumo-azul-profundo), var(--rumo-azul-noite)); }
.btn-verde { background: linear-gradient(135deg, var(--rumo-verde), #197F66); color: #fff; }
.btn-secundario:hover { border-color: var(--rumo-azul-claro); color: var(--rumo-azul); }
.hub-link { border-color: rgba(50,166,230,.30); background: rgba(214,237,250,.62); color: var(--rumo-azul); }
.hub-link:hover { background: var(--rumo-azul-claro); color: #fff; }

.campo input:focus, .campo select:focus, .campo textarea:focus {
  border-color: var(--rumo-verde);
  box-shadow: 0 0 0 4px rgba(127,224,108,.20);
}

.tabela-wrap { border-radius: var(--rumo-raio-sm); }
table.tabela thead th { background: linear-gradient(90deg, var(--rumo-azul), var(--rumo-azul-profundo)); }
table.tabela tbody tr:nth-child(even) { background: rgba(242,245,246,.74); }
table.tabela tbody tr:hover { background: rgba(214,237,250,.68); }

.badge-ok, .badge-bitola-mista { background: #E5F9C2; color: #125F4C; }
.badge-cura, .badge-bitola-larga { background: #D6EDFA; color: #004379; }
.badge-amarelo { background: #FFF4B5; color: #635401; }
.badge-projeto { background: var(--rumo-azul); color: #fff; }
.toast.aviso { background: var(--rumo-amarelo); color: var(--rumo-azul); }

.login-page {
  background:
    radial-gradient(circle at 12% 15%, rgba(127,224,108,.34), transparent 26%),
    radial-gradient(circle at 83% 10%, rgba(50,166,230,.30), transparent 28%),
    linear-gradient(135deg, var(--rumo-azul) 0%, var(--rumo-azul-profundo) 56%, var(--rumo-azul-noite) 100%);
}
.login-card { border-radius: var(--rumo-raio); }
.login-card::before { background: linear-gradient(90deg, var(--rumo-azul-claro), var(--rumo-verde-claro), var(--rumo-amarelo)); }
.login-marca img { min-width: 70px; max-width: 190px; }

body[data-tema="escuro"] {
  --rumo-azul: var(--rumo-azul-noite);
  --azul-escuro: var(--rumo-azul-noite);
  --azul-escuro-2: #00172A;
  --azul-profundo: #00111F;
  --azul-claro: #FFFFFF;
  --verde: var(--rumo-verde-claro);
  --verde-claro: var(--rumo-verde-claro);
  --amarelo: var(--rumo-amarelo);
  --cinza-card: rgba(8,42,77,.90);
  --cinza-borda: rgba(189,204,212,.24);
  --cinza-texto: #E5EBEE;
  --cinza-texto-claro: #BDCCD4;
  background:
    radial-gradient(circle at 12% 0%, rgba(127,224,108,.18), transparent 28%),
    radial-gradient(circle at 90% 3%, rgba(50,166,230,.12), transparent 26%),
    linear-gradient(135deg, #001E36 0%, #002B4D 54%, #003865 100%);
}
body[data-tema="escuro"] .topo,
body[data-tema="escuro"] .barra-filtros,
body[data-tema="escuro"] .card,
body[data-tema="escuro"] .kpi,
body[data-tema="escuro"] .modal,
body[data-tema="escuro"] .modal-cab,
body[data-tema="escuro"] .serie-card {
  background: rgba(8,42,77,.86);
  border-color: rgba(189,204,212,.24);
}
body[data-tema="escuro"] .topo-kicker,
body[data-tema="escuro"] .kpi .rotulo,
body[data-tema="escuro"] .sidebar-logo .sub,
body[data-tema="escuro"] .sidebar-rodape span { color: var(--rumo-verde-claro); }
body[data-tema="escuro"] .kpi .valor,
body[data-tema="escuro"] .topo h1,
body[data-tema="escuro"] .card-titulo,
body[data-tema="escuro"] .campo label { color: #fff; }
body[data-tema="escuro"] .hub-link:hover { color: var(--rumo-azul-noite); background: var(--rumo-verde-claro); }

/* ===================== INTEGRAÇÃO SUBCOMPONENTES ===================== */
.auditoria-area-subcomponentes { background: #e9f8e5; color: #1a6b30; }
.auditoria-area-sistema { background: #fff6d1; color: #5f4d00; }
body[data-tema="escuro"] .auditoria-area-subcomponentes { background: rgba(127,224,108,.18); color: var(--verde-claro); }
body[data-tema="escuro"] .auditoria-area-sistema { background: rgba(251,211,0,.18); color: var(--amarelo); }
.subcomponentes-page .periodo-dashboard-info { margin-bottom: 18px; }


/* ===== SUBCOMPONENTES — PADRONIZAÇÃO DE TOPO E AÇÕES (20260531-v4) ===== */
body.pagina-subcomponentes .topo {
  display: flex !important;
  position: sticky;
  top: 0;
  z-index: 50;
}
body.pagina-subcomponentes #topoAcoes {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
body.pagina-subcomponentes .exportacoes-grupo {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
body.pagina-subcomponentes .toolbar-contador {
  justify-content: flex-start;
  margin: 0 0 14px;
}
body.pagina-subcomponentes .toolbar-contador .contador {
  color: var(--cinza-texto);
  font-weight: 800;
}
body.pagina-subcomponentes .topo .badge {
  align-self: center;
}
@media (max-width: 960px) {
  body.pagina-subcomponentes #topoAcoes,
  body.pagina-subcomponentes .exportacoes-grupo {
    width: 100%;
  }
}

/* =====================================================================
   MENU LATERAL — separação clara entre Concreto, Subcomponentes, Ferramentas e Sistema
   ===================================================================== */
.sidebar {
  width: 292px !important;
  left: -320px !important;
}
.sidebar.aberta { left: 0 !important; }
.nav {
  padding: 12px 12px 16px !important;
}
.nav-section-label {
  margin: 14px 4px 8px;
  padding: 10px 12px 11px !important;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.07);
  color: #fff !important;
  letter-spacing: .9px;
  line-height: 1.2;
}
.nav-section-label:first-child { margin-top: 2px; }
.nav-section-label span {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 10.5px;
  font-weight: 950;
}
.nav-section-label span::before {
  content: '';
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: rgba(255,255,255,.82);
  box-shadow: 0 0 0 4px rgba(255,255,255,.12);
  flex: 0 0 auto;
}
.nav-section-label small {
  display: block;
  margin-top: 5px;
  padding-left: 18px;
  color: rgba(255,255,255,.70);
  font-size: 9.3px;
  font-weight: 750;
  letter-spacing: .15px;
  text-transform: none;
}
.nav-section-label--concreto {
  background: linear-gradient(135deg, rgba(50,166,230,.22), rgba(255,255,255,.07));
  border-color: rgba(50,166,230,.38);
}
.nav-section-label--concreto span::before {
  background: var(--rumo-azul-claro, #32A6E6);
  box-shadow: 0 0 0 4px rgba(50,166,230,.18);
}
.nav-section-label--subcomponentes {
  background: linear-gradient(135deg, rgba(127,224,108,.25), rgba(255,255,255,.07));
  border-color: rgba(127,224,108,.44);
}
.nav-section-label--subcomponentes span::before {
  background: var(--rumo-verde-claro, #7FE06C);
  box-shadow: 0 0 0 4px rgba(127,224,108,.18);
}
.nav-section-label--ferramentas {
  background: linear-gradient(135deg, rgba(153,102,255,.26), rgba(255,255,255,.07));
  border-color: rgba(153,102,255,.48);
}
.nav-section-label--ferramentas span::before {
  background: #9966ff;
  box-shadow: 0 0 0 4px rgba(153,102,255,.18);
}
.nav-section-label--sistema {
  background: linear-gradient(135deg, rgba(251,211,0,.22), rgba(255,255,255,.07));
  border-color: rgba(251,211,0,.38);
}
.nav-section-label--sistema span::before {
  background: var(--rumo-amarelo, #FBD300);
  box-shadow: 0 0 0 4px rgba(251,211,0,.17);
}
.nav a[data-menu-grupo] {
  margin-left: 6px;
  margin-right: 2px;
}
.nav a.nav-link--concreto::after,
.nav a.nav-link--subcomponentes::after,
.nav a.nav-link--ferramentas::after,
.nav a.nav-link--sistema::after {
  content: '';
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  width: 6px;
  height: 6px;
  border-radius: 999px;
  opacity: .72;
}
.nav a.nav-link--concreto::after { background: var(--rumo-azul-claro, #32A6E6); }
.nav a.nav-link--subcomponentes::after { background: var(--rumo-verde-claro, #7FE06C); }
.nav a.nav-link--ferramentas::after { background: #9966ff; }
.nav a.nav-link--sistema::after { background: var(--rumo-amarelo, #FBD300); }
.nav a.nav-link--subcomponentes.ativo {
  background: linear-gradient(90deg, rgba(127,224,108,.30), rgba(255,255,255,.09)) !important;
  border-color: rgba(127,224,108,.58) !important;
}
.nav a.nav-link--ferramentas.ativo {
  background: linear-gradient(90deg, rgba(153,102,255,.30), rgba(255,255,255,.09)) !important;
  border-color: rgba(153,102,255,.52) !important;
}
.nav a.nav-link--ferramentas[data-external="true"] span::after {
  content: ' ↗';
  font-weight: 900;
  opacity: .78;
}
.nav a.nav-link--concreto.ativo {
  background: linear-gradient(90deg, rgba(50,166,230,.30), rgba(255,255,255,.09)) !important;
  border-color: rgba(50,166,230,.48) !important;
}
.nav a.nav-link--sistema.ativo {
  background: linear-gradient(90deg, rgba(251,211,0,.24), rgba(255,255,255,.09)) !important;
  border-color: rgba(251,211,0,.44) !important;
}
.nav a.nav-link--concreto.ativo::before { background: var(--rumo-azul-claro, #32A6E6) !important; }
.nav a.nav-link--subcomponentes.ativo::before { background: var(--rumo-verde-claro, #7FE06C) !important; }
.nav a.nav-link--ferramentas.ativo::before { background: #9966ff !important; }
.nav a.nav-link--sistema.ativo::before { background: var(--rumo-amarelo, #FBD300) !important; }
.sidebar-rodape strong {
  line-height: 1.25;
}

@media (max-width: 768px) {
  .sidebar { width: min(292px, calc(100vw - 32px)) !important; }
  .nav-section-label small { font-size: 9px; }
}


/* =====================================================================
   FERRAMENTAS — páginas placeholder
   ===================================================================== */
.ferramenta-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, .65fr);
  gap: 18px;
  align-items: stretch;
}
.ferramenta-card-principal {
  min-height: 260px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.ferramenta-etiqueta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(153,102,255,.12);
  border: 1px solid rgba(153,102,255,.22);
  color: #5b3bd6;
  font-weight: 900;
  font-size: 11px;
  letter-spacing: .7px;
  text-transform: uppercase;
}
.ferramenta-card-principal h2 {
  margin: 18px 0 10px;
  color: var(--azul-escuro);
  font-size: clamp(26px, 3vw, 40px);
  line-height: 1.05;
}
.ferramenta-card-principal p {
  max-width: 820px;
  color: var(--texto-suave);
  font-weight: 650;
  line-height: 1.55;
}
.ferramenta-lista {
  display: grid;
  gap: 10px;
  margin-top: 16px;
}
.ferramenta-lista .item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px 14px;
  border-radius: 16px;
  background: rgba(255,255,255,.64);
  border: 1px solid rgba(0,55,100,.10);
}
.ferramenta-lista .item strong {
  display: block;
  color: var(--azul-escuro);
  font-size: 14px;
}
.ferramenta-lista .item span {
  display: block;
  margin-top: 2px;
  color: var(--texto-suave);
  font-size: 12px;
  font-weight: 650;
}
.ferramenta-lista .marcador {
  width: 10px;
  height: 10px;
  margin-top: 4px;
  border-radius: 999px;
  background: #9966ff;
  box-shadow: 0 0 0 5px rgba(153,102,255,.12);
  flex: 0 0 auto;
}
@media (max-width: 980px) {
  .ferramenta-hero { grid-template-columns: 1fr; }
}

/* Dormentes — modelos pré-preenchidos */
.especificacao-card {
  margin: 16px 0 0;
  box-shadow: none;
  border: 1px solid var(--cinza-borda);
  background: rgba(255,255,255,.62);
}
.especificacao-card:first-child { margin-top: 0; }
.especificacao-card .card-titulo { align-items: flex-start; }
.especificacao-card .detalhe-secao { margin-top: 18px; }
.especificacao-card .detalhe-grid { grid-template-columns: repeat(auto-fill, minmax(235px, 1fr)); }
body[data-tema="escuro"] .especificacao-card { background: rgba(255,255,255,.04); }

/* Medidas e Tolerâncias — Subcomponentes */
.medidas-lista {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  max-width: 760px;
  white-space: normal;
}
.medidas-lista .badge {
  line-height: 1.35;
  white-space: normal;
}

/* =====================================================================
   TOOLTIPS DE DETALHE DOS CARDS (KPIs) — Dashboard
   Caixa flutuante (anexada ao <body>) com o resumo de cada indicador.
   Conteúdo gerado em dashboard.js (detalhesKpis) e exibido por
   ligarTooltipsKpi. Usa os tokens da marca, adaptando ao tema escuro.
   ===================================================================== */
#kpis .kpi { cursor: help; }

.kpi-tip {
  position: fixed;
  z-index: 9999;
  left: 0;
  top: 0;
  min-width: 240px;
  max-width: 320px;
  padding: 14px 16px 16px;
  background: var(--cinza-card);
  color: var(--cinza-texto);
  border: 1px solid rgba(0, 53, 103, 0.12);
  border-radius: var(--raio-sm, 12px);
  box-shadow: 0 10px 32px rgba(0, 53, 103, 0.20);
  font-size: 12.5px;
  line-height: 1.4;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-4px);
  transition: opacity .16s ease, transform .16s ease;
  pointer-events: none; /* nunca rouba o hover do card */
}
.kpi-tip.aberto { opacity: 1; visibility: visible; transform: translateY(0); }

/* seta apontando para o card */
.kpi-tip::before {
  content: '';
  position: absolute;
  left: var(--seta-x, 28px);
  top: -7px;
  width: 12px;
  height: 12px;
  background: var(--cinza-card);
  border-left: 1px solid rgba(0, 53, 103, 0.12);
  border-top: 1px solid rgba(0, 53, 103, 0.12);
  transform: translateX(-50%) rotate(45deg);
}
.kpi-tip.acima::before { top: auto; bottom: -7px; transform: translateX(-50%) rotate(225deg); }

.kpi-tip-cabe {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  padding-bottom: 9px;
  margin-bottom: 9px;
  border-bottom: 1px solid rgba(0, 53, 103, 0.10);
}
.kpi-tip-pnt {
  flex: 0 0 auto;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--c, var(--azul-claro));
  box-shadow: 0 0 0 4px rgba(50, 166, 230, 0.16);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--c, var(--azul-claro)) 20%, transparent);
}
.kpi-tip-tit { font-weight: 800; font-size: 13px; letter-spacing: .1px; color: var(--azul-escuro); }
.kpi-tip-sub { margin-left: auto; font-size: 11.5px; font-weight: 700; color: var(--cinza-texto-claro); }

.kpi-tip-corpo { display: flex; flex-direction: column; gap: 3px; }
.kpi-tip-linha {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding: 2px 0;
}
.kpi-tip-linha .l {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--cinza-texto);
}
.kpi-tip-linha .v {
  flex: 0 0 auto;
  white-space: nowrap;
  font-weight: 800;
  color: var(--azul-escuro);
  font-variant-numeric: tabular-nums;
}
.kpi-tip-linha .v i { font-style: normal; font-weight: 600; font-size: 11px; color: var(--cinza-texto-claro); }
.kpi-tip-linha.forte {
  margin-top: 3px;
  padding-top: 6px;
  border-top: 1px dashed rgba(0, 53, 103, 0.16);
}
.kpi-tip-linha.forte .l,
.kpi-tip-linha.forte .v { font-weight: 900; color: var(--verde); }
.kpi-tip-linha.ok .l { color: var(--verde); }
.kpi-tip-linha.ruim .l { color: var(--erro); }
.kpi-tip-linha.neutro .l { color: var(--cinza-texto-claro); }

.kpi-tip-secao {
  margin: 9px 0 3px;
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: .5px;
  text-transform: uppercase;
  color: var(--cinza-texto-claro);
}
.kpi-tip-rodape { margin-top: 5px; font-size: 11px; font-style: italic; color: var(--cinza-texto-claro); }
.kpi-tip-vazio { padding: 4px 0; font-size: 12px; color: var(--cinza-texto-claro); }

.kpi-tip-tags { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 2px; }
.kpi-tip-tags span {
  padding: 1px 8px;
  font-size: 11px;
  font-weight: 700;
  border-radius: 999px;
  color: var(--azul-escuro);
  background: rgba(50, 166, 230, 0.14);
  background: color-mix(in srgb, var(--azul-claro) 14%, transparent);
}

.kpi-tip-tag {
  padding: 1px 8px;
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: .2px;
  border-radius: 999px;
}
.kpi-tip-tag.ok { color: #0a6b46; background: #dff3e8; background: color-mix(in srgb, var(--verde) 20%, transparent); }
.kpi-tip-tag.ruim { color: #fff; background: var(--erro); }
.kpi-tip-tag.neutro { color: #5a4b00; background: #fbeeb0; background: color-mix(in srgb, var(--amarelo) 40%, transparent); }

/* tema escuro: bordas, sombra e textos adaptados */
body[data-tema="escuro"] .kpi-tip {
  border-color: rgba(127, 224, 108, 0.22);
  box-shadow: 0 12px 34px rgba(0, 0, 0, 0.45);
}
body[data-tema="escuro"] .kpi-tip::before { border-color: rgba(127, 224, 108, 0.22); }
body[data-tema="escuro"] .kpi-tip-cabe { border-bottom-color: rgba(255, 255, 255, 0.12); }
body[data-tema="escuro"] .kpi-tip-tit,
body[data-tema="escuro"] .kpi-tip-linha .v { color: #fff; }
body[data-tema="escuro"] .kpi-tip-linha.forte { border-top-color: rgba(255, 255, 255, 0.18); }
body[data-tema="escuro"] .kpi-tip-tag.neutro { color: #1a1a1a; }
body[data-tema="escuro"] .kpi-tip-tags span { color: #fff; }

/* ===================== PEDIDOS DE DORMENTES ===================== */
.pagina-pedidos .pedidos-intro-card { margin-bottom: 18px; }
.pedidos-intro-texto { font-size: 13.5px; max-width: 980px; line-height: 1.55; }
.pedidos-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(330px, 1fr));
  gap: 18px;
  align-items: stretch;
}
.pedidos-grid-full { grid-column: 1 / -1; }
.pedido-card {
  margin-bottom: 0;
  min-height: 100%;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.pedido-card-topo {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
}
.pedido-label {
  display: block;
  color: var(--cinza-texto-claro);
  font-size: 10.5px;
  font-weight: 900;
  letter-spacing: .7px;
  text-transform: uppercase;
  margin-bottom: 3px;
}
.pedido-card h3 {
  color: var(--azul-escuro);
  font-size: 23px;
  font-weight: 900;
  letter-spacing: -.4px;
}
.pedido-badges,
.pedido-lotes,
.pedido-card-acoes {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.pedido-card-kpis {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}
.pedido-card-kpis > div {
  border: 1px solid var(--cinza-borda);
  border-radius: 16px;
  padding: 10px 12px;
  background: rgba(255,255,255,.62);
}
.pedido-card-kpis span {
  display: block;
  color: var(--cinza-texto-claro);
  font-size: 10.5px;
  font-weight: 850;
  text-transform: uppercase;
  letter-spacing: .4px;
}
.pedido-card-kpis strong {
  display: block;
  color: var(--azul-escuro);
  font-size: 20px;
  font-weight: 900;
  margin-top: 3px;
}
.pedido-progresso {
  height: 9px;
  border-radius: 999px;
  background: var(--cinza-bg);
  overflow: hidden;
  border: 1px solid rgba(215,224,229,.9);
}
.pedido-progresso span {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--azul-claro), var(--verde-claro));
}
.pedido-secao {
  border-top: 1px dashed var(--cinza-borda);
  padding-top: 12px;
}
.pedido-secao > strong {
  display: block;
  color: var(--azul-escuro);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .45px;
  margin-bottom: 8px;
}
.pedido-lote-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-width: 100%;
  border-radius: 999px;
  padding: 5px 10px;
  background: #eef6fc;
  color: var(--azul-escuro);
  font-size: 12px;
  font-weight: 850;
  border: 1px solid rgba(50,166,230,.18);
}
.pedido-lote-chip.produzido {
  align-items: flex-start;
  flex-direction: column;
  border-radius: 14px;
  background: #e5f9c2;
  color: #125f4c;
  gap: 1px;
}
.pedido-lote-chip small {
  font-size: 10.5px;
  font-weight: 700;
  opacity: .78;
}
.pedido-observacao {
  color: var(--cinza-texto);
  background: rgba(255,255,255,.66);
  border: 1px solid var(--cinza-borda);
  border-radius: 16px;
  padding: 10px 12px;
  font-size: 13px;
  line-height: 1.45;
}
.pedido-card-acoes {
  margin-top: auto;
  justify-content: flex-end;
  padding-top: 4px;
}
body[data-tema="escuro"] .pedido-card h3,
body[data-tema="escuro"] .pedido-secao > strong,
body[data-tema="escuro"] .pedido-card-kpis strong { color: #fff; }
body[data-tema="escuro"] .pedido-card-kpis > div,
body[data-tema="escuro"] .pedido-observacao {
  background: rgba(255,255,255,.07);
  border-color: rgba(255,255,255,.12);
}
body[data-tema="escuro"] .pedido-lote-chip {
  background: rgba(255,255,255,.10);
  color: #fff;
  border-color: rgba(255,255,255,.14);
}
body[data-tema="escuro"] .pedido-lote-chip.produzido {
  background: rgba(127,224,108,.18);
  color: var(--verde-claro);
}
@media (max-width: 760px) {
  .pedidos-grid { grid-template-columns: 1fr; }
  .pedido-card-kpis { grid-template-columns: 1fr; }
}

/* =====================================================================
   GLOSSÁRIO DE DEFEITOS — página suspensa sobre a tela de Reprovados
   ===================================================================== */
.glossario-overlay {
  position: fixed; inset: 0;
  background: rgba(0, 38, 77, 0.55);
  display: none;
  align-items: center; justify-content: center;
  z-index: 600;
  padding: 24px;
  backdrop-filter: blur(2px);
}
.glossario-overlay.aberto { display: flex; }
body.glossario-aberto { overflow: hidden; }

.glossario-painel {
  background: var(--branco);
  border-radius: var(--raio);
  width: 100%;
  max-width: 1200px;
  max-height: 92vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  box-shadow: 0 24px 70px rgba(0, 38, 77, 0.34);
}

.glossario-cab {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 20px 24px;
  background: var(--azul-escuro);
  color: var(--branco);
}
.glossario-cab .topo-kicker {
  font-size: 11px;
  letter-spacing: .6px;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--verde-claro);
  margin-bottom: 4px;
}
.glossario-cab h2 { font-size: 20px; font-weight: 800; color: var(--branco); }
.glossario-cab .glossario-sub { font-size: 13px; color: rgba(255, 255, 255, 0.78); margin-top: 4px; }
.glossario-cab-acoes { display: flex; align-items: center; gap: 12px; }

.glossario-fechar {
  color: rgba(255, 255, 255, 0.92);
  font-size: 26px;
  line-height: 1;
  width: 38px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.glossario-fechar:hover { background: rgba(255, 255, 255, 0.15); color: var(--branco); }

.glossario-corpo { padding: 24px; overflow-y: auto; }

.defeitos-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 18px;
}
.defeito-card {
  background: var(--cinza-card);
  border: 1px solid var(--cinza-borda);
  border-radius: var(--raio-sm);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: var(--sombra);
  transition: var(--transicao);
}
.defeito-card:hover { box-shadow: var(--sombra-hover); transform: translateY(-2px); }

.defeito-img {
  width: 100%;
  height: auto;
  max-height: 460px;
  object-fit: contain;
  background: var(--cinza-bg);
  display: block;
}
.defeito-img-vazia {
  min-height: 200px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  color: var(--cinza-texto-claro);
  font-size: 12px;
}
.defeito-img-vazia .ic { width: 40px; height: 40px; opacity: .4; }

.defeito-corpo { padding: 14px 16px 16px; display: flex; flex-direction: column; gap: 8px; }
.defeito-card-topo { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.defeito-card-topo h3 { font-size: 15px; font-weight: 700; color: var(--azul-escuro); line-height: 1.3; }
.defeito-acoes { display: flex; gap: 4px; flex-shrink: 0; }
.defeito-desc { font-size: 13px; color: var(--cinza-texto); line-height: 1.5; white-space: pre-wrap; }

/* Formulário de defeito acima da página suspensa */
.glossario-form-overlay { z-index: 700; }

.defeito-preview {
  border: 1.5px dashed var(--cinza-borda);
  border-radius: var(--raio-sm);
  min-height: 160px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 12px;
  background: var(--cinza-bg);
}
.defeito-preview img { max-width: 100%; max-height: 320px; border-radius: var(--raio-sm); object-fit: contain; }
.defeito-preview-vazio { color: var(--cinza-texto-claro); font-size: 13px; }
.campo input[type="file"] {
  padding: 8px 10px;
  cursor: pointer;
}

@media (max-width: 640px) {
  .glossario-overlay { padding: 0; }
  .glossario-painel { max-width: 100%; max-height: 100vh; height: 100vh; border-radius: 0; }
  .glossario-cab { flex-direction: column; }
  .glossario-cab-acoes { width: 100%; justify-content: space-between; }
}

/* Tema escuro */
body[data-tema="escuro"] .glossario-painel,
body[data-tema="escuro"] .defeito-card {
  background: linear-gradient(180deg, rgba(8,42,77,0.98), rgba(7,31,58,0.98));
  border-color: var(--cinza-borda);
  color: var(--branco);
}
body[data-tema="escuro"] .defeito-card-topo h3 { color: var(--branco); }
body[data-tema="escuro"] .defeito-desc { color: var(--cinza-texto-claro); }
body[data-tema="escuro"] .defeito-img { background: rgba(255,255,255,.04); }
body[data-tema="escuro"] .defeito-preview { background: rgba(3,22,43,.55); border-color: var(--cinza-borda); }

/* ===================== MENUS DROPDOWN DO TOPO (Concreto / Subcomponente / Ferramentas) ===================== */
.menu-dropdowns {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-right: 4px;
}
.menu-dd { position: relative; }

.menu-dd-botao {
  gap: 8px;
  padding-right: 10px;
}
.menu-dd-botao::before {
  content: '';
  width: 7px;
  height: 7px;
  border-radius: 999px;
  flex-shrink: 0;
  opacity: .9;
}
.menu-dd--concreto .menu-dd-botao::before { background: var(--azul-claro, #32A6E6); }
.menu-dd--subcomponentes .menu-dd-botao::before { background: var(--verde, #1E9F7F); }
.menu-dd--ferramentas .menu-dd-botao::before { background: #9966ff; }
.menu-dd--sistema .menu-dd-botao::before { background: #FBD300; }

.menu-dd-botao .ic-chevron {
  width: 14px;
  height: 14px;
  opacity: .7;
  transition: transform .18s ease;
}
.menu-dd-botao[aria-expanded="true"] .ic-chevron { transform: rotate(180deg); }

.menu-dd-botao.ativo {
  border-color: var(--azul-claro);
  color: var(--azul-claro);
  font-weight: 700;
}
.menu-dd--subcomponentes .menu-dd-botao.ativo { border-color: var(--verde); color: var(--verde); }
.menu-dd--ferramentas .menu-dd-botao.ativo { border-color: #9966ff; color: #9966ff; }
.menu-dd--sistema .menu-dd-botao.ativo { border-color: #c9a800; color: #8a7400; }

/* Painel suspenso */
.menu-dd-painel {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  min-width: 256px;
  max-width: 320px;
  background: var(--cinza-card, #fff);
  border: 1px solid var(--cinza-borda);
  border-radius: var(--raio-sm);
  box-shadow: var(--sombra-hover);
  padding: 8px;
  display: none;
  flex-direction: column;
  gap: 2px;
  z-index: 60;
  max-height: min(70vh, 520px);
  overflow-y: auto;
}
.menu-dd-painel.aberto { display: flex; }

.menu-dd-link {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 11px;
  border-radius: 9px;
  border: 1.5px solid transparent;
  text-decoration: none;
  color: var(--cinza-texto);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
}
.menu-dd-link .ic { width: 18px; height: 18px; flex-shrink: 0; opacity: .9; }
.menu-dd-link:hover { background: var(--cinza-bg); color: var(--azul-escuro); }
.menu-dd-link.ativo {
  background: linear-gradient(90deg, rgba(50,166,230,.16), transparent);
  border-color: rgba(50,166,230,.45);
  color: var(--azul-escuro);
}
.menu-dd-link.nav-link--subcomponentes.ativo {
  background: linear-gradient(90deg, rgba(30,159,127,.16), transparent);
  border-color: rgba(30,159,127,.45);
}
.menu-dd-link.nav-link--ferramentas.ativo {
  background: linear-gradient(90deg, rgba(153,102,255,.16), transparent);
  border-color: rgba(153,102,255,.45);
}
.menu-dd-link.nav-link--sistema.ativo {
  background: linear-gradient(90deg, rgba(251,211,0,.20), transparent);
  border-color: rgba(251,211,0,.50);
}
.menu-dd-link[data-external="true"] span::after { content: ' ↗'; font-weight: 900; opacity: .75; }

/* Tema escuro: contraste do hover dos links */
body[data-tema="escuro"] .menu-dd-link:hover { background: rgba(255,255,255,.08); color: #fff; }
body[data-tema="escuro"] .menu-dd-link.ativo { color: #fff; }

/* Responsivo: em telas estreitas, mostra só ícone + seta para caber */
@media (max-width: 820px) {
  .menu-dd-botao span { display: none; }
  .menu-dd-painel { right: 0; }
}

/* ===================== LOGIN — fundo "Rumo ao Hexa" cobrindo toda a tela ===================== */
.login-page {
  background: url('../assets/brand/login-bg-hexa.jpg') center center / cover no-repeat;
  background-color: #00233f; /* fallback enquanto a imagem carrega */
}
/* a imagem é o fundo: remove a textura diagonal decorativa para a foto aparecer limpa */
.login-page::before { display: none; }
/* garante o card sempre acima da foto */
.login-card { position: relative; z-index: 1; }

/* =====================================================================
   CORREÇÃO MOBILE GLOBAL — topo/menu padronizados e logout visível
   2026-06-09
   ===================================================================== */
@media (max-width: 820px) {
  .topo {
    overflow: visible !important;
    z-index: 120 !important;
    gap: 10px !important;
  }

  .topo > .flex {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .topo-identidade {
    min-width: 0;
  }

  .topo-acoes {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch !important;
    gap: 8px !important;
    width: 100% !important;
  }

  .menu-dropdowns {
    grid-column: 1 / -1;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px !important;
    width: 100%;
    margin: 0 !important;
  }

  .menu-dd {
    min-width: 0;
    width: 100%;
    position: static;
  }

  .menu-dd-botao,
  .topo .tema-toggle,
  .usuario-auth > .btn,
  #topoAcoes > .btn,
  #topoAcoes > a.btn,
  .exportacoes-grupo .btn {
    width: 100% !important;
    min-width: 0 !important;
    justify-content: center !important;
    text-align: center;
    white-space: normal !important;
    line-height: 1.15;
  }

  .menu-dd-botao span,
  .topo .tema-toggle span {
    display: inline !important;
  }

  .menu-dd-botao .ic,
  .topo .tema-toggle .ic,
  .usuario-auth .btn .ic,
  #topoAcoes .btn .ic,
  #topoAcoes a.btn .ic {
    flex-shrink: 0;
  }

  .usuario-auth {
    display: flex !important;
    width: 100%;
    min-width: 0;
  }

  .usuario-auth .usuario-pill {
    display: none !important;
  }

  .topo-pagina-acoes,
  #topoAcoes {
    grid-column: 1 / -1;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  .exportacoes-grupo {
    grid-column: 1 / -1;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
  }

  .menu-dd-painel {
    z-index: 1000 !important;
    border-radius: 18px !important;
    padding: 10px !important;
    max-width: none !important;
    box-shadow: 0 18px 50px rgba(0, 38, 77, .28) !important;
  }

  .menu-dd-link {
    white-space: normal !important;
    font-size: 13px;
    min-height: 40px;
  }
}

@media (max-width: 460px) {
  .topo-acoes,
  .menu-dropdowns,
  .topo-pagina-acoes,
  #topoAcoes {
    gap: 7px !important;
  }

  .topo .btn,
  .menu-dd-botao,
  .usuario-auth > .btn,
  #topoAcoes > .btn,
  #topoAcoes > a.btn,
  .exportacoes-grupo .btn {
    min-height: 38px !important;
    padding: 8px 9px !important;
    font-size: 12px !important;
  }

  .menu-dd-botao {
    gap: 6px !important;
  }

  .menu-dd-botao .ic,
  .topo .tema-toggle .ic {
    width: 16px;
    height: 16px;
  }
}

/* =====================================================================
   INDICADORES DE QUALIDADE — Capabilidade (Cp/Cpk) e Moldes/Cavidades
   ===================================================================== */
.dashboard-indicadores { margin-top: 18px; }
#indicadorCapabilidade, #indicadorMoldesCavidades { margin-bottom: 18px; }

.capabilidade-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 14px;
}
.cap-card {
  border: 1px solid var(--borda, #e3e8ef);
  border-left: 5px solid var(--cinza-claro, #c7cdd6);
  border-radius: 12px;
  padding: 14px 16px;
  background: var(--card, #fff);
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.cap-card.ok { border-left-color: var(--ok); }
.cap-card.bom { border-left-color: var(--azul-claro); }
.cap-card.aviso { border-left-color: var(--amarelo); }
.cap-card.baixo { border-left-color: #f59e0b; }
.cap-card.critico { border-left-color: var(--erro); }
.cap-cabecalho { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; }
.cap-rotulo { font-weight: 800; font-size: 0.92rem; }
.cap-status {
  font-size: 0.68rem; font-weight: 800; letter-spacing: 0.04em; text-transform: uppercase;
  padding: 3px 10px; border-radius: 999px; white-space: nowrap;
}
.cap-status.ok { background: color-mix(in srgb, var(--ok) 16%, transparent); color: var(--ok); }
.cap-status.bom { background: color-mix(in srgb, var(--azul-claro) 16%, transparent); color: var(--azul-escuro); }
.cap-status.aviso { background: color-mix(in srgb, var(--amarelo) 22%, transparent); color: var(--amarelo-texto, #8a6d00); }
.cap-status.baixo { background: rgba(245,158,11,0.16); color: #b45309; }
.cap-status.critico { background: color-mix(in srgb, var(--erro) 14%, transparent); color: var(--erro); }
.cap-status.neutro { background: rgba(127,127,127,0.14); opacity: 0.85; }

.cap-cpk { display: flex; align-items: baseline; gap: 10px; }
.cap-tag { font-size: 0.7rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; opacity: 0.65; }
.cap-valor { font-size: 2.1rem; font-weight: 800; line-height: 1; }
.cap-card.ok .cap-valor { color: var(--ok); }
.cap-card.bom .cap-valor { color: var(--azul-claro); }
.cap-card.aviso .cap-valor { color: var(--amarelo-texto, #b58900); }
.cap-card.baixo .cap-valor { color: #d97706; }
.cap-card.critico .cap-valor { color: var(--erro); }
.cap-meta-alvo { font-size: 0.74rem; opacity: 0.7; }

.cap-gauge-trilho {
  position: relative; display: flex; height: 12px;
  border-radius: 999px; overflow: visible;
}
.cap-zona { height: 100%; opacity: 0.55; }
.cap-zona:first-child { border-radius: 999px 0 0 999px; }
.cap-zona:last-child { border-radius: 0 999px 999px 0; }
.cap-zona.critico { background: var(--erro); }
.cap-zona.baixo { background: #f59e0b; }
.cap-zona.aviso { background: var(--amarelo); }
.cap-zona.bom { background: var(--azul-claro); }
.cap-zona.ok { background: var(--ok); }
.cap-gauge-meta {
  position: absolute; top: -3px; bottom: -3px; width: 2px;
  background: currentColor; opacity: 0.7; transform: translateX(-1px);
}
.cap-gauge-ponteiro {
  position: absolute; top: -5px; width: 0; height: 0;
  border-left: 7px solid transparent; border-right: 7px solid transparent;
  border-top: 9px solid currentColor; transform: translateX(-7px);
  filter: drop-shadow(0 1px 1px rgba(0,0,0,0.35));
}
.cap-gauge-escala { position: relative; height: 14px; font-size: 0.64rem; opacity: 0.65; margin-top: 3px; }
.cap-gauge-escala span { position: absolute; transform: translateX(-50%); }
.cap-gauge-escala span:first-child { left: 0; transform: none; }
.cap-gauge-escala span.fim { left: auto; right: 0; transform: none; }

.cap-histo-area {
  position: relative; display: flex; align-items: flex-end; gap: 2px;
  height: 54px; padding: 2px 0;
  border-bottom: 1px solid var(--borda, #e3e8ef);
}
.cap-histo-barra {
  flex: 1; min-width: 4px; border-radius: 3px 3px 0 0;
  background: color-mix(in srgb, var(--ok) 65%, transparent);
}
.cap-histo-barra.abaixo { background: color-mix(in srgb, var(--erro) 75%, transparent); }
.cap-histo-lie {
  position: absolute; top: 0; bottom: -1px; width: 2px;
  background: var(--erro); transform: translateX(-1px);
}
.cap-histo-legenda { font-size: 0.68rem; opacity: 0.65; margin-top: 4px; }

.cap-stats {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  gap: 6px 12px;
}
.cap-stats div { display: flex; flex-direction: column; gap: 1px; }
.cap-stats span { font-size: 0.66rem; text-transform: uppercase; letter-spacing: 0.05em; opacity: 0.6; }
.cap-stats strong { font-size: 0.84rem; }
.cap-vazio { font-size: 0.8rem; opacity: 0.75; }
.cap-limites { font-size: 0.72rem; opacity: 0.7; }
.cap-limites strong { color: var(--erro); }

.molde-projeto { margin-bottom: 16px; }
.molde-projeto:last-child { margin-bottom: 0; }
.molde-projeto-titulo {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  margin-bottom: 8px;
}
.molde-projeto-meta { font-size: 0.76rem; opacity: 0.75; }
.moldes-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
  gap: 10px;
}
.molde-card {
  border: 1px solid var(--borda, #e3e8ef);
  border-radius: 10px;
  padding: 10px 12px;
  background: var(--card, #fff);
}
.molde-card.principal { border-color: var(--erro); box-shadow: 0 0 0 1px var(--erro) inset; }
.molde-card-topo {
  display: flex; justify-content: space-between; align-items: baseline;
  gap: 8px; font-size: 0.82rem;
}
.molde-card-total { font-weight: 800; color: var(--erro); white-space: nowrap; }
.molde-card-motivos { margin-top: 7px; display: flex; flex-wrap: wrap; gap: 4px; }
.molde-card-motivos .badge.mini { font-size: 0.66rem; padding: 2px 7px; }
.molde-extras { font-size: 0.74rem; opacity: 0.7; margin-top: 6px; }

@media (max-width: 600px) {
  .capabilidade-grid, .moldes-grid { grid-template-columns: 1fr; }
}

/* ---- Saúde Estatística dos Projetos (Cpk 28 dias) ---- */
.saude-resumo {
  display: flex; flex-wrap: wrap; gap: 8px 22px;
  padding: 10px 12px; margin-bottom: 12px;
  border: 1px dashed var(--borda, #e3e8ef); border-radius: 10px;
  font-size: 0.82rem;
}
.saude-resumo-item { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.saude-resumo-titulo { font-weight: 700; }
.saude-resumo-extra { opacity: 0.8; }

.saude-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 12px;
}
.saude-card {
  border: 1px solid var(--borda, #e3e8ef);
  border-left: 5px solid var(--cinza-claro, #c7cdd6);
  border-radius: 12px;
  padding: 12px 14px;
  background: var(--card, #fff);
  display: flex; flex-direction: column; gap: 8px;
}
.saude-card.ok { border-left-color: var(--ok); }
.saude-card.bom { border-left-color: var(--azul-claro); }
.saude-card.aviso { border-left-color: var(--amarelo); }
.saude-card.baixo { border-left-color: #f59e0b; }
.saude-card.critico { border-left-color: var(--erro); }
.saude-card.clicavel { cursor: pointer; transition: transform 0.12s ease, box-shadow 0.12s ease; }
.saude-card.clicavel:hover { transform: translateY(-2px); box-shadow: 0 4px 14px rgba(0,0,0,0.12); }
.saude-card.ativo { outline: 2px solid var(--ok); outline-offset: 1px; }
.saude-card-topo { display: flex; justify-content: space-between; align-items: center; gap: 8px; flex-wrap: wrap; }

.saude-linha {
  display: grid;
  grid-template-columns: 1fr auto auto auto;
  grid-template-areas: "ensaio cpk seta delta" "spark spark spark base";
  align-items: center; column-gap: 8px; row-gap: 2px;
  padding: 6px 0; border-top: 1px dashed var(--borda, #e3e8ef);
}
.saude-ensaio { grid-area: ensaio; font-size: 0.78rem; font-weight: 600; }
.saude-cpk { grid-area: cpk; font-size: 1.15rem; font-weight: 800; }
.saude-cpk.ok { color: var(--ok); }
.saude-cpk.bom { color: var(--azul-claro); }
.saude-cpk.aviso { color: var(--amarelo-texto, #b58900); }
.saude-cpk.baixo { color: #d97706; }
.saude-cpk.critico { color: var(--erro); }
.saude-cpk.neutro { opacity: 0.6; }
.saude-seta { grid-area: seta; font-style: normal; font-size: 1rem; }
.saude-delta { grid-area: delta; font-size: 0.7rem; opacity: 0.75; white-space: nowrap; }
.saude-base { grid-area: base; font-size: 0.66rem; opacity: 0.6; text-align: right; }

.cap-spark { grid-area: spark; display: inline-block; width: 150px; max-width: 100%; height: 36px; }
.cap-spark svg { width: 100%; height: 100%; }
.cap-spark.ok { color: var(--ok); }
.cap-spark.bom { color: var(--azul-claro); }
.cap-spark.aviso { color: var(--amarelo-texto, #b58900); }
.cap-spark.baixo { color: #d97706; }
.cap-spark.critico { color: var(--erro); }
.cap-spark.neutro { color: var(--cinza, #8a93a2); }

.cap-alerta {
  font-size: 0.66rem; font-weight: 800; letter-spacing: 0.03em; text-transform: uppercase;
  color: var(--erro);
  background: rgba(226,59,59,0.12);
  border-radius: 999px; padding: 2px 9px; white-space: nowrap;
}
.cap-cabecalho-dir { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.cap-evolucao { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.cap-evolucao .cap-spark { height: 32px; }
.cap-evolucao-txt { font-size: 0.7rem; opacity: 0.7; flex: 1; min-width: 160px; }

.cap-ranking { margin-top: 14px; }
.cap-ranking-titulo { font-size: 0.74rem; font-weight: 700; opacity: 0.75; margin-bottom: 6px; }
.cap-ranking-tabela td, .cap-ranking-tabela th { font-size: 0.8rem; }
.cap-ranking-tabela td em { font-style: normal; }
.cap-ranking-tabela td.ok strong { color: var(--ok); }
.cap-ranking-tabela td.bom strong { color: var(--azul-claro); }
.cap-ranking-tabela td.aviso strong { color: var(--amarelo-texto, #b58900); }
.cap-ranking-tabela td.baixo strong { color: #d97706; }
.cap-ranking-tabela td.critico strong { color: var(--erro); }
.cap-ranking-tabela td small { opacity: 0.7; }

.evolucao-cpk { margin-top: 14px; border-top: 1px dashed var(--borda, #e3e8ef); padding-top: 12px; }
.evolucao-cpk-topo { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 8px; }
.evolucao-cpk-topo strong { font-size: 0.9rem; }
.evolucao-cpk-topo .btn { margin-left: auto; }
.evolucao-cpk-vazio { margin-top: 12px; font-size: 0.8rem; opacity: 0.75; }

@media (max-width: 600px) {
  .saude-grid { grid-template-columns: 1fr; }
}

/* =====================================================================
   Dossiê do lote — Fluxo de Liberação
   ===================================================================== */
body.pagina-painel-series .legenda-fluxo.dossie b {
  background: rgba(0, 170, 200, .14);
  color: var(--azul-claro);
}

body.pagina-painel-series .legenda-fluxo.aviso b {
  background: rgba(226, 59, 59, .14);
  color: var(--erro);
}

body.pagina-painel-series .tabela-fluxo-lotes {
  min-width: 1860px;
}

body.pagina-painel-series .tabela-fluxo-lotes .dossie-col {
  width: 210px;
  min-width: 210px;
}

body.pagina-painel-series .dossie-lote-card {
  width: 100%;
  min-width: 190px;
  cursor: pointer;
  border: 1px solid rgba(0, 56, 101, .14);
  background: linear-gradient(135deg, rgba(0, 170, 200, .08), rgba(141, 198, 63, .08));
  border-radius: 12px;
  padding: 8px 9px;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 2px 8px;
  align-items: center;
  text-align: left;
  font: inherit;
  transition: transform .14s ease, box-shadow .14s ease, border-color .14s ease;
}

body.pagina-painel-series .dossie-lote-card:hover,
body.pagina-painel-series .dossie-lote-card:focus-visible {
  border-color: rgba(0, 170, 200, .42);
  box-shadow: 0 8px 18px rgba(0, 56, 101, .10);
  transform: translateY(-1px);
  outline: none;
}

body.pagina-painel-series .dossie-lote-card span {
  color: var(--azul-escuro);
  font-size: 10.8px;
  font-weight: 900;
}

body.pagina-painel-series .dossie-lote-card strong {
  justify-self: end;
  color: var(--verde);
  font-size: 13px;
  font-weight: 900;
}

body.pagina-painel-series .dossie-lote-card small {
  grid-column: 1 / -1;
  color: var(--cinza-texto);
  font-size: 9.6px;
  font-weight: 800;
}

body.dossie-modal-aberto {
  overflow: hidden;
}

body.pagina-painel-series .dossie-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(0, 25, 46, .44);
  backdrop-filter: blur(3px);
}

body.pagina-painel-series .dossie-modal {
  width: min(760px, calc(100vw - 32px));
  max-height: min(82vh, 760px);
  overflow: hidden;
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
  border: 1px solid rgba(0, 170, 200, .24);
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 26px 80px rgba(0, 25, 46, .34);
}

body.pagina-painel-series .dossie-modal-cabecalho {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  padding: 18px 20px 14px;
  border-bottom: 1px solid rgba(0, 56, 101, .10);
  background: linear-gradient(135deg, rgba(0, 56, 101, .06), rgba(0, 170, 200, .05));
}

body.pagina-painel-series .dossie-modal-cabecalho span {
  display: block;
  margin-bottom: 3px;
  color: var(--verde);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .09em;
}

body.pagina-painel-series .dossie-modal-cabecalho h3 {
  margin: 0;
  color: var(--azul-escuro);
  font-size: 24px;
  line-height: 1.1;
}

body.pagina-painel-series .dossie-modal-cabecalho p {
  margin: 6px 0 0;
  color: var(--cinza-texto);
  font-size: 12px;
  font-weight: 800;
}

body.pagina-painel-series .dossie-modal-fechar {
  width: 34px;
  height: 34px;
  border: 1px solid rgba(0, 56, 101, .15);
  border-radius: 12px;
  background: #fff;
  color: var(--azul-escuro);
  cursor: pointer;
  font-size: 24px;
  line-height: 1;
  font-weight: 800;
}

body.pagina-painel-series .dossie-modal-fechar:hover,
body.pagina-painel-series .dossie-modal-fechar:focus-visible {
  border-color: rgba(226, 59, 59, .32);
  color: var(--erro);
  outline: none;
}

body.pagina-painel-series .dossie-modal-resumo {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 12px 20px;
  border-bottom: 1px solid rgba(0, 56, 101, .08);
  background: #f8fbfd;
}

body.pagina-painel-series .dossie-modal-resumo span {
  border: 1px solid rgba(0, 56, 101, .10);
  border-radius: 999px;
  padding: 6px 10px;
  color: var(--cinza-texto);
  background: #fff;
  font-size: 11px;
  font-weight: 800;
}

body.pagina-painel-series .dossie-modal-resumo b {
  color: var(--azul-escuro);
}

body.pagina-painel-series .dossie-lista {
  display: grid;
  gap: 9px;
  padding: 14px;
}

body.pagina-painel-series .dossie-modal-lista {
  overflow: auto;
  padding: 14px 20px 20px;
}

body.pagina-painel-series .dossie-item {
  border: 1px solid var(--cinza-borda);
  border-radius: 14px;
  padding: 10px;
  background: #f8fbfd;
}

body.pagina-painel-series .dossie-item.ok {
  border-color: rgba(30, 159, 127, .24);
  background: rgba(30, 159, 127, .06);
}

body.pagina-painel-series .dossie-item.aviso {
  border-color: rgba(251, 211, 0, .44);
  background: rgba(251, 211, 0, .10);
}

body.pagina-painel-series .dossie-item.erro {
  border-color: rgba(226, 59, 59, .32);
  background: rgba(226, 59, 59, .07);
}

body.pagina-painel-series .dossie-item-topo {
  display: grid;
  grid-template-columns: 24px 1fr auto;
  gap: 8px;
  align-items: start;
}

body.pagina-painel-series .dossie-item-topo b {
  width: 23px;
  height: 23px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  font-size: 10px;
  font-weight: 900;
  color: var(--cinza-texto);
  background: rgba(189, 204, 212, .26);
}

body.pagina-painel-series .dossie-item.ok .dossie-item-topo b {
  color: #fff;
  background: var(--verde);
}

body.pagina-painel-series .dossie-item.aviso .dossie-item-topo b {
  color: #5b4200;
  background: var(--amarelo);
}

body.pagina-painel-series .dossie-item.erro .dossie-item-topo b {
  color: #fff;
  background: var(--erro);
}

body.pagina-painel-series .dossie-item-topo strong {
  display: block;
  color: var(--azul-escuro);
  font-size: 12px;
  line-height: 1.15;
}

body.pagina-painel-series .dossie-item-topo span {
  display: block;
  margin-top: 2px;
  color: var(--cinza-texto);
  font-size: 10px;
  line-height: 1.25;
}

body.pagina-painel-series .dossie-item-topo a,
body.pagina-painel-series .dossie-registro a {
  color: var(--azul-escuro);
  font-size: 10px;
  font-weight: 900;
  text-decoration: none;
  border-bottom: 1px dashed currentColor;
  white-space: nowrap;
}

body.pagina-painel-series .dossie-item-topo a:hover,
body.pagina-painel-series .dossie-registro a:hover {
  color: var(--azul-claro);
}

body.pagina-painel-series .dossie-registros {
  display: grid;
  gap: 5px;
  margin-top: 7px;
  padding-left: 32px;
}

body.pagina-painel-series .dossie-registro,
body.pagina-painel-series .dossie-vazio,
body.pagina-painel-series .dossie-mais {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  color: var(--cinza-texto);
  font-size: 10px;
  line-height: 1.25;
}

body.pagina-painel-series .dossie-registro em {
  font-style: normal;
}

body.pagina-painel-series .dossie-registro.erro em {
  color: var(--erro);
  font-weight: 800;
}

body.pagina-painel-series .dossie-registro.aviso em {
  color: #8a6500;
  font-weight: 800;
}

body.pagina-painel-series[data-tema="escuro"] .dossie-lote-card {
  background: rgba(255, 255, 255, .07);
  border-color: rgba(255, 255, 255, .16);
}

body.pagina-painel-series[data-tema="escuro"] .dossie-lote-card span,
body.pagina-painel-series[data-tema="escuro"] .dossie-item-topo strong,
body.pagina-painel-series[data-tema="escuro"] .dossie-modal-cabecalho h3,
body.pagina-painel-series[data-tema="escuro"] .dossie-modal-resumo b {
  color: #fff;
}

body.pagina-painel-series[data-tema="escuro"] .dossie-lote-card small,
body.pagina-painel-series[data-tema="escuro"] .dossie-modal-cabecalho p,
body.pagina-painel-series[data-tema="escuro"] .dossie-item-topo span,
body.pagina-painel-series[data-tema="escuro"] .dossie-registro,
body.pagina-painel-series[data-tema="escuro"] .dossie-vazio,
body.pagina-painel-series[data-tema="escuro"] .dossie-mais {
  color: #c9d8e8;
}

body.pagina-painel-series[data-tema="escuro"] .dossie-modal,
body.pagina-painel-series[data-tema="escuro"] .dossie-modal-fechar,
body.pagina-painel-series[data-tema="escuro"] .dossie-item {
  background: #07223f;
  border-color: rgba(255, 255, 255, .16);
}

body.pagina-painel-series[data-tema="escuro"] .dossie-modal-cabecalho,
body.pagina-painel-series[data-tema="escuro"] .dossie-modal-resumo {
  background: rgba(255, 255, 255, .05);
  border-color: rgba(255, 255, 255, .12);
}

body.pagina-painel-series[data-tema="escuro"] .dossie-modal-resumo span {
  background: rgba(255, 255, 255, .06);
  border-color: rgba(255, 255, 255, .14);
}

body.pagina-painel-series[data-tema="escuro"] .dossie-item.ok { background: rgba(141, 198, 63, .12); }
body.pagina-painel-series[data-tema="escuro"] .dossie-item.aviso { background: rgba(251, 211, 0, .13); }
body.pagina-painel-series[data-tema="escuro"] .dossie-item.erro { background: rgba(255, 107, 107, .13); }

@media (max-width: 680px) {
  body.pagina-painel-series .dossie-modal-backdrop {
    align-items: stretch;
    padding: 10px;
  }

  body.pagina-painel-series .dossie-modal {
    width: 100%;
    max-height: calc(100vh - 20px);
    border-radius: 16px;
  }

  body.pagina-painel-series .dossie-modal-cabecalho {
    padding: 14px;
  }

  body.pagina-painel-series .dossie-modal-cabecalho h3 {
    font-size: 20px;
  }

  body.pagina-painel-series .dossie-modal-resumo,
  body.pagina-painel-series .dossie-modal-lista {
    padding-left: 14px;
    padding-right: 14px;
  }

  body.pagina-painel-series .dossie-registro,
  body.pagina-painel-series .dossie-vazio,
  body.pagina-painel-series .dossie-mais {
    align-items: flex-start;
    flex-direction: column;
  }
}


/* ===================== FICHA DO LOTE (Painel de Séries) ===================== */
.lote-serie-chip.clicavel,
.mapa-lote-chip.clicavel {
  cursor: pointer;
  transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
.lote-serie-chip.clicavel:hover,
.lote-serie-chip.clicavel:focus-visible,
.mapa-lote-chip.clicavel:hover,
.mapa-lote-chip.clicavel:focus-visible {
  border-color: var(--azul-claro);
  box-shadow: 0 2px 8px rgba(0, 56, 101, 0.18);
  transform: translateY(-1px);
  outline: none;
}
.lote-serie-chip.atual {
  border-style: dashed;
  opacity: .75;
}
.ficha-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.ficha-vinculos-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
  gap: 12px;
}
.ficha-vinculo {
  border: 1px solid var(--cinza-borda);
  border-radius: var(--raio);
  padding: 12px 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  background: var(--branco);
}
.ficha-vinculo-topo {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.ficha-vinculo-topo strong { font-size: 13.5px; }
.ficha-vinculo ul {
  margin: 0;
  padding-left: 16px;
  font-size: 12.5px;
  color: var(--cinza-texto);
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.ficha-vinculo a {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--azul-claro);
}
body[data-tema="escuro"] .ficha-vinculo {
  background: transparent;
  border-color: rgba(255, 255, 255, .14);
}
body[data-tema="escuro"] .ficha-vinculo ul { color: var(--cinza-texto-claro); }