/*
  dicode.ai — Converter imagem (/converter-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; }

.conv-cor { max-width: 260px; }
.conv-cor-entrada {
  width: 96px;
  height: 44px;
  padding: 4px;
  border: 1px solid var(--preto);
  border-radius: 0;
  background: var(--branco);
  cursor: pointer;
}
.conv-cor-entrada::-webkit-color-swatch-wrapper { padding: 0; }
.conv-cor-entrada::-webkit-color-swatch { border: 1px solid var(--linha); border-radius: 0; }
.conv-cor-entrada::-moz-color-swatch { border: 1px solid var(--linha); border-radius: 0; }
.conv-cor-entrada:focus-visible { outline: 2px solid var(--preto); outline-offset: 2px; }

/* 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); }