/* River Flow Co — shared river-guide embedded map additions
   (fullscreen expand, satellite basemap toggle, section<->map nav button).
   Loaded alongside each guide page's own inline <style> block, which still
   owns the base #river-map / .map-section-bg / .map-legend sizing. */

#river-map {
  position: relative;
  z-index: 0; /* creates a stacking context so Leaflet's controls (z-index up to 1000)
                 stay contained here instead of painting over the sticky nav (z-index 200) */
}

#river-map.map-fullscreen {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  height: 100dvh !important;
  z-index: 1000 !important;
}

body.map-fullscreen-open {
  overflow: hidden;
}

.map-fullscreen-btn-wrap {
  margin: 0 !important;
}

.map-fullscreen-btn {
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 34px !important;
  height: 34px !important;
  background: #F3E9D9 !important;
  color: #1A1A1A !important;
  border-radius: 8px !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.22);
  cursor: pointer;
}
.map-fullscreen-btn:hover {
  background: #fff !important;
}

.leaflet-control-layers {
  background: rgba(243, 233, 217, 0.96) !important;
  border-radius: 10px !important;
  border: none !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.16) !important;
  font-family: 'Manrope', ui-sans-serif, system-ui, -apple-system, sans-serif;
}
.leaflet-control-layers-toggle {
  border-radius: 10px !important;
}
.leaflet-control-layers-expanded {
  padding: 10px 14px !important;
  color: #1A1A1A;
}
.leaflet-control-layers label {
  font-size: 12px;
  font-weight: 600;
}

/* "View on map" button inside a section card, mirroring the map popup's
   "View section details" button in the opposite direction. */
.section-view-map-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-top: 10px;
  padding: 6px 12px;
  background: transparent;
  border: 1px solid var(--cream-line, #D8C49C);
  border-radius: 99px;
  font-family: 'Manrope', ui-sans-serif, system-ui, -apple-system, sans-serif;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--river-deep, #2F6A99);
  cursor: pointer;
}
.section-view-map-btn:hover {
  background: var(--cream-line, #D8C49C);
}