.elementor-widget-html:has(.mapboxgl-map) {
    /* An auto-width HTML widget collapses inside an Atomic flexbox aligned center.
       Mapbox adds its class before measuring the canvas, so fix the wrapper here.
       Keep specificity low enough for explicit Elementor widths to override it. */
    width: 100%;
    min-width: 0;
    align-self: stretch;
}
.sxmap { position: relative; width: 100%; min-width: 0; height: 420px; overflow: hidden; }
.sxmap > .sxmap-canvas { width: 100%; height: 100%; }
.sxmap > .sxmap-status { position: absolute; inset: auto 12px 40px; margin: 0; padding: 12px 16px; border-radius: 8px; background: #fff; color: #333; font: 14px/1.5 sans-serif; box-shadow: 0 2px 12px #0002; pointer-events: none; }
.sxmap > .sxmap-status[hidden] { display: none; }
.sxmap .sxmap-marker { display: block; max-width: none; height: auto; max-height: 240px; object-fit: contain; }
.sxmap > noscript { position: absolute; inset: 12px; }

/* Use Atomic design tokens first, then classic Elementor global colors. */
.mapboxgl-map {
    --sxmap-accent: var(--accent, var(--e-global-color-accent, var(--e-global-color-primary, #b73318)));
    --sxmap-accent-hover: var(--accent-hover, var(--sxmap-accent));
}
.mapboxgl-map .mapboxgl-ctrl-group > button:is(.mapboxgl-ctrl-zoom-in, .mapboxgl-ctrl-zoom-out) {
    background-color: #fff;
    color: #333;
}
.mapboxgl-map .mapboxgl-ctrl-group > button:is(.mapboxgl-ctrl-zoom-in, .mapboxgl-ctrl-zoom-out):not(:disabled):is(:hover, :focus) {
    background-color: var(--sxmap-accent);
    color: #fff;
}
.mapboxgl-map .mapboxgl-ctrl-group > button:is(.mapboxgl-ctrl-zoom-in, .mapboxgl-ctrl-zoom-out):not(:disabled):active {
    background-color: var(--sxmap-accent-hover);
    color: #fff;
}
.mapboxgl-map .mapboxgl-ctrl-group > button:is(.mapboxgl-ctrl-zoom-in, .mapboxgl-ctrl-zoom-out):not(:disabled):focus-visible {
    outline: 2px solid var(--sxmap-accent);
    outline-offset: 2px;
}
.mapboxgl-map .mapboxgl-ctrl-group > button:is(.mapboxgl-ctrl-zoom-in, .mapboxgl-ctrl-zoom-out):not(:disabled):is(:hover, :focus, :active) > .mapboxgl-ctrl-icon {
    filter: brightness(0) invert(1);
}