/**
 * nupema.css — Folha de estilos do Módulo NUPEMA
 * Monitor GeoAmbiental (MPPE) | v1.2 | 17/09/2026
 * v1.0: padrão visual Fiscalizacao + menu regiões, badges, grid, modais.
 * v1.1: + toast, seção de geometria (digitação DMS/DEC/UTM, minimapa, vértices,
 *       importação de arquivo), multiselect de municípios, badge de geometria no grid.
 * v1.2: modal do processo em abas — cabeçalho e rodapé FIXOS, scroll só no miolo
 *       (.modal-body); chips de dados do registro no cabeçalho; rodapé com
 *       Salvar/Cancelar (botão submit fora do form via atributo form=).
 */

:root {
    --nupema-verde: #1a5f3e;
    --nupema-verde-escuro: #0e3d26;
    --nupema-verde-portal: #0d5d2e;
    --nupema-fundo-filtro: #eaf6ec;
    --nupema-borda: #c8e6c9;
    --nupema-texto-suave: #6c757d;
}

* { margin: 0; padding: 0; box-sizing: border-box; }

html, body {
    height: 100%;
    overflow: hidden;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    background: #f0f2f5;
    font-size: 16px;
}

.container {
    height: 100vh;
    max-width: 100%;
    margin: 0;
    background: #fff;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* Gate do auth-guard: página só aparece após perfil validado */
.nupema-app { visibility: hidden; }
body.nupema-authorized .nupema-app { visibility: visible; }

/* ============ HEADER ============ */
.header {
    background: linear-gradient(135deg, #1a5f3e 0%, #0e3d26 100%);
    color: #fff;
    padding: 10px 25px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    flex-shrink: 0;
}
.header-title-area { display: flex; align-items: baseline; gap: 15px; flex-wrap: wrap; }
.header h1 { font-size: 1.3rem; margin: 0; }
.stats { font-size: 1rem; font-weight: bold; line-height: 1; color: #fff; }
.stats strong { color: #a5d6a7; }
.header-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.btn-voltar {
    text-decoration: none; color: #fff; font-weight: bold; font-size: 0.9rem;
    background: rgba(255,255,255,0.1); padding: 6px 12px; border-radius: 6px;
    transition: 0.2s; display: flex; align-items: center; gap: 8px;
}
.btn-voltar:hover { background: rgba(255,255,255,0.2); }
.btn-novo {
    background: #0d6efd; color: #fff; border: none; padding: 6px 14px;
    border-radius: 6px; font-weight: bold; font-size: 0.9rem; cursor: pointer; transition: 0.2s;
}
.btn-novo:hover { background: #0b5ed7; transform: translateY(-1px); }
.user-badge {
    display: flex; align-items: center; gap: 8px;
    background: rgba(255,255,255,0.15); padding: 5px 12px; border-radius: 6px;
    font-weight: bold; font-size: 0.9rem; color: #fff;
}

/* ============ LAYOUT COM MENU DE REGIÕES ============ */
.nupema-layout {
    flex: 1;
    display: flex;
    overflow: hidden;
    min-height: 0;
}

/* Menu vertical — esquerda */
.menu-regioes {
    width: 200px;
    flex-shrink: 0;
    background: #f4f7f5;
    border-right: 2px solid var(--nupema-borda);
    padding: 15px 10px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    overflow-y: auto;
}
.menu-regioes-title {
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--nupema-verde-portal);
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 0 6px 8px;
    border-bottom: 1px solid var(--nupema-borda);
    margin-bottom: 4px;
}
.btn-regiao {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 11px 12px;
    border: 1px solid transparent;
    border-left: 5px solid transparent;
    border-radius: 6px;
    background: #fff;
    color: #333;
    font-size: 0.95rem;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    text-align: left;
    transition: all 0.2s;
}
.btn-regiao:hover { background: #eaf6ec; border-color: var(--nupema-borda); }
.btn-regiao.active {
    background: #fff;
    border-color: var(--nupema-borda);
    border-left-color: var(--cor-regiao, var(--nupema-verde));
    box-shadow: 0 2px 6px rgba(0,0,0,0.08);
    transform: translateX(2px);
}
.btn-regiao.active .regiao-nome { color: var(--cor-regiao, var(--nupema-verde)); }
.regiao-dot {
    width: 12px; height: 12px;
    border-radius: 50%;
    background: var(--cor-regiao, #999);
    flex-shrink: 0;
}
.regiao-nome { flex: 1; }
.regiao-count {
    font-size: 0.8rem;
    font-weight: 700;
    color: var(--nupema-texto-suave);
    background: #e9ecef;
    padding: 2px 8px;
    border-radius: 10px;
}
.btn-regiao.active .regiao-count { background: var(--cor-regiao, var(--nupema-verde)); color: #fff; }

/* Área de conteúdo — direita */
.nupema-content {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-width: 0;
}

/* ============ FILTROS ============ */
.filtros {
    padding: 10px 20px;
    background: var(--nupema-fundo-filtro);
    border-bottom: 2px solid var(--nupema-borda);
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 8px 15px;
    align-items: flex-end;
    flex-shrink: 0;
}
.filtro-group { display: flex; flex-direction: column; }
.filtro-group label { font-size: 0.8rem; font-weight: 600; color: #1b5e20; margin-bottom: 3px; }
.filtro-group input, .filtro-group select {
    width: 100%;
    padding: 6px 10px;
    border: 1px solid #a5d6a7;
    border-radius: 4px;
    font-size: 0.9rem;
    background: #fff;
    font-family: inherit;
}
.filtro-actions { display: flex; gap: 8px; align-items: stretch; }
.btn-pesquisar { flex: 1; background: #1a5f3e; color: #fff; border: none; padding: 7px; border-radius: 4px; cursor: pointer; font-size: 0.9rem; font-weight: 600; font-family: inherit; }
.btn-pesquisar:hover { background: #144a30; }
.btn-limpar { flex: 1; background: #6c757d; color: #fff; border: none; padding: 7px; border-radius: 4px; cursor: pointer; font-size: 0.9rem; font-weight: 600; font-family: inherit; }
.btn-limpar:hover { background: #5a6268; }

/* ============ GRID ============ */
.grid-container {
    padding: 15px;
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 0;
}
.grid-table-wrapper {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 0;
    border: 1px solid #dee2e6;
    border-radius: 8px;
}
.table-scroll { flex: 1; overflow: auto; min-height: 0; }
table { width: 100%; min-width: 100%; border-collapse: collapse; font-size: 1rem; }
thead th {
    background: #e9ecef;
    padding: 14px 12px;
    text-align: left;
    font-weight: 600;
    white-space: nowrap;
    position: sticky;
    top: 0;
    z-index: 10;
    border-bottom: 2px solid #dee2e6;
    font-size: 1rem;
}
td { padding: 12px; border-bottom: 1px solid #dee2e6; vertical-align: middle; white-space: nowrap; }
td:first-child, th:first-child { padding-left: 15px; }
td:last-child, th:last-child { padding-right: 15px; }
tbody tr:nth-child(even) { background-color: #fcfcfd; }
tbody tr:hover { background-color: #e9ecef; }
tbody tr.row-auto { background-color: #fffdf5; }
tbody tr.row-auto:nth-child(even) { background-color: #fdf8ec; }
tbody tr.row-auto:hover { background-color: #f5edd8; }
.text-right { text-align: right !important; }
.text-center { text-align: center !important; }

/* Badges de origem — impedem confusão entre IDs NUPEMA e Auto */
.badge-origem {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 12px;
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.badge-origem.nupema { background: #0d6efd; color: #fff; }
.badge-origem.auto    { background: #6c757d; color: #fff; }
.id-celula { font-weight: 700; font-family: 'Consolas', monospace; }
.id-celula.id-nupema { color: #0d6efd; }
.id-celula.id-auto   { color: #6c757d; }

/* Badge de geometria no grid */
.badge-geom {
    display: inline-block;
    padding: 3px 8px;
    border-radius: 10px;
    font-size: 0.75rem;
    font-weight: 700;
}
.badge-geom.ok    { background: #d4edda; color: #155724; }
.badge-geom.warn  { background: #fff3cd; color: #856404; }

/* Ícones de status nas células */
.icones-status { display: inline-flex; gap: 6px; align-items: center; }
.ico-status {
    font-size: 1.1rem;
    cursor: help;
    opacity: 0.9;
}
.ico-status.ok    { color: #28a745; }
.ico-status.warn  { color: #fd7e14; }
.ico-status.danger{ color: #dc3545; }
.ico-status.muted { color: #ccc; }
.ico-status.info  { color: #17a2b8; }

/* Botões de ação */
.btn-editar { background: #fd7e14; color: #fff; border: none; padding: 7px 14px; border-radius: 4px; cursor: pointer; font-size: 0.95rem; font-family: inherit; }
.btn-editar:hover { background: #e96a0a; }
.btn-upload { background: #17a2b8; color: #fff; border: none; padding: 7px 12px; border-radius: 4px; cursor: pointer; font-size: 0.9rem; font-family: inherit; margin-left: 6px; }
.btn-upload:hover { background: #138496; }
.btn-geom { background: #6f42c1; color: #fff; border: none; padding: 7px 12px; border-radius: 4px; cursor: pointer; font-size: 0.9rem; font-family: inherit; margin-left: 6px; }
.btn-geom:hover { background: #5a359e; }
.btn-ver { background: #6c757d; color: #fff; border: none; padding: 7px 12px; border-radius: 4px; cursor: pointer; font-size: 0.9rem; font-family: inherit; }
.btn-ver:hover { background: #5a6268; }

/* Paginação */
.pagination {
    display: flex;
    justify-content: center;
    gap: 8px;
    padding: 12px;
    background: #fff;
    border-top: 1px solid #dee2e6;
    flex-shrink: 0;
}
.pagination button { background: #fff; border: 1px solid #dee2e6; padding: 8px 14px; cursor: pointer; border-radius: 4px; font-size: 1rem; font-family: inherit; }
.pagination button.active { background: #1a5f3e; color: #fff; border-color: #1a5f3e; }
.pagination button:disabled { opacity: 0.5; cursor: not-allowed; }

/* Estado vazio */
.empty-state {
    padding: 50px 20px;
    text-align: center;
    color: var(--nupema-texto-suave);
    font-size: 1.05rem;
}
.empty-state i { font-size: 2.5rem; display: block; margin-bottom: 15px; color: #c8e6c9; }

.loading { text-align: center; padding: 40px; color: #6c757d; font-size: 1.2rem; }

/* ============ TOAST ============ */
.toast-container {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 3000;
    display: flex;
    flex-direction: column;
    gap: 10px;
    max-width: 380px;
}
.toast {
    padding: 12px 16px;
    border-radius: 8px;
    color: #fff;
    font-weight: 600;
    font-size: 0.95rem;
    box-shadow: 0 4px 12px rgba(0,0,0,0.25);
    display: flex;
    align-items: center;
    gap: 10px;
    animation: toast-in 0.3s ease;
}
.toast.success { background: #28a745; }
.toast.error   { background: #dc3545; }
.toast.info    { background: #17a2b8; }
.toast.warning { background: #fd7e14; }
.toast.hide { opacity: 0; transition: opacity 0.4s; }
@keyframes toast-in { from { transform: translateX(120%); } to { transform: translateX(0); } }

/* ============ MODAL (base — demais modais) ============ */
.modal { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); z-index: 1000; justify-content: center; align-items: center; padding: 15px; overflow-y: auto; }
.modal-content {
    background: #fff; border-radius: 12px; width: 100%; max-width: 850px;
    min-height: 400px; max-height: 90vh; overflow-y: auto; position: relative; padding: 30px;
    display: flex; flex-direction: column;
}
.modal-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px; padding-bottom: 10px; border-bottom: 2px solid #e9ecef; flex-shrink: 0; }
.modal-header h2 { color: #1a5f3e; font-size: 1.4rem; }
.close-modal { background: none; border: none; font-size: 28px; cursor: pointer; color: #6c757d; line-height: 1; }
.modal-summary {
    background: #f8f9fa; border-left: 5px solid #1a5f3e; padding: 12px 15px; margin-bottom: 20px;
    border-radius: 4px; display: flex; flex-wrap: wrap; gap: 20px; font-size: 1rem; flex-shrink: 0;
}
.modal-summary div { display: flex; flex-direction: column; }
.modal-summary strong { color: #495057; font-size: 0.85rem; margin-bottom: 2px; text-transform: uppercase; }
.modal-summary span { color: #1a5f3e; font-weight: bold; font-size: 1.05rem; }

/* Abas */
.tab-header { display: flex; border-bottom: 2px solid #0d5d2e; margin-bottom: 25px; gap: 5px; flex-shrink: 0; flex-wrap: wrap; }
.tablinks { background: none; border: none; padding: 12px 18px; cursor: pointer; font-size: 1rem; font-weight: bold; color: #555; border-bottom: 3px solid transparent; transition: 0.3s; font-family: inherit; }
.tablinks:hover { color: #0d5d2e; }
.tablinks.active { color: #0d5d2e; border-bottom: 3px solid #0d5d2e; }
.tabcontent { display: none; flex-grow: 1; min-height: 300px; }

/* Formulários */
.form-group { margin-bottom: 18px; }
.form-group label { display: block; font-weight: 600; margin-bottom: 6px; color: #1a5f3e; font-size: 1rem; }
.form-group input, .form-group select, .form-group textarea { width: 100%; padding: 10px 12px; border: 1px solid #ced4da; border-radius: 6px; font-family: inherit; font-size: 1rem; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
button[type="submit"], .btn-salvar-modal { width: 100%; padding: 14px; border: none; border-radius: 6px; font-weight: bold; cursor: pointer; margin-top: 10px; font-size: 1.1rem; font-family: inherit; }
.btn-salvar-modal { background: #dc3545; color: #fff; }
button[type="submit"] { background: #0d6efd; color: #fff; }
.alert { padding: 12px; border-radius: 6px; margin-bottom: 20px; display: none; }
.alert-success { background: #d4edda; color: #155724; display: block; }
.alert-error { background: #f8d7da; color: #721c24; display: block; }
.alert-warning { background: #fff3cd; color: #856404; display: block; }

/* Upload drag-and-drop */
.upload-dropzone {
    border: 2px dashed #a5d6a7;
    border-radius: 8px;
    padding: 30px 20px;
    text-align: center;
    color: #1b5e20;
    background: #f8fdf9;
    cursor: pointer;
    transition: 0.2s;
    margin-bottom: 15px;
}
.upload-dropzone:hover, .upload-dropzone.dragover { border-color: #1a5f3e; background: #eaf6ec; }
.upload-dropzone i { font-size: 2rem; display: block; margin-bottom: 10px; color: #1a5f3e; }
.doc-card { border: 1px solid #ddd; padding: 12px 15px; margin-bottom: 10px; border-radius: 8px; display: flex; justify-content: space-between; align-items: center; background: #fafafa; flex-wrap: wrap; gap: 10px; }
.doc-card .doc-nome { font-weight: 600; color: #333; font-size: 0.95rem; word-break: break-all; }
.doc-card .doc-meta { font-size: 0.8rem; color: #6c757d; }
.doc-card button { padding: 6px 12px; border: none; border-radius: 4px; cursor: pointer; color: #fff; font-size: 0.85rem; font-family: inherit; }
.doc-btn-ver { background: #17a2b8; margin-right: 5px; }
.doc-btn-baixar { background: #28a745; }

/* ============ MULTISELECT DE MUNICÍPIOS ============ */
.multiselect-list {
    border: 1px solid #ced4da;
    border-radius: 6px;
    max-height: 160px;
    overflow-y: auto;
    background: #fff;
}
.multiselect-list label {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 12px;
    font-weight: 400;
    color: #333;
    font-size: 0.95rem;
    margin: 0;
    cursor: pointer;
    border-bottom: 1px solid #f1f3f5;
}
.multiselect-list label:hover { background: #eaf6ec; }
.multiselect-list input[type="checkbox"] { width: auto; margin: 0; }
.multiselect-empty { padding: 10px 12px; color: #6c757d; font-size: 0.9rem; font-style: italic; }

/* ============ SEÇÃO DE GEOMETRIA (modal processo) ============ */
.geom-section {
    border: 1px solid var(--nupema-borda);
    border-radius: 8px;
    padding: 18px;
    margin-bottom: 20px;
    background: #fbfdfc;
}
.geom-section-title {
    font-size: 1.05rem;
    font-weight: bold;
    color: var(--nupema-verde-escuro);
    margin-bottom: 14px;
    display: flex;
    align-items: center;
    gap: 8px;
}
.geom-status {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 12px;
    font-size: 0.8rem;
    font-weight: 700;
    margin-left: auto;
}
.geom-status.ok   { background: #d4edda; color: #155724; }
.geom-status.warn { background: #fff3cd; color: #856404; }

/* Grupos de coordenadas (DMS / DECIMAL / UTM) */
.coord-group { display: none; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 10px; }
.coord-group.active { display: flex; }
.coord-group label { font-weight: 400; color: #495057; font-size: 0.85rem; margin: 0; }
.coord-group input, .coord-group select {
    width: auto;
    min-width: 70px;
    padding: 6px 8px;
    border: 1px solid #ced4da;
    border-radius: 4px;
    font-size: 0.95rem;
    font-family: inherit;
}
.coord-group input.num-pequeno { width: 60px; min-width: 60px; }
.coord-group input.num-medio   { width: 110px; min-width: 110px; }

/* Radio de formato de coordenada */
.coord-type-radios { display: flex; gap: 15px; margin-bottom: 12px; flex-wrap: wrap; }
.coord-type-radios label { display: flex; align-items: center; gap: 6px; font-weight: 600; color: #1a5f3e; font-size: 0.95rem; cursor: pointer; }
.coord-type-radios input[type="radio"] { width: auto; margin: 0; }

/* Preview de validação */
.coord-preview { font-size: 0.9rem; font-weight: 600; margin: 8px 0; min-height: 20px; }
.coord-preview.valid   { color: #28a745; }
.coord-preview.invalid { color: #dc3545; }

/* Minimapa */
.minimap {
    width: 100%;
    height: 260px;
    border: 1px solid #ced4da;
    border-radius: 6px;
    margin: 12px 0;
    z-index: 1;
}

/* Lista de vértices */
.vertices-list { max-height: 140px; overflow-y: auto; margin: 10px 0; }
.vertices-list ol { margin: 0; padding-left: 22px; font-size: 0.9rem; }
.vertices-list li { padding: 2px 0; }
.vertices-list .btn-remove-vertex {
    color: #dc3545; border: none; background: none; cursor: pointer;
    font-weight: bold; font-size: 0.9rem; margin-left: 6px;
}

/* Botões da seção de geometria */
.btn-geom-acao {
    border: none; border-radius: 6px; cursor: pointer; font-weight: bold;
    font-size: 0.95rem; font-family: inherit; padding: 10px 18px; transition: 0.2s;
}
.btn-geom-acao.adicionar  { background: #17a2b8; color: #fff; }
.btn-geom-acao.adicionar:hover { background: #138496; }
.btn-geom-acao.gerar      { background: #1a5f3e; color: #fff; width: 100%; margin-top: 10px; }
.btn-geom-acao.gerar:hover { background: #144a30; }
.btn-geom-acao.limpar     { background: #6c757d; color: #fff; }
.btn-geom-acao.limpar:hover { background: #5a6268; }

/* Zona de importação de arquivo de geometria */
.geo-dropzone {
    border: 2px dashed #6f42c1;
    border-radius: 8px;
    padding: 28px 20px;
    text-align: center;
    color: #4a2a80;
    background: #f6f2fc;
    cursor: pointer;
    transition: 0.2s;
    margin-bottom: 12px;
}
.geo-dropzone:hover, .geo-dropzone.dragover { border-color: #4a2a80; background: #ece4f9; }
.geo-dropzone i { font-size: 2rem; display: block; margin-bottom: 10px; color: #6f42c1; }
.geo-dropzone small { display: block; margin-top: 6px; color: #6c757d; }

/* Info de geometria carregada (edição) */
.geom-info {
    background: #eaf6ec;
    border-left: 4px solid #1a5f3e;
    border-radius: 4px;
    padding: 10px 14px;
    font-size: 0.95rem;
    color: #155724;
    margin-bottom: 12px;
}

/* ============ MODAL DO PROCESSO EM ABAS (v1.2) ============ */
/* Estrutura: cabeçalho fixo + abas fixas + miolo com scroll + rodapé fixo */
.modal-processo { padding: 0; overflow: hidden; height: 90vh; }

.modal-processo .modal-header {
    margin: 0;
    padding: 16px 24px 12px;
    align-items: flex-start;
}
.modal-processo .modal-header-info { flex: 1; min-width: 0; padding-right: 10px; }
.modal-processo .modal-header-info h2 { font-size: 1.25rem; }

/* Chips de dados básicos do registro (preenchidos pelo app-grid v3.0) */
.modal-header-sub {
    margin-top: 8px;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.header-chip {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 12px;
    font-size: 0.8rem;
    font-weight: 700;
    white-space: nowrap;
}

/* Barra de abas grudada no cabeçalho */
.modal-processo .modal-tabs-header {
    margin: 0;
    padding: 0 24px;
}
.modal-processo .modal-tabs-header .tablinks { padding: 10px 14px; font-size: 0.95rem; }

/* Alerta de erro/avisos dentro do modal em abas */
.modal-processo #alertProcesso { margin: 10px 24px 0; }

/* Miolo: ÚNICA área que rola */
.modal-processo .modal-body {
    flex: 1;
    overflow-y: auto;
    min-height: 0;
    padding: 18px 24px;
}
.modal-processo .tabcontent { min-height: 0; }
.modal-processo .tabcontent .geom-section { margin-bottom: 0; }

/* Rodapé fixo com ações */
.modal-processo .modal-footer {
    display: flex;
    gap: 12px;
    padding: 14px 24px;
    border-top: 2px solid #e9ecef;
    flex-shrink: 0;
    background: #fff;
}
.modal-processo .modal-footer button[type="submit"] {
    margin-top: 0;
    width: auto;
    flex: 2;
}
.btn-cancelar-modal {
    background: #6c757d;
    color: #fff;
    border: none;
    padding: 14px;
    border-radius: 6px;
    font-weight: bold;
    cursor: pointer;
    font-size: 1.1rem;
    font-family: inherit;
    flex: 1;
    transition: 0.2s;
}
.btn-cancelar-modal:hover { background: #5a6268; }

/* ============ RESPONSIVIDADE ============ */
@media (max-width: 1200px) {
    .filtros { grid-template-columns: repeat(3, 1fr); }
    .filtro-actions { grid-column: span 3; }
}
@media (max-width: 768px) {
    html, body { overflow: auto; height: auto; }
    .container { height: auto; }
    .nupema-layout { flex-direction: column; }
    .menu-regioes { width: 100%; flex-direction: row; flex-wrap: wrap; border-right: none; border-bottom: 2px solid var(--nupema-borda); }
    .menu-regioes-title { width: 100%; }
    .btn-regiao { width: auto; flex: 1; min-width: 130px; }
    .filtros { grid-template-columns: repeat(2, 1fr); }
    .filtro-actions { grid-column: span 2; }
    .form-row { grid-template-columns: 1fr; gap: 0; }
    table { font-size: 0.9rem; }
    th, td { padding: 8px; }
    .modal-content { padding: 15px; }
    .modal-processo { padding: 0; height: 95vh; }
    .modal-processo .modal-body { padding: 14px 15px; }
    .modal-processo .modal-footer { flex-direction: column; }
    .minimap { height: 200px; }
    .toast-container { left: 15px; right: 15px; max-width: none; }
}
