:root {
    --apivia-text-color: rgb(10, 45, 130);
    --apivia-border-color: rgb(10, 45, 130);
    --apivia-bloc-bg-color: #e8edf0;
    --apivia-bloc-bg-highligted-color: #cee1ed;
    --apivia-bloc-border-color: #e8edf0;
    --apivia-margin: 10px;
    --apivia-border-radius: .25rem;
    --asl-mrk-infobox-clr: rgb(10, 45, 130);
    --apivia-btn-font-size: .7rem;

}

@media (max-width: 767px) {
    :root {
        --apivia-btn-font-size: 1rem;
    }
}

/* https://agilestorelocator.com/wiki/google-advanced-markers/ */
.asl-cont .asl-adv-mkr .asl-mrk-weather-icon {
    --asl-mrk-infobox-clr: rgb(10, 45, 130);
    border-color: var(--asl-mrk-infobox-clr);
    background-color: var(--asl-mrk-infobox-clr);
}

.asl-cont .sl-container {
    max-width: var(--content-width);
}

#asl-storelocator.asl-cont.asl-template-3 {

    .asl-map-canv {
        border-radius: var(--apivia-border-radius);
    }

    .sl-main-cont {

        box-shadow: none;
        border-radius: unset;
        padding-top: 1rem;

        .asl-panel {
            border: none;
            background-color: #fff;
        }

        .asl-map {
            padding-left: 2rem;
        }

        .sl-desc {
            display: none;
            p {
                color: #555d66 !important;
                font-size: 13px !important;
            }
        }

        .sl-filter-sec {
            margin-top: var(--apivia-margin);
            margin-bottom: var(--apivia-margin);
        }

        .asl-search-address {
            width: 100%;
        }

        .sl-search-btn {
            width: 100%;
            display: block;
            position: static !important;
            margin-top: var(--apivia-margin);
            margin-bottom: var(--apivia-margin);
            border: 1px solid var(--apivia-border-color);
            border-radius: var(--apivia-border-radius);
            color: var(--apivia-text-color);
            background-color: white;

        }

        .btn.apivia-btn-comparator {
            width: 100%;
            padding: 0.25rem !important;
            border-radius: var(--apivia-border-radius);
            font-size: var(--apivia-btn-font-size);
        }

        .asl-search-clr {
            display: none;
        }

        .form-control {
            border: 1px solid var(--apivia-border-color);
        }

        .asl-panel-inner {
            padding-left:  var(--apivia-margin);
            padding-right:  var(--apivia-margin);

            h3 {
                font-size: 1.2rem !important;
                font-weight: 700;
                color: var(--apivia-text-color);
            }

            .sl-main-cont-box {
                ul.sl-list {
                    li.sl-item {
                        border: var(--apivia-bloc-border-color) solid 1px;
                        margin-bottom:  var(--apivia-margin);
                        background-color:  var(--apivia-bloc-bg-color)  ;
                        border-radius: var(--apivia-border-radius);

                        cursor: pointer;
                    }
                    li.sl-item:hover {
                        border: var(--apivia-border-color) solid 1px;
                    }

                    li.sl-item.highlighted {
                        border: var(--apivia-border-color) solid 1px;
                        background-color: var(--apivia-bloc-bg-highligted-color);
                    }
                }
            }
        }
    }
}

#asl-storelocator.asl-cont .agile-modal-content .btn.btn-default {
    text-transform: inherit;
}

[id=asl-geolocation-agile-modal] {
    h2 {
        font-weight: 400;
        font-size: 1rem !important;
    }
}