#locator-wrap{
display:flex;
height:850px;
margin:0;
padding:0;
}

/* SIDEBAR */
.sidebar{
width:420px;
padding:20px; /* slightly reduced */
overflow-y:auto;
background:#2f7f7f; /* dark teal */
margin:0; /* force left */
}

/* remove outer theme spacing if any */
#locator-wrap,
.sidebar{
box-sizing:border-box;
}

/* TITLE */
.sidebar h2{
color:white;
margin-bottom:15px;
}

/* INPUT */
#searchBox{
width:100%;
padding:12px;
margin-bottom:10px;
border:none;
border-radius:6px;
}

/* BUTTONS (unchanged layout, just styled) */
button{
width:100%;
padding:12px;
margin-bottom:10px;
border:none;
border-radius:6px;
cursor:pointer;
font-weight:bold;
}

/* SEARCH BUTTON */
#searchBtn{
background:#2A3A40;
color:white;
}

/* FIND ME BUTTON */
#findMe{
background:#1f5f5f;
color:white;
}

/* RESULTS */
#results{
margin-top:10px;
}

/* CARD */
.psw-card{
padding:15px;
border-bottom:1px solid rgba(255,255,255,0.2);
color:white;
}

/* NAME */
.psw-card strong{
color:white;
}

/* MAP */
#map{
flex:1;
height:850px;
}
/* SEARCH ROW */
.search-row{
display:flex;
gap:10px;
margin-bottom:10px;
}

/* INPUT shrinks */
.search-row #searchBox{
flex:1;
margin-bottom:0;
}

/* SEARCH button sits beside */
.search-row #searchBtn{
width:120px;
margin-bottom:0;
}
.search-row #searchBox,
.search-row #searchBtn{
height:48px;
padding:0 12px; /* important for vertical alignment */
}
#findMe{
background:#1f5f5f;
color:white;
height:48px;
display:flex;
align-items:center;
justify-content:center;
padding:0 12px; /* keeps text centered nicely */
}
/* soften mapbox attribution */
.mapboxgl-ctrl-attrib{
background:rgba(255,255,255,0.6);
padding:2px 6px;
border-radius:4px;
font-size:10px;
}

/* subtle fade overlay */
#map{
position:relative;
}

#map::after{
content:'';
position:absolute;
bottom:0;
left:0;
width:180px;
height:70px;
background:linear-gradient(
to top,
rgba(255,255,255,0.8),
rgba(255,255,255,0)
);
pointer-events:none;
}
.psw-card{
padding:12px;
font-size:13px; /* smaller text */
line-height:1.4;
}

.psw-card strong{
font-size:14px; /* name slightly bigger */
}
@media (max-width: 768px){

#locator-wrap{
flex-direction:column;
height:auto;
}

/* sidebar full width */
.sidebar{
width:100%;
}

/* map below results */
#map{
width:100%;
height:400px; /* important */
}

}
/* FORCE FULL WIDTH — override theme containers */
#locator-wrap{
position:relative;
left:50%;
right:50%;
margin-left:-50vw;
margin-right:-50vw;
width:100vw;
max-width:100vw;
}
/* REMOVE theme padding */
.gdlr-core-pbf-wrapper{
padding:0 !important;
}

.gdlr-core-pbf-wrapper-content{
padding:0 !important;
}

.gdlr-core-page-builder-body{
padding:0 !important;
}
.psw-image{
margin-bottom:10px;
}

.psw-image img{
width:60px;
height:60px;
border-radius:50%;
object-fit:cover;
border:2px solid white;
}
/*styling for the image */
.psw-header{
display:flex;
align-items:center;
gap:10px;
margin-bottom:8px;
}

.psw-image img{
width:55px;
height:55px;
border-radius:50%;
object-fit:cover;
}

.psw-info strong{
display:block;
font-size:14px;
}
/* Style the popup on the map */
.map-popup{
text-align:center;
}

.popup-img{
width:50px;
height:50px;
border-radius:50%;
object-fit:cover;
margin-bottom:5px;
}
/* Add hover style logic */
.psw-name{
cursor:pointer;
text-decoration:underline;
}

.psw-name:hover{
color:#ffffff;
opacity:0.8;
}
/* Style the details on the markup */
.map-popup{
min-width:220px;
text-align:center;
font-family:Arial,sans-serif;
}

.popup-img{
width:70px;
height:70px;
border-radius:50%;
object-fit:cover;
margin-bottom:10px;
border:2px solid #2f7f7f;
}

.popup-name{
font-size:16px;
font-weight:bold;
margin-bottom:10px;
color:#2A3A40;
}

.popup-details{
font-size:13px;
line-height:1.5;
color:#444;
}

.popup-details strong{
color:#2A3A40;
}
/* MOBILE RESPONSIVE */
@media screen and (max-width: 768px){

#locator-wrap{
flex-direction:column;
height:auto;
}

.sidebar{
width:100%;
height:auto;
padding:15px;
}

#map{
width:100%;
height:500px;
min-height:500px;
}

.search-row{
flex-direction:row;
}

.search-row #searchBtn{
width:100px;
}

}