/* V1558 — Evolução de Contas: filtros, período em andamento e tendência */

/* Evita que a faixa de agrupamento invada o seletor de ano. */
#main .fevo-filtros-linha--principal {
  display: grid !important;
  grid-template-columns: minmax(350px, 2fr) repeat(5, minmax(120px, 1fr));
  align-items: end;
  gap: 12px;
  width: 100%;
  min-width: 0;
}
#main .fevo-filtros-linha--principal > .fevo-campo {
  min-width: 0;
  width: auto;
  flex: initial;
  max-width: none;
}
#main .fevo-campo--agrupamento .fevo-seg {
  width: 100%;
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
}
#main .fevo-campo--agrupamento .fevo-seg button {
  min-width: 0;
  padding-inline: 7px;
  white-space: nowrap;
}
#main .fevo-campo--ano select {
  border-color: #b8cbe3;
  background: #f7faff;
  color: var(--tq-azul-900, #12315e);
  font-weight: 700;
}
#main .fevo-filtros-linha--principal .fevo-campo > span {
  min-height: 16px;
}

/* Opções secundárias em controles compactos, sem rótulos quebrados no meio. */
#main .fevo-filtros-linha--opcoes {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 22px;
  padding-top: 12px;
  border-top: 1px solid #e8edf4;
}
#main .fevo-filtros-linha--opcoes .fevo-check {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 7px;
  min-height: 32px;
  white-space: nowrap;
  line-height: 1.25;
}
#main .fevo-filtros-linha--opcoes .fevo-check input[type="checkbox"] {
  flex: 0 0 auto;
  margin: 0;
}
#main .fevo-filtros-linha--opcoes .fevo-min {
  flex: 0 0 88px;
  width: 88px !important;
  min-width: 88px;
  margin: 0;
}
#main .fevo-legenda {
  margin-left: auto;
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px 14px;
}
#main .fevo-legenda-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
  color: var(--tq-texto-2, #5b6676);
}
#main .fevo-legenda .fevo-leg {
  flex: 0 0 12px;
  margin: 0;
  vertical-align: middle;
}

/* Cabeçalho de período em andamento: nome, selo e data em linhas próprias. */
#main .fevo-tabela thead th {
  white-space: nowrap;
}
#main .fevo-tabela thead th.is-andamento {
  min-width: 124px;
  padding-top: 9px;
  padding-bottom: 9px;
}
#main .fevo-tabela thead th .fevo-periodo-cab {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: center;
  gap: 5px;
  max-width: 100%;
  white-space: normal;
  line-height: 1.2;
}
#main .fevo-tabela thead th .fevo-periodo-nome {
  display: block;
  white-space: nowrap;
  font-weight: 750;
}
#main .fevo-tabela thead th .fevo-periodo-data {
  display: block;
  white-space: nowrap;
  font-size: 10px;
  font-weight: 500;
  line-height: 1.25;
  color: #eaf2fb;
  opacity: .92;
}
#main .fevo-tabela thead th .fevo-badge--andamento {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  max-width: 100%;
  padding: 4px 7px;
  margin: 0;
  border: 1px solid rgba(255,255,255,.28);
  border-radius: 999px;
  background: #f07f1a;
  color: #fff;
  font-size: 9.5px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: .25px;
  text-transform: uppercase;
  white-space: nowrap;
}
#main .fevo-badge--andamento i {
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
  opacity: .95;
}

/* Tendência: maior área útil, ponto final legível e indicação de valores no tooltip. */
#main .fevo-tend {
  width: 112px;
  min-width: 112px;
  text-align: center !important;
  padding-inline: 8px !important;
}
#main .fevo-spark {
  display: block;
  width: 100px;
  max-width: 100%;
  height: 36px;
  margin: 0 auto;
  overflow: visible;
}
#main .fevo-spark .fevo-spark-base {
  stroke: #dce5ef;
  stroke-width: 1;
  stroke-dasharray: 2 3;
}
#main .fevo-spark polyline {
  stroke: var(--tq-azul-600, #1766b3);
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}
#main .fevo-spark .fevo-spark-ponto-final {
  fill: var(--tq-laranja, #f07f1a);
  stroke: #fff;
  stroke-width: 1.8;
}
#main .fevo-tabela-card .fevo-tabela-topo {
  align-items: center;
  gap: 12px;
}
#main .fevo-tabela-card .fevo-tabela-topo h3 {
  line-height: 1.35;
}

@media (max-width: 1450px) {
  #main .fevo-filtros-linha--principal {
    grid-template-columns: minmax(300px, 1.4fr) repeat(2, minmax(180px, 1fr));
  }
  #main .fevo-campo--agrupamento,
  #main .fevo-campo--ano {
    grid-column: auto;
  }
}
@media (max-width: 960px) {
  #main .fevo-filtros-linha--principal {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  #main .fevo-campo--agrupamento {
    grid-column: 1 / -1;
  }
  #main .fevo-campo--ano {
    grid-column: auto;
  }
  #main .fevo-filtros-linha--opcoes {
    align-items: flex-start;
  }
  #main .fevo-legenda {
    flex-basis: 100%;
    margin-left: 0;
  }
}
@media (max-width: 600px) {
  #main > .topbar {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }
  #main > .topbar .fevo-acoes {
    width: 100%;
    justify-content: flex-start;
  }
  #main > .topbar .fevo-acoes button {
    flex: 1 1 140px;
  }
  #main .fevo-campo--agrupamento .fevo-seg button {
    padding-inline: 3px;
    font-size: 11px;
    letter-spacing: -.15px;
  }
  #main .fevo-filtros-linha--principal {
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
  }
  #main .fevo-campo--agrupamento,
  #main .fevo-campo--ano {
    grid-column: 1;
  }
  #main .fevo-filtros-linha--opcoes .fevo-check--limite {
    flex-wrap: wrap;
    white-space: normal;
  }
  #main .fevo-legenda {
    gap: 8px 12px;
  }
  #main .fevo-destaques {
    grid-template-columns: minmax(0, 1fr);
  }
  #main .fevo-tabela-topo {
    align-items: flex-start;
  }
}

@media print {
  #main .fevo-spark { width: 90px; height: 32px; }
}
