/* Shell and layers */
.weeds-map-shell { position: relative; border-radius: 14px; overflow: hidden; box-shadow: 0 10px 30px rgba(0,0,0,.08); }
.weeds-map-gradient { position: absolute; inset: 0; z-index: 1;
  background: radial-gradient(1000px 600px at 20% 10%, rgba(58,155,150,0.08), transparent 60%),
              radial-gradient(800px 400px at 80% 90%, rgba(0,170,255,0.07), transparent 60%);
  animation: gradientFloat 14s ease-in-out infinite alternate; pointer-events: none; }
@keyframes gradientFloat { 0%{ transform:translateY(0); filter:hue-rotate(0deg);} 100%{ transform:translateY(-8px); filter:hue-rotate(10deg);} }
#weeds-street-alive { position:absolute; inset:0; z-index:2; pointer-events:none; }
#weeds-map { position: relative; z-index:3; border-radius: 14px; border: 1px solid #e6e8ea; height: 600px; }
.leaflet-container { background: transparent !important; filter: brightness(1.05) contrast(1.06); }

/* Marker wrapper to allow custom HTML */
.wm-icon-wrap { width:26px; height:26px; }
.wm-icon { width:26px; height:26px; border-radius:50%; background:#fff; border:2px solid #9ca3af; box-shadow: 0 0 6px rgba(0,0,0,.12); position:relative; overflow:hidden; }
.wm-icon img { width:100%; height:100%; object-fit: cover; border-radius:50%; display:block; }
.wm-icon .ring { position:absolute; inset:-5px; border-radius:50%; border:2px solid currentColor; opacity:.65; animation: borderPulse 2.6s ease-in-out infinite; }
@keyframes borderPulse { 0%,100%{ transform: scale(1); opacity:.55 } 50%{ transform: scale(1.2); opacity:.85 } }
.wm-icon.hot   { color:#ff7b00; border-color:#ff7b00; box-shadow:0 0 10px rgba(255,123,0,.45); }
.wm-icon.pro   { color:#10b981; border-color:#10b981; box-shadow:0 0 10px rgba(16,185,129,.45); }
.wm-icon.promo { color:#0ea5e9; border-color:#0ea5e9; box-shadow:0 0 10px rgba(13,148,236,.4); }
.wm-icon.event { color:#7c3aed; border-color:#7c3aed; box-shadow:0 0 10px rgba(124,58,237,.45); }
.wm-icon.normal{ color:#9ca3af; border-color:#9ca3af; }

/* Popup + Buttons */
.wm-popup { min-width: 240px; font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
.wm-popup h4 { margin: 0 0 4px; color:#14532d; font-size:16px; }
.wm-popup .addr { margin:0 0 6px; color:#475569; font-size:12px; }
.wm-popup .desc { margin:6px 0 8px; color:#1f2937; font-size:13px; }
.wm-popup .balance { display:block; color:#065f46; margin-top:-2px; margin-bottom:8px; }
.wm-badge { display:inline-block; font-size:10px; padding:2px 6px; border-radius:999px; color:#fff; font-weight:700; margin-right:5px; }
.wm-badge.hot{background:#ff7b00}.wm-badge.pro{background:#10b981}.wm-badge.promo{background:#0ea5e9}.wm-badge.event{background:#7c3aed}.wm-badge.normal{background:#6b7280}

.wm-popup .actions { display:flex; flex-wrap:wrap; gap:6px; }
.wm-btn { background:#10b981; color:#fff; border:none; border-radius:8px; padding:7px 11px; font-size:12px; font-weight:600; cursor:pointer; transition:.2s all; }
.wm-btn:hover { background:#0d946a; transform: translateY(-1px); }
.wm-btn.outline { background:#fff; color:#10b981; border:1px solid #10b981; }
.wm-btn.outline:hover { background:#10b981; color:#fff; }
.wm-btn.ghost { background:rgba(16,185,129,.1); color:#065f46; }
.wm-btn.ghost:hover { background:rgba(16,185,129,.18); }

/* Legend */
.weeds-map-legend { position:absolute; top:10px; right:10px; z-index:5; background:rgba(255,255,255,.86); backdrop-filter: blur(8px); border:1px solid rgba(16,185,129,.18); border-radius:12px; padding:10px 12px; box-shadow:0 6px 20px rgba(0,0,0,.08); font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
.weeds-map-legend h4 { margin:0 0 6px; font-size:14px; color:#14532d; }
.weeds-map-legend div { display:flex; align-items:center; gap:8px; font-size:12px; color:#0f172a; padding:3px 0; }
.legend-dot { width:12px; height:12px; border-radius:50%; box-shadow: 0 0 8px rgba(0,0,0,.12); }
.legend-dot.hot{background:#ff7b00}.legend-dot.pro{background:#10b981}.legend-dot.promo{background:#0ea5e9}.legend-dot.event{background:#7c3aed}.legend-dot.normal{background:#9ca3af}

/* Locate me button */
.weeds-locate-btn { position:absolute; bottom:12px; right:12px; z-index:6; background:#10b981; color:#fff; border:none; border-radius:10px; padding:8px 12px; font-size:13px; font-weight:700; box-shadow:0 8px 20px rgba(16,185,129,.25); cursor:pointer; transition:.2s all; }
.weeds-locate-btn:hover { background:#0d946a; transform: translateY(-1px); }
.weeds-locate-btn.busy { opacity:.75; pointer-events:none; }

/* Toast */
.weeds-toast { position: absolute; top: 20px; left: 50%; transform: translateX(-50%); background: rgba(16,185,129,.9); color: #fff; padding: 6px 14px; border-radius: 8px; font-size: 13px; font-weight: 600; transition: opacity 0.5s ease-in-out; box-shadow: 0 2px 12px rgba(0,0,0,.25); z-index: 9999; }
.weeds-toast.fade { opacity: 0; }

/* Modal */
.wmodal { position: fixed; inset: 0; display: none; justify-content: center; align-items: center; z-index: 9999; }
.wmodal.active { display: flex; }
.wmodal-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,.45); }
.wmodal-box { position: relative; background: rgba(255,255,255,.96); backdrop-filter: blur(8px); border-radius: 14px; padding: 18px; width: 92%; max-width: 460px; box-shadow: 0 10px 30px rgba(0,0,0,.2); animation: fadeIn .25s ease; font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
.wmodal h3 { margin: 0 0 6px; color: #14532d; font-size: 18px; }
.wmodal p { margin: 0 0 10px; color: #1f2937; font-size: 14px; }
.wmodal-actions { display: flex; justify-content: flex-end; gap: 8px; }
.wmodal-actions .wmodal-close { background:#10b981; color:#fff; border:none; border-radius:8px; padding:7px 12px; font-size:13px; font-weight:700; cursor:pointer; }

@keyframes fadeIn { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }
