/* The .icon-* classes (once glyphs of the autodo icon font): an SVG of
   icons/ui as the mask of a ::before, in the text colour and as big as the
   text, so the markup (<i class="icon-crown"></i>, <th class="icon-email-unread">)
   is as it was. New icons: inline_svg_tag(..., class: "svg-icon"), below. */
[class^="icon-"]::before,
[class*=" icon-"]::before {
  content: "";
  display: inline-block;
  width: 1em;
  height: 1em;
  vertical-align: -0.125em;
  background-color: currentColor;
  -webkit-mask: no-repeat center / contain;
          mask: no-repeat center / contain; }
.icon-crown::before { -webkit-mask-image: url("/assets/icons/ui/crown-d106c36b.svg"); mask-image: url("/assets/icons/ui/crown-d106c36b.svg"); }
.icon-search::before { -webkit-mask-image: url("/assets/icons/ui/search-76868e44.svg"); mask-image: url("/assets/icons/ui/search-76868e44.svg"); }
.icon-phone::before { -webkit-mask-image: url("/assets/icons/ui/call-264b0fc8.svg"); mask-image: url("/assets/icons/ui/call-264b0fc8.svg"); }
.icon-cog::before { -webkit-mask-image: url("/assets/icons/ui/admin-fd19db26.svg"); mask-image: url("/assets/icons/ui/admin-fd19db26.svg"); }
.icon-envelope::before { -webkit-mask-image: url("/assets/icons/ui/mail-906e6e57.svg"); mask-image: url("/assets/icons/ui/mail-906e6e57.svg"); }
.icon-email-unread::before { -webkit-mask-image: url("/assets/icons/ui/mail_unread-b6de97de.svg"); mask-image: url("/assets/icons/ui/mail_unread-b6de97de.svg"); }
.icon-printer::before { -webkit-mask-image: url("/assets/icons/ui/print-554ff36b.svg"); mask-image: url("/assets/icons/ui/print-554ff36b.svg"); }
.icon-cancel-squared::before { -webkit-mask-image: url("/assets/icons/ui/close-7e4b613b.svg"); mask-image: url("/assets/icons/ui/close-7e4b613b.svg"); }
/* The icons of I18n's icons.dashboard, .settings and .shopping_cart (config/locales/da.yml): as in the top menu. */
.icon-dashboard::before { -webkit-mask-image: url("/assets/icons/ui/car_centers-3a2125ba.svg"); mask-image: url("/assets/icons/ui/car_centers-3a2125ba.svg"); }
.icon-settings::before { -webkit-mask-image: url("/assets/icons/ui/admin-fd19db26.svg"); mask-image: url("/assets/icons/ui/admin-fd19db26.svg"); }
.icon-shopping-cart::before { -webkit-mask-image: url("/assets/icons/ui/shopping_cart-9d349341.svg"); mask-image: url("/assets/icons/ui/shopping_cart-9d349341.svg"); }

/* An icon of many in a list (mask_icon): the SVG file as a mask, in the text
   colour and as big as the text. */
.mask-icon {
  display: inline-block;
  width: 1em;
  height: 1em;
  vertical-align: -0.125em;
  background-color: currentColor;
  -webkit-mask: var(--icon) no-repeat center / contain;
          mask: var(--icon) no-repeat center / contain; }

/* Inline SVG icons (inline_svg_tag(..., class: "svg-icon")): as big as the text, in its colour.
   CSS wins over the fill, width and height attributes of the SVG files. */
.svg-icon {
  display: inline-block;
  width: 1em;
  height: 1em;
  fill: currentColor;
  vertical-align: -0.125em; }

/* An extra product's icon in the order lists (dashboard/_extra_product_icons):
   as big as the icons there that are still pictures (24 px), and in line with them. */
.svg-icon.extra-product-icon {
  width: 24px;
  height: 24px;
  vertical-align: middle; }