/*
 * HNJWEB Locatiekaart compatibility boundary.
 * Leaflet keeps its own standard pane/control z-index values, but those values are
 * isolated inside this plugin's stacking context so they cannot escape above page
 * headers, menus, popups, modals, off-canvas panels or other site overlays.
 */
.hnjweb-locatiekaart-wrap,
.hnjweb-standalone-list {
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    min-width: 0;
}
.hnjweb-locatiekaart-wrap {
    position: relative;
    isolation: isolate;
}
.hnjweb-locatiekaart-wrap .hnjweb-locatiekaart {
    position: relative;
    isolation: isolate;
    max-width: 100%;
}
.hnjweb-locatiekaart-wrap .leaflet-container {
    max-width: 100%;
}

.hnjweb-locatiekaart-wrap {
    width: 100%;
    margin: 24px 0;
}
.hnjweb-map-layout {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 24px;
    width: 100%;
    max-width: 100%;
    min-width: 0;
}
.hnjweb-list-position-right .hnjweb-location-list { order: 2; }
.hnjweb-list-position-right .hnjweb-map-panel { order: 1; }
.hnjweb-list-position-above .hnjweb-map-layout,
.hnjweb-list-position-below .hnjweb-map-layout { flex-direction: column; }
.hnjweb-list-position-below .hnjweb-location-list { order: 2; }
.hnjweb-list-position-below .hnjweb-map-panel { order: 1; }
.hnjweb-map-panel { flex: 1 1 480px; width: 100%; max-width: 100%; min-width: 0; }
.hnjweb-location-list {
    flex: 0 1 250px;
    width: 250px;
    max-width: 100%;
    min-width: 210px;
    line-height: var(--hnjweb-list-line-height, 1.35);
}
.hnjweb-list-font-family-custom .hnjweb-location-list {
    font-family: var(--hnjweb-list-font-family);
}
.hnjweb-list-font-size-desktop-custom .hnjweb-location-list {
    font-size: var(--hnjweb-list-font-size-desktop);
}
.hnjweb-list-font-weight-custom .hnjweb-location-list {
    font-weight: var(--hnjweb-list-font-weight);
}
.hnjweb-list-position-above .hnjweb-location-list,
.hnjweb-list-position-below .hnjweb-location-list,
.hnjweb-standalone-list .hnjweb-location-list {
    flex-basis: auto;
    width: 100%;
}
.hnjweb-location-list-title {
    margin: 0 0 var(--hnjweb-list-title-spacing, 12px);
    line-height: 1.25;
}
.hnjweb-list-title-font-family-custom .hnjweb-location-list-title {
    font-family: var(--hnjweb-list-title-font-family);
}
.hnjweb-list-title-font-size-desktop-custom .hnjweb-location-list-title {
    font-size: var(--hnjweb-list-title-font-size-desktop);
}
.hnjweb-list-title-font-weight-custom .hnjweb-location-list-title {
    font-weight: var(--hnjweb-list-title-font-weight);
}
.hnjweb-list-title-color-custom .hnjweb-location-list-title {
    color: var(--hnjweb-list-title-color);
}
.hnjweb-location-list ul {
    list-style: none;
    margin: 0;
    padding: 0;
    column-count: var(--hnjweb-list-columns, 1);
    column-gap: 24px;
}
.hnjweb-location-list li {
    margin: 0 0 var(--hnjweb-list-item-spacing, 0px);
    padding: 0;
    break-inside: avoid;
}
.hnjweb-location-list li:last-child { margin-bottom: 0; }
.hnjweb-location-link,
.hnjweb-location-list a,
.hnjweb-location-list span {
    display: block;
    width: 100%;
    box-sizing: border-box;
    padding: 7px 10px;
    border: 0;
    background: transparent;
    color: inherit;
    text-align: left;
    text-decoration: none;
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
}
.hnjweb-location-link {
    cursor: pointer;
    color: var(--hnjweb-list-text-color, #0645ad);
    -webkit-appearance: none;
    appearance: none;
    min-height: 0;
    border-radius: 0;
    box-shadow: none;
    text-transform: none;
    letter-spacing: normal;
}
.hnjweb-location-list a,
.hnjweb-location-list span {
    color: var(--hnjweb-list-text-color, inherit);
}
.hnjweb-location-link:hover,
.hnjweb-location-link:focus,
.hnjweb-location-list a:hover,
.hnjweb-location-list a:focus {
    background: var(--hnjweb-list-active-background, #e7e7e7);
    color: var(--hnjweb-list-hover-color, #8b1a10);
    outline: none;
}
.hnjweb-location-link.is-active {
    background: var(--hnjweb-list-active-background, #e7e7e7);
    color: var(--hnjweb-list-active-color, #8b1a10);
    outline: none;
}
.hnjweb-location-link:focus-visible,
.hnjweb-location-list a:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}
.hnjweb-locatiekaart {
    width: 100%;
    height: var(--hnjweb-map-height-desktop, 520px);
    min-height: 280px;
    border-radius: 14px;
    overflow: hidden;
    border: 1px solid #ddd;
    background: #f5f5f5;
}
.hnjweb-map-style-grayscale .leaflet-tile { filter: grayscale(100%); }
.hnjweb-marker span {
    display: block;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    border: 3px solid #fff;
    box-shadow: 0 2px 8px rgba(0,0,0,.35);
}
.hnjweb-popup {
    width: min(var(--hnjweb-popup-max-width, 260px), 72vw);
    max-width: 100%;
    max-height: var(--hnjweb-popup-max-height, none);
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
}
.hnjweb-popup-place { margin: 0 0 3px; font-weight: 600; line-height: 1.2; color: var(--hnjweb-details-place-color, inherit); }
.hnjweb-popup h3 { margin: 0 0 8px; font-size: 17px; }
.hnjweb-popup p { margin: 8px 0; }
.hnjweb-popup-content p:first-child { margin-top: 0; }
.hnjweb-locatiekaart-empty { padding: 12px 0; color: #666; }
@media (max-width: 1024px) {
    .hnjweb-locatiekaart { height: var(--hnjweb-map-height-tablet, 460px); }
    .hnjweb-list-font-size-tablet-custom .hnjweb-location-list { font-size: var(--hnjweb-list-font-size-tablet); }
    .hnjweb-list-title-font-size-tablet-custom .hnjweb-location-list-title { font-size: var(--hnjweb-list-title-font-size-tablet); }
}
@media (max-width: 767px) {
    .hnjweb-map-layout { flex-direction: column; }
    .hnjweb-list-position-below .hnjweb-location-list { order: 2; }
    .hnjweb-list-position-below .hnjweb-map-panel { order: 1; }
    .hnjweb-location-list { width: 100%; min-width: 0; flex-basis: auto; }
    .hnjweb-list-font-size-mobile-custom .hnjweb-location-list { font-size: var(--hnjweb-list-font-size-mobile); }
    .hnjweb-list-title-font-size-mobile-custom .hnjweb-location-list-title { font-size: var(--hnjweb-list-title-font-size-mobile); }
    .hnjweb-location-list ul { column-count: 1; }
}
@media (max-width: 640px) {
    .hnjweb-locatiekaart { height: var(--hnjweb-map-height-mobile, 360px); }
}

.hnjweb-location-details {
    display: none;
    box-sizing: border-box;
    width: 100%;
    margin-top: 24px;
    padding: var(--hnjweb-details-padding-desktop, 24px);
    border: 1px solid var(--hnjweb-details-border-color, #ddd);
    border-radius: var(--hnjweb-details-border-radius, 12px);
    background: var(--hnjweb-details-background-color, #fff);
    color: var(--hnjweb-details-text-color, inherit);
    line-height: var(--hnjweb-details-line-height, 1.55);
    box-shadow: 0 4px 18px rgba(0,0,0,.06);
}
.hnjweb-location-details.is-visible { display: block; }
.hnjweb-details-font-family-custom .hnjweb-location-details,
.hnjweb-details-font-family-custom .hnjweb-detail-description,
.hnjweb-details-font-family-custom .hnjweb-detail-description p,
.hnjweb-details-font-family-custom .hnjweb-detail-field,
.hnjweb-details-font-family-custom .hnjweb-detail-field * {
    font-family: var(--hnjweb-details-font-family);
}
.hnjweb-details-font-size-desktop-custom .hnjweb-location-details,
.hnjweb-details-font-size-desktop-custom .hnjweb-detail-description,
.hnjweb-details-font-size-desktop-custom .hnjweb-detail-description p,
.hnjweb-details-font-size-desktop-custom .hnjweb-detail-field,
.hnjweb-details-font-size-desktop-custom .hnjweb-detail-field * {
    font-size: var(--hnjweb-details-font-size-desktop);
}
.hnjweb-location-details-inner {
    display: block;
    width: 100%;
}
.hnjweb-location-details-content {
    width: 100%;
    min-width: 0;
    max-width: none;
}
.hnjweb-location-details-place {
    margin: 0 0 4px;
    color: var(--hnjweb-details-place-color, inherit);
    line-height: 1.25;
}
.hnjweb-details-place-font-family-custom .hnjweb-location-details-place,
.hnjweb-details-place-font-family-custom .hnjweb-popup-place { font-family: var(--hnjweb-details-place-font-family); }
.hnjweb-details-place-font-size-desktop-custom .hnjweb-location-details-place,
.hnjweb-details-place-font-size-desktop-custom .hnjweb-popup-place { font-size: var(--hnjweb-details-place-font-size-desktop); }
.hnjweb-details-place-font-weight-custom .hnjweb-location-details-place,
.hnjweb-details-place-font-weight-custom .hnjweb-popup-place { font-weight: var(--hnjweb-details-place-font-weight); }
.hnjweb-location-details-content h2 {
    margin: 0 0 18px;
    color: var(--hnjweb-details-title-color, inherit);
    line-height: 1.25;
}
.hnjweb-location-details-image {
    width: 100%;
    margin-top: 18px;
}
.hnjweb-location-details-image img {
    display: block;
    width: auto;
    height: auto;
    max-width: min(100%, var(--hnjweb-details-image-max-width, 640px));
    max-height: var(--hnjweb-details-image-max-height, none);
    border-radius: var(--hnjweb-details-image-border-radius, 10px);
}
.hnjweb-details-title-font-family-custom .hnjweb-location-details-content h2 { font-family: var(--hnjweb-details-title-font-family); }
.hnjweb-details-title-font-size-desktop-custom .hnjweb-location-details-content h2 { font-size: var(--hnjweb-details-title-font-size-desktop); }
.hnjweb-details-title-font-weight-custom .hnjweb-location-details-content h2 { font-weight: var(--hnjweb-details-title-font-weight); }
.hnjweb-detail-field { margin: 0 0 16px; }
.hnjweb-detail-field > strong {
    display: block;
    margin-bottom: 3px;
    color: var(--hnjweb-details-label-color, inherit);
}
.hnjweb-details-label-font-weight-custom .hnjweb-detail-field > strong { font-weight: var(--hnjweb-details-label-font-weight); }
.hnjweb-detail-description { margin: 0 0 16px; }
.hnjweb-detail-description p:first-child { margin-top: 0; }
.hnjweb-detail-description p:last-child { margin-bottom: 0; }
.hnjweb-location-details a { color: var(--hnjweb-details-link-color, inherit); }
.hnjweb-location-details a:hover,
.hnjweb-location-details a:focus { color: var(--hnjweb-details-link-hover-color, var(--hnjweb-details-link-color, inherit)); }
.hnjweb-location-details a:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
@media (max-width: 1024px) {
    .hnjweb-details-font-size-tablet-custom .hnjweb-location-details,
    .hnjweb-details-font-size-tablet-custom .hnjweb-detail-description,
    .hnjweb-details-font-size-tablet-custom .hnjweb-detail-description p,
    .hnjweb-details-font-size-tablet-custom .hnjweb-detail-field,
    .hnjweb-details-font-size-tablet-custom .hnjweb-detail-field * { font-size: var(--hnjweb-details-font-size-tablet); }
    .hnjweb-details-place-font-size-tablet-custom .hnjweb-location-details-place,
    .hnjweb-details-place-font-size-tablet-custom .hnjweb-popup-place { font-size: var(--hnjweb-details-place-font-size-tablet); }
    .hnjweb-details-title-font-size-tablet-custom .hnjweb-location-details-content h2 { font-size: var(--hnjweb-details-title-font-size-tablet); }
}
@media (max-width: 640px) {
    .hnjweb-location-details { padding: var(--hnjweb-details-padding-mobile, 18px); }
    .hnjweb-details-font-size-mobile-custom .hnjweb-location-details,
    .hnjweb-details-font-size-mobile-custom .hnjweb-detail-description,
    .hnjweb-details-font-size-mobile-custom .hnjweb-detail-description p,
    .hnjweb-details-font-size-mobile-custom .hnjweb-detail-field,
    .hnjweb-details-font-size-mobile-custom .hnjweb-detail-field * { font-size: var(--hnjweb-details-font-size-mobile); }
    .hnjweb-details-place-font-size-mobile-custom .hnjweb-location-details-place,
    .hnjweb-details-place-font-size-mobile-custom .hnjweb-popup-place { font-size: var(--hnjweb-details-place-font-size-mobile); }
    .hnjweb-details-title-font-size-mobile-custom .hnjweb-location-details-content h2 { font-size: var(--hnjweb-details-title-font-size-mobile); }
}

/* Actieve marker */
.hnjweb-marker { background: transparent; border: 0; }
.hnjweb-marker span { display:block; width:100%; height:100%; border:3px solid #fff; border-radius:50%; box-sizing:border-box; box-shadow:0 2px 7px rgba(0,0,0,.35); transition:transform .18s ease, box-shadow .18s ease; }
.hnjweb-marker.is-active span { box-shadow:0 3px 12px rgba(0,0,0,.5); transform:scale(1.04); }

/* Ingebouwde SVG marker-iconen */
.hnjweb-marker { background: transparent; border: 0; }
.hnjweb-marker span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    filter: drop-shadow(0 2px 3px rgba(0,0,0,.38));
    transition: transform .18s ease, filter .18s ease;
}
.hnjweb-marker svg { display:block; width:100%; height:100%; overflow:visible; }
.hnjweb-marker-circle span {
    border: 3px solid var(--hnjweb-marker-border, #fff);
    border-radius: 50%;
    box-sizing: border-box;
}
.hnjweb-marker-circle svg { width:72%; height:72%; }
.hnjweb-marker.is-active span {
    transform: scale(1.08);
    filter: drop-shadow(0 3px 5px rgba(0,0,0,.55));
}

/* Explicit plugin typography settings outrank normal theme typography without !important. */
.hnjweb-locatiekaart-wrap.hnjweb-list-font-family-custom .hnjweb-location-list,
.hnjweb-standalone-list.hnjweb-list-font-family-custom .hnjweb-location-list { font-family: var(--hnjweb-list-font-family); }
.hnjweb-locatiekaart-wrap.hnjweb-list-font-size-desktop-custom .hnjweb-location-list,
.hnjweb-standalone-list.hnjweb-list-font-size-desktop-custom .hnjweb-location-list { font-size: var(--hnjweb-list-font-size-desktop); }
.hnjweb-locatiekaart-wrap.hnjweb-list-font-weight-custom .hnjweb-location-list,
.hnjweb-standalone-list.hnjweb-list-font-weight-custom .hnjweb-location-list { font-weight: var(--hnjweb-list-font-weight); }
.hnjweb-locatiekaart-wrap.hnjweb-list-title-font-family-custom .hnjweb-location-list-title,
.hnjweb-standalone-list.hnjweb-list-title-font-family-custom .hnjweb-location-list-title { font-family: var(--hnjweb-list-title-font-family); }
.hnjweb-locatiekaart-wrap.hnjweb-list-title-font-size-desktop-custom .hnjweb-location-list-title,
.hnjweb-standalone-list.hnjweb-list-title-font-size-desktop-custom .hnjweb-location-list-title { font-size: var(--hnjweb-list-title-font-size-desktop); }
.hnjweb-locatiekaart-wrap.hnjweb-list-title-font-weight-custom .hnjweb-location-list-title,
.hnjweb-standalone-list.hnjweb-list-title-font-weight-custom .hnjweb-location-list-title { font-weight: var(--hnjweb-list-title-font-weight); }
.hnjweb-locatiekaart-wrap.hnjweb-list-title-color-custom .hnjweb-location-list-title,
.hnjweb-standalone-list.hnjweb-list-title-color-custom .hnjweb-location-list-title { color: var(--hnjweb-list-title-color); }
.hnjweb-locatiekaart-wrap.hnjweb-details-place-font-family-custom .hnjweb-location-details-place,
.hnjweb-details-place-font-family-custom .hnjweb-popup-place { font-family: var(--hnjweb-details-place-font-family); }
.hnjweb-locatiekaart-wrap.hnjweb-details-place-font-size-desktop-custom .hnjweb-location-details-place,
.hnjweb-details-place-font-size-desktop-custom .hnjweb-popup-place { font-size: var(--hnjweb-details-place-font-size-desktop); }
.hnjweb-locatiekaart-wrap.hnjweb-details-place-font-weight-custom .hnjweb-location-details-place,
.hnjweb-details-place-font-weight-custom .hnjweb-popup-place { font-weight: var(--hnjweb-details-place-font-weight); }
.hnjweb-locatiekaart-wrap.hnjweb-details-font-family-custom .hnjweb-location-details,
.hnjweb-locatiekaart-wrap.hnjweb-details-font-family-custom .hnjweb-detail-description,
.hnjweb-locatiekaart-wrap.hnjweb-details-font-family-custom .hnjweb-detail-description p,
.hnjweb-locatiekaart-wrap.hnjweb-details-font-family-custom .hnjweb-detail-field,
.hnjweb-locatiekaart-wrap.hnjweb-details-font-family-custom .hnjweb-detail-field * { font-family: var(--hnjweb-details-font-family); }
.hnjweb-locatiekaart-wrap.hnjweb-details-font-size-desktop-custom .hnjweb-location-details,
.hnjweb-locatiekaart-wrap.hnjweb-details-font-size-desktop-custom .hnjweb-detail-description,
.hnjweb-locatiekaart-wrap.hnjweb-details-font-size-desktop-custom .hnjweb-detail-description p,
.hnjweb-locatiekaart-wrap.hnjweb-details-font-size-desktop-custom .hnjweb-detail-field,
.hnjweb-locatiekaart-wrap.hnjweb-details-font-size-desktop-custom .hnjweb-detail-field * { font-size: var(--hnjweb-details-font-size-desktop); }
.hnjweb-locatiekaart-wrap.hnjweb-details-title-font-family-custom .hnjweb-location-details-content h2 { font-family: var(--hnjweb-details-title-font-family); }
.hnjweb-locatiekaart-wrap.hnjweb-details-title-font-size-desktop-custom .hnjweb-location-details-content h2 { font-size: var(--hnjweb-details-title-font-size-desktop); }
.hnjweb-locatiekaart-wrap.hnjweb-details-title-font-weight-custom .hnjweb-location-details-content h2 { font-weight: var(--hnjweb-details-title-font-weight); }
.hnjweb-locatiekaart-wrap.hnjweb-details-label-font-weight-custom .hnjweb-detail-field > strong { font-weight: var(--hnjweb-details-label-font-weight); }
@media (max-width: 1024px) {
    .hnjweb-locatiekaart-wrap.hnjweb-list-font-size-tablet-custom .hnjweb-location-list,
    .hnjweb-standalone-list.hnjweb-list-font-size-tablet-custom .hnjweb-location-list { font-size: var(--hnjweb-list-font-size-tablet); }
    .hnjweb-locatiekaart-wrap.hnjweb-list-title-font-size-tablet-custom .hnjweb-location-list-title,
    .hnjweb-standalone-list.hnjweb-list-title-font-size-tablet-custom .hnjweb-location-list-title { font-size: var(--hnjweb-list-title-font-size-tablet); }
    .hnjweb-locatiekaart-wrap.hnjweb-details-place-font-size-tablet-custom .hnjweb-location-details-place,
    .hnjweb-details-place-font-size-tablet-custom .hnjweb-popup-place { font-size: var(--hnjweb-details-place-font-size-tablet); }
    .hnjweb-locatiekaart-wrap.hnjweb-details-font-size-tablet-custom .hnjweb-location-details,
    .hnjweb-locatiekaart-wrap.hnjweb-details-font-size-tablet-custom .hnjweb-detail-description,
    .hnjweb-locatiekaart-wrap.hnjweb-details-font-size-tablet-custom .hnjweb-detail-description p,
    .hnjweb-locatiekaart-wrap.hnjweb-details-font-size-tablet-custom .hnjweb-detail-field,
    .hnjweb-locatiekaart-wrap.hnjweb-details-font-size-tablet-custom .hnjweb-detail-field * { font-size: var(--hnjweb-details-font-size-tablet); }
    .hnjweb-locatiekaart-wrap.hnjweb-details-title-font-size-tablet-custom .hnjweb-location-details-content h2 { font-size: var(--hnjweb-details-title-font-size-tablet); }
}
@media (max-width: 767px) {
    .hnjweb-locatiekaart-wrap.hnjweb-list-font-size-mobile-custom .hnjweb-location-list,
    .hnjweb-standalone-list.hnjweb-list-font-size-mobile-custom .hnjweb-location-list { font-size: var(--hnjweb-list-font-size-mobile); }
    .hnjweb-locatiekaart-wrap.hnjweb-list-title-font-size-mobile-custom .hnjweb-location-list-title,
    .hnjweb-standalone-list.hnjweb-list-title-font-size-mobile-custom .hnjweb-location-list-title { font-size: var(--hnjweb-list-title-font-size-mobile); }
}
@media (max-width: 640px) {
    .hnjweb-locatiekaart-wrap.hnjweb-details-place-font-size-mobile-custom .hnjweb-location-details-place,
    .hnjweb-details-place-font-size-mobile-custom .hnjweb-popup-place { font-size: var(--hnjweb-details-place-font-size-mobile); }
    .hnjweb-locatiekaart-wrap.hnjweb-details-font-size-mobile-custom .hnjweb-location-details,
    .hnjweb-locatiekaart-wrap.hnjweb-details-font-size-mobile-custom .hnjweb-detail-description,
    .hnjweb-locatiekaart-wrap.hnjweb-details-font-size-mobile-custom .hnjweb-detail-description p,
    .hnjweb-locatiekaart-wrap.hnjweb-details-font-size-mobile-custom .hnjweb-detail-field,
    .hnjweb-locatiekaart-wrap.hnjweb-details-font-size-mobile-custom .hnjweb-detail-field * { font-size: var(--hnjweb-details-font-size-mobile); }
    .hnjweb-locatiekaart-wrap.hnjweb-details-title-font-size-mobile-custom .hnjweb-location-details-content h2 { font-size: var(--hnjweb-details-title-font-size-mobile); }
}
