/* ==========================================================================
   1. CONFIGURAÇÕES GERAIS E TRANSIÇÃO (FOUC)
   ========================================================================== */
/* Esconde os botões originais no topo da tabela */
.dataTables_wrapper .dt-buttons { display: none !important; }

/* Esconde o container inteiro fisicamente até o JS liberar */
#container-tabela-emendas { display: none; }

/* ==========================================================================
   2. TELA DE CARREGAMENTO (SPINNER)
   ========================================================================== */
#loading-emendas { 
    text-align: center; 
    padding: 60px; 
    background: #fdfdfd; 
    border: 1px solid #eee; 
    border-radius: 10px; 
}
.spinner-emendas {
    width: 3.5rem; 
    height: 3.5rem; 
    border: 0.3em solid #055f7c; 
    border-right-color: transparent; 
    border-radius: 50%; 
    display: inline-block; 
    animation: spin-loading .75s linear infinite; 
}
@keyframes spin-loading { 
    to { transform: rotate(360deg); } 
}

/* ==========================================================================
   3. CONTAINERS E LAYOUT BASE
   ========================================================================== */
.emendas-box { 
    background: #fff; 
    padding: 0px; 
    margin-bottom: 30px; 
}
.filter-container { 
    background: #f8f9fa; 
    padding: 15px; 
    border-radius: 8px; 
    border: 1px solid #dee2e6; 
    margin-bottom: 20px; 
}

/* ==========================================================================
   4. BADGES (ORIGEM DA EMENDA)
   ========================================================================== */
.badge-FEDERAL { background: #28a745 !important; color: #fff !important; padding: 4px 8px; border-radius: 4px; display: inline-block; }
.badge-ESTADUAL { background: #055f7c !important; color: #fff !important; padding: 4px 8px; border-radius: 4px; display: inline-block; }
.badge-MUNICIPAL { background: #ffc107 !important; color: #000 !important; padding: 4px 8px; border-radius: 4px; display: inline-block; }

/* ==========================================================================
   5. TIPOGRAFIA E ELEMENTOS MENORES
   ========================================================================== */
#mainTableEmendas td { font-size: 1rem; }
#filtroAno, #filtroOrigem, #filtroSituacao { font-size: 0.9rem; }
#botoesExportacao { font-size: 0.9rem; }
.export-label { font-weight: bold; margin-right: 10px; vertical-align: middle; }

/* ==========================================================================
   6. BOTÕES DE EXPORTAÇÃO (RESPONSIVIDADE E ESTILO)
   ========================================================================== */
/* ESTILO BASE (Mobile First) - Botões separados e fluidos */
.dt-buttons.btn-group { 
    display: flex !important; 
    flex-wrap: wrap; 
    gap: 6px !important; /* Espaçamento entre botões no celular */
    vertical-align: middle; 
    width: 100%;
}
.dt-buttons.btn-group .btn { 
    border: none !important; 
    font-size: 0.85rem; 
    padding: 6px 12px; 
    border-radius: 4px !important; /* Todos arredondados no mobile */
    flex: 1 1 auto; /* Botões crescem para preencher espaços vazios */
    text-align: center;
    margin: 0 !important;
}
.dt-buttons.btn-group .btn:hover { 
    z-index: 1; 
    filter: brightness(1.1);
}

/* LINKS */
a.text-info { color: #055f7c !important; }
a.text-info:focus, a.text-info:hover {
    color: #055f7c !important;
    text-decoration: underline;
}

/* Remove a borda azul e a sombra nativa de focus do Bootstrap 4 */
.page-item .page-link:focus,
.page-link:focus,
.dataTables_wrapper .dataTables_paginate .paginate_button:focus,
.dataTables_wrapper .dataTables_paginate .paginate_button:active {
    outline: none !important;
    box-shadow: none !important;
}

/* ESTILO DESKTOP (Apenas telas maiores que 768px) - Estilo colado original */
@media (min-width: 768px) {
    .dt-buttons.btn-group { 
        display: inline-flex !important; 
        flex-wrap: nowrap; 
        gap: 0 !important; /* Tira o espaçamento */
        width: auto;
    }
    .dt-buttons.btn-group .btn { 
        flex: none; 
        border-radius: 0 !important; /* Remove arredondamento individual */
        position: relative; 
    }
    /* Arredonda apenas as extremidades do grupo */
    .dt-buttons.btn-group .btn:first-child { border-top-left-radius: 4px !important; border-bottom-left-radius: 4px !important; }
    .dt-buttons.btn-group .btn:last-child { border-top-right-radius: 4px !important; border-bottom-right-radius: 4px !important; }
    
    /* Divisória interna elegante (apenas no desktop) */
    .dt-buttons.btn-group .btn:not(:last-child)::after {
        content: ""; 
        position: absolute; 
        right: 0; 
        top: 20%; 
        height: 60%; 
        width: 1px; 
        background-color: rgba(255, 255, 255, 0.4); 
    }
}