

/* Estilo base para todos os selects */
.select-pequeno,
.select-medio,
.select-grande,
.select-linha {
  border: 1px solid #ccc;
  border-radius: 25px; /* Ajusta o arredondamento da borda */
  background-color: #fff;
  cursor: pointer;
  outline: none;
  color: #333;
}

/* Esconde a seta padrão */
.select-pequeno,
.select-medio,
.select-grande,
.select-linha {
  /* ... (estilos acima) ... */
  
  /* Esconde a seta nativa em navegadores Webkit (Chrome, Safari) */
  -webkit-appearance: none;
  /* Esconde a seta nativa em Firefox */
  -moz-appearance: none;
  /* Esconde a seta nativa (padrão) */
  appearance: none;

  /* Adiciona a seta customizada como background-image */
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23555' class='bi bi-chevron-down' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 25px center; /* Esta é a linha que você vai ajustar */
  background-size: 10px; /* Tamanho da seta */
}

/* Opcional: Estilo para Internet Explorer 10+ */
.select-pequeno::-ms-expand,
.select-medio::-ms-expand,
.select-grande::-ms-expand,
.select-linha::-ms-expand {
  display: none;
}


/* Estilos para todos os selects */
.select-pequeno,
.select-medio,
.select-grande,
.select-linha {
  /* Esconde a seta nativa */
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  
  /* Estilos de borda, cor e fonte */
  border: 1px solid #ccc;
  border-radius: 30px;
  background-color: #fff;
  cursor: pointer;
  outline: none;
  color: #333;
  
  /* Adiciona a seta customizada como imagem de fundo */
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23555' class='bi bi-chevron-down' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 25px center; /* Ajuste este valor para mover a seta */
  background-size: 10px;
}

/* Esconde a seta para o Internet Explorer */
.select-pequeno::-ms-expand,
.select-medio::-ms-expand,
.select-grande::-ms-expand,
.select-linha::-ms-expand {
  display: none;
}



:root {
  --borda-arredondada: 30px; /* Altere conforme o padrão do seu framework */
}

/* Input arredondado */
.input-custom-arredondado {
  border-radius: var(--borda-arredondada);
}

/* Select arredondado */
.select-custom-arredondado {
  border-radius: var(--borda-arredondada);
}

/* Textarea usa a mesma classe dos inputs */
textarea.input-custom-arredondado {
  resize: vertical;
}

/* Checkbox arredondado */
.checkbox-custom-arredondado {
  border-radius: 50%;
}

/* Radio arredondado */
.radio-custom-arredondado {
  border-radius: 50%;
}








/* ---------- INPUTS ---------- */
.input-custom-pequeno {
  padding: 0.8rem 1.5rem;
  font-size: 1rem;
  border-radius: 30px;
  border: 1px solid #ccc;
}

.input-custom-medio {
  padding: 1.3rem 2rem;
  font-size: 1.2rem;
  border-radius: 2rem;
  border: 1px solid #ccc;
}

.input-custom-grande {
  padding: 1.3rem 3.5rem;
  font-size: 1.3em;
  border-radius: 2rem;
  border: 1px solid #ccc;
}

.input-custom-linha{
  width:97%;
  padding: 0.3rem 1.1rem;
  font-size: 1rem;
  border-radius: 30px;
  border: 1px solid #ccc;
  height: 45px;
}

/* ---------- SELECTS ---------- */
.select-pequeno {
  padding: 0.7rem 2.5rem;
  font-size: 1rem;
  border-radius: 30px;
  border: 1px solid #ccc;
}

.select-medio {
  padding: 0.9rem 2.8rem;
  font-size: 1.1rem;
  border-radius: 30px;
  border: 1px solid #ccc;
}

.select-grande {
  padding: 1.1rem 3.9rem;
  font-size: 1.2rem;
  border-radius: 30px;
  border: 1px solid #ccc;
}

.select-linha {
  padding: 0.7rem 1.5rem;
  font-size: 1rem;
  border-radius: 30px;
  border: 1px solid #ccc;
  width: 95%;
    height: 45px;

}
/* ---------- TEXTAREA ---------- */


.input-custom-area {
  width: 97%;
  padding: 14px 18px;
  font-size: 1.1rem;
  border-radius: 14px;
  border: 1px solid #ccc;
}



.arquivo-pequeno{
  padding: 0.7rem;
  font-size: 1rem;
  border-radius: 30px;
  border: 1px solid #ccc;
  width: 300px;
  background: #f8f9fa;

}


.arquivo-linha{
  font-size: 1rem;
  border-radius: 30rem;
  border: 1px solid #ccc;
  width: 97%;
  background: #f8f9fa;

}



.arquivo-medio{
  padding: 1rem;
  font-size: 1.12rem;
  border-radius: 30px;
  border: 1px solid #ccc;
  width: 500px;
  background: #f8f9fa;

}

.arquivo-grande{
  padding: 1.4rem;
  font-size: 1.24rem;
  border-radius: 50px;
  border: 1px solid #ccc;
  width: 800px;
  background: #f8f9fa;
}

