/* ===== Fase 15: fluxo de caixa (matriz de 12 meses, previsto x realizado). Só tokens. ===== */
.fx-bar { display: flex; align-items: flex-end; flex-wrap: wrap; gap: var(--sp-4); background: var(--card); border: 1px solid var(--borda); border-radius: var(--radius); padding: var(--sp-4); }
.fx-campo { min-width: 220px; }
.fx-campo-ano { min-width: 130px; }
.fx-campo label { display: block; font-size: 0.8125rem; font-weight: 600; margin-bottom: var(--sp-1); }
.fx-acoes { margin-left: auto; display: flex; align-items: center; gap: var(--sp-3); }
.fx-status { min-height: 1.25rem; font-size: 0.8125rem; color: var(--erro-escura); }
.fx-card { position: relative; background: var(--card); border: 1px solid var(--borda); border-radius: var(--radius); box-shadow: var(--sombra-card); }
.fx-scroll { overflow-x: auto; max-width: 100%; }
.fx-grid { border-collapse: separate; border-spacing: 0; width: 100%; font-size: 0.8125rem; }
.fx-grid th, .fx-grid td { padding: var(--sp-1) var(--sp-2); border-bottom: 1px solid var(--borda); white-space: nowrap; background: var(--card); }
.fx-grid thead th { position: sticky; top: 0; z-index: 2; background: var(--bg-alt); font-weight: 600; text-align: center; color: var(--text); }
.fx-grid thead tr:first-child th { height: 1.75rem; box-sizing: border-box; }
.fx-grid thead tr + tr th { top: 1.75rem; font-weight: 500; color: var(--text-secundario); }
.fx-grid .fx-sticky { position: sticky; left: 0; z-index: 1; min-width: 230px; max-width: 280px; overflow: hidden; text-overflow: ellipsis; text-align: left; font-weight: 400; border-right: 1px solid var(--borda-forte); background: var(--card); }
.fx-grid thead th.fx-sticky { z-index: 3; background: var(--bg-alt); font-weight: 600; }
.fx-grid .fx-recuo { padding-left: var(--sp-5); }
.fx-grid .fx-n { text-align: right; font-variant-numeric: tabular-nums; min-width: 96px; }
.fx-grid .neg { color: var(--erro-escura); }
.fx-grid .fx-tot { background: var(--bg-alt); font-weight: 600; }
.fx-grid .fx-secao th, .fx-grid .fx-secao td { background: var(--cor-primaria-suave); font-weight: 700; color: var(--cor-primaria-escura); }
.fx-grid .fx-grupo th, .fx-grid .fx-grupo td { background: var(--bg-alt); font-weight: 600; }
.fx-grid .fx-subtotal th, .fx-grid .fx-subtotal td, .fx-grid .fx-resultado th, .fx-grid .fx-resultado td { background: var(--bg-alt); font-weight: 700; }
.fx-grid .fx-saldo th, .fx-grid .fx-saldo td { font-style: italic; }
.fx-obs { background: none; border: none; padding: 2px; margin-left: 2px; cursor: help; color: var(--cor-primaria); border-radius: var(--radius-xs); vertical-align: middle; font-size: 1rem; }
.fx-obs:hover { background: var(--cor-primaria-suave); }
.fx-obs:focus-visible { outline: 2px solid var(--cor-primaria); }
.fx-carregando { display: flex; align-items: center; justify-content: center; gap: var(--sp-3); padding: var(--sp-6) 0; }
.fx-carregando[hidden], .fx-scroll[hidden] { display: none; }
.fx-aviso { margin: var(--sp-2) 0; padding: var(--sp-2) var(--sp-3); font-size: 0.8125rem; background: var(--alerta-suave); border-radius: var(--radius-sm); color: var(--text); }
.fx-aviso[hidden] { display: none; }
.fx-scroll:focus-visible { outline: 2px solid var(--cor-primaria); outline-offset: -2px; }
.fx-nota { margin-top: var(--sp-3); font-size: 0.75rem; color: var(--muted); }
@media (max-width: 768px) {
    .fx-acoes { margin-left: 0; width: 100%; }
    .fx-campo { min-width: 0; flex: 1 1 100%; }
    .fx-grid .fx-sticky { min-width: 150px; max-width: 160px; }
}
