/* Generated from the icon set. Each icon is a mask, so it takes the current text colour. */
:root {
  --ihf-icon-home: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 11l8-7 8 7'/%3E%3Cpath d='M6 9.5V19h12V9.5'/%3E%3Cpath d='M10 19v-5h4v5'/%3E%3C/svg%3E");
  --ihf-icon-store: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 9l1.2-4.5h13.6L20 9'/%3E%3Cpath d='M4 9a2.7 2.7 0 0 0 5.3 0 2.7 2.7 0 0 0 5.4 0A2.7 2.7 0 0 0 20 9'/%3E%3Cpath d='M5.5 12v7.5h13V12'/%3E%3Cpath d='M10 19.5v-4h4v4'/%3E%3C/svg%3E");
  --ihf-icon-mail: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5.5' width='18' height='13' rx='2'/%3E%3Cpath d='M3.5 7.5l8.5 6 8.5-6'/%3E%3C/svg%3E");
  --ihf-icon-menu: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7h16M4 12h16M4 17h16'/%3E%3C/svg%3E");
  --ihf-icon-close: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E");
  --ihf-icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-4-4'/%3E%3C/svg%3E");
  --ihf-icon-user: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 20c0-4 4-6 8-6s8 2 8 6'/%3E%3C/svg%3E");
  --ihf-icon-cart: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 4H5l2.3 10.6a1 1 0 0 0 1 .8h8.6a1 1 0 0 0 1-.8L19 9H6.3'/%3E%3Ccircle cx='9.5' cy='19.2' r='1.3'/%3E%3Ccircle cx='16.5' cy='19.2' r='1.3'/%3E%3C/svg%3E");
  --ihf-icon-cart-plus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 4H5l2.3 10.6a1 1 0 0 0 1 .8h8.6a1 1 0 0 0 1-.8L19 9H6.3'/%3E%3Ccircle cx='9.5' cy='19.2' r='1.3'/%3E%3Ccircle cx='16.5' cy='19.2' r='1.3'/%3E%3Cpath d='M17 2.2v5M14.5 4.7h5'/%3E%3C/svg%3E");
  --ihf-icon-bag: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 8h12l1 12H5L6 8z'/%3E%3Cpath d='M9 8V7a3 3 0 0 1 6 0v1'/%3E%3C/svg%3E");
  --ihf-icon-truck: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h11v10H3z'/%3E%3Cpath d='M14 9h4l3 3v4h-7z'/%3E%3Ccircle cx='7.5' cy='17.5' r='1.5'/%3E%3Ccircle cx='17.5' cy='17.5' r='1.5'/%3E%3C/svg%3E");
  --ihf-icon-tag: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12V4h8l10 10-8 8L3 12z'/%3E%3Ccircle cx='7.5' cy='8.5' r='1.2'/%3E%3C/svg%3E");
  --ihf-icon-lock: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='11' width='14' height='9' rx='2'/%3E%3Cpath d='M8 11V8a4 4 0 0 1 8 0v3'/%3E%3C/svg%3E");
  --ihf-icon-plus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E");
  --ihf-icon-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3C/svg%3E");
  --ihf-icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  --ihf-icon-chevron-left: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 6l-6 6 6 6'/%3E%3C/svg%3E");
  --ihf-icon-chevron-right: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6l6 6-6 6'/%3E%3C/svg%3E");
  --ihf-icon-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E");
  --ihf-icon-grid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='4' width='7' height='7' rx='1.5'/%3E%3Crect x='13' y='4' width='7' height='7' rx='1.5'/%3E%3Crect x='4' y='13' width='7' height='7' rx='1.5'/%3E%3Crect x='13' y='13' width='7' height='7' rx='1.5'/%3E%3C/svg%3E");
  --ihf-icon-compact: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='4' width='3' height='3' rx='0.8'/%3E%3Crect x='10.5' y='4' width='3' height='3' rx='0.8'/%3E%3Crect x='17' y='4' width='3' height='3' rx='0.8'/%3E%3Crect x='4' y='10.5' width='3' height='3' rx='0.8'/%3E%3Crect x='10.5' y='10.5' width='3' height='3' rx='0.8'/%3E%3Crect x='17' y='10.5' width='3' height='3' rx='0.8'/%3E%3Crect x='4' y='17' width='3' height='3' rx='0.8'/%3E%3Crect x='10.5' y='17' width='3' height='3' rx='0.8'/%3E%3Crect x='17' y='17' width='3' height='3' rx='0.8'/%3E%3C/svg%3E");
  --ihf-icon-list: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9.5 6H20M9.5 12H20M9.5 18H20'/%3E%3Crect x='4' y='4.5' width='3' height='3' rx='0.8'/%3E%3Crect x='4' y='10.5' width='3' height='3' rx='0.8'/%3E%3Crect x='4' y='16.5' width='3' height='3' rx='0.8'/%3E%3C/svg%3E");
  --ihf-icon-snowflake: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath transform='rotate(0 12 12)' d='M12 12V2M9.5 4.5L12 7l2.5-2.5'/%3E%3Cpath transform='rotate(60 12 12)' d='M12 12V2M9.5 4.5L12 7l2.5-2.5'/%3E%3Cpath transform='rotate(120 12 12)' d='M12 12V2M9.5 4.5L12 7l2.5-2.5'/%3E%3Cpath transform='rotate(180 12 12)' d='M12 12V2M9.5 4.5L12 7l2.5-2.5'/%3E%3Cpath transform='rotate(240 12 12)' d='M12 12V2M9.5 4.5L12 7l2.5-2.5'/%3E%3Cpath transform='rotate(300 12 12)' d='M12 12V2M9.5 4.5L12 7l2.5-2.5'/%3E%3C/svg%3E");
  --ihf-icon-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E");
  --ihf-icon-clock: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Cpath d='M12 7.5V12l3 2'/%3E%3C/svg%3E");
  --ihf-icon-pin: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s7-6.2 7-11.5a7 7 0 0 0-14 0C5 14.8 12 21 12 21z'/%3E%3Ccircle cx='12' cy='9.5' r='2.5'/%3E%3C/svg%3E");
  --ihf-icon-star: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l2.7 5.6 6.1.9-4.4 4.3 1 6.1L12 17l-5.4 2.9 1-6.1L3.2 9.5l6.1-.9z'/%3E%3C/svg%3E");
  --ihf-icon-box: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 8L12 3.5 20.5 8v8.5L12 21l-8.5-4.5z'/%3E%3Cpath d='M3.5 8L12 12.5 20.5 8M12 12.5V21'/%3E%3Cpath d='M7.7 5.800l8.5 4.5'/%3E%3C/svg%3E");
  --ihf-icon-cat-candy: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='4.5'/%3E%3Cpath d='M8 10L3.5 6.5v11L8 14M16 10l4.5-3.5v11L16 14'/%3E%3C/svg%3E");
  --ihf-icon-cat-fruits: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 7.5c-2-1.5-6-1-6 4 0 4 3 8 6 8s6-4 6-8c0-5-4-5.5-6-4z'/%3E%3Cpath d='M12 7.5c0-2 1-3.5 3-4'/%3E%3C/svg%3E");
  --ihf-icon-cat-vegetables: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.5 9.5C10 11 6 15 4 20c5-2 9-6 10.5-10.5z'/%3E%3Cpath d='M14.5 9.5L17 4M14.5 9.5L20 7M14.5 9.5l5 2'/%3E%3C/svg%3E");
  --ihf-icon-cat-pastries: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12a6 5 0 0 1 12 0z'/%3E%3Cpath d='M7 12h10l-1.5 8h-7z'/%3E%3Ccircle cx='12' cy='5' r='1.3'/%3E%3C/svg%3E");
  --ihf-icon-cat-ice-cream: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 12l4 9 4-9z'/%3E%3Cpath d='M7 12a5 5 0 1 1 10 0z'/%3E%3C/svg%3E");
  --ihf-icon-cat-dog-treats: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='6.5' cy='10.5' r='1.7'/%3E%3Ccircle cx='10' cy='6.5' r='1.7'/%3E%3Ccircle cx='14' cy='6.5' r='1.7'/%3E%3Ccircle cx='17.5' cy='10.5' r='1.7'/%3E%3Cpath d='M12 12c-3 0-5 2.5-5 4.5 0 1.5 1.2 2.5 2.5 2.5 1 0 1.5-.5 2.5-.5s1.5.5 2.5.5c1.3 0 2.5-1 2.5-2.5 0-2-2-4.5-5-4.5z'/%3E%3C/svg%3E");
  --ihf-icon-cat-default: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12V4h8l10 10-8 8L3 12z'/%3E%3Ccircle cx='7.5' cy='8.5' r='1.2'/%3E%3C/svg%3E");
}

/* Add one of these classes to a block to give it an icon, e.g. "ihf-i-truck". */
.ihf-i-home { --icon: var(--ihf-icon-home); }
.ihf-i-store { --icon: var(--ihf-icon-store); }
.ihf-i-mail { --icon: var(--ihf-icon-mail); }
.ihf-i-menu { --icon: var(--ihf-icon-menu); }
.ihf-i-close { --icon: var(--ihf-icon-close); }
.ihf-i-search { --icon: var(--ihf-icon-search); }
.ihf-i-user { --icon: var(--ihf-icon-user); }
.ihf-i-cart { --icon: var(--ihf-icon-cart); }
.ihf-i-cart-plus { --icon: var(--ihf-icon-cart-plus); }
.ihf-i-bag { --icon: var(--ihf-icon-bag); }
.ihf-i-truck { --icon: var(--ihf-icon-truck); }
.ihf-i-tag { --icon: var(--ihf-icon-tag); }
.ihf-i-lock { --icon: var(--ihf-icon-lock); }
.ihf-i-plus { --icon: var(--ihf-icon-plus); }
.ihf-i-minus { --icon: var(--ihf-icon-minus); }
.ihf-i-chevron { --icon: var(--ihf-icon-chevron); }
.ihf-i-chevron-left { --icon: var(--ihf-icon-chevron-left); }
.ihf-i-chevron-right { --icon: var(--ihf-icon-chevron-right); }
.ihf-i-arrow { --icon: var(--ihf-icon-arrow); }
.ihf-i-grid { --icon: var(--ihf-icon-grid); }
.ihf-i-compact { --icon: var(--ihf-icon-compact); }
.ihf-i-list { --icon: var(--ihf-icon-list); }
.ihf-i-snowflake { --icon: var(--ihf-icon-snowflake); }
.ihf-i-check { --icon: var(--ihf-icon-check); }
.ihf-i-clock { --icon: var(--ihf-icon-clock); }
.ihf-i-pin { --icon: var(--ihf-icon-pin); }
.ihf-i-star { --icon: var(--ihf-icon-star); }
.ihf-i-box { --icon: var(--ihf-icon-box); }

/* Card background art: each category icon as tilted line art with space around it, for repeating. */
:root {
  --ihf-art-cat-candy: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-8 -8 40 40'%3E%3Cg transform='rotate(-14 12 12)' fill='none' stroke='black' stroke-width='1.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='4.5'/%3E%3Cpath d='M8 10L3.5 6.5v11L8 14M16 10l4.5-3.5v11L16 14'/%3E%3C/g%3E%3C/svg%3E");
  --ihf-art-cat-fruits: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-8 -8 40 40'%3E%3Cg transform='rotate(-14 12 12)' fill='none' stroke='black' stroke-width='1.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 7.5c-2-1.5-6-1-6 4 0 4 3 8 6 8s6-4 6-8c0-5-4-5.5-6-4z'/%3E%3Cpath d='M12 7.5c0-2 1-3.5 3-4'/%3E%3C/g%3E%3C/svg%3E");
  --ihf-art-cat-vegetables: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-8 -8 40 40'%3E%3Cg transform='rotate(-14 12 12)' fill='none' stroke='black' stroke-width='1.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.5 9.5C10 11 6 15 4 20c5-2 9-6 10.5-10.5z'/%3E%3Cpath d='M14.5 9.5L17 4M14.5 9.5L20 7M14.5 9.5l5 2'/%3E%3C/g%3E%3C/svg%3E");
  --ihf-art-cat-pastries: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-8 -8 40 40'%3E%3Cg transform='rotate(-14 12 12)' fill='none' stroke='black' stroke-width='1.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12a6 5 0 0 1 12 0z'/%3E%3Cpath d='M7 12h10l-1.5 8h-7z'/%3E%3Ccircle cx='12' cy='5' r='1.3'/%3E%3C/g%3E%3C/svg%3E");
  --ihf-art-cat-ice-cream: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-8 -8 40 40'%3E%3Cg transform='rotate(-14 12 12)' fill='none' stroke='black' stroke-width='1.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 12l4 9 4-9z'/%3E%3Cpath d='M7 12a5 5 0 1 1 10 0z'/%3E%3C/g%3E%3C/svg%3E");
  --ihf-art-cat-dog-treats: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-8 -8 40 40'%3E%3Cg transform='rotate(-14 12 12)' fill='none' stroke='black' stroke-width='1.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='6.5' cy='10.5' r='1.7'/%3E%3Ccircle cx='10' cy='6.5' r='1.7'/%3E%3Ccircle cx='14' cy='6.5' r='1.7'/%3E%3Ccircle cx='17.5' cy='10.5' r='1.7'/%3E%3Cpath d='M12 12c-3 0-5 2.5-5 4.5 0 1.5 1.2 2.5 2.5 2.5 1 0 1.5-.5 2.5-.5s1.5.5 2.5.5c1.3 0 2.5-1 2.5-2.5 0-2-2-4.5-5-4.5z'/%3E%3C/g%3E%3C/svg%3E");
  --ihf-art-cat-default: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-8 -8 40 40'%3E%3Cg transform='rotate(-14 12 12)' fill='none' stroke='black' stroke-width='1.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12V4h8l10 10-8 8L3 12z'/%3E%3Ccircle cx='7.5' cy='8.5' r='1.2'/%3E%3C/g%3E%3C/svg%3E");
}