/* ============================================================
   Packlist route explorer v39
   Route-first dashboard layout: route context on the left,
   conditions and planning cards on the right.
   ============================================================ */

.trip-title-wrap.has-route-explorer,
.trip-title-wrap.trip-route-dashboard {
  padding: 0.55rem;
}

.trip-title-wrap.trip-route-dashboard .trip-banner-inner {
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(0, 1.62fr) minmax(25rem, 1fr);
  gap: clamp(0.78rem, 1.15vw, 1.1rem);
  align-items: start;
  padding: clamp(0.62rem, 0.95vw, 0.86rem);
  border-radius: 25px;
}

/* Natural DOM order is also the narrow-screen and keyboard reading order. */
.trip-title-wrap.trip-route-dashboard .trip-banner-inner > *,
.trip-title-wrap.trip-route-dashboard .trip-route-column > * {
  order: 0;
}

.trip-route-dates {
  margin: 0.38rem 0 0;
  color: var(--text-light, #8793a1);
  font-size: 0.8rem;
  line-height: 1.4;
}

/* Statistics occupy their own row; map and forecast share the next row. */
.trip-title-wrap.trip-route-dashboard .trip-route-column {
  grid-column: 1;
  grid-row: 3;
  position: relative;
  align-self: start;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.52rem;
  align-items: start;
  justify-content: stretch;
  min-width: 0;
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.trip-title-wrap.trip-route-dashboard .trip-title-panel {
  grid-column: 1 / -1;
  justify-self: stretch;
  min-width: 0;
  max-width: none;
  text-align: left;
  width: 100%;
  margin: 0;
  padding: 0.18rem 0 0.12rem;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.trip-title-wrap.trip-route-dashboard .trip-title-panel .trip-title-heading {
  display: block;
  width: 100%;
  max-width: none;
  margin: 0;
  text-align: left;
}

.trip-title-wrap.trip-route-dashboard .trip-title-heading,
.trip-title-wrap.trip-route-dashboard .trip-title-heading .data-display {
  justify-content: flex-start;
}

.trip-title-wrap.trip-route-dashboard .trip-title-static,
.trip-title-wrap.trip-route-dashboard .trip-title-heading .data-display,
.trip-title-wrap.trip-route-dashboard .title-input {
  color: var(--text, #18202a);
  font-size: clamp(1.55rem, 1.9vw, 2.1rem);
  font-weight: 900;
  line-height: 1.03;
  letter-spacing: -0.045em;
  text-shadow: none;
}

.trip-title-wrap.trip-route-dashboard .trip-banner-stats {
  grid-column: 1;
  grid-row: 2;
  display: grid;
  grid-template-columns: repeat(5,minmax(0,1fr));
  gap: 0.4rem;
  width: 100%;
  max-width: none;
  margin: 0;
  justify-content: flex-start;
}

.trip-title-wrap.trip-route-dashboard .trip-stat {
  display: grid;
  grid-template-columns: auto;
  gap: 0.03rem;
  min-width: 0;
  min-height: 2.7rem;
  padding: 0.38rem 0.58rem 0.42rem;
  border: 1px solid rgba(226,232,240,0.82);
  border-radius: 14px;
  background: rgba(255,255,255,0.86);
  box-shadow: 0 5px 14px rgba(15,43,37,0.05);
}

.trip-title-wrap.trip-route-dashboard .trip-stat-label {
  margin: 0;
  color: var(--label-color, #54615b);
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .06em;
  line-height: 1.4;
  text-transform: uppercase;
}

.trip-title-wrap.trip-route-dashboard .trip-stat strong {
  color: var(--text, #18202a);
  font-size: 0.9rem;
  font-weight: 900;
  line-height: 1.05;
}

.trip-route-explorer,
.trip-route-map-shell,
.trip-route-map-v24 {
  width: 100%;
}

.trip-route-explorer {
  min-width: 0;
}

.trip-route-map-shell {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(49,91,69,0.12);
  border-radius: 19px;
  background: #edf2ef;
  box-shadow: 0 10px 24px rgba(15,43,37,0.055);
}

.trip-route-map-v24 {
  height: clamp(28rem, 34vw, 34rem);
  min-height: 28rem;
  background: linear-gradient(145deg, #edf3ef, #f5f4ed);
}

.route-map-fit-button {
  position: absolute;
  z-index: 700;
  top: 0.62rem;
  right: 0.62rem;
  border: 1px solid rgba(49,91,69,0.22);
  border-radius: 999px;
  background: rgba(255,255,255,0.93);
  color: #315b45;
  padding: 0.38rem 0.72rem;
  font: inherit;
  font-size: 0.72rem;
  font-weight: 800;
  cursor: pointer;
  box-shadow: 0 5px 14px rgba(15,43,37,0.12);
  backdrop-filter: blur(8px);
}

.route-map-fit-button:hover,
.route-map-fit-button:focus-visible {
  background: #fff;
  border-color: rgba(49,91,69,0.40);
}

.route-map-status {
  position: absolute;
  z-index: 650;
  left: 0.7rem;
  right: 0.7rem;
  bottom: 0.7rem;
  padding: 0.45rem 0.62rem;
  border: 1px solid rgba(180,107,69,0.25);
  border-radius: 12px;
  background: rgba(255,255,255,0.92);
  color: #77503d;
  font-size: 0.68rem;
  font-weight: 700;
  box-shadow: 0 5px 14px rgba(15,43,37,0.10);
}

.trip-title-wrap.trip-route-dashboard .leaflet-container {
  font: inherit;
}

.trip-title-wrap.trip-route-dashboard .leaflet-control-attribution {
  max-width: min(78%, 42rem);
  white-space: normal;
  line-height: 1.15;
  font-size: 0.58rem;
  background: rgba(255,255,255,0.82);
}

.trip-title-wrap.trip-route-dashboard .leaflet-control-zoom a {
  color: #315b45;
}

/* Full-width profile directly below the map. */
.trip-title-wrap.trip-route-dashboard .trip-profile-panel {
  width: 100%;
  margin: 0;
  padding: 0.48rem 0.62rem 0.52rem;
  border: 1px solid rgba(226,232,240,0.80);
  border-radius: 16px;
  background: rgba(255,255,255,0.74);
  box-shadow: 0 7px 18px rgba(15,43,37,0.045);
}

.trip-title-wrap.trip-route-dashboard .trip-profile-head {
  display: flex;
  justify-content: space-between;
  gap: 0.5rem;
  align-items: baseline;
  margin-bottom: 0.1rem;
}

.trip-title-wrap.trip-route-dashboard .trip-profile-label,
.trip-title-wrap.trip-route-dashboard .trip-profile-range {
  font-size: 0.6rem;
}

.trip-profile-chart {
  position: relative;
  width: 100%;
  height: 9.2rem;
  min-height: 8.4rem;
}

.trip-profile-chart svg {
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
}

.route-profile-grid-line {
  stroke: rgba(98,115,130,0.18);
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}

.route-profile-axis-label {
  fill: #7b8795;
  font-size: 10px;
  font-weight: 700;
}

.route-profile-area {
  fill: rgba(45,138,112,0.10);
}

.route-profile-line {
  fill: none;
  stroke: #2d8a70;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}

.route-profile-hover-line {
  stroke: rgba(31,54,65,0.45);
  stroke-width: 1;
  stroke-dasharray: 3 3;
  vector-effect: non-scaling-stroke;
  pointer-events: none;
}

.route-profile-hover-dot {
  fill: #fff;
  stroke: #315b45;
  stroke-width: 2;
  vector-effect: non-scaling-stroke;
  pointer-events: none;
}

.trip-profile-readout {
  min-height: 1rem;
  margin-top: 0.12rem;
  color: #6e7b89;
  font-size: 0.64rem;
  font-weight: 700;
}

.route-profile-empty {
  display: grid;
  place-items: center;
  height: 100%;
  color: #7b8795;
  font-size: 0.72rem;
  font-weight: 700;
}

/* Right column = forecast, route water, day summary. */
.trip-title-wrap.trip-route-dashboard .trip-info-column {
  grid-column: 2;
  grid-row: 3;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.52rem;
  align-content: start;
  min-width: 0;
  padding-top: 0;
}

.trip-title-wrap.trip-route-dashboard .trip-info-column > * {
  width: 100%;
  min-width: 0;
  margin: 0 !important;
}

/* Stack before the sidebar becomes too cramped. */
@media (max-width: 1120px) {
  .trip-title-wrap.trip-route-dashboard .trip-banner-inner {
    grid-template-columns: 1fr;
  }

  .trip-title-wrap.trip-route-dashboard .trip-info-column {
    grid-column: 1;
    grid-row: 4;
    grid-template-columns: 1fr;
    padding-top: 0;
  }

  .trip-route-map-v24 {
    height: clamp(24rem, 54vw, 31rem);
    min-height: 24rem;
  }
}

@media (max-width: 640px) {
  .trip-title-wrap.trip-route-dashboard {
    padding: 0.4rem;
  }

  .trip-title-wrap.trip-route-dashboard .trip-banner-inner {
    gap: 0.48rem;
    padding: 0.46rem;
  }

  .trip-title-wrap.trip-route-dashboard .trip-route-column {
    gap: 0.42rem;
    padding: 0;
  }

  .trip-title-wrap.trip-route-dashboard .trip-banner-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.28rem;
  }

  .trip-title-wrap.trip-route-dashboard .trip-stat {
    min-width: 0;
    padding-inline: 0.42rem;
  }

  .trip-route-map-v24 {
    height: 18rem;
    min-height: 18rem;
  }

  .trip-profile-chart {
    height: 7.5rem;
    min-height: 7rem;
  }
}

.route-point-map-symbol { display:grid; place-items:center; width:26px; height:26px; border:2px solid white; border-radius:50%; color:white; font:700 11px/1 system-ui,sans-serif; box-shadow:0 1px 5px #0005; }
.route-point-map-icon { background:transparent; border:0; }
.route-profile-point { cursor:pointer; }
.route-profile-point:focus circle,.route-profile-point.is-selected circle { stroke:#18202a; stroke-width:3; }
.trip-route-map-shell .route-map-fullscreen-button { top:.62rem; }
.trip-route-map-shell:fullscreen,.trip-route-map-shell.route-map-expanded { width:100vw; height:100dvh; border-radius:0; background:#eef3f0; }
.trip-route-map-shell.route-map-expanded { position:fixed; inset:0; z-index:100000; }
.trip-route-map-shell:fullscreen .trip-route-map-v24,.trip-route-map-shell.route-map-expanded .trip-route-map-v24 { height:100%; min-height:0; max-height:none; }
body.route-map-fullscreen-open { overflow:hidden; }

.trip-route-map-shell .route-map-fit-button:not(.route-map-fullscreen-button) { top:3rem; }

.route-point-map-icon.is-selected .route-point-map-symbol { outline:3px solid #18202a; }
.route-profile-point text { fill:white; font:700 9px system-ui,sans-serif; pointer-events:none; }
.route-marker-picker { display:grid; gap:.35rem; max-height:240px; overflow:auto; }
.route-marker-picker button { text-align:left; border:1px solid #d9e0e7; background:white; border-radius:8px; padding:.5rem; cursor:pointer; }

.route-section-caption { margin:.5rem 0; font-size:.75rem; color:#6b7583; }

/* The same day palette is used by the summary, map and profile. */
.route-point-map-icon.is-excluded .route-point-map-symbol { border-style:dashed; }
.route-profile-point.is-excluded circle { stroke-dasharray:3 2; }

/* Small map-only distance references; real waypoints remain above these. */
.route-distance-reference { background:transparent; border:0; }
.route-distance-tick { position:relative; width:14px; height:14px; }
.route-distance-tick-bar { position:absolute; width:12px; height:2px; left:1px; top:6px; background:#244b3c; border-radius:1px; box-shadow:0 0 0 1.5px white; }
.route-distance-tick-label { position:absolute; left:16px; top:-12px; font-size:10px; font-weight:700; color:#244b3c; text-shadow:1px 0 white,-1px 0 white,0 1px white,0 -1px white; }
.route-distance-tick-label[hidden] { display:none; }
.route-gluten-free-symbol { display:block; flex-shrink:0; }

/* v43: rounded zoom control, matching the map toolbar. */
.leaflet-container .leaflet-control-zoom { border:1px solid #dbe5df; border-radius:16px; overflow:hidden; box-shadow:0 2px 8px #203e2514; }
.leaflet-container .leaflet-control-zoom a { color:#315b45; background:#fff; }
.leaflet-container .leaflet-control-zoom a:first-child { border-radius:16px 16px 0 0; }
.leaflet-container .leaflet-control-zoom a:last-child { border-radius:0 0 16px 16px; }
.leaflet-container .leaflet-control-zoom a:hover { background:#eef5ef; }

/* v46: background control, metric scale and compact weather. */
.route-basemap-switch { position:absolute; top:5.4rem; right:.62rem; z-index:500; display:flex; padding:3px; gap:2px; background:white; border:1px solid #dbe5df; border-radius:16px; box-shadow:0 2px 8px #203e2514; }
.route-basemap-switch button { padding:.35rem .55rem; border:0; border-radius:12px; font-family:inherit; font-size:.72rem; font-weight:600; color:#52665e; background:transparent; cursor:pointer; }
.route-basemap-switch button[aria-pressed=true] { background:#e6f0eb; color:#1f6f5b; }
.route-basemap-switch button:focus-visible { outline:2px solid #237a63; }
.trip-route-map-shell .planning-detail-modal { position:fixed; inset:0; z-index:20000; }
.trip-route-map-shell .packlist-tooltip { z-index:25000; }
.leaflet-control-scale-line { border-color:#33483e; background:#ffffffe6; border-radius:0 0 3px 3px; }
button.trip-day-summary-weather { display:inline-flex; align-items:center; justify-content:flex-start; gap:.3rem; width:max-content; max-width:100%; padding:.22rem .4rem; border:0; border-radius:8px; background:transparent; color:var(--text); font:inherit; font-style:normal; white-space:nowrap; cursor:pointer; }
button.trip-day-summary-weather:hover,button.trip-day-summary-weather:focus-visible { background:var(--accent-soft); }
button.trip-day-summary-weather:focus-visible { outline:2px solid var(--accent); }

.day-weather-icon { flex:none; color:#496d80; }
.packlist-tooltip.is-weather-summary:not(.is-weather-daypart):not(.is-stat-details):not(.is-route-type-legend) { white-space:pre-line; }

/* v47: route types and nearby places. */
.trip-banner-stats .route-type-overview { display:grid; align-content:center; gap:.3rem; flex:1 1 14rem; max-width:24rem; min-width:0; padding:.4rem .6rem; border:1px solid #e2e8f0; border-radius:14px; background:#ffffffdd; font-size:.7rem; grid-column:1/-1; }
.route-type-overview small { color:var(--text-muted); }
.route-type-overview>button:not(.route-type-bar) { text-align:left; border:0; padding:0; background:transparent; color:var(--accent); cursor:pointer; font:inherit; }
.route-type-bar { display:flex; width:100%; height:12px; min-width:6rem; padding:0; border:0; border-radius:6px; overflow:hidden; background:#c8ced0; cursor:default; }
.route-type-bar:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.route-type-bar span { display:block; height:100%; }
.trip-day-summary-types { grid-column:2/-1; padding:.1rem 0 .2rem; }
.trip-day-summary-types .route-type-bar { height:6px; }
.route-correction-fields { display:flex; align-items:end; flex-wrap:wrap; gap:.5rem; }
.route-correction-fields label,.route-export-label { display:grid; gap:.3rem; font-size:.75rem; min-width:0; }
.route-correction-fields input { width:7rem; }
.route-correction-fields input,.route-correction-fields select,.route-export-label select { padding:.4rem .5rem; border:1px solid var(--line); border-radius:8px; font:inherit; background:white; color:var(--text); }
.route-correction-row { display:flex; justify-content:space-between; align-items:center; gap:.7rem; padding:.3rem 0; }
.route-analysis-attribution { color:var(--text-muted); font-size:.7rem; }
[data-analysis-corrections][hidden] { display:none; }
.route-colour-switch { position:absolute; right:.62rem; top:10.5rem; z-index:500; display:flex; gap:2px; padding:3px; border:1px solid #dbe5df; border-radius:16px; background:white; }
.route-colour-switch button { border:0; background:transparent; padding:.35rem .5rem; border-radius:12px; color:#52665e; font:600 .72rem system-ui; cursor:pointer; }
.route-colour-switch button[aria-pressed=true] { background:#e6f0eb; color:#1f6f5b; }
.route-colour-switch button:disabled { opacity:.5; cursor:default; }
.route-type-key { position:absolute; bottom:2.5rem; left:.6rem; z-index:500; display:flex; flex-wrap:wrap; gap:.4rem; max-width:calc(100% - 1.2rem); padding:.4rem .5rem; border-radius:10px; background:#fffffff0; font-size:.65rem; }
.route-type-key[hidden] { display:none; }
.route-type-key span { display:flex; align-items:center; gap:.25rem; }
.route-type-key i { width:12px; height:5px; border-radius:3px; }
.route-point-map-icon.is-nearby .route-point-map-symbol,.route-profile-point.is-nearby circle { border-style:dashed; stroke-dasharray:3 2; }
.route-point-map-icon.leaflet-marker-draggable { cursor:grab; }
.route-point-map-icon.leaflet-drag-target { cursor:grabbing; }

/* v48: export and location picking */
.export-panel{max-width:620px;max-height:calc(100dvh - 48px);overflow-y:auto}
.export-option{padding:16px 0}.export-option+.export-option{border-top:1px solid #dce5e9}
.export-option h4{margin:0 0 8px}.export-option p{color:#667787;font-size:.9rem;line-height:1.5}
.export-option form{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap}
.export-option label{display:grid;gap:6px;min-width:180px;flex:1}
.export-option select{width:100%;padding:10px 12px;border:1px solid #d6e0e8;border-radius:12px;background:white;color:inherit;font:inherit}
.export-option .export-note{font-size:.8rem;margin-bottom:0}
.planning-pick-location{grid-column:1/-1}
.route-location-picker{position:absolute;z-index:1100;bottom:38px;left:12px;right:12px;display:flex;align-items:center;justify-content:space-between;gap:12px;background:#fff;padding:10px 14px;border:1px solid #d6e0e8;border-radius:16px;box-shadow:0 4px 16px #0002;color:#245947;font-weight:650}
.is-picking-place .leaflet-container{cursor:crosshair}
@media(max-width:560px){.export-option form>button{width:100%}.route-location-picker{font-size:.8rem;padding:8px 10px;gap:6px}}
.point-type-field{position:relative}
.point-type-native{position:absolute!important;width:1px!important;height:1px!important;opacity:0;pointer-events:none;padding:0!important;border:0!important}
.point-type-trigger{display:flex;align-items:center;gap:10px;width:100%;padding:8px 12px;background:#fff;border:1px solid #d6e0e8;border-radius:12px;color:inherit;font:inherit;text-align:left}
.point-type-trigger::after{content:'⌄';margin-left:auto;color:#667787}
.point-type-choices{position:absolute;top:calc(100% + 4px);left:0;right:0;z-index:10;max-height:230px;overflow:auto;padding:5px;border:1px solid #d6e0e8;border-radius:12px;background:#fff;box-shadow:0 4px 12px #0001}
.point-type-choices[hidden]{display:none}
.point-type-choices button{display:flex;align-items:center;gap:10px;width:100%;padding:8px;border:0;border-radius:10px;background:transparent;color:inherit;font:inherit;text-align:left}
.point-type-choices button:hover,.point-type-choices button:focus-visible,.point-type-choices button[aria-selected=true]{background:#edf5f1}
.point-type-trigger .planning-symbol,.point-type-choices .planning-symbol{flex:none;width:26px;height:26px}

/* Route surface summary and detail. */
.route-type-overview>button[data-open-route-analysis]{display:grid;gap:.35rem;width:100%;color:var(--text);padding:.2rem;text-align:left;border:0;background:transparent;border-radius:10px;cursor:pointer;font:inherit}
.route-type-overview>button[data-open-route-analysis]:hover{background:#eff5f1}
.route-type-overview>button[data-open-route-analysis]:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.route-type-overview>button .route-type-bar{cursor:pointer}
.route-analysis-panel{max-width:650px;max-height:calc(100dvh - 40px);overflow:auto}
.route-analysis-content{display:grid;gap:.85rem;padding:.8rem 0}
.route-analysis-day{border-top:1px solid var(--line);padding-top:.7rem}
.route-analysis-day h4{margin:0 0 .45rem;font-size:.9rem}
.route-analysis-day-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.22rem 0;font-size:.83rem}
.route-analysis-day-row i{width:.6rem;height:.6rem;border-radius:50%;flex:none}
.route-analysis-day-row span{flex:1}
.route-analysis-day-total{font-weight:700}

[data-analyse-route][hidden]{display:none!important}

/* v54: keep route classification visually aligned with the title statistics. */
.trip-banner-stats .route-type-overview{display:grid;flex:1 1 10rem;min-width:7.3rem;max-width:none;min-height:2.7rem;padding:.38rem .58rem .42rem;border:1px solid rgba(226,232,240,.82);border-radius:14px;background:rgba(255,255,255,.86);box-shadow:0 5px 14px rgba(15,43,37,.05);font-size:inherit;grid-column:auto}
.route-type-overview>button[data-open-route-analysis]{gap:.16rem;padding:0;background:transparent}
.route-type-overview>button[data-open-route-analysis]:hover{background:transparent}
.route-type-overview .route-type-bar{height:6px;min-width:0;border-radius:4px}
.route-type-overview small{font-size:.62rem;line-height:1.2}
.route-analysis-key{display:flex;flex-wrap:wrap;gap:.5rem 1rem;font-size:.73rem;color:var(--text-muted)}
.route-analysis-key span{display:inline-flex;align-items:center;gap:.35rem}
.route-analysis-key i{width:.7rem;height:.7rem;border-radius:3px;background:#c8ced0;flex:none}
.route-analysis-key .route-analysis-unanalysed{background:#edf1f5;border:1px solid #cad4d7}
.route-type-bar{background:#edf1f5}
.trip-day-summary-row .trip-day-summary-chip{align-self:center!important;margin-block:auto!important}

.route-profile-line.has-type-overlay{stroke:#b8c9bf}

.route-type-key [data-type-unanalysed][hidden]{display:none}

/* v55: same footprint as the other statistics, with a readable route bar. */
.trip-banner-stats > .route-type-overview {
  width: auto;
  min-width: 0;
  max-width: none;
  min-height: 2.7rem;
  align-content: center;
}
.route-type-overview > button[data-open-route-analysis] { gap: .32rem; }
.route-type-overview .route-type-bar { height: 10px; border-radius: 6px; }
.route-type-overview small { line-height: 1.15; }
.trip-day-summary-row:has(.trip-day-summary-types) .trip-day-summary-chip {
  grid-row: 1 / span 2 !important;
  align-self: center !important;
}
.trip-day-summary-row:has(+ .trip-day-summary-daylight-strip) { border-bottom: 0 !important; }
.trip-day-summary-daylight-strip .trip-daylight-range {
  border: 0;
  padding: .1rem .32rem;
  background: transparent;
  border-radius: 6px;
  color: var(--text);
  font: inherit;
  font-weight: 800;
  cursor: default;
}
.trip-day-summary-daylight-strip .trip-daylight-range:hover,
.trip-day-summary-daylight-strip .trip-daylight-range:focus-visible { background: var(--accent-soft); }
@media (max-width:760px) {
  .trip-day-summary-row:has(.trip-day-summary-types) .trip-day-summary-chip { grid-row: 1 / span 3 !important; }
}
.route-analysis-content [data-analysis-status]:empty { display: none; }
.route-analysis-content [data-analysis-key]:empty { display: none; }
.trip-banner-stats .trip-stat-walking {
  color: var(--text-muted);
  font-size: .59rem;
  font-weight: 740;
  white-space: nowrap;
  line-height: 1.1;
  cursor: default;
}
.trip-banner-stats .trip-stat-walking:hover,
.trip-banner-stats .trip-stat-walking:focus-visible { color: var(--accent); }
/* Route alternatives remain separate from the selected GPX until activated. */
.route-alternatives-section { margin-top: 1rem; }
.route-alternative-row { display:flex; align-items:center; gap:.55rem; padding:.6rem .35rem; border-radius:12px; }
.route-alternative-row:hover { background:#f4f7f5; cursor:pointer; }
.route-alternative-row > span { flex:1; min-width:0; font-weight:650; }
.route-alternative-row small { display:block; font-weight:400; color:#64748b; margin-top:.15rem; }
.route-alternative-row button { flex:none; }
.route-alternative-detail-panel { width:min(28rem,calc(100vw - 2rem)); }
.route-alternative-detail-name { display:grid; gap:.4rem; margin:1rem 0; font-weight:650; }
.route-alternative-detail-name input { width:100%; min-height:42px; padding:.5rem .7rem; border:1px solid #d2ded7; border-radius:10px; font:inherit; }
.route-alternative-detail-actions { display:flex; flex-wrap:wrap; gap:.6rem; justify-content:flex-end; margin-top:1rem; }
.trip-route-map-shell .route-alternative-detail { position:fixed; inset:0; z-index:20000; }
.route-alternative-tools[hidden] { display:none; }
.route-alternative-tools { position:absolute; z-index:760; left:3.5rem; top:.75rem; width:min(310px,calc(100% - 4.25rem)); max-height:calc(100% - 1.5rem); overflow-y:auto; overscroll-behavior:contain; box-sizing:border-box; padding:.7rem; background:#fff; color:#243834; box-shadow:0 12px 32px #213d3152; border:1px solid #dce8e1; border-radius:16px; display:grid; gap:.6rem; }
.route-alternative-tools-head { display:flex; align-items:center; justify-content:space-between; }
.route-alternative-tools-head button { border:0; background:transparent; color:#64748b; font-size:1.45rem; cursor:pointer; line-height:1; }
.route-alternative-tools p { margin:0; font-size:.9rem; }
.route-alternative-tools label { display:grid; gap:.2rem; font-size:.78rem; font-weight:600; }
.route-alternative-tools input,.route-alternative-tools select { width:100%; min-height:38px; padding:.35rem .6rem; border:1px solid #d2ded7; border-radius:9px; color:#243834; background:#fff; font:inherit; }
.route-alternative-actions { position:sticky; bottom:-.7rem; z-index:1; background:#fff; padding:.4rem 0; display:flex; flex-wrap:wrap; gap:.35rem; }
.route-alternative-actions button { padding:.38rem .6rem; border:1px solid #d2ded7; border-radius:999px; background:#fff; color:#246b58; cursor:pointer; font:inherit; font-size:.8rem; font-weight:600; }
.route-alternative-actions button:last-child { background:#226e58; border-color:#226e58; color:#fff; }
.route-alternative-actions button:disabled { opacity:.45; cursor:default; }
.route-alternative-tools small { color:#64748b; line-height:1.35; }
.route-alternative-segments { display:grid; gap:.3rem; max-height:125px; overflow:auto; }
.route-alternative-segments label { display:flex; align-items:center; justify-content:space-between; gap:.5rem; }
.route-alternative-segments select { width:auto; min-width:145px; min-height:32px; }
.route-alternative-profile { display:grid; gap:.2rem; color:#36594b; font-size:.78rem; }
.route-alternative-profile[hidden] { display:none; }
.route-alternative-profile svg { width:100%; height:58px; background:#f5f8f5; border-radius:9px; }
.route-alternative-handle { display:grid; place-items:center; }
.route-alternative-handle span { display:block; width:16px; height:16px; border-radius:50%; background:#fff; border:3px solid #a85f38; box-shadow:0 1px 5px #24383466; }
.route-alternative-endpoint span { width:18px; height:18px; border-color:#246b58; }
.is-drawing-alternative .trip-route-map-v24 { cursor:crosshair; }
@media (max-width:650px) {
 .route-alternative-tools { left:.75rem; top:auto; bottom:.75rem; width:min(310px,calc(100% - 1.5rem)); max-height:65%; }
 .route-alternative-row { flex-wrap:wrap; }
 .route-alternative-row > span { flex-basis:100%; }
}

/* Route detail estimates and notices share the compact route-modal spacing. */
.route-analysis-details { margin-top: .65rem; }
.route-analysis-details summary { cursor: pointer; font-weight: 600; color: #246b59; padding: .35rem 0; }
.route-analysis-detail { display: grid; gap: .2rem; padding: .55rem .7rem; margin: .3rem 0; border-radius: 12px; background: #f4f7f6; font-size: .88rem; }
.route-analysis-detail.needs-attention { background: #fff5e6; }
.route-attention-note, .route-alternative-segment-error { color: #8b5014; font-size: .85rem; }
.route-alternative-segment-error { margin: .2rem 0 .6rem; }

[data-alternative-detail-review] label { display:grid; gap:.35rem; margin:.75rem 0; font-size:.9rem; }
[data-alternative-detail-review] input { width:100%; padding:.5rem .7rem; border:1px solid #d2ded7; border-radius:10px; font:inherit; }
[data-alternative-detail-review]:not(:empty) { padding:.65rem; border-radius:12px; background:#f3f7f4; }
[data-alternative-elevation-status]:empty { display:none; }

.route-alternative-row.is-active { background:#edf5f1; }
.route-alternative-use[aria-pressed="true"] { background:#217461 !important; color:#fff !important; border-color:#217461 !important; }

.route-alternative-detail-actions button,
.route-alternative-row button { font:inherit; font-size:.85rem !important; font-weight:650 !important; height:auto !important; min-height:36px; min-width:0 !important; padding:.4rem .8rem !important; line-height:1.3; border-radius:999px; }
.route-alternative-detail-actions button[hidden] { display:none !important; }
.route-alternative-active-label { color:#217461 !important; font-weight:700 !important; }
[data-alternative-detail-review] label { display:grid; gap:.4rem; margin:.7rem 0; }
[data-alternative-detail-review] input { font:inherit; padding:.5rem; border:1px solid #d2ded7; border-radius:10px; }

/* Compact day rows: walking has its own column; type composition sits under distance. */
.trip-day-summary-grid-head,.trip-day-summary-row {
 grid-template-columns:2.4rem minmax(4.6rem,1fr) minmax(3.8rem,.8fr) minmax(3.8rem,.8fr) minmax(4.7rem,1fr) minmax(4rem,.85fr) !important;
 gap:.35rem !important;
}
.trip-day-summary-row { padding:.45rem 0 !important; }
.trip-day-summary-row:has(.trip-day-summary-types) .trip-day-summary-chip { grid-row:1 !important; }
.trip-day-summary-distance { display:grid; align-content:center; gap:.22rem; min-width:0; }
.trip-day-summary-distance .trip-day-summary-types { grid-column:auto; padding:0; max-width:7rem; }
.trip-day-summary-distance .route-type-bar { height:4px; min-width:0; border-radius:3px; }
.trip-day-summary-row .trip-day-summary-walk-time { font-size:.7rem; padding:0; }
.trip-day-summary-row .trip-day-summary-weather { justify-self:start; }
.trip-day-summary-head { border-bottom:0; }
.daylight-icon { width:1rem; height:1rem; vertical-align:middle; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; }
.packlist-tooltip.is-daylight-details { white-space:normal; min-width:13rem; }
.tooltip-daylight-row { display:grid; grid-template-columns:3.5rem 1fr auto; gap:.65rem; align-items:center; padding:.2rem 0; }
.tooltip-daylight-badge { color:white; font-weight:800; text-align:center; border-radius:999px; padding:.12rem .3rem; }
.tooltip-daylight-row > span:last-child { opacity:.8; font-size:.72rem; }

.route-type-key span[hidden] { display:none; }

/* Alternative review and route statistics stay compact at short viewport heights. */
.route-alternative-detail-name[hidden] { display:none; }
.route-alternative-detail-name input { border-color:transparent; background:transparent; padding:.25rem 0; min-height:32px; font-weight:500; }
.route-alternative-detail-name input:hover,.route-alternative-detail-name input:focus { border-color:#d2ded7; }
.route-overnight-relocation { display:grid; gap:.4rem; margin:.5rem 0; }
.route-overnight-relocation button { justify-self:start; }
.route-point-recovery { margin:.6rem 0; color:#64748b; font-size:.85rem; }
.route-point-recovery summary,.route-alternative-segment-options summary { cursor:pointer; padding:.3rem 0; }
.route-alternative-segment-options { font-size:.8rem; }
.route-alternative-tools .route-alternative-routing-note { font-size:.7rem; }
.trip-stat { position:relative; min-width:0; }
.trip-stat-quality { font-size:.7rem; font-weight:500; margin-left:.3rem; cursor:default; }
[data-route-analysis-progress] { position:absolute; right:.5rem; top:.4rem; width:.75rem; height:.75rem; border-radius:50%; background:conic-gradient(#217461 var(--analysis-progress,0%),#d9e5df 0); }
[data-route-analysis-progress]::after { content:''; position:absolute; inset:2px; border-radius:50%; background:white; }
.trip-stat-walking { white-space:nowrap; }

.route-alternative-detail .modal-close { margin-left:auto; }
.route-alternative-detail-name input { font-size:1.15rem; font-weight:700; }
.route-alternative-detail-name { margin:.25rem 0 .5rem; }
.route-point-recovery p { max-width:45rem; }

/* Compact forecast shares the statistics layout; its details stay in the dialog. */
.weather-stat>button { display:grid; gap:.15rem; text-align:left; border:0; padding:0; background:transparent; color:inherit; font:inherit; cursor:pointer; }
.weather-stat strong { display:flex; gap:.3rem; align-items:center; }
.weather-stat small { font-size:.63rem; color:var(--text-muted); }
.weather-stat .day-weather-icon { flex:none; width:1rem; height:1rem; }
.attention-nav-link { position:relative; }
.attention-count { display:inline-grid; place-items:center; min-width:1.2rem; height:1.2rem; padding:0 .25rem; margin-left:.3rem; align-self:flex-start; border-radius:999px; background:#ae3636; color:white; font-size:.65rem; font-weight:750; line-height:1; }
.attention-count[hidden] { display:none; }
.attention-intro { color:var(--text-muted); font-size:.88rem; margin:.4rem 0 1rem; }
.attention-total { font-size:.8rem; color:var(--text-muted); margin-left:.35rem; }
#dashboard-attention .dashboard-attention-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,19rem),1fr)); gap:.65rem; }
#dashboard-attention .dashboard-attention-badge { display:flex; flex-direction:column; align-items:flex-start; text-align:left; white-space:normal; border-radius:14px; padding:.85rem 1rem; gap:.45rem; height:auto; font:inherit; }
#dashboard-attention .dashboard-attention-badge strong { font-size:.92rem; }
#dashboard-attention .attention-explanation { font-size:.82rem; font-weight:400; line-height:1.5; color:var(--text); }
.food-water-route-panel { margin:1rem 0; padding:1rem; border:1px solid #dde7e1; border-radius:16px; background:white; scroll-margin-top:6rem; }
.food-water-route-panel h3 { margin:0 0 .8rem; }
.food-water-route-panel .route-water-summary-card { max-width:none; }
.food-water-route-panel>button { margin-top:.75rem; }
.attention-nav-link .attention-count { transform:translateY(-.2rem); }
.weather-stale-note { padding:.6rem .8rem; border-radius:10px; background:#fff4df; color:#805311; }
@media (max-width:760px) { .trip-title-wrap.trip-route-dashboard .weather-stat { grid-column:auto; } .weather-stat small { font-size:.73rem; } }

/* Statistic popovers share one compact, anchored presentation. */
.packlist-tooltip.is-stat-details { width:max-content; max-width:min(22rem,calc(100vw - 20px)); white-space:normal; }
.packlist-tooltip .tooltip-stat-row { display:flex; align-items:baseline; justify-content:space-between; gap:1rem; padding:.2rem 0; }
.packlist-tooltip .tooltip-stat-row strong { text-align:right; }
.packlist-tooltip .tooltip-stat-note { margin-top:.45rem; font-weight:500; line-height:1.4; }
.trip-day-summary-row .trip-day-summary-walk-time { justify-self:end; width:max-content; cursor:default; }
.trip-day-summary-weather,.route-type-bar[data-tooltip-toggle] { cursor:pointer; }

/* Map actions and display controls stay together at either corner. */
.route-map-actions { position:absolute; top:.62rem; right:.62rem; z-index:500; display:flex; gap:.35rem; }
.trip-route-map-shell .route-map-actions .route-map-fit-button { position:static; margin:0; }
.route-map-selectors { position:absolute; bottom:1.8rem; right:.62rem; z-index:500; display:grid; justify-items:end; gap:.35rem; }
.route-map-selectors .route-basemap-switch,.route-map-selectors .route-colour-switch { position:static; }
