/* ============================================================================
   Ponte de compatibilidade — TEMPORÁRIO. Este arquivo existe para MORRER.
   ============================================================================
   Reaponta os vocabulários antigos (v2-*, partes-*, nv2-*) para os tokens
   novos, para que uma tela ainda não migrada herde as correções de contraste
   no mesmo deploy — sem que ninguém precise abrir o template dela.

   Sem isto, a fase de fundação viraria um big bang: ou migra as 55 telas de
   uma vez, ou metade do sistema fica com o botão primário reprovando em
   contraste enquanto a outra metade não.

   COMO MORRER: a cada fase, ao migrar uma tela, apagar daqui as regras que ela
   era a última a usar. No fim de F7 este arquivo é removido e o <link> sai do
   base.html. Se ele ainda existir depois de F7, a migração não terminou.

   REGRA: aqui só entra ALIAS. Estilo novo vai em components.css. Se você está
   escrevendo algo aqui que não é "aponte o nome velho para o token novo",
   está no arquivo errado.
   ========================================================================== */


/* ── botão primário: a correção mais importante do arquivo ─────────────────
   .v2-btn-primary (style.css:2526) é `color: #fff !important` sobre âmbar =
   2.08:1, reprovado em qualquer critério WCAG. Só o !important daqui vence o
   !important de lá — é a ÚNICA exceção autorizada do sistema, e ela morre
   junto com este arquivo. */
.v2-btn-primary,
.partes-btn-primary,
.nv2-btn-primary,
.pm-btn-primary {
  background: var(--ds-brand) !important;
  color: var(--ds-on-brand) !important;
  border-color: var(--ds-brand) !important;
}
.v2-btn-primary:hover,
.partes-btn-primary:hover,
.nv2-btn-primary:hover,
.pm-btn-primary:hover {
  background: var(--ds-brand-strong) !important;
  color: var(--ds-on-brand) !important;
}
/* Mesma regra para o botão âmbar do Bootstrap quando a tela usa .btn-warning
   como primário (billing faz isso). */
.btn-warning {
  color: var(--ds-on-brand);
}


/* ── cabeçalhos de página: três grafias, um tamanho ────────────────────── */
.v2-page-title, .partes-page-title, .pagetitle h1 {
  font-size: var(--ds-fs-6); font-weight: 750;
  letter-spacing: -.012em; color: var(--ds-text);
}
.v2-page-desc, .partes-page-desc {
  font-size: var(--ds-fs-2); color: var(--ds-text-dim);
}


/* ── superfícies de card ──────────────────────────────────────────────── */
.v2-card, .v2-table-card, .v2-filter-card,
.partes-table-card, .partes-filter-card,
.nv2-card {
  background: var(--ds-surface);
  border-color: var(--ds-border);
  border-radius: var(--ds-radius-lg);
}


/* ── hover de linha: tira o creme de TODAS as tabelas de uma vez ──────────
   --hover-bg é #fefbf3 (creme) e --amber-light é #fff8eb. Os dois foram usados
   como PREENCHIMENTO de linha, o que transforma âmbar de acento em fundo.
   Neutro serve os dois temas com uma regra só.
   O !important aqui vence o do .table-hover do Bootstrap. */
.v2-table-card tbody tr:hover td,
.partes-table-wrapper tbody tr:hover td,
table.table-hover tbody tr:hover > * {
  background: color-mix(in srgb, var(--ds-text) 3%, transparent) !important;
}


/* ── bordas de input: 1.27:1 → 3:1 em todos os formulários do sistema ───── */
.form-control, .form-select,
input[type="text"], input[type="number"], input[type="date"],
input[type="email"], input[type="password"], input[type="search"],
input[type="tel"], input[type="url"],
select:not(.select2-hidden-accessible), textarea,
.v2-filter-input, .partes-filter-input,
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple {
  border-color: var(--ds-border-field);
}


/* ── texto de apoio: sai de 2.95:1 ────────────────────────────────────── */
.v2-text-null, .partes-text-null,
.v2-kpi-subtitle, .partes-kpi-subtitle,
.v2-filter-hint {
  color: var(--ds-text-faint);
}


/* ── dado numérico: tabular-nums onde já existe coluna de valor ─────────── */
.v2-table-card td.num, .partes-table-wrapper td.num,
.v2-kpi-value, .partes-kpi-value, .pipe-kpi-value,
.sig-summary-value, .evo-stat-value, .rpt-kpi-value {
  font-family: var(--ds-mono); font-variant-numeric: tabular-nums;
}


/* ── skeleton antigo: alinhar o cinza ao das superfícies novas ────────────
   `.v2-skeleton` (style.css:2668) é pintado com --border e --hover-bg do tema
   ANTIGO. No dark isso dá #27272a contra o #22252c do card novo: o bloco de
   esqueletos aparece como um retângulo mais claro dentro do card, o que num
   print parece overlay perdido. Mesmo tom, mesma animação. */
.v2-skeleton {
  background: linear-gradient(
    90deg,
    var(--ds-surface-2) 25%,
    color-mix(in srgb, var(--ds-text) 7%, var(--ds-surface-2)) 50%,
    var(--ds-surface-2) 75%
  );
  background-size: 200% 100%;
}

/* ── estados vazios antigos: mesma altura e mesma cor ──────────────────── */
.v2-empty-state, .partes-initial-state, .ps-empty-block, .cmp-empty {
  color: var(--ds-text-dim);
}
.v2-empty-icon, .partes-initial-icon {
  color: var(--ds-text-faint);
}


/* ── KPI com cor hardcoded no template ────────────────────────────────────
   pipeline/index.html pinta os KPIs com style="color:#3b82f6" e afins, que não
   respondem ao tema. Aqui não dá para desfazer o inline (ele vence), mas as
   variantes por classe passam a existir para quando a tela migrar. */
.pipe-kpi-value.ok, .v2-kpi-value.ok { color: var(--ds-ok); }
.pipe-kpi-value.bad, .v2-kpi-value.bad { color: var(--ds-bad); }
