/* ============================================================================
   成都普什物流 · 网点地图与导航模块样式（可独立复用）
   file: static/css/ps-map.css
   ========================================================================== */

/* ---------- 地图 ---------- */
.psm{position:relative;width:100%;overflow:hidden;background:#E8EDF2;cursor:grab;touch-action:none;
  font:13px/1.6 system-ui,"Microsoft YaHei",sans-serif}
.psm.is-dragging{cursor:grabbing}
.psm-tiles{position:absolute;left:0;top:0;width:100%;height:100%}
.psm-tiles img{position:absolute;display:block;user-select:none;-webkit-user-drag:none}
.psm-pin{position:absolute;left:50%;top:50%;transform:translate(-50%,-92%);pointer-events:none;
  filter:drop-shadow(0 6px 10px rgba(0,0,0,.32));z-index:3}
.psm-ctrl{position:absolute;right:12px;bottom:16px;display:flex;flex-direction:column;gap:8px;z-index:4}
.psm-btn{width:38px;height:38px;border:1px solid rgba(15,76,153,.18);border-radius:9px;background:rgba(255,255,255,.96);
  color:#0F4C99;font-size:19px;font-weight:700;line-height:1;cursor:pointer;box-shadow:0 4px 12px rgba(12,43,63,.16)}
.psm-btn:hover{background:#fff;border-color:#1E9E62;color:#1E9E62}
.psm-fallback[hidden]{display:none!important}
.psm-fallback{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:8px;text-align:center;padding:26px;background:#F4FAF6;color:#6B8489;z-index:5}
.psm-fallback b{font-size:15px;color:#0F4C99}
.psm-fallback span{font-size:12.5px;line-height:1.9;max-width:380px}
.psm-tip{position:absolute;left:12px;top:12px;z-index:5;background:rgba(15,76,153,.9);color:#fff;
  border-radius:8px;padding:7px 12px;font-size:12px;line-height:1.6;max-width:70%}

/* ---------- 导航按钮 ---------- */
.ps-navbtn{display:inline-flex;align-items:center;justify-content:center;gap:7px;
  background:linear-gradient(135deg,#0F4C99,#1E9E62);color:#fff;border:0;border-radius:8px;
  padding:11px 22px;font-size:14.5px;font-weight:700;letter-spacing:1px;cursor:pointer;
  box-shadow:0 8px 18px rgba(15,76,153,.22);transition:.16s;white-space:nowrap}
.ps-navbtn:hover{filter:brightness(1.07);transform:translateY(-1px)}
.ps-callbtn{display:inline-flex;align-items:center;justify-content:center;gap:7px;
  background:#C0392B;color:#fff;border:0;border-radius:8px;padding:11px 20px;font-size:14.5px;
  font-weight:700;letter-spacing:.5px;cursor:pointer;text-decoration:none;white-space:nowrap}
.ps-callbtn:hover{filter:brightness(1.08)}
.ps-ghostbtn{display:inline-flex;align-items:center;justify-content:center;gap:6px;
  background:#F2F8F4;color:#2A4750;border:1px solid #DFEBE4;border-radius:8px;
  padding:10px 16px;font-size:13.5px;cursor:pointer;white-space:nowrap}
.ps-ghostbtn:hover{border-color:#1E9E62;color:#0F4C99}

/* ---------- 导航选择弹窗 ---------- */
.ps-navmodal{position:fixed;inset:0;z-index:9999;display:flex;align-items:flex-end;justify-content:center}
.ps-navmodal[hidden]{display:none}
.ps-navmodal-mask{position:absolute;inset:0;background:rgba(8,26,40,.62);opacity:0;transition:opacity .2s}
.ps-navmodal.is-open .ps-navmodal-mask{opacity:1}
.ps-navmodal-card{position:relative;width:100%;max-width:460px;background:#fff;border-radius:16px 16px 0 0;
  padding:20px 18px calc(18px + env(safe-area-inset-bottom));transform:translateY(18px);opacity:0;
  transition:transform .22s,opacity .22s;box-shadow:0 -12px 40px rgba(0,0,0,.28)}
.ps-navmodal.is-open .ps-navmodal-card{transform:translateY(0);opacity:1}
.ps-navmodal-title{font-size:17px;color:#0F4C99;text-align:center;margin-bottom:5px}
.ps-navmodal-desc{font-size:12.5px;color:#8AA3A9;text-align:center;margin-bottom:16px;line-height:1.7}
.ps-navmodal-list{list-style:none;display:flex;flex-direction:column;gap:10px}
.ps-nav-item{width:100%;display:flex;align-items:center;gap:12px;background:#F7FCF9;
  border:1px solid #E1EDE6;border-radius:11px;padding:13px 15px;cursor:pointer;transition:.15s;text-align:left}
.ps-nav-item:hover{border-color:#1E9E62;background:#F2FAF5}
.ps-nav-item-ico{width:34px;height:34px;flex:0 0 34px;border-radius:9px;display:flex;align-items:center;
  justify-content:center;background:#EAF4EE;color:#0F4C99;font-size:16px}
.ps-nav-item-label{flex:1;font-size:15px;font-weight:600;color:#2A4750}
.ps-nav-item-go{font-size:12.5px;color:#8AA3A9}
.ps-nav-cancel{width:100%;margin-top:12px;background:#fff;border:1px solid #E1EDE6;border-radius:11px;
  padding:12px;font-size:14.5px;color:#6B8489;cursor:pointer}
.ps-nav-cancel:hover{border-color:#C0392B;color:#C0392B}

@media(max-width:600px){
  .ps-navmodal{align-items:flex-end}
  .ps-navbtn,.ps-callbtn{flex:1;min-width:130px}
}


/* ============================================================================
   网点快选 + 卡片编号 + 导航弹窗信息区（手机端强化）
   ========================================================================== */

/* ---------- 网点快速选择条 ---------- */
.netbar{background:#fff;border-bottom:1px solid #E3EEE8;padding:9px 0;position:sticky;top:58px;z-index:520;
  box-shadow:0 2px 10px rgba(12,43,63,.05)}
@media(min-width:821px){ .netbar{top:106px} }
.netbar .wrap{display:flex;align-items:center;gap:10px}
.netbar .nb-lb{flex:0 0 auto;font-size:12.5px;font-weight:700;color:#2F4F58;white-space:nowrap}
.netbar ul{list-style:none;display:flex;gap:7px;overflow-x:auto;padding:2px 0;flex:1;
  -webkit-overflow-scrolling:touch;scrollbar-width:none}
.netbar ul::-webkit-scrollbar{display:none}
.netbar a{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;padding:6px 12px 6px 7px;
  border:1px solid #D9E9E3;border-radius:16px;background:#F7FCF9;font-size:12.5px;color:#1F3F47;
  text-decoration:none;white-space:nowrap;font-weight:600}
.netbar a b{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;
  border-radius:50%;background:#115C61;color:#fff;font-size:11px;font-weight:800;letter-spacing:-.3px}
.netbar a:hover,.netbar a:active{border-color:#1E9E62;background:#EFF9F3}
.netbar a:hover b,.netbar a:active b{background:#1E9E62}

/* ---------- 卡片编号 ---------- */
.net{scroll-margin-top:170px}
.net .nt .no{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;flex:0 0 26px;
  border-radius:8px;background:linear-gradient(135deg,#115C61,#1E9E62);color:#fff;font-size:12px;font-weight:800}
.net .nt .cd{margin-left:auto;font-size:11px;color:#2F4F58;letter-spacing:.5px;background:#F2F8F4;
  border:1px solid #E3EEE8;border-radius:8px;padding:1px 7px}
.net .nt b{font-size:16.5px}
.net .nt{flex-wrap:nowrap;gap:8px}
.net .nt .bdg{flex:0 0 auto;margin-left:0}

/* ---------- 主次按钮分组 ---------- */
.net .nact{display:flex;gap:9px;margin-top:13px;flex-wrap:nowrap}
.net .nact>*{flex:1;min-width:0;padding:12px 8px;font-size:14.5px;border-radius:10px}
.net .nact .ps-navbtn svg,.net .nact .ps-callbtn svg{width:17px;height:17px;flex:0 0 17px}
.net .ntools{display:flex;gap:8px;margin-top:8px;flex-wrap:nowrap}
.net .ntools>*{flex:1;min-width:0;padding:9px 8px;font-size:13px;border-radius:9px}
@media(max-width:520px){
  .net .nact>*{padding:12px 6px;font-size:14px}
  .net .nt .cd{display:none}
}

/* ---------- 导航弹窗：目的地信息 + 拨号 ---------- */
.ps-navmodal-info{margin:0 0 14px;padding:11px 13px;background:#F4FAF6;border:1px solid #DFEBE4;border-radius:11px}
.ps-navmodal-row{display:flex;gap:9px;font-size:12.5px;line-height:1.8;color:#2F4F58;margin-bottom:3px}
.ps-navmodal-row:last-child{margin-bottom:0}
.ps-navmodal-row i{font-style:normal;flex:0 0 44px;color:#2F4F58;font-weight:700}
.ps-navmodal-row span,.ps-navmodal-row a{flex:1;color:#1B2E35;word-break:break-all;font-weight:600}
.ps-navmodal-row a{color:#C0392B;font-weight:800;text-decoration:none}
.ps-navmodal-call{display:flex;align-items:center;justify-content:center;gap:7px;width:100%;margin-top:12px;
  padding:12px;border-radius:11px;background:#C0392B;color:#fff;font-size:14.5px;font-weight:700;
  text-decoration:none;letter-spacing:.5px}
.ps-navmodal-call svg{width:17px;height:17px;flex:0 0 17px}
.ps-navmodal-warn{margin-top:11px;padding:9px 11px;background:#FFF7EC;border:1px solid #FFE0B8;border-radius:9px;
  font-size:11.5px;line-height:1.8;color:#8A5A18}
.ps-navmodal-warn[hidden]{display:none!important}

/* ---------- 地图页顶部网点切换条 ---------- */
.navsw{position:absolute;left:0;right:0;z-index:19;background:rgba(255,255,255,.97);
  border-bottom:1px solid #E3EEE8;box-shadow:0 3px 12px rgba(12,43,63,.07);padding:7px 10px}
.navsw ul{list-style:none;display:flex;gap:7px;overflow-x:auto;-webkit-overflow-scrolling:touch;
  scrollbar-width:none}
.navsw ul::-webkit-scrollbar{display:none}
.navsw a{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;padding:5px 11px 5px 6px;
  border:1px solid #D9E9E3;border-radius:15px;background:#F7FCF9;font-size:12px;color:#1F3F47;
  text-decoration:none;white-space:nowrap;font-weight:600}
.navsw a b{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;
  background:#115C61;color:#fff;font-size:10.5px;font-weight:800}
.navsw a.cur{background:#115C61;border-color:#115C61;color:#fff}
.navsw a.cur b{background:#7FD3A3;color:#0D4A4F}