/* store-locator.css */
.g9-store-list {
  overflow-y: scroll !important;
  scrollbar-color: unset !important; 
  scrollbar-width: auto;             
}
.g9-store-list::-webkit-scrollbar {
  width: 6px !important; 
}

.g9-store-list::-webkit-scrollbar-track {
  background: #f8f6f2 !important;
}

.g9-store-list::-webkit-scrollbar-thumb {
  background: url('https://pxe8uowid8.wpdns.site/wp-content/uploads/2025/09/rect-css.png') center no-repeat !important; ;
}


.g9-store-locator { font-family: Roboto, sans-serif; }
.g9-controls { margin: 20px 0; }
.g9-search-input {
    width: 100%;
    max-width: 420px;
    padding: 10px 18px;
    font-size: 16px;
    border: 1px solid rgba(0,0,0,0.15);
     background-image: url(../search.svg);
    background-position: right 14px center;
    background-repeat: no-repeat;
    background-size: 15px;
}
.g9-store-columns { display: flex;  align-items: flex-start; }
.g9-store-list { width: 400px; max-height: 703px; overflow-y: auto; border-radius: 0px; }
.g9-store-item { padding: 20px; border-bottom:1px solid #99999966; cursor: pointer; transition: background 0.24s; color: #53585C; }
.g9-store-item:hover, .g9-store-item:focus { background: #FAF1D0; outline: none; border-bottom:1px solid transparent !important; }
.g9-store-item.active { background: #FAF1D0; font-weight: 600; }
.g9-store-item .g9-store-name { display:block; font-size: 16px; margin-bottom:4px; color:#53585C; }
.g9-store-item .g9-store-meta { font-size: 14px; color: #53585C; line-height: 1.3; }
.g9-store-item .g9-direction { margin-top:10px; display:inline-block; border-bottom:1px solid #53585C; font-weight:400; padding-bottom: 1px; font-size:14px; }
.g9-map { flex: 1; min-height: 742px; width: calc(100% - 420px); }

/* Responsive rules */
@media (max-width: 1024px) {
    .g9-store-columns { flex-direction: column; }
    .g9-store-list { width: 100%; max-height: 253px; }
    .g9-map { width: 100%; min-height: 360px; }
    .g9-search-input { padding-left: 12px; padding-right: 40px; }
}


/* Left column wrapper: width and float as you requested */
.g9-left-col {
    width: 400px;
    float: left;
    clear: left;
    margin: 0;
}

/* Keep the store list sizing inside the left column */
.g9-store-list {
    width: 100%;               /* uses the 400px provided by .g9-left-col */
    max-height: 703px;
    overflow-y: auto;
    border-radius: 0px;
/*   scrollbar-width: thin;       
  scrollbar-color: #99999999 #f1f1f1; */
}

/* Make sure the map sits to the right of the left column */
.g9-map {
    /* margin-left: 420px;         */
    min-height: 742px;
    width: calc(100% - 420px);
}

/* Keep existing styles for .g9-search-input / .g9-store-item etc. (no change needed),
   but make sure search input is full width inside the left column */
.g9-controls { margin: 0 0 0px 0; }
.g9-search-input { width: 100%; max-width: none; box-sizing: border-box; }

/* Responsive: switch to stacked layout on smaller screens */
@media (max-width: 1024px) {
    .g9-left-col { width: 100%; float: none; clear: none; }
    .g9-map { margin-left: 0; width: 100%; min-height: 360px; }
    .g9-store-list { max-height: 240px; }
}


/* Address split styles */
.g9-store-meta { margin-top: 6px; }
.g9-store-address { font-size: 14px; color: #53585C; margin-bottom: 4px; font-weight:400; line-height:100%; }
.g9-store-cityzip { font-size: 14px; color: #53585C; margin-bottom: 4px; text-transform: none; color: #53585C; line-height:100%; }
.g9-store-phone { font-size: 14px; color: #53585C; font-weight: 400; line-height:100%; }

/* Infowindow styles (map popup) */
.g9-infowindow .g9-inf-address { margin-top: 4px; font-size: 14px; color: #53565C; font-weight:400; line-height:100%; }
.g9-infowindow .g9-inf-cityzip { font-size: 14; color: #53565C; margin-top: 2px; line-height:100%; font-weight:400; }
.g9-infowindow .g9-inf-phone { font-size: 14; color: #53565C; margin-top: 2px; line-height:100%; font-weight:400; }

/* Slight spacing for the direction link if needed */
.g9-direction { margin-top: 8px; display:inline-block; border-bottom:1px solid #53585C; padding-bottom: 2px; font-size:14px; }


/* Opening hours (infowindow) */
.g9-inf-opening-hours { margin-top: 8px; font-size: 13px; color: #444; }
.g9-inf-opening-row { display: flex; justify-content: space-between; gap: 12px; margin: 2px 0; }
.g9-inf-opening-row .day { font-weight: 400; color: #999999; margin-right: 10px; font-size:14px; 
 }
.g9-inf-opening-row .time { font-weight: 400; color: #999999; margin-right: 10px; font-size:14px;  white-space: nowrap; }



.g9-store-locator {
  background: #F8F6F2;
}

.nearest-store h1 {
  font-weight:400; 
}
.nearest-store p {
  line-height: 22.4px;
}
.g9-store-locator .g9-store-columns {
  width:100%;
  max-width:1720px;
  margin:0 auto;
}
@media (max-width:1730px)
{
  .g9-store-locator .g9-store-columns{
    padding-left:20px;
    padding-right:20px;

  }
}

input#g9-store-search {
  border: 1px solid #99999966;
  min-height:40px !important;
  background: #F8F6F2;

  padding:10px 20px;
  font-size:16px;
  line-height:100%;
  color:#999999;
  font-weight:400;
  text-transform:uppercase;
}
/* .nearest-store-page div#botiga-footer-ticker {
  display:none !important; 
} */
#g9-store-search:focus {
  outline: none !important;  
  box-shadow:none;
  border: 1px solid #99999966;
}
#g9-store-search::placeholder {
  font-weight: 400;
  font-size: 16px;
  line-height: 100%;
  color: #999999;
  text-transform:uppercase;
}
.g9-store-locator  {
 padding-bottom:100px; 
}


/*  Map Related css */

.g9-map .gm-style-iw-chr {
  height:100%;
  min-height:30px;
}
div#g9Map .gm-style-iw.gm-style-iw-c {
  padding-left:unset; 
  width:260px;
  border-radius:unset;
}
div#g9Map .gm-style-iw-ch{
  padding-top:unset;
}
div#g9Map button.gm-ui-hover-effect {
  height:30px !important;
  width:30px !important;

}

div#g9Map button.gm-ui-hover-effect span {
  margin:unset !important; 
  height:20px !important;
  width:20px !important;
}
div#g9Map .gm-style-iw-d {
  overflow:auto !important; 
  padding:20px 20px 26px 20px;
  border-top: 1px solid #99999966;
  border-radius:unset !important
}
div#g9Map .g9-infowindow strong {
  font-weight: 400;
  font-size: 16px ;
  line-height: 100%;
}
div#g9Map .g9-infowindow a {
  font-weight: 400;
  font-size: 16px;
  line-height: 100%;
  text-transform:uppercase;
  color: #53585C;
  margin-top:15px;
  display:block;
}
@media (max-width:600px)
{
  body .nearest-store h1 {
    font-size:24px !important;
    padding-top:30px;
    margin-bottom:8px !important;
  }
  body .nearest-store p {
    font-size:12px;
    line-height:14.4px;
  }
  .g9-left-col input#g9-store-search {
    font-size:13px; 
    line-height:100%;
    padding:11px 20px;
  }
  .g9-left-col #g9-store-search::placeholder { 
    font-size:13px; 
    line-height:100%;
  }
  .g9-left-col .g9-store-item {
    padding:12px 20px; 
  }
  .g9-left-col .g9-store-item .g9-store-name {
    font-size:12px;
  }
  .g9-store-item  .g9-store-address,.g9-store-item  .g9-store-cityzip, .g9-store-item .g9-store-phone {
    font-size:11px;
  }
  .g9-store-item {
    position:relative; 
  }

  .g9-store-item  .g9-direction {
    position:absolute;
    right: 20px;             
    top: 50%;                 
    transform: translateY(-50%); 
    margin-top:unset;
    font-size:12px;
  }
  body div#g9Map .gm-style-iw.gm-style-iw-c {
    max-height:unset !important;
  }
  body div#g9Map .gm-style-iw-d {
    max-height:unset !important;  
    padding:20px;
  }
  div#g9Map .g9-infowindow strong {
    font-size:12px; 
  }
  .g9-infowindow .g9-inf-address, .g9-infowindow .g9-inf-cityzip,  div#g9Ma .g9-infowindow .g9-inf-cityzip,  .g9-infowindow .g9-inf-phone {
    font-size:11px; 
  }
  div#g9Ma .g9-inf-opening-hours {
    margin-top:6px; 
  }
  .g9-inf-opening-row .day, .g9-inf-opening-row  span.time {
    font-size:11px; 
  }
  div#g9Map .g9-infowindow a {
    font-size:12px;
    margin-top:12px;
  }
	  body .g9-store-locator {
    padding-bottom:unset;
  }
}
div#g9Map .g9-infowindow strong {
  color:#58535C;
}


/*  Search Realted css */

.g9-search-input {
  background-image: url('/wp-content/uploads/2025/09/search.svg')!important;
  background-repeat: no-repeat !important;
  background-position: calc(100% - 14px) center !important;;
  background-size: 18px 18px;
  -webkit-appearance: none;           
  appearance: none;
}
.g9-search-input::-webkit-search-decoration,
.g9-search-input::-webkit-search-cancel-button {
  -webkit-appearance: none;
}
.g9-search-input {
  background-image: url('/wp-content/uploads/2025/09/store-locator-search.svg') !important;
}
