/* =====================================================================================================
   THE MAP'S FRAME, for LocationMap (Maps/LocationMap.razor). SHARED by the portal and the ERP: each app links
   _content/NexStack.Shared.Web/css/maps.css BEFORE its own stylesheet, as it does pills.css.

   A border and rounded corners like the portal's panels (.card) — 2026-10-22, Dave: "a border and rounded corners in
   the control sort of like our other panels". Before this a map's square edge ran straight into the page.

   ONE SPOT, the pills.css rule: each setting defaults to the portal's own variable when the page has it, else to the
   portal's value, so the ERP gets the same frame without defining the portal's variables.
   ===================================================================================================== */

:root {
    --map-border: var(--border, #e2e6ee);
    --map-radius: var(--radius, 10px);
}

/* overflow: hidden is what rounds the MAP and not just the border — Google draws its tiles square to the corner. */
.location-map {
    border: 1px solid var(--map-border);
    border-radius: var(--map-radius);
    overflow: hidden;
    box-sizing: border-box;
}