#loader-overlay {
    position: fixed; inset: 0; z-index: 9999;
    background: rgba(255, 255, 255, 0.7); backdrop-filter: blur(4px);
    display: flex; align-items: center; justify-content: center;
    transition: opacity 0.4s ease-out, visibility 0.4s;
}

.loader-hidden { opacity: 0; visibility: hidden; }

@keyframes spin { 
    to { transform: rotate(360deg); } 
}

.spinner {
    width: 50px; height: 50px;
    border: 4px solid #f3f3f3;
    border-top: 4px solid #3B82F6;
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

.fade-up { 
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

.fade-up.active { 
    opacity: 1; 
    transform: translateY(0); 
}

#area_totais {
    margin-top: 0px !important;
    margin-bottom: -13px !important;
}

#lista {
    margin-top: 0px !important;
}

#form_pesquisa {
    padding: 12px 14px;
}

#area_filtros_psequisa {
    margin-bottom: -13px;
    
}

/* Animações e Loader integrados baseados no padrão de fm_fornecedores */
    #loader-overlay {
        position: fixed; inset: 0; z-index: 9999;
        background: rgba(255, 255, 255, 0.7); backdrop-filter: blur(4px);
        display: flex; align-items: center; justify-content: center;
        transition: opacity 0.4s ease-out, visibility 0.4s;
    }
    .loader-hidden { opacity: 0; visibility: hidden; }
    
    @keyframes spin { 
        to { transform: rotate(360deg); } 
    }
    
    .spinner {
        width: 50px; height: 50px;
        border: 4px solid #f3f3f3;
        border-top: 4px solid #3B82F6;
        border-radius: 50%;
        animation: spin 1s linear infinite;
    }

    /* ANIMAÇÕES NATIVAS (SUPER LEVES) */
    .fade-up {
        opacity: 0;
        transform: translateY(20px);
        transition: opacity 0.6s ease-out, transform 0.6s ease-out;
    }
    .fade-up.active {
        opacity: 1;
        transform: translateY(0);
    }

/* LISTAS DE CADASTROS */

    .badge-status {
        background-color: #e3f2fd;
        color: #1976d2;
        padding: 5px 10px;
        border-radius: 4px;
        font-size: 12px;
        font-weight: 600;
        margin-right: 10px;
        display: inline-block;
    }

    .badge-ativo {
        background: #e8f5e9;
        color: #2e7d32;
        padding: 5px 10px;
        border-radius: 4px;
        font-size: 12px;
        font-weight: 700;
        display: inline-block;
    }

    .badge-inativo {
        background: #ffebee;
        color: #c62828;
        padding: 5px 10px;
        border-radius: 4px;
        font-size: 12px;
        font-weight: 700;
        display: inline-block;
    }

    .paginacao-container {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-top: 20px;
        color: #888;
        font-size: 13px;
    }

    .btn-paginacao {
        border: 1px solid #dee2e6;
        background: #fff;
        color: #777;
        padding: 5px 12px;
        margin: 0 2px;
        border-radius: 4px;
        cursor: pointer;
        font-size: 12px;
    }

    .btn-paginacao:hover { 
        background: #f1f1f1; 
    }

    .btn-paginacao.ativo { 
        background-color: #00a65a; 
        color: #fff; 
        border-color: #00a65a; 
    }

    .btn-paginacao.disabled { 
        opacity: 0.5; 
        cursor: not-allowed; 
    }

    /* CADASTROS.PHP */

    /* Animações e Loader integrados baseados no painel principal */
    #loader-overlay {
        position: fixed; inset: 0; z-index: 9999;
        background: rgba(255, 255, 255, 0.7); backdrop-filter: blur(4px);
        display: flex; align-items: center; justify-content: center;
        transition: opacity 0.4s ease-out, visibility 0.4s;
    }
    .loader-hidden { opacity: 0; visibility: hidden; }
    
    @keyframes spin { 
        to { transform: rotate(360deg); } 
    }
    
    .spinner {
        width: 50px; height: 50px;
        border: 4px solid #f3f3f3;
        border-top: 4px solid #3B82F6;
        border-radius: 50%;
        animation: spin 1s linear infinite;
    }

    /* ANIMAÇÕES NATIVAS (SUPER LEVES) */
    .fade-up {
        opacity: 0;
        transform: translateY(20px);
        transition: opacity 0.6s ease-out, transform 0.6s ease-out;
    }
    .fade-up.active {
        opacity: 1;
        transform: translateY(0);
    }