/* ===== dr_homes_map_html (HTML form, scoped) =====
   Loaded eagerly from anvil.yaml native_deps.head_html, which is also the only
   route that styles the designer canvas.

   .dr-homes-map is the root rule and stays a bare class, so it outranks the
   scoped reset. The rules that already name .dr-homes-map keep naming it and
   are NOT :where()-wrapped: wrapping a root-anchored selector drops it a class
   and hands the tie to the dependency's runtime-injected sheet.
   Everything else is :where(.dr-homes-map)-scoped, which adds zero specificity
   and so cannot change which rule wins, including inside the two media blocks.

   .dr-map-swatch and .dr-map-hollow tie at (0,2,1) and the hollow swatch
   carries both classes, so their file order decides the background. It is the
   order the style block had.

   .dr-map-tour-number and .dr-map-pharmacy are drawn by L.divIcon inside
   #dr-map, which is inside the root, so the scope still reaches them. Leaflet's
   own popup and control classes are restyled here in dark mode only.

   --dr-accent is the screen's token. The shell declares it; this card only
   reads it, and inherits it from whichever root it is mounted under. */

.dr-homes-map { min-width:0; }
.dr-homes-map h3 { margin:16px 0 8px; font-size:13px; font-weight:600; display:flex; align-items:center; gap:6px; }
:where(.dr-homes-map) .dr-map-controls { display:flex; flex-wrap:wrap; align-items:end; gap:10px; margin-bottom:10px; }
:where(.dr-homes-map) .dr-map-controls label { display:flex; flex-direction:column; gap:5px; font-size:11px; color:var(--px-text-muted); }
:where(.dr-homes-map) #dr-map { height:420px; width:100%; border-radius:8px; border:1px solid var(--px-border); }
:where(.dr-homes-map) .dr-map-note { color:var(--px-text-muted); font-size:11px; margin:8px 0 0; line-height:1.6; }
:where(.dr-homes-map) .dr-map-legend { display:flex; flex-wrap:wrap; gap:14px; margin-top:10px; font-size:11px; color:var(--px-text-muted); }
:where(.dr-homes-map) .dr-map-legend span.dr-map-swatch { display:inline-block; width:12px; height:12px; border-radius:50%; margin-right:5px; vertical-align:-2px; background:var(--dr-accent); }
:where(.dr-homes-map) .dr-map-legend span.dr-map-hollow { background:none; border:2px solid var(--px-text-muted); }
:where(.dr-homes-map) .dr-map-unknown { margin:10px 0 0; padding:0; list-style:none; font-size:12px; }
:where(.dr-homes-map) .dr-map-unknown li { padding:5px 0; border-bottom:1px solid var(--px-border); display:flex; justify-content:space-between; gap:14px; }
:where(.dr-homes-map) .dr-map-unknown li span { color:var(--px-text-muted); }
:where(.dr-homes-map) .dr-map-tour-number { width:20px; height:20px; border-radius:50%; background:var(--dr-accent); color:var(--px-ink-on-bright); font-size:11px; font-weight:600; display:flex; align-items:center; justify-content:center; border:2px solid var(--px-bg-card); }
:where(.dr-homes-map) .dr-map-pharmacy { width:18px; height:18px; border-radius:50%; background:var(--px-text-primary); border:3px solid var(--px-bg-card); }
/* Root class doubled to (0,3,1): the shell's .dr-dashboard button/select:focus-visible
   (drivers_analytics_html.css, outline-offset:3px) is the same (0,2,1) and loads later. */
.dr-homes-map.dr-homes-map button:focus-visible, .dr-homes-map.dr-homes-map select:focus-visible { outline:2px solid var(--dr-accent); outline-offset:2px; }
.dr-homes-map [hidden] { display:none !important; }
.dr-homes-map.dr-homes-map #dr-map-heat[aria-pressed="true"] { background:color-mix(in srgb, var(--dr-accent) 15%, transparent); border-color:var(--dr-accent); color:var(--px-text-primary); }
[data-theme="dark"] :where(.dr-homes-map) #dr-map.leaflet-container { background:var(--px-bg-elevated); }
[data-theme="dark"] :where(.dr-homes-map) #dr-map .leaflet-bar a { background:var(--px-bg-card); color:var(--px-text-primary); border-bottom-color:var(--px-border); }
[data-theme="dark"] :where(.dr-homes-map) #dr-map .leaflet-bar a:hover, [data-theme="dark"] :where(.dr-homes-map) #dr-map .leaflet-bar a:focus { background:var(--px-bg-elevated); }
[data-theme="dark"] :where(.dr-homes-map) #dr-map .leaflet-bar a.leaflet-disabled { background:var(--px-bg-disabled); color:var(--px-text-disabled); }
[data-theme="dark"] :where(.dr-homes-map) #dr-map .leaflet-control-attribution { background:color-mix(in srgb, var(--px-bg-card) 80%, transparent); color:var(--px-text-secondary); }
[data-theme="dark"] :where(.dr-homes-map) #dr-map .leaflet-control-attribution a { color:var(--px-link); }
[data-theme="dark"] :where(.dr-homes-map) #dr-map .leaflet-popup-content-wrapper, [data-theme="dark"] :where(.dr-homes-map) #dr-map .leaflet-popup-tip { background:var(--px-bg-card); color:var(--px-text-primary); }
[data-theme="dark"] :where(.dr-homes-map) #dr-map a.leaflet-popup-close-button { color:var(--px-text-muted); }
@media(max-width:900px) { :where(.dr-homes-map) #dr-map { height:320px; } }
@media print, (forced-colors:active) { :where(.dr-homes-map) #dr-map { display:none; } }