/* Icons — SVG masks. Files live in /icons/. Colors via currentColor. */

.icon {
  display: inline-block;
  width: 16px;
  height: 16px;
  background-color: currentColor;
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;
  vertical-align: middle;
  flex-shrink: 0;
}

.icon-sm { width: 14px; height: 14px; }

.icon-plus        { mask-image: url('../icons/plus.svg');        -webkit-mask-image: url('../icons/plus.svg'); }
.icon-arrow-up    { mask-image: url('../icons/arrow-up.svg');    -webkit-mask-image: url('../icons/arrow-up.svg'); }
.icon-arrow-left  { mask-image: url('../icons/arrow-left.svg');  -webkit-mask-image: url('../icons/arrow-left.svg'); }
.icon-stop        { mask-image: url('../icons/stop.svg');        -webkit-mask-image: url('../icons/stop.svg'); }
.icon-copy        { mask-image: url('../icons/copy.svg');        -webkit-mask-image: url('../icons/copy.svg'); }
.icon-edit        { mask-image: url('../icons/edit.svg');        -webkit-mask-image: url('../icons/edit.svg'); }
.icon-refresh     { mask-image: url('../icons/refresh.svg');     -webkit-mask-image: url('../icons/refresh.svg'); }
.icon-trash       { mask-image: url('../icons/trash.svg');       -webkit-mask-image: url('../icons/trash.svg'); }
.icon-settings    { mask-image: url('../icons/settings.svg');    -webkit-mask-image: url('../icons/settings.svg'); }
.icon-chevron     { mask-image: url('../icons/chevron.svg');     -webkit-mask-image: url('../icons/chevron.svg'); }
.icon-x           { mask-image: url('../icons/x.svg');           -webkit-mask-image: url('../icons/x.svg'); }
.icon-panel       { mask-image: url('../icons/panel.svg');       -webkit-mask-image: url('../icons/panel.svg'); }
.icon-download    { mask-image: url('../icons/download.svg');    -webkit-mask-image: url('../icons/download.svg'); }