/* =====================================================
   Portal BKon, BKon OS: módulo FINANCEIRO (admin)
   Telas admin-fin, admin-fin-receber, admin-fin-pagar,
   admin-fin-contas, admin-fin-extrato (js/financeiro.js).

   Só tokens do portal (portal.css): cores, raios, fontes e
   sombras vêm de lá, então claro/escuro funciona sozinho.
   Sem gradiente. Números sempre tabulares.
   Lista: tabela no desktop, cartões empilhados no celular.
   ===================================================== */

.fin-page { --fin-gap: 16px; }

.fin-muted { color: var(--text-muted); }
.fin-sr {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.fin-spacer { flex: 1; }
.fin-header-acoes { flex-wrap: wrap; gap: 8px; }

/* ── dinheiro ── */
.fin-money,
.fin-num,
.fin-kpi__valor,
.fin-tile__valor,
.fin-conta__saldo {
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1;
}
.fin-money { font-weight: 600; white-space: nowrap; color: var(--text-primary); }
.fin-money--pos { color: var(--success); }
.fin-money--neg { color: var(--danger); }
.fin-num { text-align: right; white-space: nowrap; }

/* ── avisos e notas ── */
.fin-aviso {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  padding: 12px 14px; margin-bottom: var(--fin-gap);
  border: 1px solid color-mix(in srgb, var(--warning) 35%, transparent);
  background: var(--warning-soft); border-radius: var(--radius-md);
  color: var(--text-primary); font-size: 13px; line-height: 1.5;
}
.fin-aviso p { margin: 0; }
.fin-aviso ul { margin: 6px 0 0 18px; width: 100%; }
.fin-aviso--ok {
  border-color: color-mix(in srgb, var(--success) 35%, transparent);
  background: var(--success-soft);
}
.fin-nota { font-size: 12px; line-height: 1.5; color: var(--text-muted); margin: 8px 0 12px; }
.fin-help { font-size: 12px; color: var(--text-muted); line-height: 1.4; }
.fin-tag {
  display: inline-block; padding: 1px 6px; border-radius: var(--radius-sm);
  background: var(--bg-raised); border: 1px solid var(--border-strong);
  font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.04em; text-transform: uppercase;
  color: var(--text-secondary); vertical-align: 1px;
}
.fin-empty { padding: 32px 16px; }

/* ── cartões base ── */
.fin-card {
  background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius-lg);
  box-shadow: var(--shadow-card); padding: 16px; min-width: 0;
}
.fin-card__topo { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.fin-card__titulo { font-size: 15px; font-weight: 600; color: var(--text-primary); margin: 0; letter-spacing: -0.01em; }
.fin-card--inativo { opacity: 0.7; }

.fin-grid { display: grid; grid-template-columns: 1fr; gap: var(--fin-gap); margin-top: var(--fin-gap); }
@media (min-width: 980px) {
  .fin-grid { grid-template-columns: 1fr 1fr; }
  .fin-card--largo { grid-column: 1 / -1; }
  .fin-grid--2 { grid-template-columns: 1fr 1fr; }
}

/* ── KPIs da visão ── */
.fin-kpis { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
@media (min-width: 760px) { .fin-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1200px) { .fin-kpis { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
.fin-kpi {
  background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius-lg);
  padding: 14px; min-width: 0; box-shadow: var(--shadow-card);
}
.fin-kpi__rotulo {
  font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--text-muted); margin: 0 0 6px;
}
.fin-kpi__valor { font-size: 19px; font-weight: 700; color: var(--text-primary); margin: 0; letter-spacing: -0.02em; overflow-wrap: anywhere; }
.fin-kpi__sep { font-size: 12px; font-weight: 500; color: var(--text-muted); letter-spacing: 0; }
.fin-kpi__sub { font-size: 12px; color: var(--text-muted); margin: 4px 0 0; line-height: 1.4; }
.fin-kpi--neg .fin-kpi__valor { color: var(--danger); }
.fin-kpi--alerta { border-color: color-mix(in srgb, var(--danger) 35%, transparent); }

.fin-var { font-size: 12px; font-weight: 600; font-variant-numeric: tabular-nums; }
.fin-var--bom { color: var(--success); }
.fin-var--ruim { color: var(--danger); }
.fin-var--neutro { color: var(--text-muted); }

/* ── gráfico do fluxo (SVG próprio) ── */
.fin-chart { width: 100%; height: auto; display: block; margin: 4px 0; }
.fin-chart__eixo { fill: var(--text-muted); font-size: 11px; font-family: var(--font-mono); }
.fin-chart__eixo--zero { fill: var(--danger); }
.fin-chart__grade { stroke: var(--border-strong); stroke-width: 1; }
.fin-chart__zero { stroke: var(--danger); stroke-width: 1; stroke-dasharray: 4 4; }
.fin-chart__linha { fill: none; stroke: var(--accent); stroke-width: 2.5; stroke-linejoin: round; stroke-linecap: round; }
.fin-chart__ponto { fill: var(--bg-card); stroke: var(--accent); stroke-width: 2; }
.fin-chart__ponto--neg { stroke: var(--danger); }
.fin-chart__in { fill: var(--success); opacity: 0.85; }
.fin-chart__out { fill: var(--danger); opacity: 0.85; }
.fin-legenda { display: flex; gap: 16px; flex-wrap: wrap; list-style: none; margin: 0; padding: 0; font-size: 12px; color: var(--text-secondary); }
.fin-legenda li { display: inline-flex; align-items: center; gap: 6px; }
.fin-legenda__linha { width: 16px; height: 3px; border-radius: 2px; background: var(--accent); }
.fin-legenda__in, .fin-legenda__out { width: 10px; height: 10px; border-radius: 2px; background: var(--success); }
.fin-legenda__out { background: var(--danger); }
.fin-details { margin-top: 8px; }
.fin-details summary {
  cursor: pointer; font-size: 13px; font-weight: 600; color: var(--accent-text);
  min-height: 40px; display: inline-flex; align-items: center;
}

/* ── listas simples ── */
.fin-lista-simples { list-style: none; margin: 0; padding: 0; }
.fin-lista-simples > li {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 10px 0; border-bottom: 1px solid var(--border); font-size: 13px; min-width: 0;
}
.fin-lista-simples > li:last-child { border-bottom: 0; }
.fin-lista-simples > li > span:first-child { min-width: 0; overflow-wrap: anywhere; flex: 1; text-align: left; }
.fin-lista-num { counter-reset: fin; }
.fin-lista-num > li::before { counter-increment: fin; content: counter(fin); font-family: var(--font-mono); color: var(--text-muted); font-size: 12px; width: 16px; flex-shrink: 0; }
.fin-linha-btn {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%;
  min-height: 44px; padding: 6px 8px; margin: -6px -8px; background: none; border: 0; border-radius: var(--radius-md);
  color: inherit; font: inherit; text-align: left; cursor: pointer;
}
.fin-lista-simples > li:has(.fin-linha-btn) { padding: 6px 8px; }
.fin-linha-btn:hover { background: var(--bg-card-hover); }
.fin-linha-btn:focus-visible { outline: 2px solid var(--focus-ring, var(--border-focus)); outline-offset: 1px; }
.fin-link {
  background: none; border: 0; padding: 4px 0; min-height: 32px; color: var(--accent-text); font: inherit; font-size: 12px;
  text-decoration: underline; text-underline-offset: 2px; cursor: pointer; display: block; text-align: left;
}

/* ── filtros ── */
.fin-filtros {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; align-items: end; margin-bottom: var(--fin-gap);
}
@media (min-width: 760px) { .fin-filtros { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); } }
.fin-filtros .fin-field { margin: 0; }
.fin-filtros__acoes { display: flex; gap: 8px; align-items: end; }
.fin-filtros__acoes .btn { min-height: 42px; }

/* ── totais clicáveis ── */
.fin-tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-bottom: var(--fin-gap); }
.fin-tile {
  display: flex; flex-direction: column; gap: 2px; align-items: flex-start; text-align: left;
  padding: 12px; min-height: 72px; background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--radius-lg); cursor: pointer; color: inherit; font: inherit; min-width: 0;
  transition: border-color var(--duration-fast) var(--easing), background-color var(--duration-fast) var(--easing);
}
.fin-tile:hover { background: var(--bg-card-hover); }
.fin-tile:focus-visible { outline: 2px solid var(--focus-ring, var(--border-focus)); outline-offset: 2px; }
.fin-tile--ativo { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent) inset; }
.fin-tile--alerta .fin-tile__valor { color: var(--danger); }
.fin-tile__rotulo { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-muted); }
.fin-tile__valor { font-size: 16px; font-weight: 700; color: var(--text-primary); overflow-wrap: anywhere; }
.fin-tile__qtd { font-size: 11px; color: var(--text-muted); }

/* ── tabela (desktop) ── */
.fin-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.fin-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.fin-table th {
  text-align: left; font-family: var(--font-mono); font-size: 10px; font-weight: 500; letter-spacing: 0.08em;
  text-transform: uppercase; color: var(--text-muted); padding: 8px 10px; border-bottom: 1px solid var(--border-strong); white-space: nowrap;
}
.fin-table th.fin-num { text-align: right; }
.fin-table td { padding: 10px; border-bottom: 1px solid var(--border); vertical-align: middle; color: var(--text-secondary); }
.fin-table td.fin-td-principal { color: var(--text-primary); }
.fin-table tbody tr:hover td { background: var(--bg-card-hover); }
.fin-table--compacta td { padding: 6px 10px; }
.fin-table__grupo th { padding-top: 14px; color: var(--text-secondary); border-bottom: 1px solid var(--border); }
.fin-table__total td { font-weight: 600; color: var(--text-primary); }
.fin-table__resultado td { font-weight: 700; color: var(--text-primary); border-top: 2px solid var(--border-strong); border-bottom: 0; }
.fin-tr-click { cursor: pointer; }
.fin-tr-click:focus-visible { outline: 2px solid var(--focus-ring, var(--border-focus)); outline-offset: -2px; }
.fin-tr-saldo td { color: var(--text-muted); font-style: italic; }
.fin-td-saldo .fin-money { font-weight: 500; }
.fin-td-cb { width: 40px; }
.fin-cb { width: 20px; height: 20px; accent-color: var(--accent); cursor: pointer; }
.fin-acoes { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.fin-td-acoes { text-align: right; }
.fin-acoes .btn--sm, .fin-card .fin-acoes .btn--sm { min-height: 36px; }
.fin-card .fin-acoes { justify-content: flex-start; margin-top: 12px; }

/* tabela responsiva vira cartões no celular */
@media (max-width: 760px) {
  .fin-table--responsiva thead { display: none; }
  .fin-table--responsiva, .fin-table--responsiva tbody, .fin-table--responsiva tr, .fin-table--responsiva td { display: block; width: 100%; }
  .fin-table--responsiva tr {
    position: relative; background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius-lg);
    padding: 10px 12px; margin-bottom: 10px;
  }
  .fin-table--responsiva tbody tr:hover td { background: none; }
  .fin-table--responsiva td { border: 0; padding: 4px 0; display: flex; justify-content: space-between; gap: 12px; text-align: right; }
  .fin-table--responsiva td::before {
    content: attr(data-label); font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.06em; text-transform: uppercase;
    color: var(--text-muted); text-align: left; flex-shrink: 0; padding-top: 2px;
  }
  .fin-table--responsiva td[data-label=""]::before { content: none; }
  .fin-table--responsiva td.fin-td-principal { display: block; text-align: left; font-weight: 600; font-size: 14px; padding-right: 36px; }
  .fin-table--responsiva td.fin-td-principal::before { content: none; }
  .fin-table--responsiva td.fin-td-cb { position: absolute; top: 10px; right: 10px; width: auto; padding: 0; }
  .fin-table--responsiva td.fin-td-cb::before { content: none; }
  .fin-table--responsiva td.fin-td-cb:empty { display: none; }
  .fin-table--responsiva td.fin-td-acoes { display: block; padding-top: 8px; }
  .fin-table--responsiva td.fin-td-acoes::before { content: none; }
  .fin-table--responsiva .fin-acoes { justify-content: flex-start; }
  .fin-table--responsiva .fin-acoes .btn { min-height: 40px; flex: 1 1 auto; }
  .fin-table--responsiva td.fin-num .fin-money { font-size: 15px; }
  .fin-tiles { grid-template-columns: 1fr; }
  .fin-tile { flex-direction: row; align-items: baseline; justify-content: space-between; min-height: 48px; flex-wrap: wrap; }
}
/* tabelas de leitura (DRE, fluxo) no celular continuam tabela, com rolagem */
@media (max-width: 760px) {
  .fin-table--dre td, .fin-table--dre th, .fin-table--compacta td, .fin-table--compacta th { padding: 6px; font-size: 12px; }
}

/* ── lote ── */
.fin-lote {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 8px 12px; margin-bottom: 10px;
  background: var(--bg-subtle); border: 1px solid var(--border); border-radius: var(--radius-md);
  position: sticky; top: calc(var(--topbar-height, 52px) + 4px); z-index: 5;
}
.fin-lote__info { font-size: 12px; color: var(--text-muted); flex: 1; }
.fin-lote .btn { min-height: 40px; }

/* ── abas ── */
.fin-abas {
  display: flex; gap: 4px; border-bottom: 1px solid var(--border); margin-bottom: var(--fin-gap);
  overflow-x: auto; scrollbar-width: none;
}
.fin-abas::-webkit-scrollbar { display: none; }
.fin-aba {
  background: none; border: 0; border-bottom: 2px solid transparent; padding: 10px 12px; min-height: 44px;
  color: var(--text-muted); font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; white-space: nowrap; margin-bottom: -1px;
}
.fin-aba:hover { color: var(--text-primary); }
.fin-aba--ativa { color: var(--text-primary); border-bottom-color: var(--accent); }
.fin-aba:focus-visible { outline: 2px solid var(--focus-ring, var(--border-focus)); outline-offset: -2px; border-radius: var(--radius-sm); }
.fin-aba-acoes { display: flex; justify-content: flex-end; margin-bottom: 12px; }

/* ── contas e cartões ── */
.fin-cards { display: grid; grid-template-columns: 1fr; gap: 12px; }
@media (min-width: 700px) { .fin-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1200px) { .fin-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.fin-conta__info { font-size: 12px; margin: 2px 0; line-height: 1.5; }
.fin-conta__saldo { font-size: 22px; font-weight: 700; margin: 10px 0 4px; letter-spacing: -0.02em; }
.fin-conta__saldo .fin-money { color: var(--text-primary); }
.fin-conta__saldo .fin-money--neg { color: var(--danger); }
.fin-limite { margin: 12px 0 8px; }
.fin-limite__barra { height: 8px; border-radius: var(--radius-full); background: var(--bg-raised); border: 1px solid var(--border); overflow: hidden; }
.fin-limite__barra span { display: block; height: 100%; background: var(--accent); border-radius: inherit; }
.fin-limite__barra span.fin-limite--alto { background: var(--danger); }
.fin-limite__txt { display: flex; justify-content: space-between; gap: 8px; font-size: 12px; color: var(--text-muted); margin: 6px 0 0; font-variant-numeric: tabular-nums; flex-wrap: wrap; }
.fin-cartao__fatura { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; font-size: 13px; padding-top: 10px; border-top: 1px solid var(--border); }
.fin-cartao__pend { margin: 6px 0 0; }

/* fatura no modal */
.fin-fatura-nav { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 12px; flex-wrap: wrap; }
.fin-fatura-nav .btn { min-height: 40px; }
.fin-fatura-nav__atual { margin: 0; display: flex; align-items: center; gap: 8px; font-size: 15px; }
.fin-pagar-fatura { border: 1px solid var(--border); border-radius: var(--radius-md); padding: 12px; margin: 12px 0; background: var(--bg-subtle); }
.fin-sub { font-size: 13px; font-weight: 600; margin: 0 0 8px; color: var(--text-primary); }
.fin-vazio-curto { padding: 16px 0; }

/* resumo (dl) */
.fin-resumo { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 10px; margin: 0 0 14px; }
.fin-resumo > div { background: var(--bg-subtle); border: 1px solid var(--border); border-radius: var(--radius-md); padding: 8px 10px; min-width: 0; }
.fin-resumo dt { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-muted); margin-bottom: 2px; }
.fin-resumo dd { margin: 0; font-size: 14px; font-weight: 600; color: var(--text-primary); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.fin-resumo--linha { margin-bottom: var(--fin-gap); }

/* ── categorias ── */
.fin-arvore, .fin-arvore ul { list-style: none; margin: 0; padding: 0; }
.fin-arvore ul { padding-left: 18px; border-left: 1px solid var(--border); margin: 2px 0 6px 8px; }
.fin-cat { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 4px 0; font-size: 13px; color: var(--text-primary); min-height: 40px; }
.fin-cat--inativa { color: var(--text-muted); }

/* ── conciliação ── */
.fin-conc-topo { display: grid; grid-template-columns: 1fr; gap: 12px; margin-bottom: 12px; }
@media (min-width: 980px) { .fin-conc-topo { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; } }
.fin-conc-topo .fin-filtros { margin-bottom: 0; }
.fin-upload {
  display: flex; flex-direction: column; gap: 8px; padding: 12px; border: 1px dashed var(--border-strong);
  border-radius: var(--radius-md); background: var(--bg-subtle);
}
.fin-upload input[type="file"] { padding: 8px; min-height: 44px; }
.fin-upload .btn { align-self: flex-start; min-height: 40px; }
.fin-conc-lista { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.fin-conc-item {
  display: flex; gap: 12px; align-items: flex-start; background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--radius-lg); padding: 12px;
}
.fin-conc-item > .fin-cb { margin-top: 2px; flex-shrink: 0; }
.fin-conc-item__dados { flex: 1; min-width: 0; }
.fin-conc-item__linha { display: flex; align-items: baseline; gap: 10px; margin: 0 0 6px; font-size: 13px; flex-wrap: wrap; }
.fin-conc-item__data { font-family: var(--font-mono); font-size: 12px; color: var(--text-muted); font-variant-numeric: tabular-nums; }
.fin-conc-item__desc { flex: 1; min-width: 0; color: var(--text-primary); font-weight: 600; overflow-wrap: anywhere; }
.fin-sug { margin: 0 0 8px; padding: 8px 10px; border-radius: var(--radius-md); background: var(--bg-subtle); border: 1px solid var(--border); font-size: 12px; line-height: 1.5; }
.fin-sug p { margin: 0; }
.fin-sug__conf { margin-top: 4px !important; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.fin-sug--alta { border-left: 3px solid var(--success); }
.fin-sug--media { border-left: 3px solid var(--warning); }
.fin-sug--baixa { border-left: 3px solid var(--border-strong); }
.fin-sug--escolhido { border-left: 3px solid var(--accent); }
.fin-sug--nenhuma { background: none; border-style: dashed; }
.fin-conc-item__acoes { display: grid; grid-template-columns: 1fr; gap: 8px; align-items: end; }
@media (min-width: 760px) { .fin-conc-item__acoes { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; } }
.fin-conc-item__acoes .btn { min-height: 42px; }
.fin-conc-item__acoes .fin-field { margin: 0; }
.fin-cands .fin-linha-btn { align-items: flex-start; }
.fin-cands .fin-linha-btn > span:last-child { display: inline-flex; gap: 6px; align-items: center; flex-shrink: 0; }

/* ══════════════════════════════════════════════════════
   MODAL (overlay próprio: não usa .modal-overlay para o Esc
   global do portal.js não fechar sem devolver o foco)
══════════════════════════════════════════════════════ */
.fin-overlay {
  position: fixed; inset: 0; z-index: 1100; display: flex; align-items: center; justify-content: center;
  padding: 16px; background: rgba(0, 0, 0, 0.55); animation: finFade 150ms ease-out both;
}
@keyframes finFade { from { opacity: 0; } to { opacity: 1; } }
.fin-modal { max-width: 480px; max-height: calc(100dvh - 32px); display: flex; flex-direction: column; padding: 0; overflow: hidden; }
.fin-modal--largo { max-width: 720px; }
.fin-modal:focus { outline: none; }
.fin-modal .modal__header { padding: 20px 20px 0; margin-bottom: 12px; gap: 12px; }
.fin-modal .modal__title { overflow-wrap: anywhere; }
.fin-close { width: 40px; height: 40px; }
.fin-modal__form { display: flex; flex-direction: column; min-height: 0; flex: 1; }
.fin-modal__corpo { padding: 0 20px 4px; overflow-y: auto; display: flex; flex-direction: column; gap: 12px; overscroll-behavior: contain; }
.fin-erro { margin: 8px 20px 0; }
.fin-modal__acoes {
  display: flex; gap: 8px; flex-wrap: wrap; align-items: center; padding: 14px 20px 18px; margin-top: 8px;
  border-top: 1px solid var(--border); background: var(--bg-card);
}
.fin-modal__acoes .btn { min-height: 40px; }
.fin-confirm { margin: 0; font-size: 14px; line-height: 1.55; color: var(--text-secondary); }
.fin-btn--perigo { background: var(--danger); color: #fff; }
.fin-btn--perigo:hover:not(:disabled) { background: color-mix(in srgb, var(--danger) 85%, #000); box-shadow: none; }
.fin-btn--texto-perigo { color: var(--danger); }
.fin-btn--texto-perigo:hover:not(:disabled) { color: var(--danger); border-color: var(--danger); }

@media (max-width: 640px) {
  .fin-overlay { padding: 0; align-items: flex-end; }
  .fin-modal, .fin-modal--largo { max-width: none; width: 100%; max-height: 92dvh; border-radius: var(--radius-xl) var(--radius-xl) 0 0; }
  .fin-modal__acoes { padding-bottom: calc(14px + env(safe-area-inset-bottom)); }
  .fin-modal__acoes .fin-spacer { display: none; }
  .fin-modal__acoes .btn { flex: 1 1 auto; }
}
@media (prefers-reduced-motion: reduce) {
  .fin-overlay { animation: none; }
}

/* ── formulário ── */
.fin-field { min-width: 0; }
.fin-row { display: grid; grid-template-columns: 1fr; gap: 12px; }
@media (min-width: 560px) { .fin-row { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); } }
.fin-row[hidden], .fin-field[hidden] { display: none; }
.fin-page .form-input, .fin-modal .form-input { min-height: 42px; }
.fin-check { display: flex; align-items: center; gap: 10px; min-height: 40px; font-size: 13px; color: var(--text-secondary); cursor: pointer; }
.fin-check input { width: 20px; height: 20px; accent-color: var(--accent); flex-shrink: 0; }
.fin-fieldset { border: 1px solid var(--border); border-radius: var(--radius-md); padding: 10px 12px 12px; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.fin-fieldset legend { padding: 0 4px; }
.fin-radios { display: flex; flex-wrap: wrap; gap: 4px 16px; }
.fin-radio { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; font-size: 13px; color: var(--text-secondary); cursor: pointer; }
.fin-radio input { width: 18px; height: 18px; accent-color: var(--accent); }
.fin-seg { margin-bottom: 4px; }
.fin-seg .seg-option { min-height: 40px; font-size: 13px; }
.fin-previa { margin: 0; font-size: 12px; color: var(--accent-text); line-height: 1.5; min-height: 1em; }
.fin-previa:empty { display: none; }
.fin-pagar-fatura .btn { min-height: 42px; margin-top: 4px; }