/*
  dicode.ai — Redimensionar imagem (/redimensionar-imagem): opções e lista do resultado.
  Só os tokens do design system (dicode.css): cantos retos, sem sombra nem gradiente, linhas de
  1px, rótulos e números em Fragment Mono, laranja sempre com texto preto, alvos de 44 px.
  As linhas .resultado-falha são as mesmas nas 4 páginas de imagem (comprimir, redimensionar,
  converter e remover-metadados-foto): mude as quatro juntas.
*/
/* O que está escondido (hidden) fica escondido, mesmo com display de grade ou flex nas classes */
#ferramenta [hidden] { display: none !important; }

.redim-modo { display: grid; gap: 10px; }
.redim-medidas {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: end;
  gap: 8px 12px;
  max-width: 480px;
}
.redim-x { padding-bottom: 13px; font-family: var(--fonte-mono); color: var(--cinza); }
.redim-numero { font-family: var(--fonte-mono); }
.redim-pct-campo { max-width: 260px; }
.redim-prontos { display: grid; gap: 8px; max-width: 560px; }
.redim-pronto { display: flex; }
.redim-pronto > span { flex: 1; flex-wrap: wrap; gap: 2px 10px; }
.redim-pronto .redim-pronto-uso {
  display: inline;
  min-height: 0;
  padding: 0;
  border: 0;
  background: none;
  color: inherit;
  font-weight: 400;
}
.redim-nunca { max-width: 640px; }

/* Imagem que não entrou, na lista "um por um" do resultado */
.resultado-falha { color: var(--preto); }
.resultado-falha-nome { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; font-weight: 600; text-decoration: line-through; text-decoration-thickness: 1px; overflow-wrap: anywhere; }
.resultado-falha-nome::before { content: ''; flex: none; width: 7px; height: 7px; background: var(--laranja); }
.resultado-falha .rotulo { flex: 1 1 260px; padding-bottom: 8px; color: var(--preto); }