/* Family Spots Map – V90.1 · Five-tab floating navigation and full-height map.
   Base: V90 head artwork from approved preview. No map / spot JS is changed.
   Scope: mobile map view; the fixed nav is on top, Leaflet stays interactive.
   Full-bleed below Safari's browser controls is only possible in PWA standalone.
*/

/* "Treffen & Spielen" remains in the hamburger menu. Hide ONLY its redundant
   floating navigation button, if present in the user's newer V89 branch. */
#fsm-home-nav > .fsm-home-nav__item[data-fsm-home-action="community"] {
  display: none !important;
}

@media (max-width: 899px) {
  html[data-theme="light"].fsm-home-nav-ready #fsm-home-nav.fsm-home-nav {
    box-sizing: border-box !important;
    position: fixed !important;
    z-index: 950 !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    align-items: stretch !important;
    left: max(10px, env(safe-area-inset-left, 0px)) !important;
    right: max(10px, env(safe-area-inset-right, 0px)) !important;
    bottom: max(6px, env(safe-area-inset-bottom, 0px)) !important;
    width: auto !important;
    max-width: 620px !important;
    min-height: 0 !important;
    margin-inline: auto !important;
    padding: 0 !important;
    gap: 0 !important;
    border-radius: 20px !important;
    background: #fff9f0 !important;
    border: 1px solid rgba(141, 126, 103, .20) !important;
    box-shadow: 0 4px 14px rgba(65, 53, 35, .15) !important;
  }
  html[data-theme="light"].fsm-home-nav-ready #fsm-home-nav.fsm-home-nav > .fsm-home-nav__item {
    box-sizing: border-box !important;
    min-width: 0 !important;
    min-height: 44px !important;
    padding: 2px 1px !important;
    gap: 3px !important;
    border-radius: 16px !important;
    font-size: clamp(10px, 2.75vw, 12px) !important;
    line-height: 1.1 !important;
    white-space: normal !important;
  }
  html[data-theme="light"].fsm-home-nav-ready #fsm-home-nav.fsm-home-nav > .fsm-home-nav__item > svg {
    width: 21px !important;
    height: 21px !important;
    flex-shrink: 0 !important;
  }
  html[data-theme="light"].fsm-home-nav-ready #fsm-home-nav.fsm-home-nav > .fsm-home-nav__item[data-fsm-home-action="community"] {
    display: none !important;
  }

  /* Map extends behind the fixed bar, rather than stopping above it.
     Only on the map screen; filters, spots, diary, fullscreen and dialogs
     retain their existing handlers and visibility controls. */
  html.fsm-polished[data-theme="light"] body[data-app-view="map"] #view-map.view--active > .map-section {
    position: relative !important;
    min-height: max(440px, 100svh) !important;
    margin-bottom: 0 !important;
    border-radius: 20px 20px 0 0 !important;
    overflow: hidden !important;
  }
  html.fsm-polished[data-theme="light"] body[data-app-view="map"] #view-map.view--active > .map-section > #map.map-container {
    min-height: max(440px, 100svh) !important;
    height: max(440px, 100svh) !important;
  }
  html.fsm-polished[data-theme="light"] body[data-app-view="map"] #main-content.app-main {
    padding-bottom: 0 !important;
  }
  html.fsm-polished[data-theme="light"] body[data-app-view="map"] #view-map.view--active {
    padding-bottom: 0 !important;
  }
}

/* Das originale Spots-SVG wird ausschließlich im gemeinsamen Navigationssystem
   erzeugt und eingefärbt. Keine alternative ::before-Maske. */

/* Honor existing map/diary/overlay modes. These need to override our nav grid. */
html.fsm-map-fullscreen-open #fsm-home-nav,
html.fsm-home-sheet-open #fsm-home-nav,
body[data-app-view="diary"] #fsm-home-nav,
body[data-app-view="about"] #fsm-home-nav,
body[data-filter-modal-open="1"] #fsm-home-nav,
body:has(#app-menu:not([hidden])) #fsm-home-nav {
  display: none !important;
}

@media (max-width: 359px) {
  html[data-theme="light"].fsm-home-nav-ready #fsm-home-nav.fsm-home-nav {
    left: 6px !important;
    right: 6px !important;
    padding: 3px !important;
    gap: 0 !important;
  }
  html[data-theme="light"].fsm-home-nav-ready #fsm-home-nav.fsm-home-nav > .fsm-home-nav__item {
    font-size: 10px !important;
    min-height: 44px !important;
  }
}