.store-locator {
    & .section_inner {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        
        & h2 {
            font-size: 5rem;
            font-weight: 400;
            text-align: center;

            @media (max-width: 991px) {
                font-size: 3rem;
            }
        }
        
        /* SEARCH */
        & .store-search {
            width: 80rem;
            max-width: 100%;
            margin: 0 auto 2rem;
            position: relative;

            & input {
                width: 100%;
                padding: 18px 24px;
                border-radius: 40px;
                border: 2px solid #623A2D;
                font-size: 17px;
                background:#F8D2B3;
                position: relative;
                z-index: 2;
            }
        }

        /* FEATURE FILTERS */
        & .store-feature-filters {
            display: flex;
            flex-wrap: wrap;
            gap: 1rem;
            justify-content: center;
            margin: 2rem auto 10rem;
            width: 100%;
            max-width: 80rem;

            & .feature-filter-btn {
                padding: 0.8rem 1.8rem;
                border-radius: 40px;
                border: 2px solid #623A2D;
                background: transparent;
                color: #623A2D;
                font-size: 1.4rem;
                cursor: pointer;
                transition: background .2s ease, color .2s ease;

                &:hover {
                    background: #623A2D;
                    color: #fff;
                }

                &.active {
                    background: #623A2D;
                    color: #fff;
                }
            }
        }

        /* LAYOUT */
        & .store-locator-layout {
            width: 100%;
            display: grid;
            grid-template-columns: 50rem 1fr;

            @media (max-width: 991px) {
                grid-template-columns: 1fr;
            }
        }

        /* LIST */
        & .store-list {
            max-height: 70vh;
            overflow-y: auto;
            padding-right: 1rem;
            background: var(--white);

            & .store-card {
                padding: 3rem;
                border-bottom: 1px solid #eee;
                cursor: pointer;
                transition: background .3s ease;

                &:hover {
                    background: #fafafa;
                }

                &.active {
                    border-left: 4px solid #623A2D;
                }

                & h3 {
                    font-size: 1.8rem;
                    font-family: "DM Sans", arial;
                    margin: 0 0 2rem;
                }

                & .address {
                    display: flex;
                    flex-direction: row;
                    align-items: flex-start;
                    margin: 0 0 1rem;
                    gap: 1rem;

                    & svg {
                        width: 3rem;
                        height: 3rem;
                    }

                    & p {
                        font-size: 1.4rem;
                        margin: 0;
                    }
                }

                & .telephone {
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    margin: 0 0 1rem;
                    gap: 1rem;

                    & svg {
                        width: 3rem;
                        height: 3rem;
                    }

                    & p {
                        font-size: 1.4rem;
                        margin: 0;
                    }
                }

                & .opening_hours {
                    display: flex;
                    flex-direction: row;
                    align-items: flex-start;
                    margin: 0 0 2rem;
                    gap: 1rem;

                    & svg {
                        width: 3rem;
                        height: 3rem;
                    }

                    & p {
                        font-size: 1.4rem;
                        margin: 0;
                    }
                }

                &.feature-hidden {
                    display: none;
                }

                & .store-features {
                    margin: 0 0 1.5rem;
                    font-size: 1.4rem;

                    & .store-features__label {
                        font-weight: 600;
                        margin: 0 0 0.4rem;
                    }

                    & .store-features__list {
                        margin: 0;
                        padding: 0 0 0 1.8rem;

                        & li {
                            font-size: 1.4rem;
                            margin: 0;
                        }
                    }
                }

                & .distance {
                    font-size: 1.4rem;
                    display: block;
                    color: #F1722E;
                    font-weight: 600;
                }

                & a {
                    font-size: 1.6rem;
                    border-radius: .5rem;
                    padding: 1rem !important;
                    margin-top: 2rem;

                    &:not(:last-of-type) {
                        margin-right: .5rem;
                    }
                }
            }
        }

        /* MAP */
        & .store-map {
            position: sticky;
            top: 120px;
            height: 70vh;

            & #map {
                width: 100%;
                height: 100%;
                background: #eee;
            }

            @media (max-width: 991px) {
                position: relative;
                height: 400px;
            }
        }
    }
}