/* ==========================================================================
   ERTEL — Módulo Indicadores
   ========================================================================== */

.ertel-indicadores-alerta {
  padding: var(--ertel-space-5);
  margin-top: var(--ertel-space-4);
  border-left: 3px solid var(--ertel-crit-a);
}
.ertel-indicadores-alerta__titulo {
  font-weight: var(--ertel-weight-semibold);
  color: var(--ertel-crit-a);
  font-size: var(--ertel-text-sm);
  margin-bottom: var(--ertel-space-3);
}
.ertel-indicadores-alerta__lista {
  display: flex;
  flex-direction: column;
  gap: var(--ertel-space-2);
  margin-bottom: var(--ertel-space-3);
}
.ertel-indicadores-alerta__item {
  display: flex;
  justify-content: space-between;
  gap: var(--ertel-space-3);
  font-size: var(--ertel-text-sm);
  color: var(--ertel-ink);
  padding: 6px 0;
  border-bottom: 1px solid var(--ertel-border);
}
.ertel-indicadores-alerta__item:last-child {
  border-bottom: none;
}

/* -- Tabela de Confiabilidade por Equipamento (MTBF + Disponibilidade) --------------------- */

.ertel-indicadores-tabela-confiabilidade {
  margin-top: var(--ertel-space-4);
  padding: var(--ertel-space-4);
}
.ertel-tabela-simples {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--ertel-text-sm);
}
.ertel-tabela-simples th, .ertel-tabela-simples td {
  padding: 8px 10px;
  border-bottom: 1px solid var(--ertel-border);
  text-align: left;
}
.ertel-tabela-simples th {
  font-size: var(--ertel-text-xs);
  text-transform: uppercase;
  color: var(--ertel-muted);
  font-weight: 600;
}
.ertel-tabela-simples td a {
  color: var(--ertel-ink);
  text-decoration: none;
  font-weight: 600;
}
.ertel-tabela-simples td a:hover {
  text-decoration: underline;
}

/* -- Seletor de Intervalo de Datas (calendário início/fim, seção Tendências) --------------- */

.ertel-date-range-picker {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--ertel-space-4);
}
.ertel-date-range-picker__campo {
  display: flex;
  align-items: center;
  gap: var(--ertel-space-2);
  font-size: var(--ertel-text-xs);
  font-weight: var(--ertel-weight-medium);
  color: var(--ertel-muted);
}
.ertel-date-range-picker__campo .ertel-field__input {
  width: auto;
  padding: 6px 10px;
  font-size: var(--ertel-text-xs);
}
.ertel-date-range-picker__erro {
  font-size: var(--ertel-text-xs);
  color: var(--ertel-crit-a);
  font-weight: var(--ertel-weight-medium);
}

/* -- Popover de Configuração por Gráfico (Fase 5) --------------------------------------- */

.ertel-chart-config {
  display: flex;
  flex-direction: column;
  gap: var(--ertel-space-3);
}
.ertel-chart-config__check {
  display: flex;
  align-items: center;
  gap: var(--ertel-space-2);
  font-size: var(--ertel-text-sm);
  color: var(--ertel-ink);
  cursor: pointer;
}
.ertel-chart-config__check input[type="checkbox"] {
  width: 16px;
  height: 16px;
  cursor: pointer;
}

/* Botão de engrenagem no cabeçalho de cada painel de tendência -- discreto,
   só ganha destaque no hover, pra não competir com o número/título ao lado. */
.ertel-dash-dark-painel__config-btn {
  background: none;
  border: none;
  cursor: pointer;
  font-size: 14px;
  padding: 2px 4px;
  border-radius: var(--ertel-radius-sm);
  opacity: 0.55;
  transition: opacity var(--ertel-transition-fast), background var(--ertel-transition-fast);
}
.ertel-dash-dark-painel__config-btn:hover {
  opacity: 1;
  background: rgba(255, 255, 255, 0.06);
}