/* FUTNEX 1.9.70 · folha "i" (informações) do lote do leilão (módulo ui70a, CONTRATO §3.2). Nos dois visuais (novo `html.ui68` e clássico), celular e PC.
   A folha (`.lei-info-f`, fx-geral infoHtml) reaproveitava a grade `.mk-sheet` da folha de LANCE (104px | 1fr, carta em 4 linhas, 4 <p> na coluna 2): no visual novo a carta ficava numa
   coluna estreita, "Leiloado por" sozinho ao lado e Força/Nível/Melhoria caíam embaixo, desalinhados. Aqui a folha de informação ganha regras PRÓPRIAS (a folha de lance não é tocada):
   a carta fica centralizada no topo, "Leiloado por …" centralizado logo abaixo, Força / Nível / Melhoria numa linha de 3 blocos centralizada (no celular estreito quebra centralizada) e
   depois vêm Atributos e Habilidade como sempre. Nenhuma informação sai (as barras da carta e a seção Atributos ficam). Também: o "i" fica quadrado de 44, a folha não passa a rolagem
   para o fundo (overscroll-behavior) e "Voltar ao lance" encosta no fim da folha. */

/* ------------------------------------------------------------ o botão "i" (lista e folha de lance): alvo de toque 44 x 44 quadrado nos dois visuais (o clássico media 34 x 44 na lista e 30 x 44 na folha de lance;
   o visual novo já era 44 x 44, então nada muda nele) */
html .btn.lei-info, html .mk-sheet-txt p .btn.lei-info {
  width: 44px; min-width: 44px; height: 44px; min-height: 44px; padding: 0; box-sizing: border-box;
}

/* ------------------------------------------------------------ a folha: sem encadeamento de rolagem; a calha da barra de rolagem é simétrica (o conteúdo fica no centro da folha também no PC) */
html .sheet:has(.lei-info-f) { overscroll-behavior: contain; scrollbar-gutter: stable both-edges; }
html .sheet:has(.lei-info-f .actions.sticky) { padding-bottom: 0; }          /* com "Voltar ao lance" o espaço de baixo passa a ser da própria barra (abaixo) */

/* ------------------------------------------------------------ carta + "Leiloado por" + estatísticas: uma coluna centralizada */
html .lei-info-f .mk-sheet {
  display: flex; flex-direction: column; align-items: center; justify-content: flex-start; gap: 14px;
  margin: 8px 0 4px; padding: 0; text-align: center;
}
html .lei-info-f .mk-sheet .stk { flex: none; width: 150px; max-width: 100%; margin: 0 auto; grid-column: auto; grid-row: auto; }
html.ui68 .lei-info-f .mk-sheet .stk { width: 132px; }
html .lei-info-f .mk-sheet-txt {
  display: flex; flex-direction: column; align-items: center; gap: 12px; width: 100%; min-width: 0; margin: 0; padding: 0; text-align: center;
}
html .lei-info-f .mk-sheet-txt > * { grid-column: auto; min-width: 0; margin: 0; }
html .lei-info-f .mk-sheet-txt > p { width: 100%; text-align: center; overflow-wrap: anywhere; }

/* Força · Nível · Melhoria: 3 blocos centralizados (rótulo em cima, número embaixo); em tela estreita quebram e a última linha também fica centralizada */
html .lei-info-f .lei-info-n {
  list-style: none; display: flex; flex-wrap: wrap; justify-content: center; align-items: stretch; gap: 8px; width: 100%; margin: 0; padding: 0;
}
html .lei-info-f .lei-info-n li {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; flex: 0 1 auto;
  min-width: 88px; max-width: 100%; padding: 8px 12px 9px; box-sizing: border-box; text-align: center;
  border: 1px solid var(--line); border-radius: 12px; background: var(--panel-2);
}
html .lei-info-f .lei-info-n li > span { min-width: 0; text-align: center; }
html .lei-info-f .lei-info-n b { font-size: 22px; line-height: 1; text-align: center; font-variant-numeric: tabular-nums; }
html .lei-info-f .lei-info-n em { display: block; max-width: 12ch; margin: 0; text-align: center; line-height: 1.25; white-space: normal; }

/* ------------------------------------------------------------ "Voltar ao lance": a barra encosta no fim da folha (hoje sobrava um vão de 24–29 px com o texto aparecendo por baixo)
   A folha perde o `padding-bottom` (regra acima) e a barra leva o espaço (mais a área segura do aparelho) no próprio padding, com o fundo da folha. */
html .lei-info-f .actions.sticky {
  position: sticky; bottom: 0; z-index: 3; margin: 12px -16px 0; padding: 10px 16px calc(env(safe-area-inset-bottom, 0px) + 14px);
  background: var(--panel, var(--u-s1));
}
html .lei-info-f .actions.sticky .btn { width: 100%; }
