.shipment-map {
    position: relative;
    z-index: 0;
    height: 320px;
    overflow: hidden;
    background: #dce8f5;
    border: 1px solid #d4dfec;
    border-radius: 16px;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.7), 0 16px 35px rgba(31,78,132,.12);
}

.shipment-map .leaflet-control-zoom,
.shipment-map .leaflet-control-attribution {
    overflow: hidden;
    border: 0;
    border-radius: 10px;
    box-shadow: 0 8px 24px rgba(20,52,92,.18);
}

.shipment-map .leaflet-control-zoom a {
    color: #1c385c;
    background: rgba(255,255,255,.94);
}

.shipment-map .leaflet-control-attribution {
    padding: 3px 7px;
    color: #6e7f94;
    background: rgba(255,255,255,.88);
    font-size: 10px;
}

.bdn-map-marker-shell { background: transparent; border: 0; }
.bdn-map-marker {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    color: #fff;
    background: linear-gradient(145deg,#258aff,#1265df);
    border: 5px solid rgba(255,255,255,.96);
    border-radius: 50%;
    box-shadow: 0 8px 22px rgba(19,81,166,.36);
    font: 800 13px/1 system-ui,sans-serif;
}
.bdn-map-marker.destination { background: linear-gradient(145deg,#8068ff,#5840dc); }

html.bdn-dark-panels .shipment-map {
    background: #111c2b;
    border-color: #2b3e56;
    box-shadow: 0 18px 40px rgba(0,0,0,.28);
}
html.bdn-dark-panels .shipment-map .leaflet-tile-pane { filter: brightness(.72) saturate(.75) contrast(1.12) hue-rotate(178deg) invert(.88); }
html.bdn-dark-panels .shipment-map .leaflet-control-zoom a { color:#d9e8fb;background:#142238; }
html.bdn-dark-panels .shipment-map .leaflet-control-attribution { color:#a8bad0;background:rgba(15,27,44,.9); }
html.bdn-dark-panels .shipment-map .leaflet-control-attribution a { color:#72aeff; }

@media (max-width:650px) { .shipment-map { height: 230px; } }