/* Lucide icons (API documentation, copied from mobile/css/lucide-icons.css)
   Icons are written as <i data-lucide="name"></i> and the SVG is rendered inside
   the <i>, so icons keep inheriting font-size and color like the old icon font. */

i[data-lucide] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  vertical-align: -0.125em;
}

i[data-lucide] > svg {
  width: 1em;
  height: 1em;
  display: block;
  stroke-width: 1.75;
  flex: none;
}

/* solid look for the few icons that read better filled (favourites, ratings) */
i[data-lucide].is-filled > svg {
  fill: currentColor;
}

/* brand marks - lucide has no logos, so these stay as the project brand SVGs */
img.rp-brand-ico {
  width: 1em;
  height: 1em;
  object-fit: contain;
  vertical-align: -0.125em;
}