/* TOGGLE STYLING */
.toggle {
    margin: 0;
    box-sizing: border-box;
    font-size: 0;
    display: flex;
    flex-flow: row nowrap;
    justify-content: flex-start;
    align-items: stretch;
    height:fit-content;
  }
  
  .toggle input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
  }
  
  .toggle input + label {
    margin: 0;
    padding: .25rem;
    box-sizing: border-box;
    position: relative;
    display: inline-block;
    border: solid 1px #DDD;
    background-color: #FFF;
    font-size: 1rem;
    line-height: 140%;
    font-weight: 600;
    text-align: center;
    box-shadow: 0 0 0 rgba(255, 255, 255, 0);
    transition: border-color .15s ease-out, color .25s ease-out, background-color .15s ease-out, box-shadow .15s ease-out;
    -webkit-transition: border-color .15s ease-out, color .25s ease-out, background-color .15s ease-out, box-shadow .15s ease-out;
    -moz-transition: border-color .15s ease-out, color .25s ease-out, background-color .15s ease-out, box-shadow .15s ease-out;
    -ms-transition: border-color .15s ease-out, color .25s ease-out, background-color .15s ease-out, box-shadow .15s ease-out;
    -o-transition: border-color .15s ease-out, color .25s ease-out, background-color .15s ease-out, box-shadow .15s ease-out;
}
  
  .toggle input + label:first-of-type {
    border-radius: 6px 0 0 6px;
    border-right: none;
  }
  
  .toggle input + label:last-of-type {
    border-radius: 0 6px 6px 0;
    border-left: none;
  }
  
  .toggle input:hover + label {
    border-color: #001f3f; /* Replace $darkNavy with the actual color value */
  }
  
  .toggle input:checked + label {
    background-color: #39CCCC; /* Replace $teal2 with the actual color value */
    color: #FFF;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); /* Replace $activeShadow with the actual box-shadow value */
    border-color: #39CCCC; /* Replace $teal2 with the actual color value */
    z-index: 1;
  }
  
  .toggle input:focus + label {
    outline: 2px solid #39CCCC; /* Replace with the actual focus outline value */
    outline-offset: 2px;
  }
  
  @media (min-width: 768px) {
    .toggle input + label {
      padding: .75rem .25rem;
      flex: 0 0 50%;
      display: flex;
      justify-content: center;
      align-items: center;
    }
  }
  .select-map-heading {
    display: flex;
    justify-content: center;
  }