:root {
  --icon-size: 1em;
}

.icon {
  -webkit-touch-callout: none;
  background-color: currentColor;
  block-size: var(--icon-size);
  inline-size: var(--icon-size);

  display: inline-block;
  flex-shrink: 0;

  mask-image: var(--svg);
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: var(--icon-size);

  user-select: none;
}

/* UI icons */
.icon--edit { --svg: url("/assets/edit-30d170ae.svg"); }
.icon--delete { --svg: url("/assets/delete-391c5bd0.svg"); }
.icon--search { --svg: url("/assets/search-95b1a505.svg"); }
.icon--check_box { --svg: url("/assets/check_box-01eb5274.svg"); }
.icon--check_box_outline_blank { --svg: url("/assets/check_box_outline_blank-25dc1c2b.svg"); }
.icon--add { --svg: url("/assets/add-6a123953.svg"); }
.icon--remove { --svg: url("/assets/remove-ba805c77.svg"); }
.icon--send { --svg: url("/assets/send-158ef433.svg"); }
.icon--go { --svg: url("/assets/arrow_forward-884b6cf2.svg"); }
.icon--close { --svg: url("/assets/close-40d117bb.svg"); }
.icon--cancel { --svg: url("/assets/cancel-9dd17ef5.svg"); }
.icon--back { --svg: url("/assets/arrow_top_left-d386048f.svg"); }
.icon--download { --svg: url("/assets/download-ede534ac.svg"); }
.icon--drag_handle { --svg: url("/assets/drag_handle-86dad283.svg"); }
.icon--list_alt_add { --svg: url("/assets/list_alt_add-6d7863e7.svg"); }
.icon--event_available { --svg: url("/assets/event_available-f60b6773.svg"); }
.icon--save { --svg: url("/assets/check-16602618.svg"); }
.icon--mail { --svg: url("/assets/mail-7f207186.svg"); }
.icon--youtube { --svg: url("/assets/music_video-9b997bb9.svg"); }
.icon--collapsed { --svg: url("/assets/keyboard_arrow_right-cd67bea5.svg") }
.icon--uncollapsed { --svg: url("/assets/keyboard_arrow_down-8a04c100.svg") }
.icon--show { --svg: url("/assets/open_in_full-f9c29f58.svg") }
.icon--checked { --svg: url("/assets/check_box-01eb5274.svg"); }
.icon--unchecked { --svg: url("/assets/check_box_outline_blank-25dc1c2b.svg"); }
.icon--info { --svg: url("/assets/info-28034a21.svg"); }
.icon--unfold_more { --svg: url("/assets/unfold_more-4fd3bc00.svg"); }
.icon--unfold_less { --svg: url("/assets/unfold_less-130010e2.svg"); }

/* Semantic icons */
.icon--act { --svg: url("/assets/artist-eb9d5263.svg"); }
.icon--add_location { --svg: url("/assets/add_location-1413f0e4.svg"); }
.icon--event { --svg: url("/assets/event-2aa2ee13.svg"); }
.icon--exit { --svg: url("/assets/logout-2353682b.svg"); }
.icon--login { --svg: url("/assets/door_back-3538303b.svg"); }
.icon--kitchen { --svg: url("/assets/faucet-91d65d17.svg"); }
.icon--location { --svg: url("/assets/location_on-931b57f3.svg"); }
.icon--material { --svg: url("/assets/emoji_symbols-75e319ea.svg"); }
.icon--shows { --svg: url("/assets/volume_up-5574de7b.svg"); }
.icon--user { --svg: url("/assets/directions_walk-44cdd6c8.svg"); }
.icon--users { --svg: url("group.svg"); }
.icon--stage { --svg: url("/assets/speaker-d3507f12.svg"); }
.icon--storage { --svg: url("/assets/warehouse-e3788d2a.svg"); }