/* Shuttle bus and taxi stops (assets/bus-stops.js). Pink for shuttle buses, yellow for taxi-only stations - the same colours as
 * the "Shuttle buses" and "Taxis" chips in map-layers.js's CATEGORIES, so a colour change there should be echoed here too.
 * Tokens come from map-page.css. */
.pz-bus-icon{ background:none; border:0; transition:opacity .15s ease; }
.pz-bus-icon svg{ display:block; overflow:visible; filter:drop-shadow(0 1px 3px rgba(0,0,0,0.55)); }
.pz-bus-icon:hover svg{ filter:drop-shadow(0 1px 3px rgba(0,0,0,0.55)) brightness(1.15); }

.pz-bus-pop .leaflet-popup-content{ margin:12px 14px; width:var(--pop-w) !important; font-size:12px; line-height:1.45; max-height:min(70vh, 270px); overflow-y:auto; }
/* A card taller than the cap scrolls, and says so: a scrollbar that stays on show (the pink track and thumb, not the system's auto-hiding one)
   and a "Scroll for more" bar at the foot of the visible part (bus-stops.js adds it, and takes it away at the end). */
.pz-bus-pop .leaflet-popup-content::-webkit-scrollbar{ width:10px; }   /* styled with the WebKit pseudo-elements only: setting scrollbar-width or scrollbar-color as well makes Chrome and Safari fall back to the system scrollbar, which hides itself until you scroll */
.pz-bus-pop .leaflet-popup-content::-webkit-scrollbar-track{ background:#262B36; border-radius:5px; }
.pz-bus-pop .leaflet-popup-content::-webkit-scrollbar-thumb{ background:#F27FB5; border-radius:5px; border:2px solid #262B36; }
@supports (-moz-appearance:none){ .pz-bus-pop .leaflet-popup-content{ scrollbar-width:thin; scrollbar-color:#F27FB5 #262B36; } }   /* Firefox has no WebKit pseudo-elements */
.pz-bus-pop .pz-bus-more{ position:sticky; bottom:0; margin:4px 0 -2px; padding:16px 0 2px; text-align:center; font:600 11px var(--body); color:#F59BC6; background:linear-gradient(to bottom, rgba(23,27,36,0), #171B24 62%); pointer-events:none; }
.pz-bus-pop .pz-bus-more::after{ content:' \2193'; }
.pz-bus-pop .pz-bus-more.is-end{ display:none; }
.pz-bus-pop h3{ margin:0 22px 1px 0; font-family:var(--display); font-weight:700; font-size:16px; line-height:1.2; color:#F3F5F7; }
.pz-bus-pop .pz-bus-jp{ color:#7C8494; font-size:12px; margin-bottom:8px; }
.pz-bus-pop h4{ margin:8px 0 2px; font:600 11px var(--body); letter-spacing:.06em; text-transform:uppercase; color:var(--bus, #F27FB5); }
.pz-bus-pop .pz-bus-times{ margin:0; color:#F3F5F7; font-size:13px; font-variant-numeric:tabular-nums; }
.pz-bus-pop .pz-bus-tag{ margin:6px 0 0; font-size:11px; color:#B4BCC8; }
.pz-bus-pop .pz-bus-times.none{ color:#7C8494; }
.pz-bus-pop .pz-bus-note{ margin:8px 0 0; font-size:11px; color:#7C8494; }
.pz-bus-pop .pz-bus-note a{ color:#F59BC6; }
.pz-bus-pop .pz-bus-link{ display:inline-block; margin-top:10px; padding:6px 10px; background:var(--bus, #F27FB5); color:#10131A !important; font-weight:600; text-decoration:none; border-radius:4px; }
.pz-bus-pop .pz-bus-link:hover{ background:#F59BC6; }
.pz-bus-pop .pz-bus-flag{ margin:0 0 10px; padding:9px 11px; border:1px solid var(--bus, #F27FB5); background:rgba(242,127,181,.14); background:color-mix(in srgb, var(--bus, #F27FB5) 14%, transparent); border-radius:4px; color:#F3F5F7; font-size:12px; line-height:1.4; }
.pz-bus-pop .pz-bus-flag strong{ display:block; margin-bottom:2px; color:#F59BC6; font-size:14px; }
.pz-bus-pop .pz-bus-svc{ margin:0 0 6px; padding-top:2px; font:600 11px var(--body); letter-spacing:.06em; text-transform:uppercase; color:#F59BC6; }
.pz-bus-pop .pz-bus-card + .pz-bus-card{ margin-top:14px; padding-top:12px; border-top:1px solid #262B36; }

/* The one-line "Checked ..." strip and its hidden detail panel: the site's own info-icon pattern (map-layers.js handles the
   click/hover open and close for any .pz-info button on the page), styled to match this popup's own tokens instead of the
   Places popup's. */
.pz-bus-pop .pz-conf{ display:flex; align-items:center; gap:6px; margin:9px 0 0; font-size:11px; color:#7C8494; }
.pz-bus-pop .pz-conf .pz-info{ margin-left:auto; flex:none; width:15px; height:15px; padding:0; border-radius:50%; border:1px solid #7C8494; background:none; color:#7C8494; font:600 10px var(--body); line-height:13px; cursor:pointer; }
.pz-bus-pop .pz-conf .pz-info:hover, .pz-bus-pop .pz-conf .pz-info:focus-visible{ color:#F59BC6; border-color:#F59BC6; outline:none; }
/* The panel is laid over the card below the strip, not added to it: a popup grows upward from its marker, so a panel that takes room would slide the i out from under the pointer (flicker). */
.pz-bus-pop .pz-info-panel{ position:absolute; z-index:5; left:15px; width:calc(100% - 30px); box-sizing:border-box; margin:4px 0 0; padding:6px 8px; background:#171B24; border:1px solid #262B36; border-left:2px solid var(--bus, #F27FB5); border-radius:4px; box-shadow:0 6px 16px rgba(0,0,0,.5); font-size:10.5px; line-height:1.5; color:#B4BCC8; }
.pz-bus-pop .pz-info-panel[hidden]{ display:none; }
.pz-bus-pop .pz-info-panel p{ margin:0 0 5px; }
.pz-bus-pop .pz-info-panel p:last-child{ margin:0; }
.pz-bus-pop .pz-info-panel a{ color:#F59BC6; }

/* Taxi-only stations: the site's own taxi yellow (#E6C94F, map-layers.js CATEGORIES) instead of the bus pink. */
.pz-bus-pop .pz-taxi-flag{ border-color:#E6C94F; background:rgba(230,201,79,.14); }
.pz-bus-pop .pz-taxi-flag strong{ color:#F2DB86; }
.pz-bus-pop .pz-taxi-link{ background:#E6C94F; color:#10131A !important; }
.pz-bus-pop .pz-taxi-link:hover{ background:#F2DB86; }

/* Line name tags (bus-stops.js [LABELS]): the line's letter or short name sitting on its own route line, and the same tag at the
   top of that line's card, so the two match. Dark text on the shuttle pink, like the bus stop icon. */
.pz-bus-line-label{ background:none; border:0; transition:opacity .15s ease; }
.pz-bus-line-label span{ display:inline-block; transform:translate(-50%, -50%); padding:1px 6px; white-space:nowrap; background:var(--bus, #F27FB5); color:#10131A; border:1.5px solid #0B1620; border-radius:9px; font:700 11px/1.3 var(--body); box-shadow:0 1px 3px rgba(0,0,0,.5); cursor:pointer; }
.pz-bus-pop .pz-bus-line-tag{ display:inline-block; margin-right:4px; padding:0 5px; background:var(--bus, #F27FB5); color:#10131A; border-radius:7px; letter-spacing:0; }
/* The hand shows only while the pointer is on a route line (bus-stops.js [HOVER] sets the class); the lines themselves take no mouse events. */
.leaflet-container.pz-bus-line-hover{ cursor:pointer; }
/* The chip beside the pointer that names the lit line or lines (bus-stops.js [HOVER]); it never takes the pointer itself. */
.pz-bus-hover-chip{ display:none; position:absolute; z-index:1000; pointer-events:none; max-width:260px; padding:5px 8px; background:#171B24; border:1px solid #F27FB5; border-radius:4px; box-shadow:0 4px 12px rgba(0,0,0,.5); font:600 11px/1.45 var(--body); color:#F3F5F7; }
.pz-bus-hover-chip span{ display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pz-bus-hover-chip .pz-chip-main{ color:#F3F5F7; }
.pz-bus-hover-chip .pz-chip-also{ margin-top:2px; font-weight:400; color:#B4BCC8; white-space:normal; }

/* The two bus canvases (routes, and the stop icons drawn as pictures) take no pointer events: hover and clicks on routes and stops
   are worked out from where the pointer is (bus-stops.js [HOVER]), so the canvases never block the map's own markers beneath. */
.leaflet-pzBusRoute-pane canvas, .leaflet-pzBusStops-pane canvas{ pointer-events:none; }