/* SafeStayJapan fullscreen search / explore controls */

#mapShell.is-fullscreen-map > #safeStayControls.ssj-fullscreen-controls {
  position:absolute !important;
  z-index:76 !important;
  top:14px !important;
  left:340px !important;
  right:24px !important;
  width:auto !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
  box-sizing:border-box !important;
  pointer-events:none;
}

#mapShell.is-fullscreen-map.ssj-v3-hotel-open > #safeStayControls.ssj-fullscreen-controls {
  right:410px !important;
}

#mapShell.is-fullscreen-map > #safeStayControls.ssj-fullscreen-controls .search-row,
#mapShell.is-fullscreen-map > #safeStayControls.ssj-fullscreen-controls .explore-strip,
#mapShell.is-fullscreen-map > #safeStayControls.ssj-fullscreen-controls #destinationPanel,
#mapShell.is-fullscreen-map > #safeStayControls.ssj-fullscreen-controls #searchSuggestions {
  pointer-events:auto;
}

#mapShell.is-fullscreen-map > #safeStayControls.ssj-fullscreen-controls .search-row {
  max-width:760px;
  margin:0 auto !important;
  padding:8px !important;
  border:1px solid rgba(0,0,0,.10);
  border-radius:16px;
  background:rgba(255,255,255,.96);
  box-shadow:0 6px 20px rgba(28,35,39,.18);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}

#mapShell.is-fullscreen-map > #safeStayControls.ssj-fullscreen-controls .explore-strip {
  max-width:760px;
  margin:8px auto 0 !important;
  padding:7px 8px !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
  white-space:nowrap;
  border:1px solid rgba(0,0,0,.08);
  border-radius:14px;
  background:rgba(255,255,255,.94);
  box-shadow:0 4px 14px rgba(28,35,39,.12);
  scrollbar-width:none;
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}

#mapShell.is-fullscreen-map > #safeStayControls.ssj-fullscreen-controls .explore-strip::-webkit-scrollbar {
  display:none;
}

#mapShell.is-fullscreen-map > #safeStayControls.ssj-fullscreen-controls #destinationPanel {
  max-width:760px;
  margin:8px auto 0 !important;
  max-height:46vh;
  overflow:auto;
  box-shadow:0 10px 28px rgba(28,35,39,.20);
}

/* Search dock handle. The map remains visible when the search controls are tucked away. */
#mapShell.is-fullscreen-map > #safeStayControls.ssj-fullscreen-controls .ssjSearchDockToggle{
  pointer-events:auto !important;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  min-width:92px;
  height:30px;
  margin:5px auto 0;
  padding:0 13px;
  border:1px solid rgba(0,0,0,.10);
  border-radius:999px;
  background:rgba(255,255,255,.97);
  color:#355861;
  box-shadow:0 4px 12px rgba(28,35,39,.14);
  font:800 11px/1 Arial,sans-serif;
  cursor:pointer;
}

#mapShell.is-fullscreen-map > #safeStayControls.ssj-fullscreen-controls .ssjSearchDockIcon{
  font-size:14px;
  line-height:1;
}

#mapShell.is-fullscreen-map > #safeStayControls.ssj-fullscreen-controls .search-row,
#mapShell.is-fullscreen-map > #safeStayControls.ssj-fullscreen-controls .explore-strip,
#mapShell.is-fullscreen-map > #safeStayControls.ssj-fullscreen-controls #destinationPanel{
  transition:
    max-height .26s cubic-bezier(.22,.86,.28,1),
    opacity .18s ease,
    transform .26s cubic-bezier(.22,.86,.28,1),
    margin .26s ease,
    padding .26s ease;
  transform-origin:top center;
}

#mapShell.is-fullscreen-map > #safeStayControls.ssj-fullscreen-controls.ssj-search-collapsed{
  left:50% !important;
  right:auto !important;
  width:118px !important;
  transform:translateX(-50%);
  pointer-events:auto !important;
}

#mapShell.is-fullscreen-map > #safeStayControls.ssj-fullscreen-controls.ssj-search-collapsed .search-row,
#mapShell.is-fullscreen-map > #safeStayControls.ssj-fullscreen-controls.ssj-search-collapsed .explore-strip,
#mapShell.is-fullscreen-map > #safeStayControls.ssj-fullscreen-controls.ssj-search-collapsed #destinationPanel{
  max-height:0 !important;
  margin:0 !important;
  padding-top:0 !important;
  padding-bottom:0 !important;
  opacity:0 !important;
  overflow:hidden !important;
  transform:translateY(-14px) scale(.98);
  pointer-events:none !important;
  border-width:0 !important;
  box-shadow:none !important;
}

#mapShell.is-fullscreen-map > #safeStayControls.ssj-fullscreen-controls.ssj-search-collapsed .ssjSearchDockToggle{
  margin-top:0 !important;
}

/* Permanent viewport map mode: lock the WordPress page underneath the map. */
html.ssj-map-fullscreen,
body.ssj-map-fullscreen{
  width:100% !important;
  height:100% !important;
  min-height:100% !important;
  overflow:hidden !important;
  overscroll-behavior:none !important;
}

body.ssj-map-fullscreen{
  position:fixed !important;
  inset:0 !important;
  margin:0 !important;
  padding:0 !important;
}

#mapShell.ssj-always-fullscreen{
  width:100vw !important;
  height:100dvh !important;
  min-height:100dvh !important;
  max-height:100dvh !important;
}

#mapShell.ssj-always-fullscreen #mapFullscreenButton{
  display:none !important;
}

@media (max-width:700px){
  #mapShell.is-fullscreen-map > #safeStayControls.ssj-fullscreen-controls,
  #mapShell.is-fullscreen-map.ssj-v3-hotel-open > #safeStayControls.ssj-fullscreen-controls {
    top:max(8px, env(safe-area-inset-top, 0px)) !important;
    left:10px !important;
    right:10px !important;
    width:auto !important;
    padding:6px !important;
    border:1px solid rgba(0,0,0,.10) !important;
    border-radius:16px !important;
    background:rgba(255,255,255,.96) !important;
    box-shadow:0 6px 20px rgba(28,35,39,.18) !important;
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
    pointer-events:auto !important;
  }

  #mapShell.is-fullscreen-map > #safeStayControls.ssj-fullscreen-controls .search-row {
    max-width:none;
    max-height:50px;
    margin:0 !important;
    padding:0 !important;
    gap:6px !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
  }

  #mapShell.is-fullscreen-map > #safeStayControls.ssj-fullscreen-controls #destinationSearch {
    min-width:0 !important;
    height:44px !important;
    padding:0 12px !important;
    border-radius:11px !important;
    font-size:14px !important;
  }

  #mapShell.is-fullscreen-map > #safeStayControls.ssj-fullscreen-controls #destinationSearchButton {
    height:44px !important;
    padding:0 14px !important;
    border-radius:11px !important;
    font-size:13px !important;
    flex:0 0 auto !important;
  }

  #mapShell.is-fullscreen-map > #safeStayControls.ssj-fullscreen-controls .explore-strip {
    display:flex !important;
    max-width:none;
    max-height:40px;
    margin:4px 0 0 !important;
    padding:2px 0 0 !important;
    gap:7px !important;
    flex-wrap:nowrap !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    -webkit-overflow-scrolling:touch !important;
    overscroll-behavior-x:contain !important;
    touch-action:pan-x !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    scrollbar-width:none;
  }

  #mapShell.is-fullscreen-map > #safeStayControls.ssj-fullscreen-controls .explore-strip::-webkit-scrollbar {
    display:none;
  }

  #mapShell.is-fullscreen-map > #safeStayControls.ssj-fullscreen-controls .category-chip {
    flex:0 0 auto !important;
    padding:7px 11px !important;
    font-size:12px !important;
    white-space:nowrap !important;
  }

  #mapShell.is-fullscreen-map > #safeStayControls.ssj-fullscreen-controls #exploreLoadingText {
    flex:0 0 auto !important;
    white-space:nowrap !important;
  }

  #mapShell.is-fullscreen-map > #safeStayControls.ssj-fullscreen-controls #destinationPanel {
    max-width:none;
    margin:6px 0 0 !important;
    max-height:38dvh;
  }

  #mapShell.is-fullscreen-map > #safeStayControls.ssj-fullscreen-controls .ssjSearchDockToggle{
    height:28px;
    min-width:86px;
    margin-top:4px;
  }

  #mapShell.is-fullscreen-map > #safeStayControls.ssj-fullscreen-controls.ssj-search-collapsed,
  #mapShell.is-fullscreen-map.ssj-v3-hotel-open > #safeStayControls.ssj-fullscreen-controls.ssj-search-collapsed{
    left:50% !important;
    right:auto !important;
    width:104px !important;
    padding:4px !important;
    transform:translateX(-50%);
  }

  /* Stay / Layers sheets sit above the search controls when opened. */
  #mapShell.is-fullscreen-map .ssjV3Sidebar,
  #mapShell.is-fullscreen-map .ssjV3HotelPanel,
  #mapShell.is-fullscreen-map .ssjV3MobileBackdrop {
    z-index:90 !important;
  }

  #mapShell.is-fullscreen-map .ssjV3MobileClose,
  #mapShell.is-fullscreen-map .ssjV3HotelClose {
    z-index:92 !important;
  }
}

/* =====================================================
   V4 viewport / mobile alignment corrective overrides
   Keep the fullscreen map independent from the SWELL page layout.
===================================================== */
#mapShell.ssj-always-fullscreen{
  position:fixed !important;
  inset:0 !important;
  z-index:2147483000 !important;
  margin:0 !important;
  padding:0 !important;
  overflow:hidden !important;
  box-sizing:border-box !important;
}

#mapShell.ssj-always-fullscreen > #map{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  min-height:0 !important;
  max-height:none !important;
  margin:0 !important;
  border-radius:0 !important;
}

@media (max-width:700px){
  #mapShell.is-fullscreen-map > #safeStayControls.ssj-fullscreen-controls,
  #mapShell.is-fullscreen-map.ssj-v3-hotel-open > #safeStayControls.ssj-fullscreen-controls{
    left:10px !important;
    right:10px !important;
    width:calc(100% - 20px) !important;
    max-width:calc(100% - 20px) !important;
    transform:none;
    overflow:visible !important;
    box-sizing:border-box !important;
  }

  #mapShell.is-fullscreen-map > #safeStayControls.ssj-fullscreen-controls .search-row{
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    box-sizing:border-box !important;
  }

  #mapShell.is-fullscreen-map > #safeStayControls.ssj-fullscreen-controls #searchAutocompleteBox{
    flex:1 1 auto !important;
    min-width:0 !important;
    width:auto !important;
  }

  #mapShell.is-fullscreen-map > #safeStayControls.ssj-fullscreen-controls #destinationSearch{
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
  }

  #mapShell.is-fullscreen-map > #safeStayControls.ssj-fullscreen-controls #destinationSearchButton{
    flex:0 0 72px !important;
    width:72px !important;
    min-width:72px !important;
    padding:0 8px !important;
  }

  #mapShell.is-fullscreen-map > #safeStayControls.ssj-fullscreen-controls .explore-strip{
    width:100% !important;
    max-width:100% !important;
    box-sizing:border-box !important;
  }

  #mapShell.is-fullscreen-map > #safeStayControls.ssj-fullscreen-controls.ssj-search-collapsed,
  #mapShell.is-fullscreen-map.ssj-v3-hotel-open > #safeStayControls.ssj-fullscreen-controls.ssj-search-collapsed{
    left:50% !important;
    right:auto !important;
    width:104px !important;
    max-width:104px !important;
    transform:translateX(-50%) !important;
  }
}