/* Ajustes para a tabela de solicitações */
.table {
    width: 100%; /* Tabela ocupa 100% da largura da tela */
    margin: 0 auto;
    font-size: 0.85rem; /* Diminuindo o tamanho da fonte para tornar a tabela mais compacta */
    table-layout: fixed; /* Força o ajuste de largura das colunas */
}

.table th, .table td {
    text-align: center;
    vertical-align: middle;
    padding: 0.5rem; /* Reduzindo o padding para as células */
}

.table td {
    word-wrap: break-word;
}

/* Ajustando a coluna de ações */
.table td.text-nowrap {
    white-space: nowrap;
    min-width: 180px; /* Aumenta a largura mínima da coluna de Ações */
}

/* Estilo dos botões */
.btn-sm {
    padding: 0.3rem 0.5rem;
    font-size: 0.75rem;
    border-radius: 5px;
}

.btn-outline-warning,
.btn-outline-danger {
    padding: 0.3rem 0.5rem;
}

.btn i {
    font-size: 1rem;
}

/* Ajustando os ícones de editar e remover */
.btn i {
    font-size: 1rem; /* Reduzindo o tamanho do ícone */
}

/* Estilo dos botões de editar e remover */
.btn-warning,
.btn-danger {
    padding: 0.3rem 0.5rem; /* Ajuste do padding para menor tamanho */
    font-size: 0.75rem; /* Menor tamanho para o texto */
}

.btn-warning i,
.btn-danger i {
    font-size: 1rem; /* Ícones ajustados */
}

/* Estilo do botão de download */
.btn-download {
    font-size: 0.75rem; /* Tamanho do botão */
    padding: 0.3rem 0.5rem;
    background-color: #28a745; /* Cor verde */
    border-color: #28a745;
}

.btn-download:hover {
    background-color: #218838;
    border-color: #1e7e34;
}

/* Media Query para telas maiores que 768px (PC, tablets em modo paisagem) */
@media (min-width: 768px) {
    form {
        width: 75%;  /* Aumenta o tamanho do formulário para 75% da largura da tela */
    }

    .table {
        width: 70%; /* Ajuste da tabela para maior largura em telas grandes */
    }
}

/* Media Query para telas menores que 768px (celulares e tablets em modo retrato) */
@media (max-width: 767px) {
    form {
        width: 100%;  /* Mantém o tamanho atual no celular */
    }

    .table {
        width: 100%; /* Tabela vai ocupar 100% da largura da tela */
    }
}

.form-container {
    max-width: 400px;
    margin: 40px auto 0;
    padding: 1.5rem 1.25rem;
    border: 1px solid #ccc;
    border-radius: 10px;
    background-color: #f9f9f9;
    box-shadow: 0 0 10px rgba(0,0,0,0.05);
    display: flex;
    flex-direction: column;
    align-items: center; /* Centraliza todos os elementos filhos */
    box-sizing: border-box;
    text-align: center;
}

.form-container form {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center; /* Centraliza inputs e botão */
}

.form-container .form-group {
    width: 100%;
    max-width: 300px; /* Limita largura de cada grupo */
    margin-bottom: 1rem;
    text-align: left;  /* Alinha o label à esquerda */
}

.form-container label {
    display: block;
    margin-bottom: 0.25rem;
}

.form-container .form-control,
.form-container button {
    width: 100%;
    text-align: center;
}

.destaque-titulo {
    border: 1px solid #ccc;
    border-radius: 10px;
    box-shadow: 0 0 10px rgba(0,0,0,0.05);
    background-color: #f1f1f1;  /* Cor de fundo suave */
    padding: 10px 20px;          /* Espaçamento interno */
    text-align: center;          /* Centraliza o texto */
    font-weight: bold;           /* Negrito no título */
    color: #333;                 /* Cor do texto */
    border-radius: 5px 5px 0 0;  /* Bordas arredondadas na parte superior */
    margin: 0 auto;         /* Centraliza a área e dá um espaçamento abaixo */
    width: calc(70%);    /* Ajusta a largura para 100% menos o padding do container */
}


/* Responsivo */
@media (max-width: 767px) {
    .form-container {
        width: 90%;
    }
}