/* ==========================================================================
   RESPONSIVE.CSS — 4 faixas de tela (Módulo 25.9, Bloco 13A). Carregado por último.
     ≥ 1440px     layout completo: filtros 320 | mapa | análise 360
     1280–1439px  as 3 colunas continuam, mais estreitas (filtros 280 | mapa | análise 300). DESVIO CONSCIENTE do
                  25.9 (que pede a análise em gaveta): 1366px é a tela típica de notebook e o Resumo sempre visível
                  já estava validado — escondê-lo seria perda de experiência (regra do ganho real).
     768–1279px   os filtros viram gaveta à esquerda; a análise vira janela (botão "Análise" no header)
     < 768px      mapa em tela cheia; filtros e análise em folhas inferiores (bottom sheet)
   As gavetas ficam acima das camadas do Leaflet (--z-gaveta) e prendem o foco (acessibilidade.js).
   ========================================================================== */

/* ---------------------------------------------------------------- ≤ 1439px: colunas mais estreitas */
@media (max-width: 1439px) {
    .app { grid-template-columns: 280px minmax(0, 1fr); }
    .vista--mapa { grid-template-columns: minmax(0, 1fr) 300px; }
    .header-kpi__sub { display: none; }

    .dash-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .dash-grade3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .dash-grade3 > :first-child { grid-column: 1 / -1; }
    #dash-destaques .destaques-lista { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .hierarquia { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    .hierarquia__col--cidades { grid-column: 1 / -1; }
}

/* ---------------------------------------------------------------- ≤ 1279px: filtros em gaveta; análise em janela */
@media (max-width: 1279px) {
    .app, .app[data-filtros="fechado"], .app[data-so-mapa="sim"] {
        grid-template-columns: minmax(0, 1fr);
        grid-template-areas: "header" "abas" "centro";
    }
    .app-sidebar {
        position: fixed; top: 0; left: 0; bottom: 0; z-index: var(--z-gaveta); width: min(var(--sidebar-width), 90vw);
        background: var(--color-bg-primary); box-shadow: var(--shadow-xl);
        transform: none; visibility: visible; transition: transform var(--transition-slow);
    }
    .app[data-filtros="fechado"] .app-sidebar, .app[data-so-mapa="sim"] .app-sidebar {
        transform: translateX(-100%); visibility: hidden; transition: transform var(--transition-slow), visibility 0s linear var(--transition-slow);
    }
    .sidebar-fechar { display: inline-flex; position: sticky; top: var(--space-2); float: right; margin: var(--space-2) var(--space-2) 0 0; z-index: 2; }

    /* análise como janela centralizada (botão "Análise" no header; Esc ou ✕ fecham) */
    .app[data-vista="mapa"] .btn-painel { display: inline-flex; }
    .vista--mapa, .app[data-so-mapa="sim"] .vista--mapa { grid-template-columns: minmax(0, 1fr); }
    .painel-direito {
        position: fixed; z-index: var(--z-gaveta); top: 50%; left: 50%; width: min(560px, 94vw); height: min(86vh, 900px);
        border: var(--border-width-thin) solid var(--color-border-default); border-radius: var(--radius-lg); box-shadow: var(--shadow-xl);
        transform: translate(-50%, -46%) scale(0.98); opacity: 0; visibility: hidden;
        transition: transform var(--transition-base), opacity var(--transition-base), visibility 0s linear var(--transition-base);
    }
    .app[data-painel="aberto"] .painel-direito { transform: translate(-50%, -50%); opacity: 1; visibility: visible; transition: transform var(--transition-base), opacity var(--transition-base); }
    .painel-fechar { display: inline-flex; }

    .header-kpis { max-width: 520px; }
    .u-hide-tablet { display: none !important; }

    .dash-duas, .dash-grade2, .dash-grade3 { grid-template-columns: minmax(0, 1fr); }
    .dash-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    #dash-destaques .destaques-lista { grid-template-columns: minmax(0, 1fr); }
    .rp-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .rp-duas { grid-template-columns: minmax(0, 1fr); }
    .rp-duas--tres { grid-template-columns: minmax(0, 1fr); grid-template-areas: "regiao" "parceiro" "ranking"; }
    .vista--rolagem { padding: var(--space-4); }
    .form-parceiro__grade { grid-template-columns: minmax(0, 1fr); }
}

/* ---------------------------------------------------------------- < 768px: celular */
@media (max-width: 767px) {
    html, body { overflow-x: hidden; }
    .app-header { gap: var(--space-2); padding: var(--space-2) var(--space-3); min-width: 0; }
    .app-marca { flex: 1 1 auto; min-width: 0; }
    .app-marca__avatar { width: 34px; height: 34px; }
    .header-acoes { gap: 0; }
    #btn-so-mapa { display: none; }   /* no celular o mapa já ocupa a tela */
    .app-usuario { margin-left: 0; }
    .sidebar-fechar { position: absolute; top: var(--space-2); right: var(--space-2); float: none; margin: 0; width: auto; }
    .header-kpis { display: none; }   /* os mesmos números estão no topo da análise */
    .u-hide-mobile { display: none !important; }
    .app-abas { padding: 0 var(--space-2); }

    /* filtros e análise como folhas inferiores */
    .app-sidebar, .painel-direito {
        top: auto; left: 0; right: 0; bottom: 0; width: 100%; height: 82vh; max-height: 82vh;
        border-radius: var(--radius-lg) var(--radius-lg) 0 0; border: 0; border-top: var(--border-width-thin) solid var(--color-border-default);
    }
    .app[data-filtros="fechado"] .app-sidebar, .app[data-so-mapa="sim"] .app-sidebar { transform: translateY(100%); }
    .app-sidebar { transform: none; }
    .painel-direito { transform: translateY(100%); opacity: 1; }
    .app[data-painel="aberto"] .painel-direito { transform: none; }
    .app-sidebar::before, .painel-direito::before {   /* "pegador" da folha */
        content: ''; display: block; width: 40px; height: 4px; margin: var(--space-2) auto 0; border-radius: var(--radius-full); background: var(--color-border-strong);
    }

    .dash-kpis, .rp-kpis { grid-template-columns: minmax(0, 1fr); }
    .hierarquia { grid-template-columns: minmax(0, 1fr); }
    .tabela-parceiros .contato, .tabela-parceiros th:nth-child(9) { display: none; }
    .cad-cab__acoes { flex: 1 1 100%; }
    .prime-legend { max-width: 200px; }
    .botoes-nivel { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* aba Geral: cada cargo numa linha só, composição | candidatos | partidos lado a lado (≥ 768px; no celular empilha) */
@media (min-width: 768px) {
    .geral-cargo .dash-grade3 { grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr) minmax(0, 1fr); }
    .geral-cargo .dash-grade3 > :first-child { grid-column: auto; }
}

@media print {
    .app-sidebar, .app-abas, .header-acoes, .skip-links, .painel-fundo, .sidebar-fundo { display: none !important; }
    .app { display: block; height: auto; }
}