/*
	Maps
*/
[data-map] {
    height: 100%;
    width: 100%;
    min-height: 100svw;
}

@media (min-width: 576px) {
    [data-map] {
        min-height: 80vw;
    }
}

@media (min-width: 768px) {
    [data-map] {
        min-height: 60vw;
    }
}

@media (min-width: 1024px) {
    [data-map] {
        min-height: clamp(40rem, 50vw, 50rem);
    }
}
	  
.marker {
	align-items: center;
	background: transparent;
	box-shadow: none;
	outline: none;
	border: none;
	background-image: url('/wp-content/themes/main/images/marker.svg');
	cursor: pointer;
	display: block;
	height: 3.8rem;
	width: 3rem;
}

.maplibregl-popup-content {
    border-radius: 8px;
    box-shadow: 0 12px 32px rgb(15 23 42 / 18%);
    font: 14px/1.4 Inter, ui-sans-serif, system-ui, sans-serif;
    padding: 12px 14px;
    text-align: center;
}

.maplibregl-popup-close-button {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    outline: 0;
    border: 0;
    border-radius: 100%;
    background-color: var(--color-black);
    color: transparent;
    width: 2.5rem;
    height: 2.5rem;
    padding: 0 !important;
    translate: 1rem -1rem;
    transition: .2s;
}

.maplibregl-popup-close-button:hover {
    opacity: 1 !important;
    background-color: var(--color-primary);
}

.maplibregl-popup-close-button::after {
    content: '\eb99';
    color: var(--color-white);

    /* use !important to prevent issues with browser extensions that change fonts */
	font-family: 'remixicon' !important;
	/* font-family: 'icons' !important; */
	speak: never;
	font-size: 2rem;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
    position: absolute;
    top: 50%;
    left: 50%;
    translate: -50% -50%;

	/* Better Font Rendering =========== */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.popup-title {
    display: block;
    font-weight: 700;
    margin-bottom: 4px;
}

.maplibregl-popup-anchor-bottom .maplibregl-popup-tip {
    translate: 0 -0.1rem;
}

.locations-list {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: stretch;
    gap: 0.5rem;
    padding: var(--padding-containers) var(--padding-blocks);
    border-bottom: .1rem solid var(--color-grey-3);
    overflow-x: auto;
}

.locations {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: stretch;
    gap: 1rem;
}

.location {
    width: 100%;
    padding: calc(var(--padding-blocks) / 2);
    background-color: var(--color-white);
    border-radius: 0.5rem;
}

.location-additional-info {
    display: block;
    font-weight: 400;
    padding-top: 1rem;
    margin-top: 1rem;
    border-top: .1rem solid var(--color-grey-1);
}

@media (min-width: 1024px) {
    .locations-list {
        border-bottom: 0;
        border-right: .1rem solid var(--color-grey-3);
    }
}