/* ==========================================================================
   SIG Projetos — controles do mapa (layout moderno)
   direita: bússola + zoom + grupo (comparar, imprimir, legenda)
   topo à esquerda: barra de desenho | embaixo: coordenadas (esquerda) e escala (direita)
   (carregado depois de mapa.css; usa as mesmas variáveis)
   ========================================================================== */

/* ---------------------------------------------------------------- coluna da direita */
.leaflet-top.leaflet-right { top: 12px; right: 12px; display: flex; flex-direction: column; align-items: flex-end; gap: 10px; }
.leaflet-top.leaflet-right .leaflet-control { margin: 0 !important; float: none; clear: none; }
.leaflet-bar, .leaflet-touch .leaflet-bar { background: var(--sig-vidro); backdrop-filter: blur(10px); border: 1px solid rgba(226, 232, 240, .9) !important; }
.leaflet-bar a, .leaflet-touch .leaflet-bar a, .sig-grupo-ferramentas .easy-button-button {
    width: 38px !important; height: 38px !important; line-height: 38px !important; display: flex !important; align-items: center; justify-content: center;
    background-color: transparent !important; color: #334155 !important; border: none !important; border-bottom: 1px solid #eef2f6 !important;
    font-size: 17px; transition: background-color .15s, color .15s; }
.leaflet-bar a:last-child, .sig-grupo-ferramentas > :last-child { border-bottom: none !important; }
.leaflet-bar a:hover, .sig-grupo-ferramentas .easy-button-button:hover { background-color: var(--sig-primaria-clara) !important; color: var(--sig-primaria) !important; }
.leaflet-bar a.leaflet-disabled { color: #cbd5e1 !important; background-color: transparent !important; }

/* zoom: ícones do Bootstrap no lugar dos PNG do plugin */
.leaflet-control-zoom a { font-size: 0 !important; background-image: none !important; }
.leaflet-control-zoom a::before { font-family: 'bootstrap-icons'; font-size: 17px; line-height: 1; }
.leaflet-control-zoom .leaflet-control-zoom-to-start::before { content: "\f423"; }
.leaflet-control-zoom .leaflet-control-zoom-in::before { content: "\f64d"; }
.leaflet-control-zoom .leaflet-control-zoom-out::before { content: "\f63b"; }
.leaflet-control-zoom .leaflet-control-zoom-to-area::before { content: "\f1b6"; }
.leaflet-bar a.zoom-area-ativo { background-color: var(--sig-primaria) !important; color: #fff !important; box-shadow: none; }

/* bússola (girar o mapa) */
.leaflet-control-rotate { border-radius: 50% !important; }
.leaflet-control-rotate a { border-radius: 50%; border: none !important; }

/* grupo comparar / imprimir / legenda */
.sig-grupo-ferramentas { display: flex; flex-direction: column; overflow: hidden; }
.sig-grupo-ferramentas .easy-button-button { cursor: pointer; padding: 0; border-radius: 0; }
.sig-grupo-ferramentas .button-state { display: flex; align-items: center; justify-content: center; }
.sig-grupo-ferramentas .cmp-botao.ativo { background-color: var(--sig-primaria) !important; color: #fff !important; }

/* ---------------------------------------------------------------- barra de desenho (topo, à esquerda) */
.sig-barra-desenho { position: absolute; top: 12px; left: 12px; z-index: 800; display: flex; align-items: center; gap: 2px;
    padding: 4px 6px; background: var(--sig-vidro); backdrop-filter: blur(10px); border: 1px solid rgba(226, 232, 240, .9); border-radius: 14px; box-shadow: var(--sig-sombra); }
.sig-barra-rotulo { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 36px; color: var(--sig-primaria); font-size: 17px;
    padding-right: 4px; border-right: 1px solid var(--sig-borda); margin-right: 2px; }
.sig-barra-desenho .leaflet-control, .sig-barra-desenho .leaflet-bar { margin: 0 !important; float: none; clear: none; background: transparent; backdrop-filter: none;
    border: none !important; box-shadow: none !important; border-radius: 0 !important; overflow: visible; }
.sig-barra-desenho .leaflet-draw-section { position: relative; margin: 0; }
.sig-barra-desenho .leaflet-draw-toolbar, .sig-barra-desenho .leaflet-pm-toolbar { display: flex; flex-direction: row; margin: 0; }
.sig-barra-desenho .leaflet-pm-toolbar { padding-left: 4px; margin-left: 2px !important; border-left: 1px solid var(--sig-borda) !important; }
.sig-barra-desenho .leaflet-pm-toolbar:empty { display: none; }
.sig-barra-desenho .button-container { position: relative; }
.sig-barra-desenho a, .sig-barra-desenho .leaflet-buttons-control-button {
    width: 36px !important; height: 36px !important; border: none !important; border-radius: 10px !important; margin: 0 1px; background-color: transparent !important; }
.sig-barra-desenho a:hover, .sig-barra-desenho .leaflet-buttons-control-button:hover { background-color: var(--sig-primaria-clara) !important; }
/* ferramentas de medição (Leaflet.draw): ícones do Bootstrap no lugar do sprite */
.sig-barra-desenho .leaflet-draw-toolbar a { background-image: none !important; display: flex !important; align-items: center; justify-content: center; color: #334155 !important; text-decoration: none; }
.sig-barra-desenho .leaflet-draw-toolbar a::before { font-family: 'bootstrap-icons'; font-size: 18px; line-height: 1; }
.sig-barra-desenho .leaflet-draw-toolbar a.leaflet-draw-draw-polyline::before { content: "\f523"; }
.sig-barra-desenho .leaflet-draw-toolbar a.leaflet-draw-draw-polygon::before { content: "\f4ce"; }
.sig-barra-desenho .leaflet-draw-toolbar a.leaflet-draw-draw-circlemarker::before { content: "\f3e8"; }
.sig-barra-desenho .leaflet-draw-toolbar a:hover { color: var(--sig-primaria) !important; }
.sig-barra-desenho .leaflet-draw-toolbar a.leaflet-draw-toolbar-button-enabled,
.sig-barra-desenho .button-container.active > .leaflet-buttons-control-button { background-color: var(--sig-primaria-clara) !important; box-shadow: inset 0 0 0 2px var(--sig-primaria); }
.sig-barra-desenho .control-icon { width: 20px; height: 20px; margin: 8px auto; }

/* menus de ação (Concluir, Desfazer, Cancelar) abrem abaixo do botão */
.sig-barra-desenho .leaflet-draw-actions, .sig-barra-desenho .button-container .leaflet-pm-actions-container {
    top: 44px !important; bottom: auto !important; left: 0 !important; right: auto !important; flex-direction: row; gap: 4px;
    background: #0f172a; border-radius: 10px; padding: 4px; box-shadow: var(--sig-sombra); white-space: nowrap; }
.sig-barra-desenho .leaflet-draw-actions { list-style: none; margin: 0; }
.sig-barra-desenho .button-container.active .leaflet-pm-actions-container { display: flex !important; }
.sig-barra-desenho .leaflet-draw-actions a, .sig-barra-desenho .leaflet-pm-actions-container a.leaflet-pm-action {
    width: auto !important; height: 30px !important; line-height: 30px !important; padding: 0 12px !important; margin: 0 !important; border-radius: 7px !important;
    background: transparent !important; color: #fff !important; font-size: 12.5px; font-weight: 600; border: none !important; display: inline-flex !important; align-items: center; }
.sig-barra-desenho .leaflet-draw-actions a:hover, .sig-barra-desenho .leaflet-pm-actions-container a.leaflet-pm-action:hover { background: rgba(255, 255, 255, .14) !important; }
.sig-barra-desenho .leaflet-draw-actions li { display: inline-flex; }

/* ---------------------------------------------------------------- embaixo à esquerda: coordenadas e escala */
.leaflet-bottom.leaflet-left { display: flex; flex-direction: row; align-items: flex-end; gap: 8px; padding: 0 0 12px 12px; }
.leaflet-bottom.leaflet-left .leaflet-control { margin: 0 !important; float: none; clear: none; }
.leaflet-control-graphicscale { background: var(--sig-vidro); backdrop-filter: blur(10px); border: 1px solid rgba(226, 232, 240, .9); border-radius: 12px;
    box-shadow: var(--sig-sombra); padding: 6px 12px 4px !important; font-size: 11px; }

.coordenadas-mapa { display: flex; align-items: stretch; background: rgba(15, 23, 42, .86); color: #e2e8f0; border-radius: 12px; box-shadow: var(--sig-sombra);
    backdrop-filter: blur(10px); font-size: 12px; line-height: 1.25; overflow: hidden; cursor: default; }
.coordenadas-mapa .coord-icone { display: flex; align-items: center; padding: 0 10px; color: #5eead4; font-size: 15px; border-right: 1px solid rgba(255, 255, 255, .1); }
.coordenadas-mapa .coord-linha { position: relative; display: flex; flex-direction: column; justify-content: center; gap: 1px; padding: 6px 26px 6px 12px;
    border-right: 1px solid rgba(255, 255, 255, .1); cursor: copy; transition: background .15s; white-space: nowrap; }
.coordenadas-mapa .coord-linha:hover { background: rgba(255, 255, 255, .08); }
.coordenadas-mapa .coord-linha.coord-copiada { background: rgba(20, 184, 166, .35); }
.coordenadas-mapa .coord-rotulo { font-size: 9.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #94a3b8; }
.coordenadas-mapa .coord-valor { font-variant-numeric: tabular-nums; font-weight: 600; color: #fff; white-space: pre; }
.coordenadas-mapa .coord-copiar { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); font-size: 11px; color: #94a3b8; opacity: 0; transition: opacity .15s; }
.coordenadas-mapa .coord-linha:hover .coord-copiar { opacity: 1; }
.coordenadas-mapa .coord-datum { display: flex; align-items: center; padding: 0 10px; font-size: 10px; font-weight: 700; color: #94a3b8; letter-spacing: .04em; }

/* telas médias: esconde GMS (e o datum) para caber */
@media (max-width: 1280px) { body:not(.toggle-sidebar) .coordenadas-mapa .coord-linha:nth-of-type(2) { display: none; } }
@media (max-width: 1000px) { .coordenadas-mapa .coord-linha:nth-of-type(2), .coordenadas-mapa .coord-datum { display: none; } }

/* ---------------------------------------------------------------- celular */
@media (max-width: 768px) {
    .leaflet-top.leaflet-right { top: 8px; right: 8px; gap: 8px; }
    .leaflet-bar a, .leaflet-touch .leaflet-bar a, .sig-grupo-ferramentas .easy-button-button { width: 36px !important; height: 36px !important; }
    .sig-barra-desenho { top: 8px; left: 8px; transform: none; max-width: calc(100% - 64px); padding: 3px 4px; }
    .sig-barra-desenho a, .sig-barra-desenho .leaflet-buttons-control-button { width: 31px !important; height: 34px !important; margin: 0; }
    .sig-barra-desenho .leaflet-draw-actions, .sig-barra-desenho .button-container .leaflet-pm-actions-container { top: 42px !important; }
    .sig-barra-rotulo { display: none; }
    .leaflet-bottom.leaflet-left { padding-bottom: 56px; }
}

/* escala no canto inferior direito, acima da atribuição */
.leaflet-bottom.leaflet-right .leaflet-control-graphicscale { margin: 0 12px 6px 0 !important; float: none; }
.leaflet-bottom.leaflet-right { display: flex; flex-direction: column; align-items: flex-end; }
@media (max-width: 768px) { .leaflet-bottom.leaflet-right { bottom: 46px; } .leaflet-bottom.leaflet-right .leaflet-control-graphicscale { margin-right: 8px !important; } }

/* ---------------------------------------------------------------- barra de desenho vertical (um botão abaixo do outro) */
.sig-barra-desenho { flex-direction: column; padding: 5px 4px; gap: 2px; }
.sig-barra-rotulo { width: 36px; height: 30px; padding: 0 0 4px; margin: 0 0 2px; border-right: none; border-bottom: 1px solid var(--sig-borda); }
.sig-barra-desenho .leaflet-draw-toolbar, .sig-barra-desenho .leaflet-pm-toolbar { flex-direction: column; }
.sig-barra-desenho .leaflet-pm-toolbar { padding: 4px 0 0; margin: 2px 0 0 !important; border-left: none !important; border-top: 1px solid var(--sig-borda) !important; }
.sig-barra-desenho a, .sig-barra-desenho .leaflet-buttons-control-button { margin: 1px 0; }
/* Concluir / Desfazer / Cancelar: ao lado direito do botão */
.sig-barra-desenho .leaflet-draw-actions, .sig-barra-desenho .button-container .leaflet-pm-actions-container {
    top: 2px !important; left: 46px !important; right: auto !important; bottom: auto !important; }
@media (max-width: 768px) {
    .sig-barra-desenho { top: 8px; left: 8px; max-width: none; padding: 3px; }
    .sig-barra-desenho a, .sig-barra-desenho .leaflet-buttons-control-button { width: 34px !important; height: 32px !important; }
    .sig-barra-desenho .leaflet-draw-actions, .sig-barra-desenho .button-container .leaflet-pm-actions-container { top: 0 !important; left: 42px !important; }
}

/* ==========================================================================
   Tamanho conforme a tela (notebook com escala 125–150% até monitores grandes)
   Os tamanhos acompanham a largura (vw) e a altura (vh), com mínimo e máximo:
   em notebooks de tela baixa tudo fica mais compacto; em monitores grandes, maior.
   ========================================================================== */
:root {
    --sig-lateral: clamp(280px, 21vw, 400px);
    --sig-topo: clamp(48px, 6.4vh, 60px);
    --sig-botao: clamp(30px, min(4.5vh, 2.5vw), 40px);     /* botões do mapa */
    --sig-legenda-l: clamp(260px, 23vw, 440px);
    --sig-legenda-a: clamp(130px, 27vh, 380px);
    --sig-margem: clamp(8px, 1.4vh, 14px);
}
/* texto base: um pouco menor em notebooks, um pouco maior em monitores grandes */
html { font-size: clamp(14px, min(.22vw + 12.4px, 1.5vh + 5px), 17px); }
body { font-size: clamp(13px, min(.2vw + 10.6px, 1.3vh + 4.6px), 15.5px); }

/* barra superior */
.sig-topo { height: var(--sig-topo); }
.sig-topo-btn, .sig-topo-publicar { height: calc(var(--sig-topo) - 20px); }
@media (max-width: 1350px) { .sig-topo-texto span { display: none; } }

/* botões do mapa (direita) e barra de desenho (esquerda) */
.leaflet-bar a, .leaflet-touch .leaflet-bar a, .sig-grupo-ferramentas .easy-button-button {
    width: var(--sig-botao) !important; height: var(--sig-botao) !important; line-height: var(--sig-botao) !important; }
.leaflet-bar a i, .sig-grupo-ferramentas .easy-button-button i { font-size: calc(var(--sig-botao) * .45); }
.sig-barra-desenho { top: var(--sig-margem); left: var(--sig-margem); }
.sig-barra-desenho a, .sig-barra-desenho .leaflet-buttons-control-button { width: var(--sig-botao) !important; height: var(--sig-botao) !important; }
.sig-barra-desenho .leaflet-draw-toolbar a::before { font-size: calc(var(--sig-botao) * .5); }
.sig-barra-rotulo { width: var(--sig-botao); height: calc(var(--sig-botao) * .8); font-size: calc(var(--sig-botao) * .45); }
.sig-barra-desenho .leaflet-draw-actions, .sig-barra-desenho .button-container .leaflet-pm-actions-container { left: calc(var(--sig-botao) + 10px) !important; }
.leaflet-top.leaflet-right .leaflet-control { margin-top: calc(var(--sig-margem) * .6); margin-right: var(--sig-margem); }

/* legenda: largura e altura proporcionais; começa à direita da barra de desenho, acima das coordenadas */
.draggable { width: var(--sig-legenda-l); height: var(--sig-legenda-a); bottom: calc(var(--sig-botao) + var(--sig-margem) * 2 + 14px);
    left: calc(var(--sig-lateral) + var(--sig-botao) + var(--sig-margem) * 2 + 12px); }
body.toggle-sidebar .draggable { left: calc(var(--sig-botao) + var(--sig-margem) * 2 + 12px); }
body.sig-sem-desenho .draggable { left: calc(var(--sig-lateral) + var(--sig-margem)); }
body.sig-sem-desenho.toggle-sidebar .draggable { left: var(--sig-margem); }

/* coordenadas e escala */
.leaflet-bottom.leaflet-left { padding: 0 0 var(--sig-margem) var(--sig-margem); }
.coordenadas-mapa { font-size: clamp(11px, min(.62vw, 1.5vh), 13.5px); }
.coordenadas-mapa .coord-linha { padding: clamp(3px, .7vh, 7px) 24px clamp(3px, .7vh, 7px) clamp(8px, .7vw, 13px); }
.coordenadas-mapa .coord-rotulo { font-size: .78em; }
.leaflet-control-graphicscale { font-size: clamp(10px, .6vw, 12px); }

/* busca, painel "Neste ponto" e menu lateral */
.sig-busca { top: var(--sig-margem); width: clamp(260px, 30vw, 540px); }
.sig-busca-campo { height: calc(var(--sig-botao) + 4px); }
.sig-identificar { top: calc(var(--sig-topo) + var(--sig-margem)); right: calc(var(--sig-botao) + var(--sig-margem) * 2 + 8px); width: clamp(300px, 24vw, 440px);
    max-height: calc(100vh - var(--sig-topo) - var(--sig-botao) * 2 - 40px); }

/* notebooks de tela baixa (escala 125–150%) */
@media (max-height: 760px) {
    .sig-barra-rotulo { display: none; }
    .sig-barra-desenho { padding: 3px; gap: 0; }
    .sig-barra-desenho a, .sig-barra-desenho .leaflet-buttons-control-button { margin: 0; }
    .sig-barra-desenho .leaflet-pm-toolbar { padding-top: 2px; margin-top: 1px !important; }
    .coordenadas-mapa .coord-icone { padding: 0 7px; }
    .sig-abas { margin-top: 6px; margin-bottom: 2px; }
    .sig-abas .nav-link { padding-top: 4px; padding-bottom: 4px; }
}
/* telas estreitas de notebook com o menu aberto: só decimal e UTM nas coordenadas */
@media (max-width: 1450px) { body:not(.toggle-sidebar) .coordenadas-mapa .coord-linha:nth-of-type(2) { display: none; } }
/* celular: mantém o que já estava definido para telas pequenas */
@media (max-width: 768px) {
    :root { --sig-lateral: min(88vw, 360px); --sig-botao: 36px; --sig-topo: 56px; }
    .draggable, body.toggle-sidebar .draggable, body.sig-sem-desenho .draggable { width: auto; left: 0; }
}
/* agrupar/desagrupar pontos na linha da legenda (destacado = pontos separados) */
.legenda-atalho.legenda-agrupar.ativo { background: var(--sig-primaria-clara); color: var(--sig-primaria); }
.legenda-atalho.legenda-agrupar:disabled { opacity: .35; cursor: default; }

/* ==========================================================================
   Minha localização (GPS)
   ========================================================================== */
.sig-gps-botao { display: flex !important; align-items: center; justify-content: center; }
.sig-gps-botao i { transform: scaleX(-1) rotate(0deg); font-size: calc(var(--sig-botao) * .42); }
.sig-gps-botao.gps-procurando i { color: var(--sig-suave); animation: sig-gps-piscar 1s ease-in-out infinite; }
.sig-gps-botao.gps-seguindo { color: #fff !important; background: #2563eb !important; }
.sig-gps-botao.gps-ligado { color: #2563eb !important; }
@keyframes sig-gps-piscar { 50% { opacity: .25; } }
.sig-gps-ponto { background: transparent; border: none; }
.sig-gps-ponto span { position: relative; display: block; width: 18px; height: 18px; margin: 2px; border-radius: 50%; background: #2563eb; border: 3px solid #fff; box-shadow: 0 1px 6px rgba(0, 0, 0, .35); }
.sig-gps-ponto span::after { content: ''; position: absolute; inset: -9px; border-radius: 50%; background: rgba(37, 99, 235, .35); animation: sig-gps-pulso 2s ease-out infinite; z-index: -1; }
@keyframes sig-gps-pulso { from { transform: scale(.4); opacity: 1; } to { transform: scale(1.6); opacity: 0; } }
.leaflet-tooltip.sig-gps-rotulo { background: #1e3a8a; color: #fff; border: none; border-radius: 999px; padding: 1px 8px; font-size: 11px; font-weight: 700; box-shadow: 0 1px 4px rgba(0, 0, 0, .3); }
.leaflet-tooltip.sig-gps-rotulo::before { display: none; }
.sig-gps-popup { min-width: 230px; }
.sig-gps-titulo { font-weight: 700; margin-bottom: 6px; color: #1e3a8a; }
.sig-gps-popup .sig-tabela-props { font-size: 12px; }
.sig-gps-popup .sig-tabela-props th { width: 34%; }
.sig-gps-acoes { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-top: 8px; }
.sig-gps-acoes .btn { font-size: .76rem; padding: 5px 6px; }
.sig-gps-acoes .btn-light { border: 1px solid var(--sig-borda); }
.leaflet-bar a.sig-gps-botao.gps-seguindo, .leaflet-touch .leaflet-bar a.sig-gps-botao.gps-seguindo { color: #fff !important; background-color: #2563eb !important; }
.leaflet-bar a.sig-gps-botao.gps-ligado, .leaflet-touch .leaflet-bar a.sig-gps-botao.gps-ligado { color: #2563eb !important; }
.leaflet-bar a.sig-gps-botao.gps-procurando, .leaflet-touch .leaflet-bar a.sig-gps-botao.gps-procurando { color: var(--sig-suave) !important; }