/* --- Zone & coussin coin bas-droite (évite la coupe) --- */
.leaflet-bottom.leaflet-right { padding: 14px; }

.leaflet-control-radial { position: relative; }
.radial {
  position: relative;
  /* zone du bouquet (comme Image 1) */
  width: 140px;   /* = 3 * 40 + 2 * 10 de marge visuelle */
  height: 140px;
}

/* Boutons ronds 40px, icône 28px centrée */
:root {
  --btn: 40px;
  --icon: 28px;
  --gap: 6px;     /* écart du bouquet par rapport au toggle */
}

.radial__toggle,
.radial__btn {
  width: var(--btn);
  height: var(--btn);
  border-radius: 50%;
  background-color: #fff;
  background-position: center;
  background-repeat: no-repeat;
  background-size: var(--icon) var(--icon);
  border: 0;
  box-shadow: 0 1px 4px -1px rgba(0,0,0,.3);
  display: block;
  cursor: pointer;
  outline: none;
  transition: transform .18s ease, opacity .18s ease, box-shadow .18s ease, background-color .18s ease;
}

/* Toggle : ancré bas-droite de la zone */
.radial__toggle {
  position: absolute;
  right: -50px;
  bottom: 0;
  z-index: 2;
}

/* État replié : tous les boutons collés sur le toggle (invisibles) */
.radial__btn {
  position: absolute;
  right: calc(var(--gap));
  bottom: calc(var(--gap));
  opacity: 0;
  pointer-events: none;
  transform: scale(.6);
}
.leaflet-control-radial.open .radial__btn {
  opacity: 1;
  pointer-events: auto;
  transform: scale(1); /* la position se fait avec top/left/right/bottom */
}

/* ---------- Positions EXACTES “Image 1” ---------- */
/* Up = en haut CENTRE du bouquet */
.leaflet-control-radial.open .btn-up {
  top: 0;
  left: 50%;
  transform: translateX(-50%) scale(1); /* centré horizontalement */
}

/* Left = milieu GAUCHE du bouquet */
.leaflet-control-radial.open .btn-left {
  top: 50%;
  left: 0;
  transform: translateY(-50%) scale(1);
}

/* Right = milieu DROITE du bouquet */
.leaflet-control-radial.open .btn-right {
  top: 50%;
  right: 0;
  transform: translateY(-50%) scale(1);
}

/* Down = en bas CENTRE du bouquet */
.leaflet-control-radial.open .btn-down {
  bottom: 0;
  left: 50%;
  transform: translateX(-50%) scale(1);
}

/* Plus = COIN HAUT-DROIT du bouquet */
.leaflet-control-radial.open .btn-plus {
  top: 0;
  right: 0;
  transform: scale(1);
}

/* Minus = COIN BAS-DROIT du bouquet (au-dessus du toggle, sans chevauchement) */
.leaflet-control-radial.open .btn-minus {
  bottom: 0;
  right: 0;
  transform: scale(1);
}

.leaflet-right .leaflet-control {
  margin-right: 46px;
}

/* États hover/active (optionnel, garder si déjà présent) */
.radial__toggle:focus-visible, .radial__btn:focus-visible { box-shadow: 0 0 0 3px rgba(0,120,255,.35); }
.radial__toggle:hover, .radial__btn:hover { box-shadow: 0 2px 8px -1px rgba(0,0,0,.35); }
.radial__toggle:active, .radial__btn:active { box-shadow: 0 0 0 2px rgba(0,0,0,.1) inset; }

.radial__toggle:focus-visible,
.radial__btn:focus-visible { box-shadow: 0 0 0 3px rgba(0,120,255,.35); }

.radial__toggle:hover,
.radial__btn:hover { box-shadow: 0 2px 8px -1px rgba(0,0,0,.35); }

.radial__toggle:active,
.radial__btn:active { box-shadow: inset 0 0 0 2px rgba(0,0,0,.1); }

.radial__toggle {
  background-image: url("data:image/svg+xml,%3Csvg fill='none' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 19.175l2.125-2.125 1.425 1.4L12 22l-3.55-3.55 1.425-1.4L12 19.175zM4.825 12l2.125 2.125-1.4 1.425L2 12l3.55-3.55 1.4 1.425L4.825 12zm14.35 0L17.05 9.875l1.4-1.425L22 12l-3.55 3.55-1.4-1.425L19.175 12zM12 4.825L9.875 6.95 8.45 5.55 12 2l3.55 3.55-1.425 1.4L12 4.825z' fill='%23666'/%3E%3C/svg%3E");
}

.btn-left  { background-image: url("data:image/svg+xml,%3Csvg fill='none' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14 18l-6-6 6-6 1.4 1.4-4.6 4.6 4.6 4.6L14 18z' fill='%23666'/%3E%3C/svg%3E"); }
.btn-right { background-image: url("data:image/svg+xml,%3Csvg fill='none' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12.6 12L8 7.4 9.4 6l6 6-6 6L8 16.6 12.6 12z' fill='%23666'/%3E%3C/svg%3E"); }
.btn-up    { background-image: url("data:image/svg+xml,%3Csvg fill='none' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 10.8l-4.6 4.6L6 14l6-6 6 6-1.4 1.4-4.6-4.6z' fill='%23666'/%3E%3C/svg%3E"); }
.btn-down  { background-image: url("data:image/svg+xml,%3Csvg fill='none' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 15.4l-6-6L7.4 8l4.6 4.6L16.6 8 18 9.4l-6 6z' fill='%23666'/%3E%3C/svg%3E"); }
.btn-plus  { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 -960 960 960' fill='%23666'%3E%3Cpath d='M440-440H200v-80h240v-240h80v240h240v80H520v240h-80v-240z'/%3E%3C/svg%3E"); }
.btn-minus { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 -960 960 960' fill='%23666'%3E%3Cpath d='M200-440v-80h560v80H200z'/%3E%3C/svg%3E"); }

.radial__btn:hover.btn-left  { background-image: url("data:image/svg+xml,%3Csvg fill='none' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14 18l-6-6 6-6 1.4 1.4-4.6 4.6 4.6 4.6L14 18z' fill='%23333'/%3E%3C/svg%3E"); }
.radial__btn:active.btn-left { background-image: url("data:image/svg+xml,%3Csvg fill='none' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14 18l-6-6 6-6 1.4 1.4-4.6 4.6 4.6 4.6L14 18z' fill='%23111'/%3E%3C/svg%3E"); }

.radial__btn:hover.btn-right  { background-image: url("data:image/svg+xml,%3Csvg fill='none' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12.6 12L8 7.4 9.4 6l6 6-6 6L8 16.6 12.6 12z' fill='%23333'/%3E%3C/svg%3E"); }
.radial__btn:active.btn-right { background-image: url("data:image/svg+xml,%3Csvg fill='none' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12.6 12L8 7.4 9.4 6l6 6-6 6L8 16.6 12.6 12z' fill='%23111'/%3E%3C/svg%3E"); }

.radial__btn:hover.btn-up  { background-image: url("data:image/svg+xml,%3Csvg fill='none' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 10.8l-4.6 4.6L6 14l6-6 6 6-1.4 1.4-4.6-4.6z' fill='%23333'/%3E%3C/svg%3E"); }
.radial__btn:active.btn-up { background-image: url("data:image/svg+xml,%3Csvg fill='none' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 10.8l-4.6 4.6L6 14l6-6 6 6-1.4 1.4-4.6-4.6z' fill='%23111'/%3E%3C/svg%3E"); }

.radial__btn:hover.btn-down  { background-image: url("data:image/svg+xml,%3Csvg fill='none' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 15.4l-6-6L7.4 8l4.6 4.6L16.6 8 18 9.4l-6 6z' fill='%23333'/%3E%3C/svg%3E"); }
.radial__btn:active.btn-down { background-image: url("data:image/svg+xml,%3Csvg fill='none' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 15.4l-6-6L7.4 8l4.6 4.6L16.6 8 18 9.4l-6 6z' fill='%23111'/%3E%3C/svg%3E"); }

.radial__btn:hover.btn-plus  { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 -960 960 960' fill='%23333'%3E%3Cpath d='M440-440H200v-80h240v-240h80v240h240v80H520v240h-80v-240z'/%3E%3C/svg%3E"); }
.radial__btn:active.btn-plus { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 -960 960 960' fill='%23111'%3E%3Cpath d='M440-440H200v-80h240v-240h80v240h240v80H520v240h-80v-240z'/%3E%3C/svg%3E"); }

.radial__btn:hover.btn-minus  { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 -960 960 960' fill='%23333'%3E%3Cpath d='M200-440v-80h560v80H200z'/%3E%3C/svg%3E"); }
.radial__btn:active.btn-minus { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 -960 960 960' fill='%23111'%3E%3Cpath d='M200-440v-80h560v80H200z'/%3E%3C/svg%3E"); }

.radial__btn.is-disabled {
  opacity: .35;
  cursor: default;
  box-shadow: none;
}
.radial__btn.is-disabled:hover,
.radial__btn.is-disabled:active {
  box-shadow: none;
  background-color: #fff;
}