/* Map widget (assets/map.js). Colours come in as CSS variables from the widget's style settings. */
.ndet-map { position: relative; width: 100%; height: var(--ndet-map-h, 460px); border-radius: var(--ndet-map-radius, 16px); overflow: hidden; background: var(--ndet-map-land, #ECE5D9); isolation: isolate; box-shadow: inset 0 0 0 1px rgba(35, 31, 32, .08); }
.ndet-map-fill-yes { flex-grow: 1; display: flex; flex-direction: column; }
.ndet-map-fill-yes > .elementor-widget-container { flex: 1 1 auto; display: flex; flex-direction: column; }
.ndet-map-fill-yes .ndet-map { height: auto; min-height: var(--ndet-map-h, 460px); flex: 1 1 auto; }
.ndet-map__canvas, .ndet-map .ndet-map__canvas.maplibregl-map { position: absolute; inset: 0; border-radius: inherit; overflow: hidden; }
.ndet-map .maplibregl-ctrl-group { background: #FFFDF8; border-radius: 10px; box-shadow: 0 2px 10px rgba(35, 31, 32, .12); overflow: hidden; }
.ndet-map .maplibregl-ctrl-group button { width: 34px; height: 34px; }
.ndet-map .maplibregl-ctrl-attrib { background: rgba(255, 253, 248, .85); font: 11px/1.4 var(--e-global-typography-text-font-family, sans-serif), sans-serif; color: #6B6259; }
.ndet-map .maplibregl-ctrl-attrib a { color: #6B6259; }
.ndet-map .maplibregl-cooperative-gesture-screen { font-family: var(--e-global-typography-text-font-family, sans-serif), sans-serif; background: rgba(26, 22, 23, .6); }

/* Pins. */
.ndet-map__pin { display: flex; align-items: center; gap: 10px; text-decoration: none; cursor: pointer; }
div.ndet-map__pin { cursor: default; }
.ndet-map__dot { width: 22px; height: 22px; border-radius: 50%; background: var(--ndet-map-pin, #55602A); border: 4px solid #FFFDF8; box-shadow: 0 0 0 6px rgba(35, 31, 32, .12), 0 4px 10px rgba(35, 31, 32, .25); flex: none; box-sizing: border-box; }
@supports (color: color-mix(in srgb, red 50%, blue)) {
	.ndet-map__dot { box-shadow: 0 0 0 6px color-mix(in srgb, var(--ndet-map-pin, #55602A) 22%, transparent), 0 4px 10px rgba(35, 31, 32, .25); }
	.ndet-map__pin--town .ndet-map__dot { box-shadow: 0 0 0 6px color-mix(in srgb, var(--ndet-map-town, #231F20) 14%, transparent), 0 4px 10px rgba(35, 31, 32, .25); }
}
.ndet-map__tag { display: flex; flex-direction: column; background: var(--ndet-map-tag-bg, #1A1617); color: var(--ndet-map-tag-color, #F7F4EE); padding: 8px 14px; border-radius: 10px; font-family: var(--e-global-typography-text-font-family, inherit), sans-serif; font-size: 14px; line-height: 1.25; box-shadow: 0 6px 18px rgba(26, 22, 23, .25); white-space: nowrap; }
.ndet-map__tag strong { font-weight: 600; }
.ndet-map__tag span { font-weight: 400; font-size: 12.5px; color: var(--ndet-map-tag-sub, #C9A54C); }
a.ndet-map__pin:hover .ndet-map__tag, a.ndet-map__pin:focus-visible .ndet-map__tag { filter: brightness(1.15); }
.ndet-map__pin--left { flex-direction: row-reverse; }
.ndet-map__pin--above { flex-direction: column-reverse; gap: 8px; }
.ndet-map__pin--below { flex-direction: column; gap: 8px; }
.ndet-map__pin--town .ndet-map__dot { background: var(--ndet-map-town, #231F20); }
.ndet-map__pin--town .ndet-map__tag { background: #FFFDF8; color: var(--ndet-map-town, #231F20); box-shadow: 0 6px 18px rgba(26, 22, 23, .16); }
.ndet-map__pin--dot .ndet-map__dot { width: 14px; height: 14px; border-width: 3px; box-shadow: 0 2px 6px rgba(35, 31, 32, .25); }
.ndet-map__pin--nearest .ndet-map__dot { transform: scale(1.25); }

/* Nearest showroom box (town pages). */
.ndet-map__card { position: absolute; left: 16px; bottom: 16px; z-index: 2; max-width: 380px; background: var(--ndet-map-card-bg, #FFFDF8); border-radius: 14px; padding: 16px 18px 18px; box-shadow: 0 8px 24px rgba(26, 22, 23, .16); font-family: var(--e-global-typography-text-font-family, inherit), sans-serif; color: var(--ndet-map-card-text, #6B6259); }
.ndet-map__eyebrow { display: block; font-size: 13px; line-height: 1.3; color: var(--ndet-map-card-eyebrow, #7A5F22); }
.ndet-map__to { display: block; margin: 4px 0 2px; font-family: var(--e-global-typography-primary-font-family, inherit), serif; font-size: 22px; font-weight: 500; line-height: 1.2; color: var(--ndet-map-card-title, #231F20); }
.ndet-map__far { display: block; font-size: 14px; line-height: 1.4; }
.ndet-map__links { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; margin-top: 14px; }
.ndet-map__links + .ndet-map__far { margin-top: 12px; }
.ndet-map__links a, .ndet-map__group a { display: inline-flex; align-items: center; gap: 6px; }
.ndet-map__icon { width: 1em; height: 1em; flex: none; }
.ndet-map__group { display: flex; flex-direction: column; align-items: flex-start; margin-top: 14px; padding-top: 12px; border-top: 1px solid rgba(35, 31, 32, .12); }
.ndet-map__group .ndet-map__visit { margin-bottom: 4px; }
.ndet-map a.ndet-map__go { white-space: nowrap; background: var(--ndet-map-btn-bg, #55602A); color: var(--ndet-map-btn-color, #FFFDF8); padding: 9px 14px; border-radius: 8px; font-size: 14px; font-weight: 600; text-decoration: none; }
.ndet-map a.ndet-map__go:hover, .ndet-map a.ndet-map__go:focus-visible { filter: brightness(.9); color: var(--ndet-map-btn-color, #FFFDF8); }
.ndet-map a.ndet-map__visit { color: var(--ndet-map-link, #231F20); font-size: 14px; font-weight: 600; text-decoration: none; }
.ndet-map a.ndet-map__visit:hover { color: var(--ndet-map-link, #231F20); text-decoration: underline; }

/* The places as a list: for screen readers, and on screen when the map can't be drawn. */
.ndet-map__places { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.ndet-map--failed { display: flex; flex-direction: column; justify-content: flex-start; height: auto; min-height: 0; padding: 20px; gap: 16px; box-shadow: inset 0 0 0 1px rgba(35, 31, 32, .12); }
.ndet-map--failed .ndet-map__card { position: static; max-width: none; box-shadow: none; padding: 0; background: transparent; }
.ndet-map--failed .ndet-map__places { position: static; width: auto; height: auto; margin: 0; padding: 0 0 0 1.2em; overflow: visible; clip: auto; white-space: normal; }
.ndet-map--failed .ndet-map__card + .ndet-map__places { display: none; }
.ndet-map--failed:not(:has(li, .ndet-map__card)) { display: none; }

/* Editor notes. */
.ndet-map-note { padding: 16px 18px; border: 1px dashed rgba(35, 31, 32, .35); border-radius: 10px; font-size: 14px; line-height: 1.4; color: #3B3536; background: #FFFDF8; }
.ndet-map-note--over { position: absolute; top: 12px; left: 12px; right: 60px; z-index: 3; padding: 8px 12px; font-size: 12px; border-style: solid; opacity: .92; }

@media (max-width: 767px) {
	/* Phones: the box sits over the bottom of the map, so the map gets taller and the box smaller. */
	.ndet-map:has(.ndet-map__card), .ndet-map-fill-yes .ndet-map:has(.ndet-map__card) { min-height: max(var(--ndet-map-h, 320px), 600px); }
	.ndet-map:has(.ndet-map__card) .maplibregl-ctrl-top-right { display: none; }
	.ndet-map:has(.ndet-map__card) .maplibregl-ctrl-bottom-right { top: 0; bottom: auto; } /* the box covers the bottom: credits go to the free top corner */
	.ndet-map__card { left: 10px; right: 10px; bottom: 10px; max-width: none; padding: 12px 14px 14px; border-radius: 12px; }
	.ndet-map__eyebrow { font-size: 12px; }
	.ndet-map__to { margin: 2px 0 0; font-size: 18px; }
	.ndet-map__far { font-size: 13px; line-height: 1.35; }
	.ndet-map__links { gap: 8px 14px; margin-top: 10px; }
	.ndet-map a.ndet-map__go { padding: 7px 11px; font-size: 13px; border-radius: 7px; }
	.ndet-map a.ndet-map__visit { font-size: 13px; }
	.ndet-map__links + .ndet-map__far { margin-top: 8px; }
	.ndet-map__group { margin-top: 10px; padding-top: 9px; }
}
