/* Shared layout fixes for the High Plateau route maps. Loaded after detailed.css and route.css. */

/* Desktop: the map fills its column. frame.js holds the column at the tallest day panel and
   re-fits the viewBox, so there is no empty band under the map. */
@media(min-width:1101px){
#routemap.detailed-map .mapside{display:flex;flex-direction:column}
#routemap.detailed-map .maps{flex:1 1 auto;display:flex;flex-direction:column}
#routemap.detailed-map .mview.on{flex:1 1 auto;display:flex;flex-direction:column}
#routemap.detailed-map .mview.on .gmap{flex:1 1 auto}
}

/* Tablet and phone: one column. detailed.css sets two columns with an id selector, which
   outranks the single-column rule in map.css, so it is restated here at the same strength. */
@media(max-width:1100px){
#routemap.detailed-map .gwbody,#routemap.detailed-map.big .gwbody{grid-template-columns:minmax(0,1fr)}
#routemap.detailed-map .listside{border-left:0}
#routemap.detailed-map.big{overflow-y:auto}
#routemap.detailed-map.big .gmap{height:auto;min-height:0}
}

/* One on-screen size for every map. frame.js publishes --u (map units per screen pixel) on each
   map, so labels, lines and markers render at the same pixel size on all four routes however far
   each view is zoomed. Sizes are the Everest benchmark's at desktop width; --s scales the set
   up for Expand and down for phones. */
#routemap.detailed-map .gmap{--u:2;--s:1}
#routemap.detailed-map.big .gmap{--s:1.3}
@media(max-width:760px){#routemap.detailed-map .gmap{--s:.8}}
#routemap.detailed-map .stop .nm{font-size:calc(var(--u)*var(--s)*11.2px);stroke-width:calc(var(--u)*var(--s)*3.4px)}
#routemap.detailed-map .lake-label,#routemap.detailed-map .context-label{font-size:calc(var(--u)*var(--s)*9.7px);stroke-width:calc(var(--u)*var(--s)*2px)}
#routemap.detailed-map .region-label{font-size:calc(var(--u)*var(--s)*10.7px);letter-spacing:calc(var(--u)*var(--s)*3.9px)}
#routemap.detailed-map .legs .leg{stroke-width:calc(var(--u)*var(--s)*2.4px)}
#routemap.detailed-map .legs .leg.active{stroke-width:calc(var(--u)*var(--s)*3.9px)!important}
#routemap.detailed-map .legs .leg[stroke-dasharray]{stroke-dasharray:calc(var(--u)*var(--s)*5.8px) calc(var(--u)*var(--s)*4.4px)}
#routemap.detailed-map .stop .pt{r:calc(var(--u)*var(--s)*3.9px);stroke-width:calc(var(--u)*var(--s)*1.9px)}
#routemap.detailed-map .stop .leader{stroke-width:calc(var(--u)*var(--s)*.63px)}

/* Phone, whole-journey view: there is not room for every name across ~340 px. Show the selected
   day's stops and four anchors; every marker stays. Regional tabs keep all their names. */
@media(max-width:760px){
#routemap.detailed-map .mview[data-view="all"] .stop:not(.on):not([data-city="Lhasa"]):not([data-city="Kathmandu"]):not([data-city="Darchen"]):not([data-city="Everest / Rongbuk"]) :is(.nm,.leader){display:none}
}

/* Desktop label edges only; mobile refinements remain a separate preview. */
@media(min-width:1101px){
/* Keep the Siling Tso caption inside the western regional crop. */
#routemap.detailed-map .mview[data-view="kailash"] .lake-label[x="2110"]{text-anchor:end}
/* Shigatse is outside the Nepal crop: remove its stray caption and leader. */
#routemap.detailed-map .mview[data-view="nepal"] [data-city="Shigatse"] :is(.nm,.leader){display:none}
/* Keep Gyantse above the expanded lakes map's lower edge. */
#routemap.detailed-map.big .mview[data-view="namtso"] [data-city="Gyantse"] .nm{transform:translateY(-18px)}
#routemap.detailed-map.big .mview[data-view="namtso"] [data-city="Gyantse"] .leader{d:path("M2190 4380 L2162 4435")}
/* These secondary captions refer to context beyond this regional crop. */
#routemap.detailed-map.big .mview[data-view="namtso"] .lake-label[transform]{display:none}
#routemap.detailed-map .mview[data-view="kailash"] .region-label[x="1200"]{display:none}
#routemap.detailed-map.big .mview[data-view="kailash"] [data-city="Paiku Tso"] :is(.nm,.leader){display:none}
}

/* GM captions: desktop presentation offsets only, preserving stop coordinates. */
@media(min-width:1101px){
#routemap.detailed-map [data-city="Manasarovar"] .nm{transform:translateY(-50px)}
#routemap.detailed-map [data-city="Manasarovar"] .leader{d:path("M1035 3810 L930 3868")}
#routemap.detailed-map [data-city="Darchen"] .nm{transform:translateY(45px)}
#routemap.detailed-map [data-city="Darchen"] .leader{d:path("M1025 3760 L810 3698")}
#routemap.detailed-map .kailash-symbol{transform:translate(65px,15px)}
#routemap.detailed-map .context-label[x="1075"][y="3680"]{transform:translate(31px,40px)}
}