/* AYTAÇ HARİTA 3.0 — mlmap.css (MapLibre marker/popup stilleri) */
.ml-truck{ cursor:pointer; }
.truck-pin{ position:relative; display:flex; flex-direction:column; align-items:center; }
.truck-pin .tp-dot{ width:36px; height:36px; border-radius:50%; background:var(--primary); border:3px solid #fff;
  display:flex; align-items:center; justify-content:center; box-shadow:0 2px 7px rgba(0,0,0,.45); transition:box-shadow .3s; }
.truck-pin .tp-dot svg{ width:21px; height:21px; }
.truck-pin .tp-plate{ margin-top:3px; background:#161B26; color:#fff; font-size:10px; font-weight:800;
  letter-spacing:.3px; padding:2px 6px; border-radius:6px; white-space:nowrap; box-shadow:0 1px 3px rgba(0,0,0,.45);
  font-family:'JetBrains Mono',monospace; }
/* canlılık: taze = yeşil nabız halkası, bayat = gri */
.truck-pin.fresh .tp-dot{ box-shadow:0 0 0 5px rgba(34,197,94,.28), 0 2px 7px rgba(0,0,0,.45); }
.truck-pin.stale .tp-dot{ background:#6b7280; }
@keyframes ml-pulse{ 0%{box-shadow:0 0 0 4px rgba(34,197,94,.35),0 2px 7px rgba(0,0,0,.45);}
  70%{box-shadow:0 0 0 12px rgba(34,197,94,0),0 2px 7px rgba(0,0,0,.45);}
  100%{box-shadow:0 0 0 4px rgba(34,197,94,0),0 2px 7px rgba(0,0,0,.45);} }
.truck-pin.fresh .tp-dot{ animation:ml-pulse 2.2s infinite; }

/* kendi konumum mavi noktası */
.me-dot{ width:20px; height:20px; border-radius:50%; background:#4285F4; border:3px solid #fff;
  box-shadow:0 0 0 8px rgba(66,133,244,.18), 0 2px 8px rgba(0,0,0,.4); }

/* popup (araç kartı) */
.loc-popup .maplibregl-popup-content{ border-radius:14px; padding:12px 14px; box-shadow:0 8px 26px rgba(0,0,0,.28);
  font-family:'Manrope',system-ui,Arial,sans-serif; }
.loc-popup .maplibregl-popup-close-button{ font-size:18px; padding:2px 7px; color:#888; }
.lp-row{ display:flex; justify-content:space-between; gap:14px; font-size:12px; padding:4px 0; border-top:1px solid #eef0f2; }
.lp-row:first-of-type{ border-top:none; }
.lp-row .k{ color:#8a8f98; } .lp-row .v{ font-weight:700; text-align:right; color:#1b2430; }
.loc-popup .btn-full{ display:flex; align-items:center; justify-content:center; gap:6px; margin-top:9px;
  background:var(--primary); color:#fff; text-decoration:none; padding:9px; border-radius:10px; font-weight:800; font-size:13px; }

/* ── navigasyon puck (yukarı bakan ok — kamera yöne döner) ── */
.ml-puck svg{ filter:drop-shadow(0 2px 5px rgba(0,0,0,.55)); }
/* nav manevra banner (Google görünümü) */
.nav-banner{ position:fixed; top:0; left:0; right:0; z-index:8600; background:#0b6e3f; color:#fff;
  padding:14px 16px calc(14px + env(safe-area-inset-top,0)); display:flex; align-items:center; gap:14px;
  box-shadow:0 4px 18px rgba(0,0,0,.35); }
.nav-banner .ok{ font-size:38px; line-height:1; min-width:42px; text-align:center; }
.nav-banner .mesafe{ font-size:25px; font-weight:800; }
.nav-banner .talimat{ font-size:13.5px; opacity:.95; margin-top:2px; }
.nav-foot{ position:fixed; left:12px; right:12px; bottom:calc(70px + env(safe-area-inset-bottom,0)); z-index:8600;
  background:#fff; border-radius:16px; padding:11px 13px; display:flex; align-items:center; gap:11px;
  box-shadow:0 6px 22px rgba(0,0,0,.28); }
.nav-foot .nav-hiz{ background:#f0f2f5; border-radius:10px; padding:8px 9px; font-weight:800; font-size:12.5px; color:#333; min-width:62px; text-align:center; }
.nav-foot .sure{ color:#0b6e3f; font-weight:800; font-size:21px; }
.nav-foot .det{ flex:1; font-size:11.5px; color:#555; line-height:1.35; }
.nav-foot button{ border:none; width:42px; height:42px; border-radius:50%; font-size:17px; cursor:pointer; }
.nav-foot button:not(.end){ background:#eef1f4; }
.nav-foot .end{ background:#e11d48; color:#fff; }
.nav-recenter{ position:fixed; left:14px; bottom:calc(148px + env(safe-area-inset-bottom,0)); z-index:8600;
  background:#fff; border:none; border-radius:22px; padding:10px 15px; font-weight:800; font-size:13px;
  box-shadow:0 4px 14px rgba(0,0,0,.25); cursor:pointer; display:none; }
body.nav-on .ml-hide-on-nav{ display:none !important; }
/* leaflet-rotate %150 canvas hilesini nötrle — MapLibre dönmeyi native yapar, konteyner tam dolar */
body.nav-on .map-canvas{ left:0 !important; top:0 !important; width:100% !important; height:100% !important; }
/* MapLibre canvas konteyneri tam doldursun (sağ boşluk kökten biter) */
.map-canvas .maplibregl-map, .map-canvas.maplibregl-map{ position:absolute; inset:0; width:100%; height:100%; }
/* NAV MODU DÜZENİ (pro app gibi):
   - alt sekme çubuğunu gizle (immersive)
   - yan tuşları (Yol Bildir vb.) GÖSTER ama ETA kartının ÜSTÜNDE, tıklanır */
/* NAV MODU: alt sekme çubuğu (İşler·Harita·Sohbet·Menü) HEP SABİT kalır — kullanıcı
   serbest gezinir, ona karışmıyoruz. ETA kartı + yan tuşlar çubuğun ÜSTÜNE konumlanır. */
body.nav-on .map-fabs{ display:flex !important; bottom:calc(148px + env(safe-area-inset-bottom,0px)) !important; z-index:8650 !important; }
body.nav-on .map-fab{ display:flex !important; bottom:calc(222px + env(safe-area-inset-bottom,0px)) !important; z-index:8650 !important; }
/* HARİTA DIŞI ekrandayken (nav sürerken): tam nav gizlenir, slim bar görünür (Google gibi — ekranı örtmez) */
body.nav-offmap #nav-banner, body.nav-offmap #nav-foot, body.nav-offmap #nav-recenter,
body.nav-offmap .map-fabs, body.nav-offmap .map-fab{ display:none !important; }
.nav-mini{ display:none; position:fixed; left:10px; right:10px; bottom:calc(74px + env(safe-area-inset-bottom,0px)); z-index:8560;
  background:#0b6e3f; color:#fff; border-radius:14px; padding:9px 11px; align-items:center; gap:10px; box-shadow:0 6px 20px rgba(0,0,0,.32); }
body.nav-offmap .nav-mini{ display:flex; }
/* slim bar açıkken alttaki yüzen tuşlar (chat +, tema) slim bar'ın ÜSTÜNE çıksın — çakışma yok */
body.nav-offmap .wz-fab, body.nav-offmap .theme-toggle{ bottom:calc(136px + env(safe-area-inset-bottom,0px)) !important; z-index:8555 !important; }
/* uygulama içi arama bar'ı (#call-bar) nav bar'larıyla çakışmasın — üstüne çıksın */
body.nav-on #call-bar{ bottom:calc(140px + env(safe-area-inset-bottom,0px)) !important; }
.nav-mini .nav-mini-tap{ display:flex; align-items:center; gap:10px; flex:1; cursor:pointer; min-width:0; }
.nav-mini .ok{ font-size:24px; line-height:1; flex:none; }
.nav-mini .d{ font-weight:800; font-size:13.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.nav-mini .s{ font-size:11px; opacity:.92; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.nav-mini .end{ background:rgba(255,255,255,.22); border:none; color:#fff; width:34px; height:34px; border-radius:50%; font-size:15px; cursor:pointer; flex:none; }