#lipas-filters{display:flex;flex-wrap:wrap;gap:8px;margin:8px 2px 12px}
.lipas-chip{border:1px solid #344466;background:#0b1426;color:#a9c2ff;border-radius:999px;padding:6px 10px;font-size:12px;cursor:pointer}
.lipas-chip .count{opacity:.7}
.lipas-chip.active{background:#1a2550;border-color:#3b82f6;color:#e7efff}


::-webkit-scrollbar {
    display: none;
}
#lipas-filters > label > span {
	
	display:none;
	
}

#lipas-filters{display:flex;flex-wrap:wrap;gap:8px;margin:6px 2px 10px}
.lipas-chip{
  border:1px solid #314268;
  background:#0b1a36;
  color:#cfe1ff;
  padding:4px 10px;
  border-radius:999px;
  font-size:12px;
  cursor:pointer;
  opacity:.55;
  transition:all .15s ease;
}
.lipas-chip:hover{opacity:.8}
.lipas-chip.active{
  background:#1b2a4b;
  border-color:#3b82f6;
  box-shadow:0 0 0 1px rgba(59,130,246,.25) inset;
  opacity:1;
}
.lipas-chip .count{opacity:.7;margin-left:6px}


#lipas-map {
width:100vw!important;
height:100vh!important;
}

/* Kill any leftover MapLibre popup UI (we removed JS popups) */
.maplibregl-popup, .maplibregl-popup-anchor-top, .mapboxgl-popup, .mapboxgl-popup * {
  display:none !important;
  visibility:hidden !important;
  opacity:0 !important;
}

#lipas-sidebar {
display:block!important;
top:0px!important;
position:absolute!important;
overflow:scroll;
z-index:9999;
height:100vh;
}


.lipascc {
  position:relative;
  
}



.maplibregl-canvas {
  width:100vw;
  height:100vh;
}

  .leaflet-popup-content b {
  font-size:18px; font-weight:700;}
#lipas-sidebar{background:white;
  box-sizing:border-box;max-width:520px;padding:20px 30px}
#lipas-sidebar .hint{color:#6b7280;font-size:12px;margin:6px 2px 10px}
#lipas-list{display:grid;gap:10px}
.lipas-card{width:360px;
  background:#ffffff;
box-shadow:1px 1px 4px #333;  
  border-radius:12px;padding:10px;cursor:pointer}
.lipas-card h3{margin:0 0 4px;font-size:15px;line-height:1.2}
.lipas-meta{color:#000000;font-size:12px}
.lipas-badges{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
.lipas-badge{box-shadow:0 1px 2px rgba(0,0,0,.35); background:#ffffff;border:1px solid #13254b;color:#000000;padding:2px 6px;border-radius:999px;font-size:11px}

/* base: sidebar interactive on desktop; on mobile we’ll control with .pe-off */
#lipas-sidebar {
  /* your existing styles... */
  touch-action: auto; /* allow normal scroll inside when active */
}

/* when deactivated (mobile + closed) let touches fall through to the map */
#lipas-sidebar.pe-off {
  pointer-events: none !important;
  /* optional: faint it so users see it's inactive */
  opacity: 0.0;
  transition: opacity .2s ease;
}

/* when opened again, fully interactive */
body.lipas-sidebar-open #lipas-sidebar {
  pointer-events: auto;
  opacity: 1;
}

/* optional: keep header area (if any) clickable even when pe-off */
#lipas-sidebar.pe-off .keep-clickable {
  pointer-events: auto;
}


.lipas-card.active .lipas-addr,
.lipas-card.active .lipas-meta {
  font-size:1.2em;
}

.lipas-km-dual .track,
.lipas-km-dual .range-fill{
  position:absolute;left:0;right:0;top:50%;height:4px;transform:translateY(-50%);
  border-radius:999px;background:#d6d6d6;pointer-events:none
}
.lipas-km-dual .range-fill{ background:#3b82f6 }  


@media screen and (max-width:1279px) {


.lipas-card.active{

  width:100vw!important;

}
  .lipas-infopage-modal{
          float:right;
          
        position:relative; width:100vw; height:100vh;
        background:#fff;  overflow:hidden;
        box-shadow:0 16px 48px rgba(0,0,0,.35);
      }

  

}  


@media screen and (min-width:1280px) {



    .lipas-infopage-modal{
          float:right;
          
        position:relative; width:calc(100% - 420px); height:100vh;
        background:#fff;  overflow:hidden;
        box-shadow:0 16px 48px rgba(0,0,0,.35);
      }


.lipas-card.active{

  width:550px!important;

}

}

@media screen and (max-width:1279px) {

.lipas-card.active .maplibregl-ctrl-group button {

  display:none;
}
  
.lipas-card.active{
z-index:2;
  width:100vw!important;

}

}


.lipas-card.active{
  position:fixed!important;
  left:0px;
  top:0px;
  display:block;
  height:100vh!important;
z-index:2;
 /* outline:2px solid #3b82f6;*/
  padding:50px;
}

img.lipas-main {
  height:100vh!important;
  width:100vw!important;
  object-fit:contain!important;
  min-height:100vh!important;

}

.lipas-modal-images {
  background:black;
}

.lipas-card.active h3{
padding-right:80px;
  font-size:2em;
}
.lipas-modal video {
  width:100%!important;
  height:100%!important;
}

.lipas-modal .close {
  transform:scale(3);
  pointer-events:auto;
  z-index:999999;
}

.lipas-modal {
  height:100vh!important;
  width:100vw!important;
  overflow:auto;
  background:#fff;
  border-radius:12px;
  box-shadow:0 10px 40px rgba(0,0,0,.3);
}

.lipas-card h1, .lipas-card h2, .lipas-card h3 {
  color:black!important;
}

.lipas-kmrange {
  margin-left:20px;
}

.lipas-desc{color:#000000}
#lipas-filters{max-width:360px;display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10px}
#lipas-filters .lipas-chip{border-radius:999px;
   box-shadow:1px 1px 4px #333;
  background:#ffffff;color:#000000;padding:6px 10px;font-size:12px;cursor:pointer}
#lipas-filters .lipas-chip.active{outline:2px solid #3b82f6}
#lipas-type-select{min-width:260px; max-width:320px; padding:6px 8px;border-radius:8px;border:1px solid #ffffff;background:#ffffff;color:#000000}
.lipas-addr{color:#000000;font-size:12px;margin-top:4px}
.lipas-feats{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.lipas-feat{display:inline-flex;align-items:center;gap:6px; box-shadow:1px 1px 4px #333; background:#ffffff;color:#000000;padding:2px 6px;border-radius:8px;font-size:11px;white-space:nowrap}

/* make the selected marker stand out a bit */
.lipas-divmarker.active .lipas-pinwrap {
  transform: translateY(-2px) scale(1.06);
  transition: transform .15s ease;
  z-index: 2;
}


@media screen and (min-width:1280px) {
#lipas-map > div.maplibregl-control-container > div.maplibregl-ctrl-top-right > div:nth-child(2) > button
{
display:none;
}
}
#lipas-map { position: relative; }
#lipas-map .maplibregl-map { position:absolute; inset:0; }

.lipas-card-side {
  position:absolute;
  right:20px;
  top:80px;
}

iframe #coiOverlay {
  display:none!important;
}

.km-reset {color:black;}






/* --- QR Code block --- */
.lipas-card-grid { display:grid; grid-template-columns: 1fr auto; align-items:flex-start; gap:12px; }
.lipas-card-grid .lipas-card-main { min-width:0; }
.lipas-card-grid .lipas-card-side { display:flex; flex-direction:column; align-items:center; justify-content:flex-start; gap:6px; }
.lipas-qr-wrap { display:none; }
.lipas-card.active .lipas-qr-wrap {display:block;}
.lipas-qr-inner { display:block; }
.lipas-qr-img { width:90px; height:90px; object-fit:contain; border:1px solid #13254b; border-radius:8px; background:#ffffff; padding:4px; box-shadow:0 1px 2px rgba(0,0,0,.15); }
.lipas-qr-links { display:none; }
@media (max-width:640px){
  .lipas-card-grid { grid-template-columns: 1fr 110px; }
  .lipas-qr-img { width:100px; height:100px; }
}
.lipas-qr-links a { color:#0b4ab8; text-decoration:underline; }
.lipas-qr-links a:hover { text-decoration:none; }
.lipas-qr-links strong { font-size:13px; }
.lipas-qr-hint { color:#516580; display:block; margin-top:4px; font-size:12px; }
.lipas-qr-error { color:#a94442; display:block; margin-top:4px; font-size:12px; }
.lipas-qr-head { display:block; margin-bottom:4px; }
.lipas-qr-img.qr-hidden { visibility:hidden; }




.lipas-card.active {
background:#ffffff;
overflow: auto;
}
.lipas-desc {display:none;}

.lipas-card.active .lipas-desc {
padding:20px 0px;
display:block!important;
}

/* Show short preview by default; show full text when the card is active */
.lipas-desc-full { display: none; }
.lipas-card.active .lipas-desc-short { display: none; }
.lipas-card.active .lipas-desc-full  { display: block; }


/* --- Mobile sidebar toggle --- */
.lipas-sidebar-toggle { font-size:28px!important; color:black!important; background:#0b1a36; border:1px solid #13254b; color:#9cc0ff; border-radius:8px; padding:6px 10px; cursor:pointer; font-size:13px; line-height:1; box-shadow:0 1px 2px rgba(0,0,0,.35); }
.lipas-sidebar-toggle:focus { outline:2px solid #3b82f6; }

/* Mobile overlay */
@media (max-width: 900px){
  #lipas-sidebar{
    display:none;
    position:absolute; z-index:1;
    width:100vw;
     bottom:10px; top:60px;
   border-radius:12px; box-shadow:0 10px 30px rgba(0,0,0,.35);
    overflow:auto; 
  }
  body.lipas-sidebar-open #lipas-sidebar{ display:block; }
}

/* Hide by default globally; show when open */
body:not(.lipas-sidebar-open) #lipas-sidebar{ display:none; }
body.lipas-sidebar-open #lipas-sidebar{ display:block; }

/* Small slide animation on mobile */
@media (max-width: 900px){
  #lipas-sidebar{ transform:translateY(6px); opacity:0; transition:transform .2s ease, opacity .2s ease; }
  body.lipas-sidebar-open #lipas-sidebar{ transform:none; opacity:1; }
}



/* Amenity bubbles on markers (for DivIcon) */
.leaflet-marker-icon.lipas-divmarker { background:transparent; border:0; }
.lipas-pinwrap{ position:relative; width:36px; height:44px; }
.lipas-pin{ background:transparent!important; position:absolute; left:5px; top:3px; width:22px; height:22px; border-radius:50% 50% 50% 0; box-shadow:0 1px 2px rgba(0,0,0,.35); }
.lipas-pin::after{ content:""; position:absolute; inset:5px; border-radius:50%; background:rgba(255,255,255,.22); transform:rotate(-45deg); }
.lipas-pinimg img{ width:28px; height:36px; object-fit:contain; display:block; }
.lipas-pin-glyph{ position:absolute; left:0; top:0; width:36px; height:28px; display:flex; align-items:center; justify-content:center; font-size:26px; line-height:1; transform:translateY(2px); }
.lipas-km {
  position:absolute;
  left:80px;
  bottom:10px;
  transform:translateX(-50%);
  min-width:80px;
  max-width:140px;
  padding:2px46px 3px;
  font-size:14px;
  font-weight:600;
  line-height:1.2;
  text-align:center;
  color:#0b1a36;
  background:rgba(147,197,253,0.55); /* light translucent blue */
  border:1px solid rgba(255,255,255,0.5);
  border-radius:24px;
  box-shadow:0 2px 6px rgba(0,0,0,0.25), 0 0 0 1px rgba(0,0,0,0.15);
  backdrop-filter:blur(4px);
  -webkit-backdrop-filter:blur(4px);
  text-shadow:0 1px 1px rgba(255,255,255,0.65);
  letter-spacing:.3px;
  pointer-events:none;
  user-select:none;
  font-variant-numeric:tabular-nums;
}

.lipas-card.active .lipas-media-mini {
  display:block!important;
}

.lipas-media-mini{display:none;}
.lipas-clear-active .lipas-media-mini {display:block!important;}

.lipas-media-mini img, .lipas-media-mini video {max-width:100%!important;}
.lipas-bubbles{ position:absolute; right:0; bottom:0; display:flex; gap:2px; }
.lipas-bubble{ width:16px; height:16px; border-radius:50%; background:#0b1a36; color:#fff; display:flex; align-items:center; justify-content:center; font-size:11px; line-height:1; box-shadow:0 0 0 1px rgba(0,0,0,.35); }

.lipas-bubble {display:none!important;}
/* Ensure no CSS filters on map */
#lipas-map, #lipas-map * { filter:none!important; -webkit-filter:none!important; mix-blend-mode:normal!important; }
#lipas-map img.leaflet-tile { filter:none!important; -webkit-filter:none!important; }
#lipas-map .leaflet-pane, #lipas-map .leaflet-overlay-pane svg, #lipas-map .leaflet-marker-pane img, #lipas-map .leaflet-tile-pane { filter:none!important; }