/* =========================================
   ARQUIVO: rankings-aba/rankings-aba.css
   DESCRIÇÃO: Estilos estruturais da página de listagem geral de rankings.
   NOTA: O visual dos cards e do governador vem injetado dinamicamente 
         pelo arquivo scripts-gerais/rankings.js
   ========================================= */

:root {
    --primary-blue: #003399;
    --text-dark: #1a1a1a;
    --bg-light: #f4f6f9;
    --white: #ffffff;
}

* { 
    margin: 0; 
    padding: 0; 
    box-sizing: border-box; 
    font-family: 'Segoe UI', Roboto, sans-serif; 
}

body { 
    background-color: var(--bg-light); 
    color: var(--text-dark); 
    padding-top: 60px; /* Espaço para o header fixo */
}

/* CONTEÚDO PRINCIPAL */
.app-content { 
    padding: 15px; 
}

/* FEED DE RANKINGS (Grid Responsivo) */
.rankings-feed { 
    display: grid; 
    grid-template-columns: 1fr; /* Padrão Celular: 1 Coluna */
    gap: 20px; 
    align-items: start;
}

/* Tablets e PCs (Telas a partir de 768px): 2 Colunas */
@media (min-width: 768px) {
    .rankings-feed {
        grid-template-columns: 1fr 1fr;
    }
}

/* =========================================
   MODO NOTURNO (Página Rankings)
   ========================================= */
body.dark-theme {
    background-color: #121212;
    color: #e0e0e0;
}