/* Container principal do li para usar Flexbox */
li.not-completed {
	display: flex;
	align-items: flex-start; /* Alinha os itens no topo */
	gap: 10px; /* Espaçamento entre os elementos */
  }
  
  /* <p> ocupa 20% do espaço */
  li.not-completed p {
	flex: 0 0 20%; /* Fixa o p em 20% */
	margin: 0; /* Remove o espaçamento padrão */
  }
  
  /* Container para textarea e small */
  .qtd_caracteres {
	flex: 1; /* Ocupa o restante do espaço (80%) */
	display: flex;
	flex-direction: column; /* Coloca o textarea acima do small */
	align-items: flex-end; /* Alinha o small à direita */
	width: 100%; /* Garante que o conteúdo ocupe o espaço total */
  }
  
  /* Estiliza o textarea */
  .qtd_caracteres textarea {
	width: 100%; /* Ocupa todo o espaço disponível */
	margin-bottom: 5px; /* Espaçamento abaixo do textarea */
	resize: vertical; /* Permite redimensionamento apenas vertical */
  }
  
  /* Estiliza o <small> */
  .qtd_caracteres small {
	align-self: flex-start; /* Alinha o small à direita */
	font-size: 12px; /* Ajuste o tamanho da fonte conforme necessário */
	color: #555; /* Cor para diferenciar do textarea */
  }