/* Override icone Mapbox built-in con SVG inline brand var(--brand-base).
   Usiamo background-image override (invece di CSS filter che dipendeva
   da specificita' e non veniva applicato in tutti i contesti). Con
   !important per vincere sempre il default Mapbox.  */
button.mapboxgl-ctrl-zoom-in .mapboxgl-ctrl-icon {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M10 4 L10 16 M4 10 L16 10' stroke='%23890103' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") !important;
}
button.mapboxgl-ctrl-zoom-out .mapboxgl-ctrl-icon {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M4 10 L16 10' stroke='%23890103' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") !important;
}
button.mapboxgl-ctrl-compass .mapboxgl-ctrl-icon,
button.mapboxgl-ctrl-fullscreen .mapboxgl-ctrl-icon,
button.mapboxgl-ctrl-shrink .mapboxgl-ctrl-icon {
  filter: brightness(0) saturate(100%) invert(7%) sepia(95%) saturate(7500%) hue-rotate(3deg) brightness(94%) contrast(115%) !important;
}

.mapboxgl-ctrl-group-cad {
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
}

.mapboxgl-ctrl-group-cad button {
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 17px;
  line-height: 1;
  position: relative;
  padding: 0;
  text-align: center;
}

.mapboxgl-ctrl-group-cad button svg {
  width: 16px;
  height: 16px;
  display: block;
}

.mapboxgl-ctrl-group-cad button img {
  width: 16px;
  height: 16px;
  display: block;
  margin: 0 auto;
}

.mapboxgl-ctrl-group-draw button {
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 17px;
  line-height: 1;
  font-weight: 400;
  color: var(--brand-text-primary);
}

.mapboxgl-ctrl-group-draw button.active {
  background-color: var(--brand-border);
}

body.portal-assegnazioni #surfaceGroupNavWindow {
  display: none !important;
}

body.portal-assegnazioni .mapboxgl-ctrl-group-cad,
body.portal-assegnazioni .mapboxgl-ctrl-group-draw {
  display: none !important;
}

.mapboxgl-ctrl-group-draw svg {
  width: 16px;
  height: 16px;
  display: block;
}

.mapboxgl-ctrl-group .mapboxgl-ctrl-geoloc,
.mapboxgl-ctrl-group .mapboxgl-ctrl-reset,
.mapboxgl-ctrl-group .mapboxgl-ctrl-streetview {
  background-image: none;
  text-indent: 0;
  overflow: visible;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 17px;
  line-height: 1;
}

.mapboxgl-ctrl-top-left {
  display: flex;
  flex-direction: column;
  /* padding-top = altezza tab strip sidebar (var settata a runtime da
   * lucide-icons.js syncTabStripHeight, default 42px). Il top della toolbar
   * coincide cosi' con la linea border-bottom delle tabs Mappe/Fonti/etc. */
  padding: var(--tab-strip-height, 48px) 0 0 0;
  z-index: 3600;
}

.mapboxgl-ctrl-top-left .mapboxgl-ctrl {
  margin: 0 !important;
}

.mapboxgl-ctrl-top-left .mapboxgl-ctrl-group-cad {
  margin-top: 15px !important;
}

.mapboxgl-ctrl-top-left .mapboxgl-ctrl-group-draw {
  margin-top: 15px !important;
}

.mapboxgl-ctrl-top-left .mapboxgl-style-switcher {
  margin-top: 10px !important;
  margin-bottom: 10px !important;
  padding: 4px;
  width: auto;
  min-width: 0;
}

.mapboxgl-ctrl-group .mapboxgl-style-switcher {
  width: 30px;
  height: 30px;
  padding: 0;
  /* Mask brand-aware: background-color: var(--brand-base) colora l'icona */
  background-image: none;
  background-color: var(--brand-base);
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 54.849 54.849'><path d='M54.497,39.614l-10.363-4.49l-14.917,5.968c-0.537,0.214-1.165,0.319-1.793,0.319c-0.627,0-1.254-0.104-1.79-0.318l-14.921-5.968L0.351,39.614c-0.472,0.203-0.467,0.524,0.01,0.716L26.56,50.81c0.477,0.191,1.251,0.191,1.729,0L54.488,40.33C54.964,40.139,54.969,39.817,54.497,39.614z'/><path d='M54.497,27.512l-10.364-4.491l-14.916,5.966c-0.536,0.215-1.165,0.321-1.792,0.321c-0.628,0-1.256-0.106-1.793-0.321l-14.918-5.966L0.351,27.512c-0.472,0.203-0.467,0.523,0.01,0.716L26.56,38.706c0.477,0.19,1.251,0.19,1.729,0l26.199-10.479C54.964,28.036,54.969,27.716,54.497,27.512z'/><path d='M0.361,16.125l13.662,5.465l12.537,5.015c0.477,0.191,1.251,0.191,1.729,0l12.541-5.016l13.658-5.463c0.477-0.191,0.48-0.511,0.01-0.716L28.277,4.048c-0.471-0.204-1.236-0.204-1.708,0L0.351,15.41C-0.121,15.614-0.116,15.935,0.361,16.125z'/></svg>");
          mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 54.849 54.849'><path d='M54.497,39.614l-10.363-4.49l-14.917,5.968c-0.537,0.214-1.165,0.319-1.793,0.319c-0.627,0-1.254-0.104-1.79-0.318l-14.921-5.968L0.351,39.614c-0.472,0.203-0.467,0.524,0.01,0.716L26.56,50.81c0.477,0.191,1.251,0.191,1.729,0L54.488,40.33C54.964,40.139,54.969,39.817,54.497,39.614z'/><path d='M54.497,27.512l-10.364-4.491l-14.916,5.966c-0.536,0.215-1.165,0.321-1.792,0.321c-0.628,0-1.256-0.106-1.793-0.321l-14.918-5.966L0.351,27.512c-0.472,0.203-0.467,0.523,0.01,0.716L26.56,38.706c0.477,0.19,1.251,0.19,1.729,0l26.199-10.479C54.964,28.036,54.969,27.716,54.497,27.512z'/><path d='M0.361,16.125l13.662,5.465l12.537,5.015c0.477,0.191,1.251,0.191,1.729,0l12.541-5.016l13.658-5.463c0.477-0.191,0.48-0.511,0.01-0.716L28.277,4.048c-0.471-0.204-1.236-0.204-1.708,0L0.351,15.41C-0.121,15.614-0.116,15.935,0.361,16.125z'/></svg>");
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask-size: 16px 16px;
          mask-size: 16px 16px;
}

.mapboxgl-style-switcher {
  display: block !important;
}

.mapboxgl-ctrl-group {
  position: relative;
  overflow: visible !important;
  display: inline-flex !important;
  flex-direction: column !important;
  z-index: 3600;
}

.mapboxgl-ctrl-group.mapboxgl-ctrl {
  display: inline-flex !important;
  flex-direction: column !important;
  align-items: stretch;
}

.mapboxgl-ctrl-group.mapboxgl-ctrl > button {
  display: block;
}

.mapboxgl-ctrl-group .mapboxgl-style-switcher.style-switcher-open {
  /* Stato aperto: stessa icona, colore brand piu' intenso (deep-bg) */
  background-color: var(--brand-deep-bg);
}

.mapboxgl-style-list {
  position: absolute;
  top: 0;
  left: 36px;
  transform: none;
  z-index: 3605;
  display: none;
  min-width: 160px;
  max-width: 220px;
  background: #ffffff;
  border: 1px solid var(--brand-border);
  border-radius: 8px;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
  padding: 4px 0;
}

.mapboxgl-ctrl-group .mapboxgl-style-list button {
  font-size: 13px;
  padding: 6px 10px 5px;
  text-align: left;
}

.mapboxgl-style-switcher select {
  font-size: 13px;
  line-height: 1.2;
  padding: 2px 6px;
  width: auto;
  min-width: 0;
}

.mapboxgl-ctrl-bottom-left {
  display: flex;
  flex-direction: column;
  padding: 0 0 10px 0; /* attaccata al bordo sx (era 10px left) */
}

.mapboxgl-ctrl-bottom-left .mapboxgl-ctrl {
  margin: 0 !important;
}

.mapboxgl-ctrl-bottom-left .mapboxgl-ctrl-group-cad {
  margin-bottom: 10px !important;
}

.mapboxgl-ctrl-bottom-left .mapboxgl-ctrl-group.mapboxgl-ctrl {
  display: inline-flex !important;
  flex-direction: column !important;
  align-items: stretch;
}

.mapboxgl-ctrl-bottom-left .mapboxgl-ctrl-group.mapboxgl-ctrl > button {
  display: block;
}

.mapboxgl-ctrl-group .mapboxgl-ctrl-zoom-in,
.mapboxgl-ctrl-group .mapboxgl-ctrl-zoom-out {
  background: #ffffff !important;
  background-image: none !important;
  border: none;
  border-radius: 6px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12);
  width: 30px;
  height: 30px;
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  mask-image: none !important;
  -webkit-mask-image: none !important;
}

.mapboxgl-ctrl-group .mapboxgl-ctrl-zoom-in .mapboxgl-ctrl-icon,
.mapboxgl-ctrl-group .mapboxgl-ctrl-zoom-out .mapboxgl-ctrl-icon {
  display: none !important;
  background-image: none !important;
}

.mapboxgl-ctrl-group .mapboxgl-ctrl-zoom-in::before {
  content: "+";
  color: var(--text-secondary);
  font-size: 19px;
  font-weight: 700;
  line-height: 1;
}

.mapboxgl-ctrl-group .mapboxgl-ctrl-zoom-out::before {
  content: "−";
  color: var(--text-secondary);
  font-size: 19px;
  font-weight: 700;
  line-height: 1;
}

.mapboxgl-ctrl-group .mapboxgl-ctrl-zoom-in::after,
.mapboxgl-ctrl-group .mapboxgl-ctrl-zoom-out::after {
  display: none !important;
  content: none !important;
  background: none !important;
}


.mapboxgl-ctrl-geoloc svg,
.mapboxgl-ctrl-reset svg {
  width: 16px;
  height: 16px;
}

.mapboxgl-ctrl-streetview svg,
.mapboxgl-ctrl-streetview img {
  width: 17px;
  height: 17px;
  display: block;
}

.mapboxgl-ctrl-streetview .streetview-icon-wrap {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.mapboxgl-ctrl-streetview img {
  margin: 0 auto;
  object-fit: contain;
  object-position: center;
}

.mapboxgl-ctrl-group .mapboxgl-ctrl-streetview:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.mapboxgl-ctrl-fit {
  background-image: none !important;
  background-color: #ffffff;
  position: relative;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  text-indent: 0 !important;
}

.mapboxgl-ctrl-fit svg {
  width: 18px !important;
  height: 18px !important;
  display: block !important;
  margin: 0 !important;
  position: static !important;
  transform: none !important;
}

.mapboxgl-ctrl-zoom-indicator {
  width: 38px;
  height: 24px;
  margin: 3px auto;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  color: #334155;
  background: var(--brand-interactive-bg);
  border: 1px solid #d5dbe3;
  border-radius: 6px;
  user-select: none;
  pointer-events: none;
}

/* Icona "Adatta vista ai marker" (era ::before content: "⤢" con carattere
   Unicode U+2922 che non era sempre reso dal font di sistema — tofu ▢ in
   font senza glyph). Ora SVG inline rendered dal JS in mapcontrol-core.js
   come per gli altri bottoni (reset, geolocate). */

.mapboxgl-ctrl-group-cad button.active {
  background-color: var(--brand-border);
}



/* marker selezionato leggermente più grande */
.cad-pin-selected img,
.cad-pin-selected svg,
.cad-pin-selected {
  transform: scale(1.1);
}

/* cursore marker + croce (overlay personalizzato) */
#catastoCursor {
  position: absolute;
  width: 32px;
  height: 32px;
  pointer-events: none;
  transform: translate(-16px, -32px);
  display: none;
  z-index: 50;
}

#catastoCursor .catasto-cursor-cross {
  position: absolute;
  bottom: 2px;
  left: 16px;
  width: 16px;
  height: 16px;
  transform: translate(-50%, 0);
}

#catastoCursor .catasto-cursor-cross::before,
#catastoCursor .catasto-cursor-cross::after {
  content: "";
  position: absolute;
  background: var(--brand-text-primary);
}

#catastoCursor .catasto-cursor-cross::before {
  width: 1px;
  height: 16px;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
}

#catastoCursor .catasto-cursor-cross::after {
  width: 16px;
  height: 1px;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}

#catastoCursor .catasto-cursor-pin {
  position: absolute;
  bottom: 10px;
  left: 16px;
  width: 18px;
  height: 18px;
  background: var(--interactive);
  border-radius: 50% 50% 50% 0;
  transform: translate(-50%, 0) rotate(-45deg);
  box-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
}

#catastoCursor .catasto-cursor-pin::after {
  content: "";
  position: absolute;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #ffffff;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/* ============================================================== *
 * REDESIGN OTTANIO V2 — TOOLBOX MAPBOX (introdotto 2026-05-03)
 * Riferimento: docs/redesign/DeskControl Perizie - Handoff Sviluppo.md sez. 3.7
 * Override completi per stilizzare le toolbar Mapbox (zoom + custom controls
 * + mapbox-gl-draw) come toolbar verticale ottanio v2:
 *   - Container 38px wide, sfondo bianco, bordo --ott-200, radius 8, shadow-md
 *   - Bottoni 38x36, hover --ott-50, active --ott-base bianco
 *   - Icone Lucide stroke 2 via mask-image + background-color brand-aware
 *   - Gruppi separati visivamente (zoom + cad + draw)
 * ============================================================== */

/* Container gruppi ctrl: ATTACCATO al bordo sx (no border-left, no shadow heavy).
 * I gruppi adiacenti si fondono visivamente (vedi piu' giu' override radius
 * first/last child). overflow visible per permettere ai dropdown
 * (style-switcher) di sfondare il container. */
.mapboxgl-ctrl-group {
  background: var(--paper) !important;
  border: 1px solid var(--ott-200) !important;
  border-left: 0 !important;
  border-radius: 0 !important;
  box-shadow: var(--rd-shadow-sm) !important;
  overflow: visible !important;
}

/* Buttons standard 38x36, no border, color --ott-500 default */
.mapboxgl-ctrl-group button {
  width: 38px !important;
  height: 36px !important;
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: var(--ott-500) !important;
  transition: background var(--t-fast), color var(--t-fast) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative;
  cursor: pointer;
}
.mapboxgl-ctrl-group button + button {
  border-top: 1px solid var(--ott-200) !important;
}
.mapboxgl-ctrl-group button:hover {
  background: var(--ott-50) !important;
  color: var(--ott-base) !important;
}
.mapboxgl-ctrl-group button:disabled,
.mapboxgl-ctrl-group button[aria-disabled="true"] {
  opacity: 0.4;
  cursor: not-allowed;
}
.mapboxgl-ctrl-group button.active,
.mapboxgl-ctrl-group button.mapbox-gl-draw_active,
.mapboxgl-ctrl-group button[aria-pressed="true"] {
  background: var(--ott-base) !important;
  color: #fff !important;
}
.mapboxgl-ctrl-group button.active:hover,
.mapboxgl-ctrl-group button.mapbox-gl-draw_active:hover {
  background: var(--ott-soft) !important;
}

/* Reset background-image custom precedenti */
.mapboxgl-ctrl-group button .mapboxgl-ctrl-icon,
.mapboxgl-ctrl-group button.mapboxgl-ctrl-icon {
  background-image: none !important;
  filter: none !important;
}

/* Pseudo-element interno: solo per bottoni con mask-image definita (vedi sotto).
   Default = nessun ::before (per non mostrare quadratini vuoti su bottoni custom). */
.mapboxgl-ctrl-group button::before { display: none; }

/* Helper: bottoni che USANO il ::before Lucide condividono questa regola base. */
.mapboxgl-ctrl-group button.mapboxgl-ctrl-zoom-in::before,
.mapboxgl-ctrl-group button.mapboxgl-ctrl-zoom-out::before,
.mapboxgl-ctrl-group button.mapboxgl-ctrl-compass::before,
.mapboxgl-ctrl-group button.mapboxgl-ctrl-fullscreen::before,
.mapboxgl-ctrl-group button.mapboxgl-ctrl-shrink::before,
.mapboxgl-ctrl-group button.mapboxgl-ctrl-geoloc::before,
.mapboxgl-ctrl-group button.mapboxgl-ctrl-reset::before,
.mapboxgl-ctrl-group button.mapboxgl-ctrl-fit::before,
.mapboxgl-ctrl-group button.mapboxgl-ctrl-share::before,
.mapboxgl-ctrl-group button.mapboxgl-ctrl-heatmap::before,
.mapboxgl-ctrl-group button.mapboxgl-style-switcher::before,
.mapboxgl-ctrl-group button.mapbox-gl-draw_polygon::before,
.mapboxgl-ctrl-group button.mapbox-gl-draw_point::before,
.mapboxgl-ctrl-group button.mapbox-gl-draw_line::before,
.mapboxgl-ctrl-group button.mapbox-gl-draw_trash::before,
.mapboxgl-ctrl-group button.mapbox-gl-draw_combine::before,
.mapboxgl-ctrl-group button.mapbox-gl-draw_uncombine::before,
.mapboxgl-ctrl-group .mapboxgl-ctrl-icon.mapboxgl-ctrl-measure-line::before {
  display: inline-block !important;
  content: "" !important;
  width: 17px !important;
  height: 17px !important;
  background-color: currentColor !important;
  background-image: none !important;
  -webkit-mask-repeat: no-repeat !important;
  mask-repeat: no-repeat !important;
  -webkit-mask-position: center !important;
  mask-position: center !important;
  -webkit-mask-size: 17px 17px !important;
  mask-size: 17px 17px !important;
  color: inherit !important;
  font-size: 0 !important;
}

/* Bottoni con mask-image Lucide: nascondi TUTTI i children (svg/img/span) e
 * azzera background-image legacy. Eccezioni (.mapboxgl-ctrl-streetview, .cad-screenshot,
 * .cad-fastmap, .cad-fastmap-selected) non sono in questa lista perche'
 * lasciate con icone originali (vedi blocco cad-* sotto). */
.mapboxgl-ctrl-group button.mapboxgl-ctrl-zoom-in,
.mapboxgl-ctrl-group button.mapboxgl-ctrl-zoom-out,
.mapboxgl-ctrl-group button.mapboxgl-ctrl-compass,
.mapboxgl-ctrl-group button.mapboxgl-ctrl-fullscreen,
.mapboxgl-ctrl-group button.mapboxgl-ctrl-shrink,
.mapboxgl-ctrl-group button.mapboxgl-ctrl-geoloc,
.mapboxgl-ctrl-group button.mapboxgl-ctrl-reset,
.mapboxgl-ctrl-group button.mapboxgl-ctrl-fit,
.mapboxgl-ctrl-group button.mapboxgl-ctrl-share,
.mapboxgl-ctrl-group button.mapboxgl-ctrl-heatmap,
.mapboxgl-ctrl-group button.mapbox-gl-draw_polygon,
.mapboxgl-ctrl-group button.mapbox-gl-draw_point,
.mapboxgl-ctrl-group button.mapbox-gl-draw_line,
.mapboxgl-ctrl-group button.mapbox-gl-draw_trash,
.mapboxgl-ctrl-group button.mapbox-gl-draw_combine,
.mapboxgl-ctrl-group button.mapbox-gl-draw_uncombine {
  background-image: none !important;
}
/* Nascondi ogni child element dentro questi bottoni — svg, img, span */
.mapboxgl-ctrl-group button.mapboxgl-ctrl-zoom-in > *,
.mapboxgl-ctrl-group button.mapboxgl-ctrl-zoom-out > *,
.mapboxgl-ctrl-group button.mapboxgl-ctrl-compass > *,
.mapboxgl-ctrl-group button.mapboxgl-ctrl-fullscreen > *,
.mapboxgl-ctrl-group button.mapboxgl-ctrl-shrink > *,
.mapboxgl-ctrl-group button.mapboxgl-ctrl-geoloc > *,
.mapboxgl-ctrl-group button.mapboxgl-ctrl-reset > *,
.mapboxgl-ctrl-group button.mapboxgl-ctrl-fit > *,
.mapboxgl-ctrl-group button.mapboxgl-ctrl-share > *,
.mapboxgl-ctrl-group button.mapboxgl-ctrl-heatmap > *,
.mapboxgl-ctrl-group button.mapbox-gl-draw_polygon > *,
.mapboxgl-ctrl-group button.mapbox-gl-draw_point > *,
.mapboxgl-ctrl-group button.mapbox-gl-draw_line > *,
.mapboxgl-ctrl-group button.mapbox-gl-draw_trash > *,
.mapboxgl-ctrl-group button.mapbox-gl-draw_combine > *,
.mapboxgl-ctrl-group button.mapbox-gl-draw_uncombine > * {
  display: none !important;
}

/* ZOOM IN / OUT — Lucide plus / minus */
.mapboxgl-ctrl-group button.mapboxgl-ctrl-zoom-in::before {
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><line x1='12' y1='5' x2='12' y2='19'/><line x1='5' y1='12' x2='19' y2='12'/></svg>");
          mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><line x1='12' y1='5' x2='12' y2='19'/><line x1='5' y1='12' x2='19' y2='12'/></svg>");
}
.mapboxgl-ctrl-group button.mapboxgl-ctrl-zoom-out::before {
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><line x1='5' y1='12' x2='19' y2='12'/></svg>");
          mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><line x1='5' y1='12' x2='19' y2='12'/></svg>");
}
/* Zoom indicator (solo testo): nessun ::before, numero centrato H+V */
.mapboxgl-ctrl-zoom-indicator {
  font-family: var(--ff-mono) !important;
  font-size: var(--fs-12) !important;
  font-weight: 600 !important;
  color: var(--ott-base) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center;
  padding: 0 !important;
  background: var(--paper) !important;
  border: 0 !important;
  pointer-events: none;
}
.mapboxgl-ctrl-zoom-indicator::before { display: none !important; }

/* COMPASS — Lucide compass */
.mapboxgl-ctrl-group button.mapboxgl-ctrl-compass::before {
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='10'/><polygon points='16.24 7.76 14.12 14.12 7.76 16.24 9.88 9.88 16.24 7.76'/></svg>");
          mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='10'/><polygon points='16.24 7.76 14.12 14.12 7.76 16.24 9.88 9.88 16.24 7.76'/></svg>");
}

/* FULLSCREEN / SHRINK — Lucide maximize / minimize */
.mapboxgl-ctrl-group button.mapboxgl-ctrl-fullscreen::before {
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M8 3H5a2 2 0 0 0-2 2v3'/><path d='M21 8V5a2 2 0 0 0-2-2h-3'/><path d='M3 16v3a2 2 0 0 0 2 2h3'/><path d='M16 21h3a2 2 0 0 0 2-2v-3'/></svg>");
          mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M8 3H5a2 2 0 0 0-2 2v3'/><path d='M21 8V5a2 2 0 0 0-2-2h-3'/><path d='M3 16v3a2 2 0 0 0 2 2h3'/><path d='M16 21h3a2 2 0 0 0 2-2v-3'/></svg>");
}
.mapboxgl-ctrl-group button.mapboxgl-ctrl-shrink::before {
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M8 3v3a2 2 0 0 1-2 2H3'/><path d='M21 8h-3a2 2 0 0 1-2-2V3'/><path d='M3 16h3a2 2 0 0 1 2 2v3'/><path d='M16 21v-3a2 2 0 0 1 2-2h3'/></svg>");
          mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M8 3v3a2 2 0 0 1-2 2H3'/><path d='M21 8h-3a2 2 0 0 1-2-2V3'/><path d='M3 16h3a2 2 0 0 1 2 2v3'/><path d='M16 21v-3a2 2 0 0 1 2-2h3'/></svg>");
}

/* GEOLOC — Lucide crosshair */
.mapboxgl-ctrl-group button.mapboxgl-ctrl-geoloc::before {
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='10'/><line x1='22' y1='12' x2='18' y2='12'/><line x1='6' y1='12' x2='2' y2='12'/><line x1='12' y1='6' x2='12' y2='2'/><line x1='12' y1='22' x2='12' y2='18'/></svg>");
          mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='10'/><line x1='22' y1='12' x2='18' y2='12'/><line x1='6' y1='12' x2='2' y2='12'/><line x1='12' y1='6' x2='12' y2='2'/><line x1='12' y1='22' x2='12' y2='18'/></svg>");
}

/* RESET — Lucide refresh-cw */
.mapboxgl-ctrl-group button.mapboxgl-ctrl-reset::before {
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='23 4 23 10 17 10'/><polyline points='1 20 1 14 7 14'/><path d='M3.51 9a9 9 0 0 1 14.85-3.36L23 10M1 14l4.64 4.36A9 9 0 0 0 20.49 15'/></svg>");
          mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='23 4 23 10 17 10'/><polyline points='1 20 1 14 7 14'/><path d='M3.51 9a9 9 0 0 1 14.85-3.36L23 10M1 14l4.64 4.36A9 9 0 0 0 20.49 15'/></svg>");
}

/* FIT — Lucide maximize-2 */
.mapboxgl-ctrl-group button.mapboxgl-ctrl-fit::before {
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='15 3 21 3 21 9'/><polyline points='9 21 3 21 3 15'/><line x1='21' y1='3' x2='14' y2='10'/><line x1='3' y1='21' x2='10' y2='14'/></svg>");
          mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='15 3 21 3 21 9'/><polyline points='9 21 3 21 3 15'/><line x1='21' y1='3' x2='14' y2='10'/><line x1='3' y1='21' x2='10' y2='14'/></svg>");
}

/* SHARE — Lucide share-2 */
.mapboxgl-ctrl-group button.mapboxgl-ctrl-share::before {
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='18' cy='5' r='3'/><circle cx='6' cy='12' r='3'/><circle cx='18' cy='19' r='3'/><line x1='8.59' y1='13.51' x2='15.42' y2='17.49'/><line x1='15.41' y1='6.51' x2='8.59' y2='10.49'/></svg>");
          mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='18' cy='5' r='3'/><circle cx='6' cy='12' r='3'/><circle cx='18' cy='19' r='3'/><line x1='8.59' y1='13.51' x2='15.42' y2='17.49'/><line x1='15.41' y1='6.51' x2='8.59' y2='10.49'/></svg>");
}

/* HEATMAP — Lucide flame (sostituto: layers per categoria heat) */
.mapboxgl-ctrl-group button.mapboxgl-ctrl-heatmap::before {
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polygon points='12 2 2 7 12 12 22 7 12 2'/><polyline points='2 17 12 22 22 17'/><polyline points='2 12 12 17 22 12'/></svg>");
          mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polygon points='12 2 2 7 12 12 22 7 12 2'/><polyline points='2 17 12 22 22 17'/><polyline points='2 12 12 17 22 12'/></svg>");
}

/* STREETVIEW — lasciata con icona originale (richiesta dev): no override mask. */

/* STYLE-SWITCHER — Lucide layers (gia' presente sopra ma adatto al nuovo container) */
.mapboxgl-ctrl-group button.mapboxgl-style-switcher {
  width: 38px !important;
  height: 36px !important;
  background-color: transparent !important;
  background-image: none !important;
  -webkit-mask-image: none !important;
  mask-image: none !important;
  color: var(--ott-500) !important;
}
/* Style-switcher dropdown: deve sfondare la toolbar e mostrarsi al di sopra.
 * Il container .mapboxgl-ctrl-group deve avere position:relative per ancorare
 * il dropdown absolute. */
.mapboxgl-ctrl-group { position: relative !important; }

.mapboxgl-style-list {
  position: absolute !important;
  left: calc(100% + 8px) !important;
  top: 0 !important;
  width: 200px !important;
  min-width: 200px !important;
  z-index: 9999 !important;
  background: var(--paper) !important;
  border: 1px solid var(--ott-200) !important;
  border-radius: var(--rd-r-8) !important;
  box-shadow: var(--rd-shadow-lg) !important;
  padding: 6px !important;
  text-align: left !important;
}

/* Bottoni interni dropdown stili */
.mapboxgl-ctrl-group .mapboxgl-style-list button {
  width: 100% !important;
  height: auto !important;
  text-align: left !important;
  padding: 8px 12px !important;
  margin: 0 !important;
  font-family: var(--ff-body) !important;
  font-size: var(--fs-12-5) !important;
  font-weight: 500 !important;
  color: var(--ink) !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: var(--rd-r-6) !important;
  display: block !important;
  cursor: pointer !important;
  white-space: nowrap !important;
}
.mapboxgl-ctrl-group .mapboxgl-style-list button + button {
  border-top: 0 !important;
  margin-top: 2px !important;
}
.mapboxgl-ctrl-group .mapboxgl-style-list button.active {
  background: var(--ott-50) !important;
  color: var(--ott-base) !important;
  font-weight: 600 !important;
}
.mapboxgl-ctrl-group .mapboxgl-style-list button:hover {
  background: var(--ott-50) !important;
  color: var(--ott-base) !important;
}
/* Pulisci ::before sul button interno (no Lucide qui) */
.mapboxgl-ctrl-group .mapboxgl-style-list button::before { display: none !important; }
.mapboxgl-ctrl-group button.mapboxgl-style-switcher::before {
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polygon points='12 2 2 7 12 12 22 7 12 2'/><polyline points='2 17 12 22 22 17'/><polyline points='2 12 12 17 22 12'/></svg>");
          mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polygon points='12 2 2 7 12 12 22 7 12 2'/><polyline points='2 17 12 22 22 17'/><polyline points='2 12 12 17 22 12'/></svg>");
}
.mapboxgl-ctrl-group button.mapboxgl-style-switcher:hover {
  background: var(--ott-50) !important;
  color: var(--ott-base) !important;
}

/* MAPBOX-GL-DRAW BUTTONS — Lucide pen-tool / point / line / trash / polygon */
.mapboxgl-ctrl-group button.mapbox-gl-draw_polygon::before {
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polygon points='5 3 19 8 21 19 8 21 3 12 5 3'/></svg>");
          mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polygon points='5 3 19 8 21 19 8 21 3 12 5 3'/></svg>");
}
.mapboxgl-ctrl-group button.mapbox-gl-draw_point::before {
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z'/><circle cx='12' cy='10' r='3'/></svg>");
          mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z'/><circle cx='12' cy='10' r='3'/></svg>");
}
.mapboxgl-ctrl-group button.mapbox-gl-draw_line::before {
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><line x1='5' y1='19' x2='19' y2='5'/></svg>");
          mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><line x1='5' y1='19' x2='19' y2='5'/></svg>");
}
.mapboxgl-ctrl-group button.mapbox-gl-draw_trash::before {
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='3 6 5 6 21 6'/><path d='M19 6l-2 14a2 2 0 0 1-2 2H9a2 2 0 0 1-2-2L5 6'/><path d='M10 11v6'/><path d='M14 11v6'/><path d='M9 6V4a2 2 0 0 1 2-2h2a2 2 0 0 1 2 2v2'/></svg>");
          mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='3 6 5 6 21 6'/><path d='M19 6l-2 14a2 2 0 0 1-2 2H9a2 2 0 0 1-2-2L5 6'/><path d='M10 11v6'/><path d='M14 11v6'/><path d='M9 6V4a2 2 0 0 1 2-2h2a2 2 0 0 1 2 2v2'/></svg>");
}
.mapboxgl-ctrl-group button.mapbox-gl-draw_combine::before {
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='3' y='3' width='10' height='10' rx='1'/><rect x='11' y='11' width='10' height='10' rx='1'/></svg>");
          mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='3' y='3' width='10' height='10' rx='1'/><rect x='11' y='11' width='10' height='10' rx='1'/></svg>");
}
.mapboxgl-ctrl-group button.mapbox-gl-draw_uncombine::before {
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='3' y='3' width='8' height='8' rx='1'/><rect x='13' y='13' width='8' height='8' rx='1'/></svg>");
          mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='3' y='3' width='8' height='8' rx='1'/><rect x='13' y='13' width='8' height='8' rx='1'/></svg>");
}

/* Hide native draw icons (background-image) */
.mapboxgl-ctrl-group button.mapbox-gl-draw_polygon,
.mapboxgl-ctrl-group button.mapbox-gl-draw_point,
.mapboxgl-ctrl-group button.mapbox-gl-draw_line,
.mapboxgl-ctrl-group button.mapbox-gl-draw_trash,
.mapboxgl-ctrl-group button.mapbox-gl-draw_combine,
.mapboxgl-ctrl-group button.mapbox-gl-draw_uncombine,
.mapboxgl-ctrl-group button.mapbox-gl-draw_ctrl-draw-btn {
  background-image: none !important;
}

/* CADASTRAL CUSTOM CONTROLS (cad-* buttons): override emoji unicode con Lucide.
 * ECCEZIONI lasciate con asset originali (richiesta dev):
 *   - cad-screenshot (📷 → asset originale)
 *   - cad-fastmap / cad-fastmap-selected (img assets/icons/* — Richiedi immagini) */

.mapboxgl-ctrl-group-cad button {
  width: 38px !important;
  height: 36px !important;
}
.mapboxgl-ctrl-group-cad button svg,
.mapboxgl-ctrl-group-cad button img {
  width: 17px !important;
  height: 17px !important;
}

/* Nascondi emoji unicode dei bottoni che ricevono Lucide via ::before */
.mapboxgl-ctrl-group-cad button.cad-add-pin,
.mapboxgl-ctrl-group-cad button.cad-move-pin,
.mapboxgl-ctrl-group-cad button.cad-delete-one,
.mapboxgl-ctrl-group-cad button.cad-delete-all {
  font-size: 0 !important;
  color: var(--ott-500) !important;
}

/* cad-add-pin → Lucide map-pin */
.mapboxgl-ctrl-group-cad button.cad-add-pin::before {
  display: inline-block !important;
  content: "" !important;
  width: 17px !important;
  height: 17px !important;
  background-color: currentColor !important;
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z'/><circle cx='12' cy='10' r='3'/></svg>") !important;
          mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z'/><circle cx='12' cy='10' r='3'/></svg>") !important;
  -webkit-mask-repeat: no-repeat !important;
  mask-repeat: no-repeat !important;
  -webkit-mask-position: center !important;
  mask-position: center !important;
  -webkit-mask-size: 17px 17px !important;
  mask-size: 17px 17px !important;
}

/* cad-move-pin → Lucide move (4 frecce) */
.mapboxgl-ctrl-group-cad button.cad-move-pin::before {
  display: inline-block !important;
  content: "" !important;
  width: 17px !important;
  height: 17px !important;
  background-color: currentColor !important;
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='5 9 2 12 5 15'/><polyline points='9 5 12 2 15 5'/><polyline points='15 19 12 22 9 19'/><polyline points='19 9 22 12 19 15'/><line x1='2' y1='12' x2='22' y2='12'/><line x1='12' y1='2' x2='12' y2='22'/></svg>") !important;
          mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='5 9 2 12 5 15'/><polyline points='9 5 12 2 15 5'/><polyline points='15 19 12 22 9 19'/><polyline points='19 9 22 12 19 15'/><line x1='2' y1='12' x2='22' y2='12'/><line x1='12' y1='2' x2='12' y2='22'/></svg>") !important;
  -webkit-mask-repeat: no-repeat !important;
  mask-repeat: no-repeat !important;
  -webkit-mask-position: center !important;
  mask-position: center !important;
  -webkit-mask-size: 17px 17px !important;
  mask-size: 17px 17px !important;
}

/* cad-delete-one → Lucide trash-2 */
.mapboxgl-ctrl-group-cad button.cad-delete-one::before {
  display: inline-block !important;
  content: "" !important;
  width: 17px !important;
  height: 17px !important;
  background-color: currentColor !important;
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='3 6 5 6 21 6'/><path d='M19 6l-2 14a2 2 0 0 1-2 2H9a2 2 0 0 1-2-2L5 6'/><path d='M10 11v6'/><path d='M14 11v6'/><path d='M9 6V4a2 2 0 0 1 2-2h2a2 2 0 0 1 2 2v2'/></svg>") !important;
          mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='3 6 5 6 21 6'/><path d='M19 6l-2 14a2 2 0 0 1-2 2H9a2 2 0 0 1-2-2L5 6'/><path d='M10 11v6'/><path d='M14 11v6'/><path d='M9 6V4a2 2 0 0 1 2-2h2a2 2 0 0 1 2 2v2'/></svg>") !important;
  -webkit-mask-repeat: no-repeat !important;
  mask-repeat: no-repeat !important;
  -webkit-mask-position: center !important;
  mask-position: center !important;
  -webkit-mask-size: 17px 17px !important;
  mask-size: 17px 17px !important;
}

/* cad-delete-all → Lucide trash con X (combo) — uso x-circle per differenziare */
.mapboxgl-ctrl-group-cad button.cad-delete-all::before {
  display: inline-block !important;
  content: "" !important;
  width: 17px !important;
  height: 17px !important;
  background-color: currentColor !important;
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='10'/><line x1='15' y1='9' x2='9' y2='15'/><line x1='9' y1='9' x2='15' y2='15'/></svg>") !important;
          mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='10'/><line x1='15' y1='9' x2='9' y2='15'/><line x1='9' y1='9' x2='15' y2='15'/></svg>") !important;
  -webkit-mask-repeat: no-repeat !important;
  mask-repeat: no-repeat !important;
  -webkit-mask-position: center !important;
  mask-position: center !important;
  -webkit-mask-size: 17px 17px !important;
  mask-size: 17px 17px !important;
}

/* Active state cad-* button: bg ottanio + icona bianca */
.mapboxgl-ctrl-group-cad button.active {
  background: var(--ott-base) !important;
  color: #fff !important;
}
.mapboxgl-ctrl-group-cad button.active::before { background-color: #fff !important; }
.mapboxgl-ctrl-group-cad button.active svg {
  color: #fff !important;
  filter: none !important;
}

/* Hover bg ottanio-50 + color brand */
.mapboxgl-ctrl-group-cad button:not(.active):hover { color: var(--ott-base) !important; }

/* MEASURE control (DrawMeasureControl): identifica via classe parent */
.mapboxgl-ctrl-group .mapboxgl-ctrl-icon.mapboxgl-ctrl-measure-line::before {
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M21.3 15.3a2.4 2.4 0 0 1 0 3.4l-2.6 2.6a2.4 2.4 0 0 1-3.4 0L2.7 8.7a2.4 2.4 0 0 1 0-3.4l2.6-2.6a2.4 2.4 0 0 1 3.4 0z'/><path d='M14.5 12.5l-1-1'/><path d='M17.5 9.5l-1.5-1.5'/><path d='M11.5 15.5l-1-1'/><path d='M8.5 18.5l-1-1'/></svg>");
          mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M21.3 15.3a2.4 2.4 0 0 1 0 3.4l-2.6 2.6a2.4 2.4 0 0 1-3.4 0L2.7 8.7a2.4 2.4 0 0 1 0-3.4l2.6-2.6a2.4 2.4 0 0 1 3.4 0z'/><path d='M14.5 12.5l-1-1'/><path d='M17.5 9.5l-1.5-1.5'/><path d='M11.5 15.5l-1-1'/><path d='M8.5 18.5l-1-1'/></svg>");
}

/* UNICA TOOLBAR: gruppi adiacenti si fondono. Margin 0, border collapse,
 * radius solo agli estremi della pila (primo top-right, ultimo bottom-right). */
.mapboxgl-ctrl-top-left .mapboxgl-ctrl-group + .mapboxgl-ctrl-group,
.mapboxgl-ctrl-bottom-left .mapboxgl-ctrl-group + .mapboxgl-ctrl-group {
  margin-top: -1px !important; /* sovrappone il bordo top con bordo bottom precedente */
  margin-bottom: 0 !important;
}
.mapboxgl-ctrl-top-left .mapboxgl-ctrl-group:first-child,
.mapboxgl-ctrl-bottom-left .mapboxgl-ctrl-group:first-child {
  border-radius: 0 var(--rd-r-8) 0 0 !important;
}
.mapboxgl-ctrl-top-left .mapboxgl-ctrl-group:last-child,
.mapboxgl-ctrl-bottom-left .mapboxgl-ctrl-group:last-child {
  border-radius: 0 0 var(--rd-r-8) 0 !important;
}
.mapboxgl-ctrl-top-left .mapboxgl-ctrl-group:first-child:last-child,
.mapboxgl-ctrl-bottom-left .mapboxgl-ctrl-group:first-child:last-child {
  border-radius: 0 var(--rd-r-8) var(--rd-r-8) 0 !important;
}