/* V1602 — Tendência Estatística (visão da Empresa Âncora) no padrão do sistema + rascunho de plano de ação.
   Escopo: #fp-area.gp-ancora-padrao. Carregar depois de ancora-padrao-v1601.css. */

/* 1. Cabeçalho no padrão de página: sobretítulo, título 23px azul-escuro e barra laranja */
#fp-area.gp-ancora-padrao .tfh-cab { position: relative; padding-left: 16px !important; }
#fp-area.gp-ancora-padrao .tfh-cab::before { content: ""; position: absolute; left: 0; top: 4px; bottom: 4px; width: 4px; border-radius: 2px; background: var(--tq-laranja); }
#fp-area.gp-ancora-padrao .tfh-trilha { font-size: var(--tq-fs-mini) !important; font-weight: 700 !important; letter-spacing: .06em; text-transform: uppercase; color: var(--tq-texto-2) !important; }
#fp-area.gp-ancora-padrao .tfh-trilha a { color: var(--tq-texto-2) !important; text-decoration: none; }
#fp-area.gp-ancora-padrao .tfh-trilha a:hover { color: var(--tq-azul-600) !important; text-decoration: underline; }
#fp-area.gp-ancora-padrao .tfh-titulo { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
#fp-area.gp-ancora-padrao .tfh-titulo h2 { margin: 2px 0 !important; font-size: var(--tq-fs-titulo) !important; font-weight: 700 !important; line-height: 1.2 !important; color: var(--tq-azul-900) !important; }
#fp-area.gp-ancora-padrao .tfh-sub { font-size: var(--tq-fs-rotulo) !important; color: var(--tq-texto-2) !important; line-height: 1.5; }
#fp-area.gp-ancora-padrao .tfh-dir > small { font-size: var(--tq-fs-mini) !important; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--tq-texto-2) !important; }
#fp-area.gp-ancora-padrao .tfh-dir-txt { font-size: var(--tq-fs-rotulo) !important; color: var(--tq-texto-3) !important; }

/* 2. Filtros legíveis: rótulo 12px, campo 38px/13px sem cortar o texto */
#fp-area.gp-ancora-padrao .tfh-filtros { display: flex !important; flex-wrap: wrap; align-items: flex-end; gap: 10px 16px !important; }
#fp-area.gp-ancora-padrao .tfh-filtros > label {
  display: flex !important; flex-direction: column; align-items: flex-start !important; gap: 5px !important;
  font-size: var(--tq-fs-rotulo) !important; font-weight: 600; color: var(--tq-texto-2) !important;
}
#fp-area.gp-ancora-padrao .tfh-filtros > label select {
  min-width: 170px; width: auto !important; max-width: 260px; height: var(--tq-altura-campo) !important;
  padding: 0 30px 0 10px !important; font-size: var(--tq-fs-corpo) !important;
  border: 1px solid var(--tq-borda-forte) !important; border-radius: var(--tq-raio) !important; color: var(--tq-texto) !important;
}
/* 6. selo do baseline com o tamanho mínimo do padrão */
#fp-area.gp-ancora-padrao .tfh-filtros .tfh-base {
  align-self: flex-end; margin-bottom: 7px; padding: 4px 10px !important; border-radius: 999px;
  font-size: var(--tq-fs-mini) !important; font-weight: 700; background: var(--tq-azul-100) !important; color: var(--tq-azul-800) !important;
}

/* 3. Título da seção de indicadores como título de cartão */
#fp-area.gp-ancora-padrao .tfh-secao h4 {
  display: flex; align-items: center; gap: 9px; margin: 0;
  font-size: var(--tq-fs-secao) !important; font-weight: 700 !important; color: var(--tq-azul-800) !important; text-transform: none !important;
}
#fp-area.gp-ancora-padrao .tfh-secao h4::before { content: ""; flex: 0 0 3px; width: 3px; height: 16px; border-radius: 2px; background: var(--tq-laranja); }
#fp-area.gp-ancora-padrao .tfh-leg { font-size: var(--tq-fs-rotulo) !important; color: var(--tq-texto-2) !important; }

/* 4/5. Cartões de indicador no modelo aprovado (V1594): borda superior colorida, número azul-escuro */
#fp-area.gp-ancora-padrao .tfx-grid.tfh-indicator-cards { grid-template-columns: repeat(12, minmax(0, 1fr)) !important; gap: 10px !important; }
#fp-area.gp-ancora-padrao .tfx-grid.tfh-indicator-cards > .tfx-card {
  grid-column: span 3; padding: 12px 14px 11px !important; gap: 6px !important;
  border: 1px solid var(--tq-borda) !important; border-top: 3px solid var(--kpi-accent, var(--tq-azul-600)) !important;
  border-radius: 10px !important; background: var(--tq-painel) !important; box-shadow: 0 1px 2px rgba(21, 49, 86, .08) !important;
}
#fp-area.gp-ancora-padrao .tfx-grid.tfh-indicator-cards > .tfx-card header strong { font-size: var(--tq-fs-rotulo) !important; font-weight: 700 !important; color: var(--tq-azul-800) !important; white-space: normal !important; }
#fp-area.gp-ancora-padrao .tfx-grid.tfh-indicator-cards > .tfx-card header small { font-size: var(--tq-fs-mini) !important; color: var(--tq-texto-3) !important; }
#fp-area.gp-ancora-padrao .tfx-grid.tfh-indicator-cards > .tfx-card .tdx-selo { font-size: var(--tq-fs-mini) !important; }
#fp-area.gp-ancora-padrao .tfx-grid.tfh-indicator-cards > .tfx-card .tfx-valor { padding: 0 !important; background: none !important; align-items: baseline; }
#fp-area.gp-ancora-padrao .tfx-grid.tfh-indicator-cards > .tfx-card .tfx-valor > span { font-size: 24px !important; font-weight: 800 !important; color: var(--tq-azul-900) !important; }
#fp-area.gp-ancora-padrao .tfx-grid.tfh-indicator-cards > .tfx-card .tfx-valor > small { font-size: var(--tq-fs-mini) !important; color: var(--tq-texto-3) !important; }
#fp-area.gp-ancora-padrao .tfx-grid.tfh-indicator-cards > .tfx-card .tfx-card-summary { font-size: var(--tq-fs-mini) !important; color: var(--tq-texto-2) !important; padding-top: 6px; border-top: 1px solid var(--tq-borda); }
#fp-area.gp-ancora-padrao .tfx-grid.tfh-indicator-cards > .tfx-card.tfx-clic:hover { border-color: var(--tq-borda-forte) !important; border-top-color: var(--kpi-accent, var(--tq-azul-600)) !important; box-shadow: 0 4px 12px rgba(18, 49, 94, .10) !important; }
/* selecionado: como os níveis da Carteira — contorno azul + fundo azul-claro, mantendo a cor da situação no topo */
#fp-area.gp-ancora-padrao .tfx-grid.tfh-indicator-cards > .tfx-card.tfx-sel {
  border-color: var(--tq-azul-600) !important; border-top-color: var(--kpi-accent, var(--tq-azul-600)) !important;
  background: var(--tq-azul-100) !important; box-shadow: 0 0 0 1px var(--tq-azul-600) !important;
}
#fp-area.gp-ancora-padrao .tfx-grid.tfh-indicator-cards > .tfx-card.tfx-sel .tfx-valor { background: none !important; }
/* 7. última linha completa (sem espaço vazio): 7 = 4 + 3 largos, 6 = 4 + 2, 5 = 4 + 1 */
#fp-area.gp-ancora-padrao .tfh-ult-3 > .tfx-card:nth-last-child(-n+3) { grid-column: span 4; }
#fp-area.gp-ancora-padrao .tfh-ult-2 > .tfx-card:nth-last-child(-n+2) { grid-column: span 6; }
#fp-area.gp-ancora-padrao .tfh-ult-1 > .tfx-card:last-child { grid-column: span 12; }
@media (max-width: 1050px) {
  #fp-area.gp-ancora-padrao .tfx-grid.tfh-indicator-cards > .tfx-card,
  #fp-area.gp-ancora-padrao .tfh-ult-3 > .tfx-card:nth-last-child(-n+3),
  #fp-area.gp-ancora-padrao .tfh-ult-2 > .tfx-card:nth-last-child(-n+2) { grid-column: span 6; }
  #fp-area.gp-ancora-padrao .tfx-grid.tfh-indicator-cards > .tfx-card:last-child:nth-child(odd) { grid-column: span 12; }
}
@media (max-width: 620px) { #fp-area.gp-ancora-padrao .tfx-grid.tfh-indicator-cards > .tfx-card { grid-column: span 12 !important; } }

/* Planos de Ação: aviso de rascunho vindo da tendência */
.fp-rascunho-tend { display: flex; align-items: center; gap: 12px; margin: 0 0 12px; padding: 10px 14px; border: 1px solid var(--tq-azul-600); border-left-width: 4px; border-radius: var(--tq-raio); background: var(--tq-azul-100); }
.fp-rascunho-tend > span { font-size: 18px; color: var(--tq-azul-600); }
.fp-rascunho-tend > div { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.fp-rascunho-tend b { color: var(--tq-azul-900); font-size: var(--tq-fs-corpo); }
.fp-rascunho-tend small { color: var(--tq-texto-2); font-size: var(--tq-fs-rotulo); }
