/* AF — anexos nos andamentos — 13/08/2026 (rev. c: arrastar e soltar)
   Botão de anexar no formulário de andamento e as etiquetas dos documentos
   dentro de cada cartão da linha do tempo. */

.afn-anexos {
  display: flex;
  flex-direction: column;
  gap: .5rem;
  margin-bottom: .75rem;
}
.afn-compacto { margin-bottom: 0; }

.afn-barra {
  display: flex;
  align-items: center;
  gap: .625rem;
  flex-wrap: wrap;
}

.afn-botao {
  display: inline-flex;
  align-items: center;
  gap: .375rem;
  border-radius: 9999px;
  border: 1px dashed hsl(var(--border));
  background: hsl(var(--background));
  color: hsl(var(--muted-foreground));
  font-size: .8125rem;
  font-family: inherit;
  padding: .3125rem .875rem;
  cursor: pointer;
  transition: color .12s, border-color .12s, background-color .12s;
}
.afn-botao:hover:not(:disabled) {
  color: hsl(var(--foreground));
  border-color: hsl(var(--foreground) / .35);
  background: hsl(var(--muted) / .5);
}
.afn-botao:disabled { opacity: .6; cursor: progress; }

.afn-clipe { width: .875rem; height: .875rem; flex: 0 0 auto; }

.afn-conta { font-size: .75rem; color: hsl(var(--muted-foreground)); }

.afn-input { display: none; }
/* área de soltar arquivos */
.afn-anexos {
  border-radius: .625rem;
  transition: background-color .12s, box-shadow .12s;
}
.afn-anexos.afn-arrastando {
  background: hsl(var(--primary) / .06);
  box-shadow: 0 0 0 2px hsl(var(--primary) / .45);
  padding: .5rem;
}
.afn-anexos.afn-arrastando .afn-dica { color: hsl(var(--primary)); font-weight: 500; }

.afn-dica {
  font-size: .6875rem;
  color: hsl(var(--muted-foreground));
}
@media (hover: none) {
  /* em celular não existe arrastar do computador */
  .afn-dica { display: none; }
}


/* ---------- lista dentro do formulário ---------- */
.afn-lista {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: .25rem;
}
.afn-lista li {
  display: flex;
  align-items: center;
  gap: .5rem;
  font-size: .8125rem;
  border: 1px solid hsl(var(--border));
  border-radius: .5rem;
  padding: .3125rem .5rem .3125rem .625rem;
  background: hsl(var(--background));
}
.afn-nome {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: hsl(var(--primary));
  text-decoration: none;
}
a.afn-nome:hover { text-decoration: underline; }
.afn-tam { font-size: .6875rem; color: hsl(var(--muted-foreground)); flex: 0 0 auto; }
/* chave que libera o documento para o Portal da Família */
.afn-portal {
  display: inline-flex;
  align-items: center;
  gap: .3125rem;
  flex: 0 0 auto;
  font-size: .6875rem;
  color: hsl(var(--muted-foreground));
  cursor: pointer;
  user-select: none;
  white-space: nowrap;
}
.afn-portal input { width: .8125rem; height: .8125rem; cursor: pointer; margin: 0; }
.afn-portal:hover { color: hsl(var(--foreground)); }

.afn-x {
  flex: 0 0 auto;
  background: none; border: 0; cursor: pointer;
  font-size: 1.0625rem; line-height: 1;
  color: hsl(var(--muted-foreground));
  padding: 0 .125rem;
}
.afn-x:hover { color: hsl(var(--destructive)); }

/* ---------- etiquetas no cartão do andamento ---------- */
.afn-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .375rem;
  margin-top: .5rem;
}
.afn-chip {
  display: inline-flex;
  align-items: center;
  gap: .3125rem;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: .75rem;
  border-radius: 9999px;
  border: 1px solid hsl(var(--border));
  background: hsl(var(--muted));
  color: hsl(var(--foreground));
  padding: .1875rem .625rem;
  text-decoration: none;
}
.afn-chip:hover { background: hsl(var(--accent)); }
.afn-chip svg { width: .75rem; height: .75rem; flex: 0 0 auto; opacity: .75; }
