:root {
  font-size: 100%;
  --textColor: #000000;
  --primaryColor: #e67e22;
  --secondaryColor: #ffffff;
}

.rdlocator {
  display: flex;
}

.rdlocator .leaflet-container a {
  color: var(--textColor);
}

.location-list {
  width: calc(25% - 4px);
  height: 60vh;
  /* overflow: auto; */
  margin-right: 4px;
}

#map.leaflet-container {
  height: 60vh;
  width: 75%;
  font: inherit;
  border-radius: 0.25rem;
}

#map .leaflet-popup-content-wrapper {
  border-radius: 0;
  color: var(--textColor);
}

.location-list .filter, .location-list .custom-dropdown {
  padding: 0 1rem 0 0;
  margin: 0 0 1rem 0;
  position: relative;
}

.location-list .filter input.search, .location-list .custom-dropdown .custom-input, .location-list .custom-dropdown .options {
  color: var(--textColor);
  font-size: 1rem;
  display: inline-block;
  border: 1.5px solid var(--textColor);
  line-height: 1.75;
  background: var(--secondaryColor);
  box-sizing: border-box;
}

.location-list .filter input.search, .location-list .custom-dropdown .custom-input {
  width: 100%;
  padding: 0 0.75rem;
  border-radius: 0.25rem;
}

.location-list .custom-dropdown .custom-input {
  user-select: none;
}

.location-list .custom-dropdown .options {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  border-bottom-left-radius: 0.25rem;
  border-bottom-right-radius: 0.25rem;
}

.location-list .filter input.search:focus {
  outline: none;
}

::-webkit-scrollbar {
  width: 3px;
  height: 3px;
  border-left: 0;
  background: rgba(0, 0, 0, 0.1);
}

::-webkit-scrollbar-thumb {
  /* background: var(--primaryColor); */
  border-radius: 0;
}

.location-list ul.list {
  padding: 0 1rem 0 0;
  margin: 0;
  list-style-type: none;
}

.location-list .location {
  margin: 0 0 1rem 0;
  border-bottom: 1px solid var(--textColor);
  padding: 0.5rem 1rem 0.75rem 1rem;
  word-wrap: break-word;
  overflow-wrap: break-word;
  hyphens: auto;
}

.location-list li {
  line-height: 1.25;
}

.location-list li .location.fadeIn {
  animation: fadeIn 0.5s;
}

@keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

.location-list li:last-child .location {
  border: none;
}

.location-list .location a {
  text-decoration: none;
  display: block;
  color: var(--primaryColor);
  font-size: 1.125rem;
  line-height: 1.25;
  font-weight: 700;
  margin: 0 0 0.5rem 0;
  border-bottom: 0;
}

.location-list .location.active a {
  text-decoration: underline 2px;
}

.location-list .location span {
  color: var(--textColor);
  font-size: 1rem;
  line-height: 1.5;
  display: inline-block;
}

.location-list .location p {
  color: var(--textColor);
  font-size: 1rem;
  line-height: 1.5;
  margin: 0.5rem 0;
}

.location-list .location small, .location-list .location i {
  color: var(--textColor);
  font-size: 0.75rem;
  font-style: normal;
  display: block;
}

.leaflet-popup-content-wrapper {
  padding: 0;
  overflow: hidden;
}

.leaflet-popup-content-wrapper .leaflet-popup-content {
  margin: 0;
}

.leaflet-popup-content-wrapper a {
  text-decoration: none;
}

.leaflet-popup-content-wrapper h4 {
  padding: 0.5rem 1rem;
  margin: 0;
  background: var(--primaryColor);
  color: var(--secondaryColor);
  font-size: 1rem;
  line-height: 1.25;
  font-weight: 700;
}

.leaflet-popup-content-wrapper img {
  max-height: 96px;
  width: auto;
  padding: 0.25rem 1rem;
  margin: 0;
}

.leaflet-popup-content-wrapper span {
  padding: 0 1rem;
  margin: 0.25rem 0 0 0;
  font-size: 0.875rem;
  line-height: 1.25;
  display: inline-block;
}

.leaflet-popup-content-wrapper p {
  padding: 0 1rem;
  font-size: 0.875rem;
  line-height: 1.25;
  margin: 0.25rem 0 0 0;
}

.leaflet-popup-content-wrapper .location-menu {
  padding: 0.5rem 1rem 1rem 1rem;
}

.leaflet-popup-content-wrapper .leaflet-popup-content .location-email {

}

.leaflet-popup-content-wrapper .leaflet-popup-content .location-link {

}

.leaflet-popup-content-wrapper .leaflet-popup-content .location-link a, .leaflet-popup-content-wrapper .leaflet-popup-content .location-email a {
  text-decoration: none;
  text-transform: uppercase;
  color: var(--primaryColor);
  font-size: 0.875rem;
  font-weight: 700;
  border-bottom: 1.5px solid var(--primaryColor);
}

/* CUSTOM DROPDOWN */

.custom-dropdown {
  cursor: pointer;
}

.custom-dropdown:before {
  content: "";
  position: absolute;
  right: 28px;
  top: 12px;
  /* z-index: 9999; */
  width: 8px;
  height: 8px;
  border: 1.5px solid var(--textColor);
  border-top: transparent;
  border-right: transparent;
  transform: rotate(-45deg);
  transform-origin: center;
  pointer-events: none;
  transition: all 0.15s linear;
  opacity: 0;
}

.custom-dropdown.active:before {
  opacity: 1;
}

.--custom-dropdown:after {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.custom-reset {
  position: absolute;
  right: 24px;
  top: 8px;
  width: 16px;
  height: 16px;
  cursor: pointer;
  z-index: 9;
  visibility: hidden;
}

.custom-reset:before, .custom-reset:after {
  position: absolute;
  left: 7px;
  content: ' ';
  height: 16px;
  width: 1.5px;
  background: var(--textColor);
  transition: all 0.15s linear;
  opacity: 0;
}

.custom-reset:hover:before, .custom-reset:hover:after {
  background: var(--primaryColor);
}

.custom-reset.active {
  visibility: visible;
}

.custom-reset.active:before, .custom-reset.active:after {
  opacity: 1;
}

.custom-reset.active:before {
  transform: rotate(-45deg);
}

.custom-reset.active:after {
  transform: rotate(45deg);
}

.custom-reset:before {
  transform: rotate(45deg);
}

.custom-reset:after {
  transform: rotate(-45deg);
}

.custom-dropdown .custom-input {
  cursor: pointer;
  outline: none;
  user-select: none;
}

.custom-dropdown .options {
  cursor: pointer;
  outline: none;
  overflow: hidden;
  padding: 0;
  position: absolute;
  top: 36px;
  left: 0;
  right: 16px;
  transition: all 0.15s ease;
  opacity: 0;
  transform: translateY(-4px);
  visibility: hidden;
  list-style: none;
  z-index: 9;
}

.custom-dropdown .options .custom-option {
  padding: 0.25rem 0.75rem;
  border-radius: 0;
  transition: all 0.2s ease;
  line-height: 1.75;
}

.custom-dropdown .options .custom-option:last-of-type {
  border-bottom-radius-left: 0.25rem;
  border-bottom-radius-right: 0.25rem;
}

.custom-dropdown .options .custom-option {
  color: var(--textColor);
}

.custom-dropdown .options .custom-reset {
  color: var(--primaryColor);
}

.custom-dropdown .options .custom-option:not(:last-of-type), .custom-dropdown .options .custom-reset:not(:last-of-type) {
  margin-bottom: 0;
}

.custom-dropdown .options .custom-option.active, .custom-dropdown .options .custom-option:hover {
  color: var(--secondaryColor);
  background: var(--textColor);
}

.custom-dropdown .options .custom-reset:hover {
  color: var(--secondaryColor);
  background: var(--primaryColor);
}

.custom-dropdown.opened .custom-input {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

.custom-dropdown.opened .options {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.custom-dropdown.opened::before {
  transform: rotate(-225deg);
}

/* SIMPLE SCROLLBAR */

.rdlocator .ss-wrapper {
  overflow: hidden;
  width: calc(100% - 16px);
  height: 100%;
  position: relative;
  z-index: 1;
  float: left;
}

.rdlocator .ss-content {
  height: 100%;
  width: calc(100% + 16px);
  padding: 0 0 0 0;
  position: relative;
  overflow-x: auto;
  overflow-y: scroll;
  box-sizing: border-box;
}

.rdlocator .ss-content:-webkit-scrollbar{
  display: none;
}

.rdlocator .ss-content {
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.rdlocator .ss-content.rtl {
  width: calc(100% + 16px);
  right: auto;
}

.rdlocator .ss-scroll {
  position: relative;
  background: var(--textColor);
  width: 6px;
  border-radius: 0.25rem;
  top: 0;
  z-index: 2;
  cursor: pointer;
  /* opacity: 0; */
  transition: opacity 0.25s linear;
}

.rdlocator .ss-hidden {
  /* display: none; */
  top: -99999px !important;
  left: -99999px !important;
}

.rdlocator .ss-container:hover .ss-scroll, .rdlocator .ss-container:active .ss-scroll {
  /* opacity: 1; */
}

.rdlocator .ss-grabbed {
  -moz-user-select: none;
  -webkit-user-select: none;
  user-select: none;
}

/* RESPONSIVE */

@media (max-width: 768px) {

  .rdlocator {
    flex-direction: column-reverse;
  }

  .rdlocator .ss-wrapper {
    /* width: 100%; */
  }

  .rdlocator .ss-content {
    width: 100%;
  }

  .location-list {
    width: 100%;
  }

  .location-list .filter, .location-list .custom-dropdown {
    padding: 0;
  }

  .rdlocator #map {
    width: 100%;
    margin-bottom: 2rem;
  }

  .location-list {
    margin: 0;
  }

  .custom-dropdown:before {
    right: 12px;
  }

  .custom-dropdown .options {
    right: 0;
  }

  .custom-reset {
    right: 8px;
  }

  ::-webkit-scrollbar {
    display: none;
  }

}