@charset "UTF-8";
/*
 Theme Path
========================================================================== */
/*
 Font Family
========================================================================== */
/*
 Font Size
========================================================================== */
/*
 Colors
========================================================================== */
/*
 Helpers
========================================================================== */
/*
 Sizes
========================================================================== */
/*
 Columns
========================================================================== */
/*
 Buttons – @include button();
========================================================================== */
/* Fluid Type - Responsive fonts sizing
https://chriskirknielsen.com/blog/modern-fluid-typography-with-clamp/
usage: @include fluid-type(min viewport size, max viewport, min font size, max font size);
========================================================================== */
/*
 Tint (adds white) – @include tint(red, 10%);
========================================================================== */
/*
 Shade (adds black) – @include shade(red, 10%);
========================================================================== */
/*
 Hex to RGB – hextorgb(#000); //returns 0, 0, 0,
========================================================================== */
/*
 Object Fit – @include object-fit(cover);
========================================================================== */
/*
 Rows – @include rows(4,10px); px or % support
========================================================================== */
/*
 Aspect Ratio – @include aspect-ratio(9,16) 0r @include aspect-ratio(70%,30%)
========================================================================== */
/*
 Align Full – @include alignfull;
========================================================================== */
/*
 Min Width Query – @include media($desktop);
========================================================================== */
/*
 Max Width Query – @include media-height($tablet);
========================================================================== */
/*
 Min Width and Max Width Query – @include media-between($tablet, $desktop);
========================================================================== */
/*
 Min Height Query – @include media-height($tablet);
========================================================================== */
/*
 Truncate – @include truncate-text(ellipsis);
========================================================================== */
/*
 Rem to Pix Calculate for fonts
========================================================================== */
/*
 Font Size rem to pix – @include font-size(30px);
========================================================================== */
/*
 Rem Calculate – @include rem(padding, 30px);
========================================================================== */
/*
 Column width with margin
========================================================================== */
/*
 SCSS variable in background image with SVG image data URI
 usage – style="fill: friendly-color(var(--wp--preset--color--tertiary));"
========================================================================== */
/* -------------------------------------------------------------------------- */
/*                                   Resets                                   */
/* -------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------- */
/*                                    Utils                                   */
/* -------------------------------------------------------------------------- */
.location-finder__header {
  background-color: var(--wp--preset--color--tertiary);
}
.location-finder__fieldset {
  border: none;
  padding: 0;
  margin: 0;
  display: flex;
  align-items: center;
  gap: 8px;
}
@media screen and (max-width: 991px) {
  .location-finder__fieldset {
    flex-direction: column;
    gap: 11px;
    align-items: flex-start;
  }
}
.location-finder__form {
  display: flex;
  padding: 30px 30px;
  column-gap: 20px;
  justify-content: center;
  flex-wrap: wrap;
  row-gap: 20px;
}
@media screen and (max-width: 991px) {
  .location-finder__form {
    align-items: flex-end;
  }
}
.location-finder__inputs-container {
  gap: 8px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
}
@media screen and (max-width: 991px) {
  .location-finder__inputs-container {
    gap: 20px;
    max-width: 469px;
  }
}
@media screen and (max-width: 479px) {
  .location-finder__inputs-container {
    flex-direction: column;
    width: 100%;
  }
}
.location-finder__label {
  font-weight: 700;
  font-size: 14px;
  color: #2d2d39;
}
.location-finder__input {
  width: 200px;
  font-size: 16px;
  color: #757588;
}
@media screen and (max-width: 991px) {
  .location-finder__input {
    width: 100%;
  }
}
.location-finder__input::-webkit-outer-spin-button, .location-finder__input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.location-finder__input[type=number] {
  -moz-appearance: textfield;
}
.location-finder__button-container {
  display: flex;
  align-items: center;
  gap: 10px;
}
@media screen and (max-width: 767px) {
  .location-finder__button-container {
    flex-direction: column;
    width: 100%;
    max-width: 465px;
  }
  .location-finder__button-container .button {
    width: 100%;
  }
}
.location-finder__button-separator {
  text-transform: uppercase;
  font-size: 14px;
  color: #2d2d39;
  padding: 10px 0;
}
.location-finder #current-location-btn:hover {
  color: #fff !important;
}
.location-finder__map-container {
  position: relative;
  display: grid;
  grid-template-columns: 400px auto;
  height: 600px;
  max-height: 100%;
}
@media screen and (max-width: 991px) {
  .location-finder__map-container {
    grid-template-columns: 100%;
  }
}
.location-finder__map-container--size--tall {
  height: auto;
  max-height: none;
}
@media screen and (min-width: 992px) {
  .location-finder__map-container--size--tall {
    height: 1000px;
    max-height: 70vh;
  }
}
.location-finder__map-container--loading .location-finder__loading-overlay {
  display: flex;
}
.location-finder__loading-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: none;
  background-image: url("/wp-content/themes/qualsight/icons/loading-spinner.svg");
  background-position: center;
  background-size: 100px;
  background-color: rgba(255, 255, 255, 0.5);
  background-repeat: no-repeat;
  z-index: 1;
  pointer-events: none;
}
.location-finder__location-list {
  margin: 0;
  padding: 0;
  list-style: none;
  margin-top: 0 !important;
  box-shadow: inset 0 -1px 0 #c5c5c5;
  overflow-y: auto;
  position: relative;
}
@media screen and (max-width: 991px) {
  .location-finder__location-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    order: 2;
  }
}
@media screen and (max-width: 575px) {
  .location-finder__location-list {
    grid-template-columns: 100%;
  }
}
.location-finder__load-more-item {
  padding: 15px;
  display: flex;
  justify-content: center;
}
@media screen and (max-width: 991px) {
  .location-finder__load-more-item {
    grid-column-start: 1;
    grid-column-end: 3;
  }
}
@media screen and (max-width: 519px) {
  .location-finder__load-more-item {
    grid-column-start: unset;
    grid-column-end: unset;
  }
}
.location-finder__location-item {
  padding: 15px;
  cursor: pointer;
  border-bottom: 1px solid #e5e5e5;
  display: none;
}
@media screen and (max-width: 991px) {
  .location-finder__location-item {
    border-right: 1px solid #e5e5e5;
  }
}
.location-finder__location-item--visible {
  display: block;
}
.location-finder__location-item--focus, .location-finder__location-item:hover {
  background-color: var(--wp--preset--color--tertiary);
}
.location-finder__map {
  background-color: #c5c5c4;
  height: 100%;
  width: 100%;
  display: none;
}
@media screen and (min-width: 768px) {
  .location-finder__map {
    display: block;
  }
}

.location-marker-popup {
  padding: 10px;
}
.location-marker-popup__header {
  display: flex;
  align-items: baseline;
  gap: 10px;
}
.location-marker-popup__title {
  font-size: 22px;
  margin: 0 0 10px 0;
}
.location-marker-popup__link {
  text-decoration: none !important;
  color: var(--wp--preset--color--primary-dark);
}
.location-marker-popup__distance {
  color: rgba(0, 0, 0, 0.6);
  font-size: 0.8em;
}
.location-marker-popup__address {
  font-size: 14px;
  margin: 0 0 10px 0 !important;
  text-transform: capitalize;
}
.location-marker-popup__phone {
  display: flex;
  margin: 0 0 15px 0;
  width: max-content;
  gap: 5px;
  align-items: center;
  font-weight: 500;
  line-height: 1;
  font-size: 16px;
  text-decoration: none !important;
}
.location-marker-popup__buttons {
  display: flex;
  gap: 5px;
  flex-wrap: wrap;
}
.location-marker-popup__button {
  font-size: 13px !important;
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}
.location-marker-popup__button:hover {
  color: #fff !important;
}