/* SC Store Locator */
#sc-store-locator-map {
  .sl-main,.sl-map {
    height: auto;
  }

  .sl-map {
    aspect-ratio: 188/127;
    max-height: 800px;

    @media (min-width: 1024px) {
      aspect-ratio: 933/832;
    }
  }

  .sl-aside {
    background-color: transparent;

    .sl-search-settings {
      padding: 24px var(--side-spacing);
      border-bottom: 0;
      font-size: var(--text-size-h5);

      @media (min-width: 1024px) {
        padding: 0 var(--side-spacing);
      }
    }

    .sl-address-list {
      border: 0;
      max-height: calc(800px - 125px);

      .sl-address-item {
        position: relative;
        border-top: 1px solid var(--border-color);
        grid-template-columns: 1fr;
        padding: 24px var(--side-spacing) 24px var(--side-spacing);

        &:last-child {
          border-bottom: 1px solid var(--border-color);
        }

        > svg {
          display: none;
        }

        .sc-directions-btn,.sc-accordion-btn,.sc-phone-btn {
          position: relative;
          z-index: 2;
        }

        .sc-contact {
          .sc-phone-btn {
            font-size: var(--text-size-tiny);
          }
        }

        .sc-accordion {
          &.sc-accordion:has(.sc-accordion__body-wrap > br:only-child),.sc-accordion:has(.sc-accordion__body-wrap:empty) {
            display: none;
          }

          .sc-accordion__head {

            .sc-store-status {
              position: relative;
              color: var(--system-success);
              font-size: var(--text-size-tiny);
              display: inline-flex;
              align-items: center;

              &:not(:empty) {
                &::before {
                  content: '';
                  display: inline-block;
                  height: 6px;
                  width: 6px;
                  background-color: var(--system-success);
                  margin-right: 8px;
                }
              }
            }

            .sc-accordion-btn {
              font-size: var(--text-size-tiny);

              svg {
                transform: rotate(180deg);
                transition: var(--duration-default) ease-in-out;
              }

              span {
                display: inline-block;

                &::before {
                  content: 'Show';
                  display: inline-block;
                  margin-right: 3px;
                }
              }

              &.active {

                svg {
                  transform: rotate(0deg);
                }

                span {
                  &::before {
                    content: 'Hide';
                  }
                }

              }
            }
          }

          .sc-accordion__body {
            overflow: hidden;
            max-height: 0px;
            transition: max-height var(--duration-extra-longer) ease;

            &.active {
              max-height: 1000px;
            }

            .sc-accordion__body-wrap {
              padding-top: 16px;
            }
          }
        }

        .sl-address-action-bttn {
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          height: 100%;
          background: transparent;
          border-radius: 0;
          z-index: 1;

          &.active {
            border: 1px solid black;
          }

          svg {
            display: none;
          }
        }
      }
    }
  }

  .sl-search-bar {
    padding: 0;

    #toggle-bttn {
      display: none;
    }

    .sl-input {
      border: 1px solid rgb(var(--color-input-border));
      color: rgb(var(--color-foreground));
      font-size: var(--text-size-small);


      &::placeholder {
        color: var(--secondary-grey);
        font-size: var(--text-size-small);
      }
    }


    .sl-autocomplete-dropdown {
      border: 1px solid rgb(var(--color-input-border));

      &:empty {
        display: none;
      }

      li {
        font-size: var(--text-size-small);
      }
    }
  }

  .sl-search-options {
    display: block !important;
    padding-left: 0;
    padding-bottom: 0;

    @media (min-width: 1024px) {
      padding-bottom: 32px;
    }

    .sl-search-selects {
      display: none;
    }

    &:has(>.sl-search-options) {
      padding-top: 0;
    }

    .sl-my-location-toggle {
      display: inline-flex;
      border-bottom: 1px solid black;
      padding-bottom: 2px;

      .sl-link {
        font-size: var(--text-size-tiny);
        text-transform: uppercase;
        letter-spacing: 0.5px;
        font-weight: 500;
        color: rgb(var(--color-foreground));
      }

    }
  }

  .sl-address-details {
    &.sl-spinner-container {
      circle {
        fill: rgb(var(--color-foreground));
      }
    }

    .name {
      color: rgb(var(--color-foreground));
      font-size: var(--text-size-h5);
      margin-bottom: 16px;
    }

    p.address {
      position: relative;
      display: inline-block;
      margin-bottom: 6px;
      z-index: 2;
    }

    .sc-contact {
      margin-bottom: 14px;
    }

    br {
      display: none;
    }

    .hours {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      grid-auto-flow: row;
      row-gap: 10px;
      
      p {
        margin: 0;
        font-size: var(--text-size-tiny);
      }
      
      p:nth-of-type(odd) {
        text-align: left;
      }
      
      p:nth-of-type(even) {
        text-align: right;
      }
    }

    .sl-directions-toggle,.sl-directions {
      display: none;
    }
  }

  .sl-map {
    .gm-style-iw-c {
      border-radius: 0;
      box-shadow: unset;
    }

    .gm-style-iw {
      padding: 0;

      .image-wrapper {
        margin-bottom: 17px;

        img {
          max-width: 160px;
          height: auto;
        }
      }

      .gm-style-iw-chr {
        display: none;
      }

      .gm-style-iw-d {
        padding: 10px;
        overflow: auto !important;
      }
    }

  }
}

.pac-container {
  display: none;
}
