/*
 * P8 POI category icons.
 * The icon SVGs are inlined into the page and read their colours from CSS
 * custom properties, so they can be themed globally (:root, injected from the
 * component options) and per category (set on the .p8-icon-marker wrapper):
 *   --p8-icon-bg              background fill of the round icon
 *   --p8-icon-color           colour of the icon line art
 *   --p8-icon-stroke-width    line width of the icon art
 *   --p8-icon-bg-border       border colour of the round icon
 *   --p8-icon-bg-border-width border width of the round icon
 */
:root {
  --p8-icon-bg: #f3f4f6;
  --p8-icon-color: #111827;
  --p8-icon-stroke-width: 2.2;
  --p8-icon-bg-border: #d1d5db;
  --p8-icon-bg-border-width: 1;
}

.p8-icon-marker {
  display: inline-block;
  line-height: 0;
  vertical-align: middle;
}

.p8-icon-marker > svg {
  display: block;
  width: 100%;
  height: 100%;
}