/* Icon registry. Every icon is an SVG in /assets/icons.
   To swap one for a PNG, drop the PNG into /assets/icons and change the url() below
   (icons are rendered as masks, so a PNG's alpha channel is what counts). */
:root {
  --icon-x: url('../assets/icons/x.svg');
  --icon-check: url('../assets/icons/check.svg');
  --icon-eye: url('../assets/icons/eye.svg');
  --icon-eye-off: url('../assets/icons/eye-off.svg');
  --icon-camera: url('../assets/icons/camera.svg');
  --icon-home: url('../assets/icons/home.svg');
  --icon-menu: url('../assets/icons/menu.svg');
  --icon-close: url('../assets/icons/close.svg');
  --icon-arrow-right: url('../assets/icons/arrow-right.svg');
  --icon-hand: url('../assets/icons/hand.svg');
  --icon-cloud: url('../assets/icons/cloud.svg');
  --icon-plane: url('../assets/icons/plane.svg');
  --icon-pencil: url('../assets/icons/pencil.svg');
  --icon-logout: url('../assets/icons/logout.svg');
  --icon-tools: url('../assets/icons/tools.svg');
  --icon-plus: url('../assets/icons/plus.svg');
  --logo: url('../assets/img/logo.png');
}

.i {
  display: inline-block;
  width: 1em; height: 1em;
  background-color: currentColor;
  -webkit-mask: var(--icon) center / contain no-repeat;
  mask: var(--icon) center / contain no-repeat;
  flex: none;
}
.i-x { --icon: var(--icon-x); }
.i-check { --icon: var(--icon-check); }
.i-eye { --icon: var(--icon-eye); }
.i-eye-off { --icon: var(--icon-eye-off); }
.i-camera { --icon: var(--icon-camera); }
.i-home { --icon: var(--icon-home); }
.i-menu { --icon: var(--icon-menu); }
.i-close { --icon: var(--icon-close); }
.i-arrow-right { --icon: var(--icon-arrow-right); }
.i-hand { --icon: var(--icon-hand); }
.i-plus { --icon: var(--icon-plus); }
.i-pencil { --icon: var(--icon-pencil); }
.i-logout { --icon: var(--icon-logout); }
.i-tools { --icon: var(--icon-tools); }

/* The AvGram logo, tintable via color */
.logo {
  display: inline-block;
  background-color: currentColor;
  -webkit-mask: var(--logo) center / contain no-repeat;
  mask: var(--logo) center / contain no-repeat;
}
