/* Importando a fonte Roboto */
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');

/* Aplicando Roboto como fonte padrão */
body {
  font-family: 'Roboto', sans-serif;
}

/* Estilo minimalista e ultra-compacto para inputs, selects e textareas */
.form-control.form-control-sm {
  padding: 0.1rem 0.3rem; /* Padding ainda menor para reduzir o tamanho */
  font-size: 0.7rem; /* Fonte ainda menor para maior discrição */
  height: auto; /* Altura ajustável ao conteúdo */
  border: 1px solid #e0e0e0; /* Borda muito leve e discreta */
  border-radius: 0.2rem; /* Cantos levemente arredondados */
  background-color: #fafafa; /* Fundo muito claro e suave */
  color: #444; /* Cor de texto neutra e legível */
  font-family: 'Roboto', sans-serif; /* Fonte moderna e limpa */
  box-shadow: none; /* Sem sombra para um visual mais plano */
  transition: border-color 0.2s ease-in-out; /* Transição suave para interatividade */
}

/* Estilo para inputs inválidos */
.form-control.form-control-sm.is-invalid {
  border-color: #dc3545 !important; /* Força a cor de borda vermelha quando o input é inválido */
}

/* Estilo para mensagens de feedback inválido */
.invalid-feedback {
  color: #dc3545; /* Cor de texto vermelha para feedback */
  font-size: 0.75rem; /* Tamanho menor para o texto de feedback */
  margin-top: 0.2rem; /* Espaçamento acima da mensagem */
}

/* Efeito ao focar no input */
.form-control.form-control-sm:focus {
  border-color: #ccc; /* Borda ligeiramente mais escura ao focar */
  outline: none; /* Remove o contorno padrão do navegador */
  background-color: #fff; /* Fundo branco ao focar para destacar */
}
/* Reduzindo altura e espaçamento de botões */
.btn-sm {
  padding: 0.2rem 0.4rem; /* Altura reduzida */
  font-size: 0.8rem; /* Fonte menor */
  border-radius: 0.2rem;
  font-family: 'Roboto', sans-serif;
}

/* Removendo sombras e ajustando bordas */
.form-control, .btn {
  box-shadow: none;
}

/* Estilo de foco minimalista */
.form-control:focus, .btn:focus {
  box-shadow: none;
  border-color: #8FBC8F;
}

/* Inputs e selects com borda mais suave */
.form-control {
  border: 1px solid #ddd;
}

/* Ajustando margens */
.form-group {
  margin-bottom: 0.5rem; /* Margem inferior menor */
}

/* Para selects */
select.form-control-sm {
  height: auto;
  padding-right: 1.2rem; /* Ajuste para ícones no select */
}

/* Para evitar que elementos ocupem muita largura */
.form-control {
  max-width: 100%;
}

/* Placeholder mais discreto */
::placeholder {
  color: #aaa;
  font-style: italic;
}

/* Estilo minimalista para tabelas */
.table {
  border-collapse: collapse;
  width: 100%;
  font-size: 0.8rem; /* Fonte menor */
  color: #333;
  font-family: 'Roboto', sans-serif;
}

/* Removendo bordas pesadas e ajustando linhas */
.table th, .table td {
  padding: 0.35rem; /* Altura reduzida */
  text-align: left;
}

/* Fundo sutil para o cabeçalho */
.table thead th {
  background-color: #8FBC8F;
  color: #fff;
  font-weight: bold;
  border-bottom: 2px solid #ccc;
  padding: 0.4rem; /* Altura reduzida para o cabeçalho */
}

/* Alternância de cores nas linhas */
.table tbody tr:nth-child(odd) {
  background-color: #f9f9f9;
}

.table tbody tr:nth-child(even) {
  background-color: #ffffff;
}

/* Efeito de hover */
.table tbody tr:hover {
  background-color: #e9ecef;
}

/* Alinhamento do texto no cabeçalho */
.table th {
  text-transform: uppercase;
  font-size: 0.7rem; /* Fonte ainda menor para cabeçalhos */
  color: #555;
  letter-spacing: 0.05em;
}

/* Ajuste para bordas arredondadas na tabela */
.table {
  border-radius: 0.25rem;
  overflow: hidden;
}

/* Removendo bordas laterais se houver overflow */
.table-container {
  overflow-x: auto;
}

/* Para células numéricas */
.table td.number, .table th.number {
  text-align: right;
}

/* Links na tabela */
.table a {
  color: #8FBC8F;
  text-decoration: none;
}

.table a:hover {
  text-decoration: underline;
}

label {
    font-size: 0.75rem; /* Fonte menor */
    font-weight: bold;
}

span {
    font-size: 0.8rem; /* Fonte menor */
    color: #8b0000;
}

.link {
  color: #333;
  text-decoration: none;
}

.link:hover {
  color: #92b7e7;
  text-decoration: underline;
}

.icon1 {
  color: #333;
}

.icon1:hover {
  color: #92b7e7;
}

.icon2 {
  color: #333;
}

.icon2:hover {
  color: #ff0000;
}