/* Forecast-only viewport, location and sidebar controls. */
.hsf-sidebar-divider { display: none; }

@media (min-width: 1025px) {
  body.sites11a-forecast-active > .container-fluid {
    height: var(--hsf-viewport-height, 100vh) !important;
    min-height: 0 !important;
  }
  @supports (height: 100dvh) {
    body.sites11a-forecast-active > .container-fluid {
      height: var(--hsf-viewport-height, 100dvh) !important;
    }
  }
  body.sites11a-forecast-active .sites11a-forecast-page .app-shell {
    gap: 0;
    padding-bottom: max(14px, env(safe-area-inset-bottom));
  }
  body.sites11a-forecast-active #forecast-control-panel {
    flex: 0 0 var(--hsf-sidebar-width, 300px);
    width: var(--hsf-sidebar-width, 300px);
    max-width: none;
  }
  .hsf-sidebar-divider {
    display: flex;
    flex: 0 0 18px;
    align-items: center;
    justify-content: center;
    cursor: col-resize;
    touch-action: none;
    user-select: none;
    outline-offset: -3px;
  }
  .hsf-sidebar-divider::before {
    content: '';
    width: 4px;
    height: 48px;
    border: 1px solid #89917f;
    border-radius: 3px;
    background: #d7ddcf;
  }
  .hsf-sidebar-divider:hover::before,
  .hsf-sidebar-divider:focus-visible::before,
  .hsf-sidebar-divider.hsf-resizing::before { background: #9d2235; border-color: #9d2235; }
  .hsf-sidebar-divider:focus-visible { outline: 2px solid #9d2235; }
  /* A narrower map gets a second row for its date badge, below Search. */
  .hsf-map-compact .forecast-fixed-label {
    top: 92px;
    left: 54px;
    transform: none;
    max-width: calc(100% - 330px);
  }
  /* When browser chrome leaves little height, allow page scrolling rather
     than compressing the map until its controls cover or clip each other. */
  html.sites11a-forecast-active.hsf-short-viewport,
  body.sites11a-forecast-active.hsf-short-viewport { height: auto !important; overflow-y: auto !important; }
  body.sites11a-forecast-active.hsf-short-viewport > .container-fluid {
    display: block;
    height: auto !important;
    min-height: var(--hsf-viewport-height, 100vh) !important;
    overflow: visible !important;
  }
  body.sites11a-forecast-active.hsf-short-viewport .sites11a-main { display: block; overflow: visible; }
  body.sites11a-forecast-active.hsf-short-viewport .sites11a-forecast-page .app-shell {
    flex: none;
    height: 448px;
    min-height: 448px;
  }
}

#heat_map .hsf-locate-control { margin-left: 4px; margin-top: 8px; border: 0; box-shadow: none; }
#heat_map .hsf-locate-button {
  width: 44px;
  height: 44px;
  padding: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #34422f;
  background: #fff;
  border: 1px solid #9fa99a;
  border-radius: 3px;
  box-shadow: 0 1px 5px rgba(0,0,0,.2);
  cursor: pointer;
}
#heat_map .hsf-locate-button:hover { background: #f4f6f0; }
#heat_map .hsf-locate-button:focus-visible { outline: 3px solid #9d2235; outline-offset: 2px; }
#heat_map .hsf-locate-button[aria-busy='true'] { opacity: .6; cursor: progress; }
#heat_map .hsf-locate-button svg { display: block; width: 22px; height: 22px; }
#heat_map .hsf-location-status {
  position: absolute;
  z-index: 1000;
  left: 10px;
  width: 250px;
  max-width: calc(100% - 20px);
  padding: 8px 10px;
  border: 1px solid #9fa99a;
  background: #fff;
  color: #34422f;
  box-shadow: 0 1px 5px rgba(0,0,0,.15);
  font-size: 12px;
  line-height: 1.4;
  pointer-events: none;
}
#heat_map .hsf-location-status:empty { display: none; }
/* Location remains available while touch-map panning is switched off. */
.map-panel:not(.hsf-map-interactive) #heat_map .hsf-locate-control,
.map-panel:not(.hsf-map-interactive) #heat_map .hsf-locate-control * { pointer-events: auto !important; }

/* Match the report-map direction arrow, including its colour and round button. */
#heat_map .hsf-locate-button { border-radius: 50%; color: #24476b; border-color: #b8c9d8; }
#heat_map .hsf-locate-button svg { fill: currentColor; }
.hsf-summary-divider { display: none; }
#hsf-summary-pane { flex: 0 0 auto; min-height: 0; }
@media (min-width: 1025px) {
  #hsf-summary-pane { overflow: hidden; }
  .hsf-summary-divider {
    display: flex; flex: 0 0 18px; height: 18px; min-height: 18px;
    align-items: center; justify-content: center; cursor: row-resize;
    touch-action: none; user-select: none; outline-offset: -3px;
  }
  .hsf-summary-divider::before { content: ''; width: 48px; height: 4px; border: 1px solid #89917f; border-radius: 3px; background: #d7ddcf; }
  .hsf-summary-divider:hover::before, .hsf-summary-divider:focus-visible::before,
  .hsf-summary-divider.hsf-resizing::before { background: #9d2235; border-color: #9d2235; }
  .hsf-summary-divider:focus-visible { outline: 2px solid #9d2235; }
  #heat_map .leaflet-control-affm-camps, .map-panel #camp-layer-control-panel { width: max-content; max-width: calc(100vw - 96px); }
  .map-panel #camp-layer-control-panel .shiny-input-container { width: auto; }
  #heat_map .heat-risk-legend { width: max-content; max-width: calc(100vw - 40px); }
  /* The attribution stays at the map's bottom; both legend edges sit 18px up. */
  #heat_map .heat-risk-legend-control { position: absolute; bottom: 18px; right: 12px; margin: 0 !important; }
}