/* ============================================================
   Tawsila — map kit styles (matches ui/map.js + offline fallback)
   ============================================================ */
.map-el{position:absolute;inset:0;z-index:1;background:var(--map-land)}
.map-badge{position:absolute;top:14px;inset-inline-start:14px;z-index:600;display:inline-flex;align-items:center;gap:6px;
  background:var(--bg-glass);backdrop-filter:blur(12px);border:1px solid var(--border);border-radius:var(--r-full);
  padding:.34rem .8rem;font-size:var(--fs-xs);font-weight:700;box-shadow:var(--shadow-sm);max-width:72%}
.map-badge span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.map-badge svg{width:14px;height:14px;color:var(--primary);flex:none}
.pin-me,.pin-dest,.pin-car{display:grid;place-items:center;box-shadow:0 8px 20px rgba(8,47,73,.32)}
.pin-me{width:20px;height:20px;border-radius:50%;background:var(--primary);border:4px solid #fff;box-shadow:0 0 0 7px rgba(14,165,233,.16)}
.pin-dest{width:22px;height:22px;border-radius:6px;background:var(--danger);border:3px solid #fff;transform:rotate(45deg)}
.pin-car{width:34px;height:34px;border-radius:12px;background:var(--bg-elev);border:2px solid var(--primary);color:var(--primary);
  transition:transform .95s linear}
.pin-car svg{width:18px;height:18px}
.map-fallback{position:absolute;inset:0;background:
  linear-gradient(160deg,var(--map-land),var(--bg-sunken));overflow:hidden}
.map-fallback::before{content:"";position:absolute;inset:0;background-image:
  linear-gradient(var(--border) 1px,transparent 1px),linear-gradient(90deg,var(--border) 1px,transparent 1px);
  background-size:44px 44px;opacity:.5}
.leaflet-container{background:var(--map-land);font-family:var(--font);cursor:crosshair}
.leaflet-div-icon{background:none;border:none}
html[data-theme="dark"] .leaflet-tile-pane{filter:invert(1) hue-rotate(185deg) brightness(.86) contrast(1.04) saturate(.8)}
.leaflet-control-zoom{border:none!important;box-shadow:var(--shadow-sm)!important;border-radius:var(--r-sm)!important;overflow:hidden}
.leaflet-control-zoom a{background:var(--bg-elev)!important;color:var(--text)!important;border-color:var(--border)!important;
  width:34px!important;height:34px!important;line-height:34px!important}
.leaflet-control-zoom a:hover{background:var(--primary-soft)!important;color:var(--primary)!important}
.leaflet-control-attribution{background:var(--bg-glass)!important;color:var(--muted)!important;font-size:9px!important;border-radius:var(--r-xs) 0 0 0}
.leaflet-popup-content-wrapper{background:var(--bg-elev);color:var(--text);border-radius:var(--r-sm);box-shadow:var(--shadow)}
.leaflet-popup-tip{background:var(--bg-elev)}