.ftth-real-marker-wrapper {
  overflow:visible !important;
  background:transparent !important;
  border:0 !important;
}

.ftth-real-marker {
  --marker-color:#64748b;
  position:relative;
  width:40px;
  height:48px;
  transform-origin:50% 100%;
  filter:drop-shadow(0 5px 5px rgba(15,23,42,.25));
  transition:
    transform .18s ease,
    filter .18s ease;
}

.ftth-real-marker:hover {
  z-index:10;
  transform:translateY(-3px) scale(1.13);
  filter:drop-shadow(0 8px 7px rgba(15,23,42,.30));
}

.ftth-real-marker-body {
  position:absolute;
  top:1px;
  left:3px;
  display:grid;
  place-items:center;
  width:34px;
  height:34px;
  box-sizing:border-box;
  border:2px solid rgba(255,255,255,.95);
  border-radius:11px;
  background:
    radial-gradient(
      circle at 30% 20%,
      rgba(255,255,255,.35),
      transparent 32%
    ),
    linear-gradient(
      145deg,
      color-mix(in srgb,var(--marker-color) 80%,white),
      var(--marker-color)
    );
  box-shadow:
    inset 0 1px 1px rgba(255,255,255,.25),
    0 3px 8px rgba(15,23,42,.28);
}

.ftth-real-marker-body::before {
  content:"";
  position:absolute;
  inset:3px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:7px;
  pointer-events:none;
}

.ftth-real-marker svg {
  position:relative;
  z-index:2;
  width:25px;
  height:25px;
  overflow:visible;
  fill:none;
  stroke:white;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.ftth-real-marker svg circle {
  fill:rgba(255,255,255,.18);
}

.ftth-real-marker-tip {
  position:absolute;
  top:29px;
  left:14px;
  width:12px;
  height:12px;
  border-right:2px solid white;
  border-bottom:2px solid white;
  border-radius:0 0 4px 0;
  background:var(--marker-color);
  transform:rotate(45deg);
  box-shadow:2px 2px 3px rgba(15,23,42,.15);
}

.ftth-real-marker-shadow {
  position:absolute;
  bottom:0;
  left:11px;
  width:18px;
  height:5px;
  border-radius:50%;
  background:rgba(15,23,42,.23);
  filter:blur(2px);
}

.ftth-real-marker-light {
  position:absolute;
  top:3px;
  right:3px;
  z-index:4;
  width:6px;
  height:6px;
  box-sizing:border-box;
  border:1px solid white;
  border-radius:50%;
  background:#22c55e;
  box-shadow:0 0 5px #22c55e;
}

.ftth-real-marker.status-warning
.ftth-real-marker-light {
  background:#fde047;
  box-shadow:0 0 6px #fde047;
  animation:ftthMarkerPulse 1.4s infinite;
}

.ftth-real-marker.status-critical
.ftth-real-marker-light,
.ftth-real-marker.status-offline
.ftth-real-marker-light {
  background:#fecaca;
  box-shadow:0 0 7px #ef4444;
  animation:ftthMarkerPulse .9s infinite;
}

.ftth-real-marker.status-offline
.ftth-real-marker-body {
  filter:saturate(.65);
}

.ftth-real-marker-client .ftth-real-marker-body {
  border-radius:50% 50% 11px 11px;
}

.ftth-real-marker-pole .ftth-real-marker-body {
  border-radius:17px;
}

.ftth-real-marker-reserve .ftth-real-marker-body {
  border-radius:50%;
}

.ftth-real-marker-splice .ftth-real-marker-body {
  border-radius:17px;
}

@keyframes ftthMarkerPulse {
  0%,100% {
    opacity:1;
    transform:scale(1);
  }

  50% {
    opacity:.45;
    transform:scale(1.45);
  }
}

/* Tooltips con apariencia técnica */
.leaflet-tooltip {
  padding:6px 9px !important;
  border:1px solid var(--border) !important;
  border-radius:8px !important;
  background:var(--panel) !important;
  color:var(--text) !important;
  box-shadow:0 5px 14px rgba(15,23,42,.18) !important;
  font-size:11px !important;
  font-weight:650 !important;
}

.leaflet-tooltip::before {
  border-top-color:var(--panel) !important;
}

@media (max-width:600px) {
  .ftth-real-marker {
    transform:scale(.92);
  }

  .ftth-real-marker:hover {
    transform:translateY(-2px) scale(1.03);
  }
}

/* Marcadores compactos */
.ftth-real-marker-wrapper {
  width:30px !important;
  height:37px !important;
}

.ftth-real-marker {
  width:30px !important;
  height:37px !important;
}

.ftth-real-marker-body {
  top:1px !important;
  left:2px !important;
  width:26px !important;
  height:26px !important;
  border-width:1.5px !important;
  border-radius:9px !important;
}

.ftth-real-marker-body::before {
  inset:2px !important;
  border-radius:6px !important;
}

.ftth-real-marker svg {
  width:19px !important;
  height:19px !important;
  stroke-width:2 !important;
}

.ftth-real-marker-tip {
  top:22px !important;
  left:10px !important;
  width:9px !important;
  height:9px !important;
  border-right-width:1.5px !important;
  border-bottom-width:1.5px !important;
}

.ftth-real-marker-shadow {
  bottom:0 !important;
  left:8px !important;
  width:14px !important;
  height:4px !important;
}

.ftth-real-marker-light {
  top:2px !important;
  right:2px !important;
  width:5px !important;
  height:5px !important;
}

.ftth-real-marker-client .ftth-real-marker-body {
  border-radius:50% 50% 8px 8px !important;
}

.ftth-real-marker-pole .ftth-real-marker-body,
.ftth-real-marker-splice .ftth-real-marker-body {
  border-radius:13px !important;
}

.ftth-real-marker-reserve .ftth-real-marker-body {
  border-radius:50% !important;
}

.ftth-real-marker:hover {
  transform:translateY(-2px) scale(1.10) !important;
}

@media (max-width:600px) {
  .ftth-real-marker {
    transform:scale(.90);
  }

  .ftth-real-marker:hover {
    transform:translateY(-1px) scale(.98) !important;
  }
}

/* Marcadores FTTH tamaño mini */
.ftth-real-marker-wrapper {
  width:22px !important;
  height:29px !important;
}

.ftth-real-marker {
  width:22px !important;
  height:29px !important;
  filter:drop-shadow(0 3px 3px rgba(15,23,42,.24));
}

.ftth-real-marker-body {
  top:1px !important;
  left:1px !important;
  width:20px !important;
  height:20px !important;
  border-width:1px !important;
  border-radius:7px !important;
  box-shadow:
    inset 0 1px 1px rgba(255,255,255,.2),
    0 2px 5px rgba(15,23,42,.24) !important;
}

.ftth-real-marker-body::before {
  inset:1.5px !important;
  border-radius:5px !important;
}

.ftth-real-marker svg {
  width:15px !important;
  height:15px !important;
  stroke-width:2.1 !important;
}

.ftth-real-marker-tip {
  top:17px !important;
  left:7px !important;
  width:7px !important;
  height:7px !important;
  border-right-width:1px !important;
  border-bottom-width:1px !important;
}

.ftth-real-marker-shadow {
  bottom:0 !important;
  left:6px !important;
  width:10px !important;
  height:3px !important;
}

.ftth-real-marker-light {
  top:1px !important;
  right:1px !important;
  width:4px !important;
  height:4px !important;
  border-width:1px !important;
}

.ftth-real-marker-client .ftth-real-marker-body {
  border-radius:50% 50% 6px 6px !important;
}

.ftth-real-marker-pole .ftth-real-marker-body,
.ftth-real-marker-splice .ftth-real-marker-body {
  border-radius:10px !important;
}

.ftth-real-marker-reserve .ftth-real-marker-body {
  border-radius:50% !important;
}

.ftth-real-marker:hover {
  transform:translateY(-2px) scale(1.18) !important;
  filter:drop-shadow(0 5px 4px rgba(15,23,42,.30));
}

/* Tamaño dinámico según el zoom de Leaflet */
#ftthMap {
  --ftth-marker-zoom-scale:1;
}

#ftthMap .ftth-real-marker {
  transform:
    scale(var(--ftth-marker-zoom-scale,1))
    !important;
  transform-origin:50% 100% !important;
  transition:
    transform .14s ease,
    filter .14s ease !important;
}

#ftthMap .ftth-real-marker:hover {
  transform:
    translateY(-2px)
    scale(
      calc(
        var(--ftth-marker-zoom-scale,1) * 1.16
      )
    )
    !important;
}

/* En zoom muy alejado se simplifican detalles */
#ftthMap[data-ftth-zoom="10"]
.ftth-real-marker-light,
#ftthMap[data-ftth-zoom="9"]
.ftth-real-marker-light,
#ftthMap[data-ftth-zoom="8"]
.ftth-real-marker-light {
  display:none;
}