/* One line-icon family for the public site and member pages. SVGs inherit the
   existing text/action colour, including brand panels and forced colours. */
.riko-ui-icon {
  display: inline-block;
  width: 1.15em;
  height: 1.15em;
  margin-inline-end: .45em;
  vertical-align: -.2em;
  flex: 0 0 auto;
  pointer-events: none;
}
/* Form-specific SVG colours must not wash out an icon inside a filled button. */
html body .riko-ui-icon { color: inherit !important; }
:is(h1, h2, h3) > .riko-ui-icon {
  width: .85em;
  height: .85em;
  vertical-align: -.06em;
  margin-inline-end: .35em;
}
.riko-billing-plan-benefits dt > .riko-ui-icon {
  width: 1.35em;
  height: 1.35em;
  color: var(--riko-link) !important;
}
/* Keep the established header geometry at intermediate desktop widths. */
@media (min-width: 960px) and (max-width: 1399px) {
  :is(#riko-primary-menu, .riko-toolbar-links) .riko-ui-icon { display: none; }
}
@media (max-width: 767px) {
  h1 > .riko-ui-icon { width: .7em; height: .7em; }
}