/* Correção dos lançamentos de água de bateria — só o que não existe no
   tema/style. Nenhuma classe daqui é lida por app.js: esta página não o carrega.
   O `.conteudo-largo` (52rem) vem do admin.css? Não: cada página traz o seu, e
   aqui ele é redeclarado porque este arquivo não importa aquele. */

.conteudo-largo { max-width: 52rem; }

/* ── Filtros ─────────────────────────────────────────────────────────────── */
/* Em linha no desktop, empilhados no celular. O botão acompanha a última coluna
   e nunca fica órfão numa linha só dele. */
.bp-filtros {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 12px;
}
.bp-filtros .form-group { flex: 1 1 160px; margin: 0; }
.bp-filtros .btn { flex: 0 0 auto; min-height: 48px; }

@media (max-width: 560px) {
  .bp-filtros .form-group,
  .bp-filtros .btn { flex-basis: 100%; }
}

/* ── Linha de lançamento ─────────────────────────────────────────────────── */

.bp-linha {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-card);
  padding: 14px 16px;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.bp-id { min-width: 0; flex: 1 1 240px; }

.bp-placa {
  font-weight: 600;
  font-size: var(--t-base);
  color: var(--ink);
}

/* --ink-2 = 6,2:1. O piso do projeto é 4,8:1 (--ink-3) e texto de apoio não
   desce disso. */
.bp-sub {
  font-size: var(--t-xs);
  color: var(--ink-2);
  overflow-wrap: anywhere;
}
.bp-quem { color: var(--ink-3); }

/* A correção deixa rastro visível: sem isto, um número ajustado pelo PCM ficaria
   indistinguível do que o mecânico mediu no pátio. */
.bp-corrigido { font-style: italic; }

.bp-obs {
  font-size: var(--t-xs);
  color: var(--ink-2);
  margin-top: 4px;
  overflow-wrap: anywhere;
}

/* O tema tem pill-neutro/brand/info/bad, mas não uma variante "ok" — e o
   tema.css é cópia byte a byte do da PreventivasApp, então acrescentar uma lá
   quebraria o diff de sincronia. Fica local, sobre os tokens que já existem.
   Cinza (pill-neutro) diria "sem informação", que é o oposto: nível bom é
   resposta, e boa. #065f46 sobre #ecfdf5 dá 9,4:1. */
.bp-pill-ok { background: var(--ok-bg); color: var(--ok-ink); }

.bp-medida {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
}

.bp-litros {
  font-size: 17px;
  font-weight: 700;
  color: var(--ink);
  font-variant-numeric: tabular-nums;   /* a coluna de números alinha à vista */
}

.bp-foto {
  font-size: var(--t-xs);
  font-weight: 600;
  color: var(--brand-ink);              /* 5,0:1 — âmbar nunca é cor de texto */
  text-decoration: underline;
  /* Alvo de 44px pelo padding: é um link dentro de uma linha, mas a WCAG 2.5.5
     mede a região que aciona, não o desenho. Precisa dos DOIS eixos — a palavra
     "foto" tem 24px de largura, e a auditoria pegou exatamente isso. */
  display: inline-block;
  min-height: 44px;
  min-width: 44px;
  padding-block: 13px;
  padding-inline: 10px;
  text-align: center;
}

.bp-acoes {
  display: flex;
  gap: 8px;
  flex: 0 0 auto;
}
.bp-btn { min-height: 44px; padding-inline: 14px; }
/* Apagar não é vermelho em repouso, pela mesma razão do "Remover bateria" na
   tela do mecânico: um vermelho presente em toda linha vira o normal da tela. */
.bp-btn-apagar:hover,
.bp-btn-apagar:focus-visible { color: var(--bad-ink); border-color: var(--bad-line); }

/* ── Modal de correção ───────────────────────────────────────────────────── */
/* O modal tem seis campos e precisa caber num celular deitado. Teto + rolagem
   por dentro: foi a correção que o seletor do quadro recebeu em 2026-08-09,
   quando ele apareceu recortado nas duas pontas e ficou sem saída. */
#modalEditar .modal-caixa {
  display: flex;
  flex-direction: column;
  max-height: calc(100dvh - 48px);
  overflow-y: auto;
  text-align: left;
}
#modalEditar .modal-titulo,
#modalEditar .modal-botoes { flex: none; }