/* Ask then Go trip map: card, full-screen mode, panel, pins, popups */
.nm-card{background:#fff;border:1px solid #ebe3ef;border-radius:24px;margin:19px 0 24px;padding:18px;box-shadow:0 12px 30px #32243c08;position:relative}
.nm-card.hide{display:none}
.nm-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.nm-head h3{margin:0;font-size:20px;letter-spacing:-.6px}.nm-head small{color:#938b93;font-size:12px}
.nm-actions{display:flex;gap:8px;flex-wrap:wrap}
.nm-btn{border:1px solid #b7dcd9;background:#e3f1f0;color:#155f66;border-radius:18px;padding:8px 13px;font-size:13px;font-weight:650}
.nm-btn:hover{background:#d3ebe8}.nm-btn:focus-visible,.nm-primary:focus-visible,.nm-chip:focus-visible,.nm-item:focus-visible,.nm-pin:focus-visible,.nm-close:focus-visible,.nm-step:focus-visible{outline:3px solid #1d7a8266;outline-offset:2px}
.nm-primary{background:#1d7a82;color:#fff;border:0;border-radius:20px;padding:10px 18px;font-weight:700}
.nm-primary:hover{background:#155f66}
.nm-consent{border:1px dashed #9fcdc8;background:#eef8f7;border-radius:18px;padding:18px;display:none}
.nm-consent p{margin:7px 0 13px;font-size:13px;color:#5f5668}
.nm-card.nm-needs-consent .nm-consent{display:block}.nm-card.nm-needs-consent .nm-body,.nm-card.nm-needs-consent .nm-actions{display:none}
.nm-body{display:flex;min-height:0}
.nm-panel{display:none}
.nm-stage{position:relative;flex:1;min-width:0}
.nm-canvas{height:380px;border-radius:18px;overflow:hidden;background:radial-gradient(circle at 50% 40%,#dfe9f6,#c9d6ea)}
.nm-card.nm-loading .nm-canvas{opacity:.55}
.nm-status{position:absolute;left:12px;bottom:12px;max-width:calc(100% - 90px);background:#fffffff2;border-radius:12px;padding:5px 10px;font-size:12px;color:#5f5668;box-shadow:0 2px 10px #2a203b1f}
.nm-status:empty{display:none}
.nm-close{display:none;position:absolute;top:12px;left:12px;z-index:3;width:38px;height:38px;border-radius:50%;border:0;background:#fff;box-shadow:0 2px 12px #2a203b33;font-size:22px;line-height:1}
.nm-foot{margin:9px 2px 0;font-size:11px;color:#938b93}
/* the stops that could not be found: named under the map, outside it (the map's own attribution stays free) */
.nm-miss{display:flex;gap:6px;align-items:flex-start;margin:8px 2px 0;font-size:12px;line-height:1.45;color:#7a5a2a}
.nm-miss[hidden]{display:none}
.nm-miss .nm-ic{width:14px;height:14px;flex:none;margin-top:2px}
/* pins */
.nm-wrap{display:grid;place-items:center}
.nm-pin{width:30px;height:30px;border-radius:50%;border:3px solid #fff;background:#1d7a82;color:#fff;font-weight:800;font-size:12px;display:grid;place-items:center;box-shadow:0 3px 10px #2a203b55;padding:0;cursor:pointer}
.nm-pin{position:relative}
.nm-pin.poi{width:24px;height:24px;background:#f2694b;font-size:10px}
/* the stop's days (22.10): a range ("4–5", "1–2 · 5") needs a pill, one day stays a round pin */
.nm-pin.is-range{width:auto;min-width:30px;height:28px;border-radius:14px;padding:0 8px;font-size:11.5px;letter-spacing:-.2px;white-space:nowrap}
.nm-pin.origin{background:#2f2138;width:22px;height:22px;font-size:11px}
.nm-pin.is-active{background:#2f2138;box-shadow:0 0 0 4px #1d7a8255,0 3px 12px #2a203b77;z-index:5}
.nm-pin.poi.is-active{background:#a8460f}
.nm-pin.is-dim{opacity:.35}
.nm-pin.nm-hidden{opacity:0;pointer-events:none}
.nm-pin.nm-pop{animation:nmpop .5s cubic-bezier(.2,1.6,.4,1)}
@keyframes nmpop{from{scale:.2;opacity:0}to{scale:1;opacity:1}}
.nm-pin{font-variant-numeric:tabular-nums}
.nm-plane{width:34px;height:34px;border-radius:50%;background:#fff;box-shadow:0 3px 12px #2a203b55;display:grid;place-items:center;color:#1d7a82;font-size:18px;pointer-events:none}
.nm-plane span{display:block;transform:rotate(-90deg);line-height:0}.nm-plane .nm-ic{width:20px;height:20px;display:block}
.nm-leglabel{background:#fff;border-radius:12px;padding:3px 9px;font-size:12px;font-weight:700;color:#2c4a52;box-shadow:0 2px 10px #2a203b33;pointer-events:none;white-space:nowrap}
/* popup */
.nm-popup{display:grid;gap:4px;font:13px/1.4 -apple-system,Segoe UI,Arial,sans-serif;color:#271e31;min-width:190px}
.nm-popup small{color:#7f55b5;font-weight:700}.nm-popup strong{font-size:15px}.nm-popup p{margin:2px 0;color:#5f5668}
.nm-popup ul{margin:2px 0;padding-left:16px;color:#5f5668}
.nm-link{color:#155f66;font-weight:650;text-decoration:none}.nm-link:hover{text-decoration:underline}
.maplibregl-popup-content{border-radius:16px!important;padding:14px 16px!important;box-shadow:0 10px 34px #2a203b44!important}
/* list <-> map selection in the itinerary */
.nm-selectable{cursor:pointer;transition:box-shadow .2s,border-color .2s}
.nm-selectable:hover{box-shadow:0 0 0 2px #1d7a8233}
.nm-selectable:focus-visible{outline:3px solid #1d7a8266;outline-offset:2px}
.nm-selectable.is-selected{box-shadow:0 0 0 3px #1d7a82;border-radius:18px}
.timeline-item{position:relative}
.nm-remove{position:absolute;top:8px;right:8px;width:28px;height:28px;border-radius:50%;border:1px solid #e3d9ea;background:#fff;color:#8a7d92;font-size:17px;line-height:1;opacity:.0;transition:opacity .15s}
.timeline-item:hover .nm-remove,.timeline-item:focus-within .nm-remove,.nm-remove:focus-visible{opacity:1}
@media(hover:none){.nm-remove{opacity:1}}
.aff-notice{border-left:3px solid #1d7a82;padding-left:10px}
/* panel + full screen */
html.nm-lock,html.nm-lock body{overflow:hidden}
.nm-card.nm-full{position:fixed;inset:0;z-index:90;margin:0;border-radius:0;border:0;padding:0;display:flex;flex-direction:column;background:#fff}
.nm-card.nm-full .nm-head{margin:0;padding:12px 16px 12px 62px;border-bottom:1px solid #eee8ed}
.nm-card.nm-full .nm-foot{display:none}
.nm-card.nm-full .nm-body{flex:1;min-height:0}
.nm-card.nm-full .nm-stage{position:relative}
.nm-card.nm-full .nm-canvas{height:100%;border-radius:0}
.nm-card.nm-full .nm-close{display:block;position:fixed;top:12px;left:12px}
.nm-card.nm-full .nm-panel{display:flex;flex-direction:column;width:380px;max-width:42vw;border-right:1px solid #eee8ed;background:#fff;min-height:0;overflow:hidden}
.nm-panel-top{padding:12px 14px;border-bottom:1px solid #f0ebf2;display:grid;gap:10px}
.nm-daynav{display:flex;align-items:center;justify-content:space-between;gap:8px}
.nm-step{width:34px;height:34px;border-radius:50%;border:1px solid #b7dcd9;background:#e3f1f0;font-size:20px;line-height:1;color:#155f66}.nm-step:disabled{opacity:.35;cursor:default}
.nm-chips{display:flex;gap:6px;overflow-x:auto;padding-bottom:4px;scrollbar-width:thin}
.nm-chip{flex:none;min-width:34px;height:32px;border-radius:16px;border:1px solid #b7dcd9;background:#fff;padding:0 11px;font-weight:650;font-size:13px;color:#2c4a52}
.nm-chip.on{background:#1d7a82;border-color:#1d7a82;color:#fff}
.nm-list{overflow:auto;padding:10px 12px 20px;display:grid;gap:6px;align-content:start}
.nm-item{text-align:left;display:grid;gap:2px;border:1px solid #eee8ed;background:#fff;border-radius:14px;padding:9px 12px}
.nm-item.stop{background:#eef8f7;border-color:#c8e4e1}.nm-item.seg{margin-left:14px}
.nm-item small{color:#8c8394;font-size:12px}
.nm-item.is-active{border-color:#1d7a82;box-shadow:0 0 0 2px #1d7a8244}
.nm-leg{font-size:12px;color:#7f55b5;padding:2px 6px}
.nm-empty,.nm-hint{font-size:12px;color:#8c8394;margin:6px 4px}
@media(max-width:760px){
  .nm-canvas{height:300px}
  .nm-card.nm-full .nm-body{flex-direction:column-reverse}
  .nm-card.nm-full .nm-panel{width:100%;max-width:none;height:44vh;border-right:0;border-top:1px solid #eee8ed;flex:none}
  .nm-card.nm-full .nm-stage{flex:1;min-height:0}
  .nm-card.nm-full .nm-head{padding-left:62px}
  .nm-card.nm-full .nm-actions .nm-btn:last-child{display:none}
}
@media(prefers-reduced-motion:reduce){.nm-pin.nm-pop{animation:none}}

/* real map replaces the schematic animation but keeps the stop chips */
#routeCard.nm-live .section-top,#routeCard.nm-live #routeSvg,#routeCard.nm-live .route-caption{display:none}
#routeCard.nm-live{padding-top:14px}

.nm-plane.nm-car span{transform:none}
.nm-plane.nm-car{color:#e2573a}
.nm-leg.road{color:#c4492f}
.nm-leg.flight{color:#1d7a82}
.nm-leg.boat{color:#2b6cb0}
.nm-daytrip{font-size:12px;color:#c4492f;padding:2px 6px 2px 14px}
/* compact day dialog: the map alone, centred over a dimmed page */
.nm-backdrop{position:fixed;inset:0;z-index:89;background:#0e223066;backdrop-filter:blur(2px)}
.nm-card.nm-full.nm-compact{inset:auto;top:50%;left:50%;transform:translate(-50%,-50%);width:min(760px,94vw);height:min(560px,82vh);border-radius:22px;box-shadow:0 30px 80px #0e223055;overflow:hidden}
.nm-card.nm-full.nm-compact .nm-panel{display:none}
.nm-card.nm-full.nm-compact .nm-close{position:absolute;top:10px;left:10px}
.nm-card.nm-full.nm-compact .nm-head{padding-left:54px}
.nm-card.nm-full.nm-compact .nm-canvas{border-radius:0 0 22px 22px}
/* the schematic flight shown before the real map is allowed: Ask then Go's first animation, drawn locally, in the current palette */
.nm-schem{margin:0 0 12px}
.nm-schem[hidden]{display:none}
.nm-schem-svg{display:block;width:100%;height:auto;border-radius:16px}
.nm-schem-cap{margin:6px 2px 0;font-size:12.5px;color:var(--nm-muted,#5b6870);font-weight:600}

/* 27.10, points only: a town's numbered pill stays above the small places next to it (Fansipan covered Sapa's "2–4") */
.maplibregl-marker:has(> .nm-pin.stop){z-index:3}
.maplibregl-marker:has(> .nm-pin.poi){z-index:1}
.nm-pin.poi{width:14px;height:14px;border-width:2px;font-size:0}
/* 27.10: the town's pin says its days in words and names the town ("Zilele 2–4" / "Sapa") */
.nm-pin.is-days{width:auto;height:auto;min-width:0;border-radius:12px;padding:4px 10px 5px;display:flex;flex-direction:column;align-items:center;gap:1px;line-height:1.1;white-space:nowrap;font-variant-numeric:tabular-nums}
.nm-pin.is-days b{font-size:12px;font-weight:800;letter-spacing:-.1px}
.nm-pin.is-days small{font-size:10.5px;font-weight:600;opacity:.88;max-width:120px;overflow:hidden;text-overflow:ellipsis}
