/* defdo_coverage_maps: minimal, theme-aware styles. Colours come from DaisyUI
   tokens when present, with plain fallbacks. Override any --defdo-map-* on
   .defdo-coverage-map (or higher) to retheme the basemap; the map follows
   live, without refetching tiles. */
.defdo-coverage-map {
  --defdo-map-land: var(--color-base-100, #f6f6f4);
  /* --defdo-map-land-alt: optional; unset, natural areas get a subtle tint of
     --defdo-map-land (close to the background in every theme). */
  --defdo-map-water: color-mix(in oklab, var(--color-info, #5aa0d8) 30%, var(--color-base-100, #ffffff));
  --defdo-map-road: var(--color-base-300, #d9d9d6);
  --defdo-map-label: var(--color-base-content, #333333);
  --defdo-map-halo: var(--color-base-100, #ffffff);
  --defdo-overlay-opacity: 0.6;
  display: flex; flex-direction: column; gap: 0.5rem;
}
.defdo-coverage-form { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.defdo-coverage-form input[name="q"] { padding: 0.5rem 0.75rem; border: 1px solid var(--color-base-300, #ccc); border-radius: 0.375rem; background: var(--color-base-100, #fff); color: var(--color-base-content, #222); }
.defdo-coverage-form button, .defdo-coverage-placeholder button { padding: 0.5rem 1rem; border: 0; border-radius: 0.375rem; background: var(--color-primary, #1f4fd8); color: var(--color-primary-content, #fff); cursor: pointer; }
.defdo-coverage-form button[data-defdo-coverage-locate] { background: var(--color-base-200, #eee); color: var(--color-base-content, #222); }
.defdo-coverage-search-field { position: relative; flex: 1; min-width: 12rem; }
.defdo-coverage-search-field input[name="q"] { width: 100%; box-sizing: border-box; }
.defdo-coverage-suggestions { position: absolute; left: 0; right: 0; top: calc(100% + 0.25rem); z-index: 20; margin: 0; padding: 0.25rem 0; list-style: none; background: var(--color-base-100, #fff); color: var(--color-base-content, #222); border: 1px solid var(--color-base-300, #ccc); border-radius: 0.375rem; box-shadow: 0 4px 12px rgba(0,0,0,0.12); max-height: 16rem; overflow-y: auto; }
.defdo-coverage-suggestions[hidden] { display: none; }
.defdo-coverage-suggestions li { padding: 0.5rem 0.75rem; cursor: pointer; }
.defdo-coverage-suggestions li[aria-selected="true"], .defdo-coverage-suggestions li:hover { background: var(--color-base-200, #eee); }
.defdo-coverage-status { min-height: 1.25rem; font-size: 0.875rem; }
.defdo-coverage-status[data-state="covered"] { color: var(--color-success, #157f3b); }
.defdo-coverage-status[data-state="not_covered"], .defdo-coverage-status[data-state="error"] { color: var(--color-error, #b42318); }
.defdo-coverage-canvas { position: relative; box-sizing: border-box; width: 100%; min-height: 200px; border: 1px solid var(--color-base-300, #d9d9d6); border-radius: var(--radius-box, 0.5rem); overflow: hidden; background: var(--defdo-map-land); }
.defdo-coverage-gl { position: absolute; inset: 0; }
/* maplibre-gl.css sets `.maplibregl-map { position: relative }` and may load
   after this sheet, which collapsed the box to 0px (the map rendered into a
   clipped, invisible canvas). Size it explicitly so the stacking order of the
   two stylesheets no longer matters. */
.defdo-coverage-canvas > .defdo-coverage-gl.maplibregl-map,
.defdo-coverage-canvas > .defdo-coverage-gl { position: absolute; inset: 0; width: 100%; height: 100%; }
.defdo-coverage-placeholder { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, var(--defdo-map-land), var(--defdo-map-land-alt, var(--defdo-map-land))); }
.defdo-coverage-notice { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; margin: 0; padding: 1rem; text-align: center; color: var(--color-base-content, #222); }
.defdo-coverage-notice[hidden] { display: none; }
/* Legend: a horizontal bar under the map. Round check toggles, a two-tone chip
   per layer (fill at the overlay opacity inside a band of the full colour, as
   the layer looks on the map) and the attribution text. Only DaisyUI tokens
   with plain fallbacks; the chip colour arrives as --defdo-chip, set through
   the CSSOM by the bundle (CSP style-src 'self'). Under 480px the bar collapses
   behind a button; wider screens always show the layers. */
.defdo-coverage-legend { border: 1px solid var(--color-base-300, #d9d9d6); border-radius: var(--radius-box, 0.5rem); background: var(--color-base-100, #fff); color: var(--color-base-content, #222); font-size: 0.875rem; line-height: 1.25rem; }
.defdo-coverage-layers { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 1.5rem; min-width: 0; margin: 0; padding: 0.75rem 1rem; border: 0; }
.defdo-coverage-layer { display: inline-flex; align-items: center; gap: 0.5rem; font-weight: 500; cursor: pointer; }
.defdo-coverage-credit { margin-inline-start: auto; font-size: 0.75rem; color: color-mix(in oklab, var(--color-base-content, #222) 70%, transparent); }
.defdo-coverage-sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.defdo-coverage-check { appearance: none; -webkit-appearance: none; position: relative; flex: none; box-sizing: border-box; width: 1.25rem; height: 1.25rem; margin: 0; border: 2px solid color-mix(in oklab, var(--color-base-content, #222) 55%, var(--color-base-100, #fff)); border-radius: 50%; background: var(--color-base-100, #fff); cursor: pointer; transition: background-color 0.15s, border-color 0.15s; }
.defdo-coverage-check::after { content: ""; position: absolute; left: 50%; top: 46%; width: 0.3rem; height: 0.55rem; border: solid var(--color-primary-content, #fff); border-width: 0 2px 2px 0; transform: translate(-50%, -50%) rotate(45deg) scale(0); transition: transform 0.12s; }
.defdo-coverage-check:checked { border-color: var(--color-primary, #1f4fd8); background: var(--color-primary, #1f4fd8); }
.defdo-coverage-check:checked::after { transform: translate(-50%, -50%) rotate(45deg) scale(1); }
.defdo-coverage-check:focus-visible { outline: 2px solid var(--color-primary, #1f4fd8); outline-offset: 2px; }
.defdo-coverage-swatch { --defdo-chip: var(--color-primary, #1f4fd8); display: inline-block; flex: none; box-sizing: border-box; width: 1.75rem; height: 1rem; border: 2px solid var(--defdo-chip); border-radius: 0.3rem; background: color-mix(in srgb, var(--defdo-chip) calc(var(--defdo-overlay-opacity, 0.6) * 100%), transparent); }
.defdo-coverage-legend-toggle { display: none; }
@media (max-width: 479px) {
  .defdo-coverage-legend-toggle { display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 0.625rem 1rem; border: 0; border-radius: inherit; background: transparent; color: inherit; font: inherit; font-weight: 600; cursor: pointer; }
  .defdo-coverage-legend-toggle::after { content: ""; width: 0.5rem; height: 0.5rem; border: solid currentColor; border-width: 0 2px 2px 0; transform: rotate(45deg); transition: transform 0.15s; }
  .defdo-coverage-legend-toggle[aria-expanded="true"]::after { transform: rotate(-135deg); }
  .defdo-coverage-legend-toggle:focus-visible { outline: 2px solid var(--color-primary, #1f4fd8); outline-offset: -2px; }
  .defdo-coverage-layers { flex-direction: column; align-items: flex-start; border-top: 1px solid var(--color-base-300, #d9d9d6); }
  .defdo-coverage-legend[data-open="false"] .defdo-coverage-layers { display: none; }
  .defdo-coverage-credit { margin-inline-start: 0; }
}
@media (forced-colors: active) {
  .defdo-coverage-check { border-color: CanvasText; }
  .defdo-coverage-check:checked { border-color: Highlight; background: Highlight; }
  .defdo-coverage-check:checked::after { border-color: HighlightText; }
}
/* The scale bar ("300 km", bottom-left) follows the theme. */
.defdo-coverage-map .maplibregl-ctrl-scale { background-color: color-mix(in srgb, var(--color-base-100, #fff) 75%, transparent); border-color: var(--color-base-content, #333); color: var(--color-base-content, #333); }
.defdo-coverage-popup strong { display: block; margin-bottom: 4px; }
.defdo-coverage-probe { position: absolute; width: 0; height: 0; overflow: hidden; pointer-events: none; }