/* Estiliza o formulário de filtro */
body{
    font-family: Poppins, sans-serif;
}
form {
    display: flex;
    flex-direction: row;
    align-items: center;
    
    gap: 8px;
    flex-wrap: wrap; /* Permite quebra de linha em telas menores */
    /* margin-bottom: 20px; */
    justify-content: center;
}

form label {
    font-family: Poppins, sans-serif;
    font-size: 16px;
    margin-right: 3px;
    color: #2B161B;
}

form input[type="date"],
form select {
    font-family: Poppins, sans-serif;
    padding: 8px;
    font-size: 12px;
    border-radius: 5px;
    border: 1px solid #747474;
    max-width: 120px; /* Limita o tamanho para input e select */
    width: 100%;
}

form button,
form .btnMostrarTodos {
    font-family: Poppins, sans-serif;
    padding: 7px 7px;
    background-color: #c10000;
    color: white;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-size: 16px;
    transition: background-color 0.3s;
    width: 100%;
    max-width: 120px; /* Limita o tamanho do botão */
}
form button {
    max-width: 120px; /* Limita o tamanho do botão */
    font-size: 14px;
    font-weight: 500;
}

form button:hover,
form .btnMostrarTodos:hover {
    background-color: #900000;
}
table {
    border: 1px solid black;
    border-collapse: collapse;
    background-color: #f5f5f5;
    width: 100%;
    margin-bottom: 20px;
}
#tabela {
    display: flex;
    justify-content: center;
}
/* Estilos gerais para a tabela */
.tabelaEventos {
    border: 1px solid black;
    align-items: center;
    justify-content: center;
    margin: 20px 0;
    font-size: 12px; /* Fonte menor para mais eventos visíveis */
    border-radius: 6px;
}
table {
    border-collapse: collapse;
    width: 100%;
    margin: 0 auto;
    border: 1px solid #ddd;
    border-radius: .3rem;
    overflow: hidden;
}
.tabelaEventos th,
.tabelaEventos td {
    padding: 12px;
    text-align: left;
    /* border: 1px solid #ddd; */
    /* border-radius: .3rem; */
}

/* Cabeçalho */
.tabelaEventos th {
    background-color: #c10000; /* Vermelho escuro */
    color: white;
    font-weight: bold;
}

/* Linhas alternadas */
.tabelaEventos tr:nth-child(even) {
    background-color: #f2f2f2;
}

.tabelaEventos tr:nth-child(odd) {
    background-color: white;
}

.tabelaEventos tr:hover {
    background-color: #d3d3d3;
}
.tabelaEventos td {
 color: rgb(78, 78, 78);
}
/* Estilos das colunas */
.anoCol,
.mesCol,
.dataInicioCol,
.dataTerminoCol,
.orgaoCol {
    width: 7%;
}

.dataInicioCol,
.dataTerminoCol {
    width: 15%;
}

.tituloCol {
    width: 50%;
}

.tituloRow {
    max-width: 300px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
}

/* Estilos responsivos */
@media (max-width: 768px) {
    .tabelaEventos th,
    .tabelaEventos td {
        font-size: 12px;
        padding: 8px;
    }

    .tituloRow {
        max-width: 150px;
    }

    form {
        flex-direction: column; /* Coloca os campos de filtro em coluna */
        align-items: stretch; /* Para que os campos ocupem a largura total */
    }

    form input[type="date"],
    form select,
    form button,
    form .btnMostrarTodos {
        max-width: 100%; /* Torna os elementos do formulário responsivos */
    }
}
div#filtroEtapas {
    display: flex;
    font-weight: 600;
    align-items: center;
    justify-content: center;
    font-family: Poppins, sans-serif;
}
div#filtrosGerais {
    display: flex;
    align-items: center;
    font-weight: 600;
    justify-content: center;
    font-family: Poppins, sans-serif;
}
div.botoesCategorias {
    display: flex;
    align-items: center;
    justify-content: center; 
    gap: 12px;
}
div.botoesCategorias a {
    font-size: 14px;
    font-weight: 500;
    color: #ffffff;
    background-color: #c10000;
    padding: 10px 15px;
    text-decoration: none;
    border-radius: 5px;
    display: inline-block;
}


div.botoesCategorias .btnMostrarTodos {
    color: #ffffff;
    background-color: #dd9300;
    padding: 10px 15px;
    text-decoration: none;
    border-radius: 5px;
}


div.botoesCategorias a:hover {
    background-color: #e60000;
    transform: scale(1.1);
}

div.botoesCategorias a.ativo {
    background-color: #ff0707;
    cursor: default;
}

/* Estilos para a navegação de páginas */
.navegacaoPaginas {
    font-size: 16px;
    text-align: center;
    margin-top: 20px;
}

.navegacaoPaginas a {
    display: inline-block;
    margin: 0 5px;
    padding: 6px 14px;
    background-color: #c10000;
    color: white;
    text-decoration: none;
    border-radius: 5px;
    font-weight: bold;
    transition: background-color 0.3s, transform 0.2s ease;
}

.navegacaoPaginas a:hover {
    background-color: #e60000;
    transform: scale(1.1);
}

.navegacaoPaginas a.ativo {
    background-color: #900000;
    cursor: default;
}

.navegacaoPaginas a:active {
    background-color: #660000;
}

@media (max-width: 480px) {
    .tabelaEventos th,
    .tabelaEventos td {
        font-size: 10px;
        padding: 6px;
    }

    .tituloRow {
        max-width: 120px; /* Ajuste para melhorar a visualização em telas pequenas */
    }
    Análise da documentação apresentada para formalização de instrumento jurídico - DOCUMENTAÇÃO ENTREGUE ATÉ 20/02/2024.
    form {
        padding: 10px;
    }

    .navegacaoPaginas a {
        padding: 6px 12px;
        font-size: 14px;
    }
}
/* Centraliza os checkboxes de exclusão e seus cabeçalhos */
.tabelaEventos th:first-child, 
.tabelaEventos td:first-child {
    text-align: center;      /* Centraliza o conteúdo horizontalmente */
    vertical-align: middle;  /* Alinha verticalmente no meio da célula */
    width: 40px;             /* Define uma largura fixa para a coluna de seleção */
}

/* Garante que o input (o quadrado) se comporte como bloco para respeitar o alinhamento */
.tabelaEventos td:first-child input[type="checkbox"] {
    margin: 0 auto;
    display: block;
}