/* ===== Paleta & base ===== */
:root{
  --brown:#8F553A; --green:#358340; --red:#BA2027; --yellow:#F6AB31;
  --bg:#F7F6F4; --ink:#2f2f2f; --topbar-h:64px;
}
*{ box-sizing:border-box }
html,body{ height:100% }
body{ margin:0; background:var(--bg); color:var(--ink);
      font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,"Noto Sans","Helvetica Neue",sans-serif }

/* ===== Topo ===== */
.topbar,.pactas-header{
  height:var(--topbar-h); display:flex; align-items:center; gap:14px;
  padding:0 16px; background:var(--bg); border-bottom:1px solid #E9E5E0;
}
.pactas-header .emblem{height:42px}
.pactas-header .wordmark{height:28px}
.pactas-header .mi{font-weight:700;color:var(--red);font-size:20px}
.pactas-header .dash{color:var(--brown);font-weight:700}

/* ===== Layout principal ===== */
.main{ display:grid; grid-template-columns:380px 1fr; min-height:calc(100dvh - var(--topbar-h)); }
.panel{
  padding:12px; background:#fff; border-right:1px solid #eee; overflow:auto;
  border-top-left-radius:0; border-top-right-radius:0;
}
.mapwrap{ position:relative }
#map{ position:absolute; inset:0 }

/* ===== Filtros/Grupos ===== */
.filters-title{font-size:18px;margin:4px 0 10px;color:var(--green)}
.group{
  background:#fff; border:1px solid #eee; border-radius:10px;
  padding:10px; margin-bottom:10px; box-shadow:0 1px 4px rgba(0,0,0,.03)
}
.group h3{ margin:0 0 8px; font-size:15px; color:var(--brown); font-weight:600 }
.sub{ margin:8px 0 0; padding-left:6px; border-left:3px solid #f0ece8; font-size:13px; font-weight:500 }
label{ font-size:13px; color:#444; display:flex; align-items:center; gap:6px; margin:2px 0 }
input[type="text"], select, .btn{
  height:36px; padding:0 10px; border:1px solid #d6d2cd; border-radius:8px; background:#fff; width:100%
}
.btn{ background:var(--green); color:#fff; border:0; font-weight:600; margin-top:8px }
.btn:hover{ filter:brightness(.96) }
.btn.secondary{ background:#fff; color:#6b665f; border:1px solid #d6d2cd }
.btn.secondary:hover{ background:#f6f3f0 }

/* ===== Legenda & muni-box ===== */
.legend{ margin-top:12px }
.legend h3{ font-size:14px; margin:0 0 8px; color:var(--brown) }
.legend ul{ list-style:none; padding:0; margin:0; display:grid; gap:6px }
.legend li{ display:flex; align-items:center; gap:8px; font-size:13px }
.legend .swatch{ width:16px; height:16px; border-radius:4px; border:1px solid #ddd }
.munibox{
  position:absolute; left:12px; bottom:12px; background:rgba(255,255,255,.92);
  padding:8px 12px; border-radius:8px; font-size:13px; color:#333;
  box-shadow:0 2px 8px rgba(0,0,0,.08)
}

/* ===== ComboSelect (clean/material) ===== */
.combo{ position:relative }
.combo .combo-control{
  display:flex; align-items:center; gap:8px; min-height:44px; cursor:text;
  padding:8px 40px 8px 12px; background:#fff; border:1px solid #D8D5D0; border-radius:12px;
  transition:border-color .15s, box-shadow .15s, background-color .15s
}
.combo .combo-control:hover{ border-color:#bcb8b3 }
.combo.open .combo-control, .combo .combo-input:focus{
  border-color:var(--brown); box-shadow:0 0 0 3px rgba(143,85,58,.12)
}
.combo .combo-tags{ display:flex; flex-wrap:wrap; gap:6px; min-height:24px }
.combo .combo-input{ border:0; outline:0; flex:1 1 auto; min-width:120px; height:28px; background:transparent; color:#2f2f2f; font:inherit; font-size:14px }
.combo .combo-input::placeholder{ color:#9b978f }
.combo .combo-caret{
  position:absolute; right:8px; top:50%; transform:translateY(-50%);
  width:28px; height:28px; border:0; background:transparent; border-radius:8px; cursor:pointer
}
.combo .combo-caret::after{
  content:""; display:block; width:12px; height:12px; margin:8px auto; background:#8a867f;
  -webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23888" d="M7 10l5 5 5-5z"/></svg>') center/contain no-repeat;
          mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23888" d="M7 10l5 5 5-5z"/></svg>') center/contain no-repeat
}
.combo.open .combo-caret::after{
  -webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23888" d="M7 14l5-5 5 5z"/></svg>') center/contain no-repeat;
          mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23888" d="M7 14l5-5 5 5z"/></svg>') center/contain no-repeat
}
.combo .combo-tag{
  display:inline-flex; align-items:center; gap:6px; padding:4px 8px; border-radius:999px;
  background:#f2efeb; border:1px solid #e6e1db; font-size:13px; color:#3a3733
}
.combo .combo-tag .x{ width:18px; height:18px; border:0; background:transparent; color:#6d6963; cursor:pointer }
.combo .combo-tag .x:hover{ color:#2f2f2f }
.combo .combo-menu{
  display:none; position:absolute; left:0; right:0; top:calc(100% + 6px);
  background:#fff; border:1px solid #e8e4df; border-radius:12px;
  box-shadow:0 12px 28px rgba(0,0,0,.12); z-index:2000; max-height:320px; overflow:auto
}
.combo.open .combo-menu{ display:block }
.combo .combo-list{ list-style:none; margin:0; padding:6px }
.combo .combo-item{ display:flex; align-items:center; gap:10px; padding:10px 12px; border-radius:8px; cursor:pointer; font-size:14px }
.combo .combo-item:hover{ background:#f6f3f0 }
.combo .combo-item .check{
  width:18px; height:18px; border-radius:6px; border:1.5px solid #cfcac4; display:inline-block; position:relative
}
.combo .combo-item .check.on{ background:var(--brown); border-color:var(--brown) }
.combo .combo-item .check.on::after{
  content:""; position:absolute; left:4px; top:1px; width:6px; height:10px;
  border:2px solid #fff; border-top:0; border-left:0; transform:rotate(45deg)
}
.combo .combo-source{ display:none }

/* Badges de categoria (usadas no menu de produtos unificado) */
.badge{ margin-left:auto; display:inline-flex; align-items:center; gap:4px;
  padding:2px 6px; border-radius:999px; font-size:11px; line-height:1; border:1px solid transparent; text-transform:capitalize }
.badge-animal{background:#eef7f2;border-color:#d7eee4;color:#2f6b53}
.badge-vegetal{background:#fff4e6;border-color:#ffe4c2;color:#7a4b1a}
.badge-artesanato{background:#f3eef7;border-color:#e3d7f1;color:#5e3a7a}
.badge-outros{background:#eef2f7;border-color:#d7e1f1;color:#364a7a}

/* ===== Drawer (painel de detalhes) ===== */
.pactas-drawer{
  position:fixed; top:var(--topbar-h); right:0; bottom:0; width:360px; background:#fff;
  border-left:1px solid #eee; box-shadow:-2px 0 16px rgba(0,0,0,.12);
  transform:translateX(100%); transition:transform .25s ease; display:flex; flex-direction:column; z-index:10000
}
.pactas-drawer.open{ transform:translateX(0) }
.pactas-drawer header{ display:flex; align-items:center; gap:8px; padding:16px 18px; border-bottom:1px solid #eee }
.pactas-drawer h2{ font-size:20px; margin:0; line-height:1.2; font-weight:700; letter-spacing:.2px }
.pactas-drawer .content{ padding:16px 18px; overflow:auto; font-size:14.5px; line-height:1.6 }
.pactas-drawer section{ margin:16px 0 18px }
.pactas-drawer h3{ margin:0 0 8px; font-size:13.5px; color:var(--brown); font-weight:700; letter-spacing:.2px }
.pactas-drawer .kv>div{ margin:6px 0 }
.pactas-chip{ display:inline-flex; align-items:center; gap:8px; padding:6px 10px; border-radius:999px; background:#f6f3f0; border:1px solid #eee; font-weight:600 }
.pactas-dot{ width:10px; height:10px; border-radius:50%; display:inline-block }
.pactas-close{ margin-left:auto; border:0; background:transparent; font-size:22px; line-height:1; cursor:pointer; color:#888 }
.pactas-close:hover{ color:#555 }

/* ===== Tooltip & contadores ===== */
.leaflet-tooltip.muni-tip{
  background:#fff; color:#2b2b2b; border:1px solid #e6e1db; border-radius:10px;
  padding:6px 10px; box-shadow:0 4px 16px rgba(0,0,0,.12);
  font-weight:600; letter-spacing:.2px; pointer-events:none; z-index:10000
}
.muni-count{
  display:flex; align-items:center; gap:6px; padding:6px 10px; background:#fff;
  border:1px solid #e6e1db; border-radius:16px; box-shadow:0 2px 10px rgba(0,0,0,.12);
  font-size:13px; color:#2f2f2f; white-space:nowrap
}
.muni-count .bubble{ min-width:22px; height:22px; line-height:22px; border-radius:999px; text-align:center; color:#fff; font-weight:700; padding:0 6px }
.muni-count .name{ font-weight:600 }

/* ===== Mobile: mapa full + bottom-sheet ===== */
@media (max-width:900px){
  :root{ --topbar-h:56px }
  .main{ grid-template-columns:1fr }
  .mapwrap{ position:fixed; inset:var(--topbar-h) 0 0 0 }
  #map{ position:absolute; inset:0 }
  .panel{
    position:fixed; left:0; right:0; bottom:0; z-index:5000;
    border-top:1px solid #E9E5E0; border-right:0; border-top-left-radius:14px; border-top-right-radius:14px;
    background:#fff; box-shadow:0 -12px 28px rgba(0,0,0,.12);
    height:var(--sheet-h,56px); display:flex; flex-direction:column; transition:height .22s ease
  }
  .panel[data-sheet="closed"]{ --sheet-h:56px }
  .panel[data-sheet="peek"]  { --sheet-h:38vh }
  .panel[data-sheet="full"]  { --sheet-h:86vh }
}

/* Esconde botão “Aplicar” (auto-aplica filtros) */
#apply{ display:none !important }

.main{
  display: grid;
  grid-template-columns: 380px 1fr;
  height: calc(100vh - var(--topbar-h));   /* era min-height / dvh */
}

.panel{
  padding: 12px;
  background: #fff;
  border-right: 1px solid #eee;
  overflow: auto;
}

.mapwrap{
  position: relative;
  height: 100%;                             /* garante a altura do grid */
}

#map{
  position: absolute;
  inset: 0;                                  /* ocupa toda a mapwrap */
}

.pactas-header{
  display:grid;
  grid-template-columns: 1fr auto 1fr;  /* centro fixo */
  align-items:center;
  height: var(--topbar-h);
  background: var(--sheet-bg);
  border-bottom:1px solid #E9E5E0;
}
.pactas-header .brand{
  grid-column:2;                          /* sempre no centro */
  display:flex; align-items:center; gap:12px;
  justify-self:center;
}
.pactas-header .hdr-side{ min-width:0; }  /* colunas laterais “flex” */

/* Popup móvel removido - usando definição consolidada abaixo */
/* Painel sem “borda de caixa” no mobile e com cantos arredondados */
.panel{
  border: 0;                      /* remove aquela borda externa */
  border-top-left-radius: 16px;
  border-top-right-radius: 16px;
  background: var(--sheet-bg, #F7F6F4);
  box-shadow: 0 -12px 28px rgba(0,0,0,.12);
}

/* Cabeçalho do sheet com alça (grab) central */
.sheet-header{
  position: relative;
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding: 14px 12px 10px;
  border-bottom: 1px solid #E9E5E0;
  background: var(--sheet-bg, #F7F6F4);
}

.sheet-header .grab{
  position:absolute;
  top:6px; left:50%; transform:translateX(-50%);
  width:42px; height:5px; border-radius:999px;
  background:#d9d5cf;             /* cor da “alça” */
  pointer-events:none;
}

/* Corpo do sheet sem borda extra */
.sheet-body{
  background: var(--sheet-bg, #F7F6F4);
  padding: 12px;
  border: 0;
}

/* Botão pequeno no header */
.btn.sm{ height:32px; padding:0 10px; font-size:12.5px }

/* Só no mobile o sheet fica sobre o mapa */
@media (max-width:900px){
  .panel{
    position: fixed; left:0; right:0; bottom:0; z-index:5000;
    transition: height .22s ease;
    height: var(--sheet-h, 56px);
  }
  .panel[data-sheet="closed"]{ --sheet-h: 56px; }
  .panel[data-sheet="peek"]  { --sheet-h: 38vh; }
  .panel[data-sheet="full"]  { --sheet-h: 86vh; }
}
:root{ --topbar-h:64px; }
@media (max-width:900px){ :root{ --topbar-h:56px; } }

.mapwrap{ position:fixed; inset: var(--topbar-h) 0 0 0; }
#map{ position:absolute; inset:0; }

/* Desktop: painel normal na esquerda */
@media (min-width:901px){
  .panel{ position: static; height:auto; box-shadow:none; border:0; }
}

/* Mobile: bottom-sheet sobre o mapa */
@media (max-width:900px){
  .panel{
    position: fixed; left:0; right:0; bottom:0; z-index:5000;
    height: var(--sheet-h, 56px);
    border-top-left-radius: 16px; border-top-right-radius:16px;
    background: var(--sheet-bg,#F7F6F4); box-shadow:0 -12px 28px rgba(0,0,0,.12);
    border-top:1px solid #E9E5E0;
  }
  .panel[data-sheet="closed"]{ --sheet-h:56px; }  /* cabeçalho fechado */
  .panel[data-sheet="peek"]  { --sheet-h:38vh; }
  .panel[data-sheet="full"]  { --sheet-h:86vh; }
  .sheet-header{
    position:relative; padding:14px 12px 10px; border-bottom:1px solid #E9E5E0;
    background: var(--sheet-bg,#F7F6F4);
  }
  .sheet-header .grab{
    position:absolute; left:50%; top:6px; transform:translateX(-50%);
    width:42px; height:5px; border-radius:999px; background:#d9d5cf;
  }
  .sheet-body{ padding:12px; overflow:auto; background:var(--sheet-bg,#F7F6F4); }
}

/* ===== DESKTOP: sidebar visível à esquerda e mapa na direita ===== */
@media (min-width: 901px){
  .main{
    display: grid;
    grid-template-columns: 380px 1fr;          /* painel + mapa */
    column-gap: 0;
    height: calc(100vh - var(--topbar-h));     /* ocupa a tela abaixo do header */
  }

  /* painel volta a ser uma coluna normal */
  .panel{
    position: relative;                        /* NÃO fixed no desktop */
    inset: auto;
    height: auto;
    overflow: auto;
    box-shadow: none;
    border: 0;
    border-right: 1px solid #eee;              /* opcional */
    z-index: 1;
  }

  /* mapa deixa de ser fixed no desktop */
  .mapwrap{
    position: relative;                        /* NÃO fixed aqui */
    inset: auto;
    height: auto;
  }
  #map{
    position: absolute;                        /* ocupa toda a coluna do mapa */
    inset: 0;
  }
}

/* ===== MOBILE continua como bottom-sheet ===== */
@media (max-width: 900px){
  .main{ grid-template-columns: 1fr; }
  .panel{
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 5000;
    height: var(--sheet-h, 56px);
  }
  .mapwrap{ position: fixed; inset: var(--topbar-h) 0 0 0; }
  #map{ position: absolute; inset: 0; }
}

/* Definição duplicada removida - usando versão consolidada */
/* ===== Header centralizado ===== */
:root{
  --topbar-h: 64px;
  --sheet-bg: #F7F6F4;
}

.pactas-header{
  position: sticky;
  top: 0;
  z-index: 3000;
  background: var(--sheet-bg);
  border-bottom: 1px solid #E9E5E0;
}

.pactas-header .header-inner{
  height: var(--topbar-h);
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr auto 1fr; /* centraliza a marca */
  align-items: center;
  padding: 0 12px;
}

.pactas-header .wordmark{
  height: 40px;
  justify-self: center;
}

/* ===== Layout base (garante painel no desktop) ===== */
.main{
  display: grid;
  grid-template-columns: 380px 1fr;
  min-height: calc(100dvh - var(--topbar-h));
}

.panel{
  position: relative;
  height: auto;
  border-right: 1px solid #eee;
  background: #fff;
}

/* ===== Bottom-sheet (mobile) ===== */
@media (max-width: 900px){
  .main{ grid-template-columns: 1fr; }
  .mapwrap{ position: fixed; inset: var(--topbar-h) 0 0 0; }
  #map{ position: absolute; inset: 0; }

  .panel{
    position: fixed;
    left: 0; right: 0; bottom: 0;
    z-index: 5000;
    background: var(--sheet-bg);
    border-top: 1px solid #E9E5E0;
    border-top-left-radius: 14px;
    border-top-right-radius: 14px;
    box-shadow: 0 -12px 28px rgba(0,0,0,.12);
    height: var(--sheet-h, 56px);
    transition: height .22s ease;
  }
  .panel[data-sheet="closed"]{ --sheet-h: 56px; }
  .panel[data-sheet="peek"]  { --sheet-h: 38vh; }
  .panel[data-sheet="full"]  { --sheet-h: 86vh; }
}

/* Cabeçalho do sheet (com “pegador”) */
.sheet-header{
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
  border-bottom: 1px solid #eee;
  background: inherit;
}

.sheet-header .sheet-title{
  font-weight: 700;
  color: var(--green);
}

.sheet-header .grab{
  position: absolute;
  left: 50%; transform: translateX(-50%);
  top: 6px;
  width: 40px; height: 5px;
  border-radius: 999px;
  background: #d9d5cf;
}

/* Definição duplicada removida - usando versão consolidada abaixo */

.leaflet-popup-content-wrapper {
  width: 90vw !important;     /* 90% da largura da tela */
  max-height: 70vh !important; /* 70% da altura da tela */
  overflow-y: auto !important; /* rolagem se o texto for longo */
  border-radius: 12px;
}

.leaflet-popup-content {
  font-size: 0.95rem;
  line-height: 1.3;
  padding: 10px;
}

@media (min-width: 768px) {
  .leaflet-popup-content-wrapper {
    width: 300px !important;
    max-height: none;
  }
}
/* === Mobile Info (card) - versão consolidada === */
.mobile-info{
  position: fixed;
  left: 12px; right: 12px;
  bottom: calc(12px + var(--sheet-offset, 0px));
  z-index: 7000;
  background:#fff;
  border:1px solid #E9E5E0;
  border-radius: 14px;
  box-shadow: 0 16px 40px rgba(0,0,0,.22);
  max-height: 75vh;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 14px 16px;
  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, "Noto Sans", sans-serif;
  line-height: 1.55;
  -webkit-overflow-scrolling: touch;

  /* animação */
  transform: translateY(16px);
  opacity: 0;
  transition: transform .22s ease, opacity .22s ease;
}
.mobile-info.show{ transform: translateY(0); opacity: 1; }

/* quando o sheet estiver aberto, empurra a caixa pra cima */
@media (max-width:900px){
  .panel[data-sheet="peek"] ~ .mobile-info{ --sheet-offset: 38vh; }
  .panel[data-sheet="full"] ~ .mobile-info{ --sheet-offset: 86vh; }
}

.mobile-info header{
  display:flex; align-items:center; gap:10px; margin:0 0 10px 0;
}
.mobile-info header h3{ margin:0; font-size:16px; font-weight:700; letter-spacing:.2px;}
.mobile-info .dot{ width:10px; height:10px; border-radius:50%; display:inline-block; }
.mobile-info .close{
  margin-left:auto; border:0; background:transparent; font-size:22px; line-height:1;
  color:#888; cursor:pointer;
}
.mobile-info .close:hover{ color:#555; }

.mobile-info .section{ margin: 12px 0 14px; }
.mobile-info .section:last-child{ margin-bottom: 8px; }
.mobile-info .label{ font-weight:700; color:#8F553A; font-size:13px; margin-bottom:6px; display:block; }
.mobile-info .kv{ font-size:14px; }
.mobile-info .kv div{ margin:5px 0; word-wrap:break-word; }

/* Backdrop do card móvel */
.mi-backdrop{
  position:fixed; inset:0; z-index: 5900;
  background: rgba(0,0,0,.18);
  backdrop-filter: blur(1px);
}

/* Quando o sheet (painel de filtros) estiver aberto, o card sobe junto */
@media(max-width:900px){
  .panel[data-sheet="peek"] ~ .mobile-info{ bottom: calc(12px + 38vh); }
  .panel[data-sheet="full"] ~ .mobile-info{ bottom: calc(12px + 86vh); }
}
/* panes com z-index previsíveis */
.leaflet-pane.leaflet-overlay-pane { z-index: 400; }  /* polígonos */
.leaflet-pane.leaflet-marker-pane  { z-index: 650; }  /* pins (default) */
.pins-pane { z-index: 700; }                          /* nossa pane de pins, ainda mais alta */

.leaflet-pane.leaflet-overlay-pane { z-index: 300; }  /* polígonos */
.leaflet-pane.leaflet-marker-pane  { z-index: 650; }  /* pins */
.leaflet-interactive:focus { outline: none !important; } /* remove quadrado preto */


/* Aviso de divergência de dados do mapa */
.map-notice {
  font-size: 12px;
  color: #6b5a45;
  background: #fdf6ec;
  border: 1px solid #e8d5b7;
  border-radius: 6px;
  padding: 8px 10px;
  margin: 8px 12px 4px;
  line-height: 1.5;
}

/* ============================================================
   GRUPO 3 — Header polido
   ============================================================ */

/* Cantos inferiores arredondados + sombra sutil */
.pactas-header {
  border-radius: 0 0 18px 18px;
  box-shadow: 0 4px 20px rgba(0,0,0,.07);
  z-index: 3001; /* sombra sobre o painel abaixo */
}

/* Ícone admin ancorado no canto direito da terceira coluna */
.pactas-header .hdr-side.right {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  padding-right: 4px;
}

/* Hover no botão admin */
#adminBtn {
  display: inline-flex;
  align-items: center;
  transition: transform .15s ease, opacity .15s ease;
  border-radius: 8px;
  padding: 4px;
}
#adminBtn:hover { transform: scale(1.1); opacity: .8; }

/* ============================================================
   GRUPO 4 — Animações e transições
   ============================================================ */

/* --- Keyframes --- */
@keyframes fadeSlideInLeft {
  from { opacity: 0; transform: translateX(-8px); }
  to   { opacity: 1; transform: translateX(0); }
}
@keyframes menuDropIn {
  from { opacity: 0; transform: translateY(-6px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes drawerContentFade {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* Botões: transição + micro-feedback no clique */
.btn {
  cursor: pointer;
  transition: filter .15s ease, transform .12s ease, background-color .15s ease;
}
.btn:active { transform: scale(.96); }
.btn.secondary { transition: background-color .15s ease, border-color .15s ease, transform .12s ease; }

/* Hover nos itens do combo */
.combo .combo-item { transition: background-color .12s ease; }

/* Animação de entrada do menu do combo ao abrir */
.combo.open .combo-menu { animation: menuDropIn .15s ease; }

/* Grupos de filtro: sombra extra no hover */
.group { transition: box-shadow .2s ease; }
.group:hover { box-shadow: 0 3px 10px rgba(0,0,0,.08); }

/* Painel lateral: fade-in ao carregar (desktop) */
@media (min-width: 901px) {
  .panel { animation: fadeSlideInLeft .3s ease; }
}

/* Conteúdo do drawer: fade-in ao abrir */
.pactas-drawer .content { animation: drawerContentFade .2s ease; }

/* Transição suave nos polígonos do mapa */
.leaflet-interactive { transition: fill-opacity .2s ease, stroke-width .2s ease; }

/* Caret do combo: rotação suave ao abrir/fechar */
.combo .combo-caret { transition: transform .15s ease; }
.combo.open .combo-caret { transform: translateY(-50%) rotate(180deg); }

/* Toggle de contornos municipais */
.toggle { cursor: pointer; transition: color .15s ease; }
.toggle:hover { color: var(--brown); }

/* ============================================================
   GRUPO 5 — Bordas arredondadas e visuais amigáveis
   ============================================================ */

/* Header: cantos inferiores mais generosos */
.pactas-header {
  border-radius: 0 0 24px 24px;
  box-shadow: 0 4px 24px rgba(0,0,0,.08);
}

/* Logo clicável */
.brand { cursor: pointer; user-select: none; }

/* Painel de filtros (desktop): cantos direitos arredondados + sombra lateral */
@media (min-width: 901px) {
  .panel {
    border-radius: 0 20px 20px 0;
    box-shadow: 3px 0 20px rgba(0,0,0,.06);
    border-right: 0;
  }
  .sheet-header {
    border-radius: 0 20px 0 0;
  }
}

/* Painel mobile (bottom-sheet): cantos superiores mais arredondados */
@media (max-width: 900px) {
  .panel {
    border-top-left-radius: 22px;
    border-top-right-radius: 22px;
  }
}

/* Grupos de filtro: cantos mais suaves */
.group {
  border-radius: 16px;
}