
    /* Legenda (scura) */
    .dsc-legend {
      background: var(--panel);
      color: var(--text);
      padding: 10px 12px;
      border: 1px solid var(--border);
      border-radius: 8px;
      box-shadow: 0 8px 24px rgba(0,0,0,.30);
      font: 14px/1.2 system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
    }
    .dsc-legend h4 {
      margin: 0 0 8px 0; font-size: 13px; font-weight: 700; color: var(--muted);
    }
    .dsc-legend .item { display: flex; align-items: center; gap: 8px; margin: 6px 0; }
    .dsc-legend .swatch { width: 18px; height: 18px; border: 2px solid transparent; box-sizing: border-box; }


/* Bottone per riaprire la legenda */
.legend-toggle {
  background: var(--panel);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 999px;
  padding: 8px 12px;
  font: 14px/1 system-ui, -apple-system, Segoe UI, Roboto, Arial;
  box-shadow: 0 8px 24px rgba(0,0,0,.30);
}
.legend-toggle:active { transform: translateY(1px); }

/* Legenda: dimensioni e scroll su schermi piccoli */
@media (max-width: 640px) {
  .dsc-legend {
    max-width: 78vw;
    max-height: 38vh;
    overflow: auto;
    padding: 8px 10px;
  }
  .dsc-legend h4 { font-size: 12px; margin-bottom: 6px; }
  .dsc-legend .item { margin: 4px 0; }
  .dsc-legend .swatch { width: 16px; height: 16px; }
}

/* Alza il bottone "Legenda" quando la legenda è chiusa (solo mobile) */
/* @media (max-width: 640px) {
  .leaflet-bottom .legend-toggle {
    margin-bottom: calc(env(safe-area-inset-bottom, 0px + 34px));
  }
} */

.legend-toggle {
  position: fixed !important;
  left: 5px;
  bottom: 0px;
}

.satelliteToggle-btn{
  background:var(--panel);
  color:var(--text);
  border:1px solid var(--border);
  border-radius:999px;
  padding:6px 10px;
  box-shadow:0 8px 24px rgba(0,0,0,.30);
  cursor:pointer;
  white-space:nowrap;
  background:#0d47a1;
  color:#fff;
}

.satelliteToggle-btn.active{
  background:#0d47a1;
  color:#fff;
}

.topoToggle-btn{
  background:var(--panel);
  color:var(--text);
  border:1px solid var(--border);
  border-radius:999px;
  padding:6px 10px;
  box-shadow:0 8px 24px rgba(0,0,0,.30);
  cursor:pointer;
  white-space:nowrap;
}

.topoToggle-btn.active{
  background:#0d47a1;
  color:#fff;
}


.airToggle-btn{
    position:absolute;
    left: 12px;
    bottom: 80px;
    z-index:3500;
    background:var(--panel);
    color:var(--text);
    border:1px solid var(--border);
    border-radius:999px;
    padding:6px 10px;
    box-shadow:0 8px 24px rgba(0,0,0,.30);
    display:none;
}

.gliderToggle-btn{
    position:absolute;
    left:12px;
    bottom:116px;   /* 👈 tra droni e ADS-B */
    z-index:3500;
    background:var(--panel);
    color:var(--text);
    border:1px solid var(--border);
    border-radius:999px;
    padding:6px 10px;
    box-shadow:0 8px 24px rgba(0,0,0,.30);
    display:none;
}

.droneToggle-btn{
    position:absolute;
    left: 12px;
    bottom: 152px;
    z-index:3500;
    background:var(--panel);
    color:var(--text);
    border:1px solid var(--border);
    border-radius:999px;
    padding:6px 10px;
    box-shadow:0 8px 24px rgba(0,0,0,.30);
    display:none;
}
.doaToggle-btn{
    position:absolute;
    left: 12px;
    bottom: 188px;   /* 40px sopra */
    z-index:3500;
    background:var(--panel);
    color:var(--text);
    border:1px solid var(--border);
    border-radius:999px;
    padding:6px 10px;
    box-shadow:0 8px 24px rgba(0,0,0,.30);
    display:none;
}
@media (max-width: 640px) {
  .satelliteToggle-btn {
    position:absolute;
    left:0px;
    bottom:23px;
    z-index:3500;
    gap:6px;
  }

  .topoToggle-btn {
    position:absolute;
    left:80px;
    bottom:23px;
    z-index:3500;
    gap:6px;
  }

  .airToggle-btn {
    position:absolute;
    left:12px;
    bottom:97px;
    z-index:3500;
    gap:6px;
  }

  .gliderToggle-btn {
    position:absolute;
    left:12px;
    bottom:127px;
    z-index:3500;
    gap:6px;
  }  

  .droneToggle-btn {
    position:absolute;
    left:12px;
    bottom:157px;
    z-index:3500;
    gap:6px;
  } 

  .doaToggle-btn {
    position:absolute;
    left:12px;
    bottom:187px;
    z-index:3500;
    gap:6px;
  }     
}  