@mixin _add-icon {
  align-items: baseline;
  display: inline-flex;

  &::before {
    align-self: center;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    content: "";
    display: inline-flex;
    height: 22px;
    margin-right: 0.25ch;
    width: 22px;
  }
}

$icons: (
  agent:
    'data:image/svg+xml,%3Csvg fill="none" height="17" viewBox="0 0 16 17" width="16" xmlns="http://www.w3.org/2000/svg"%3E%3Cg clip-rule="evenodd" fill="%2314cc80" fill-rule="evenodd"%3E%3Cpath d="m2.90887 2.68183c-.40166 0-.72727.32561-.72727.72727v7.2727c0 .4017.32561.7273.72727.7273h10.18183c.4016 0 .7273-.3256.7273-.7273v-7.2727c0-.40166-.3257-.72727-.7273-.72727zm-2.181819.72727c0-1.20499.976829-2.18182 2.181819-2.18182h10.18183c1.205 0 2.1818.97683 2.1818 2.18182v7.2727c0 1.205-.9768 2.1818-2.1818 2.1818h-10.18183c-1.20499 0-2.181819-.9768-2.181819-2.1818z"/%3E%3Cpath d="m3.63623 15.0454c0-.4016.32561-.7272.72727-.7272h7.2727c.4017 0 .7273.3256.7273.7272 0 .4017-.3256.7273-.7273.7273h-7.2727c-.40166 0-.72727-.3256-.72727-.7273z"/%3E%3Cpath d="m7.99973 11.4091c.40166 0 .72728.3256.72728.7273v2.9091c0 .4016-.32562.7272-.72728.7272s-.72727-.3256-.72727-.7272v-2.9091c0-.4017.32561-.7273.72727-.7273z"/%3E%3C/g%3E%3C/svg%3E',
  repository:
    'data:image/svg+xml,%3Csvg fill="none" height="17" viewBox="0 0 16 17" width="16" xmlns="http://www.w3.org/2000/svg"%3E%3Cg clip-rule="evenodd" fill="%237648f5" fill-rule="evenodd"%3E%3Cpath d="m9.59418 1.86629c.00001.00001-.00001-.00001 0 0l5.14182 5.14106c.8515.85266.8519 2.23446.0003 3.08715l-5.14212 5.1414c-.00001 0 .00001 0 0 0-.85202.852-2.2347.852-3.0867 0l-5.14109-5.1411c-.851581-.85266-.85191-2.23442-.00033-3.08709l1.54215-1.54215c.28401-.28401.7445-.28401 1.02852 0 .28401.28402.28401.7445 0 1.02852l-1.54149 1.54149c-.28443.28479-.28443.74626 0 1.03105l5.14076 5.14078c.28398.284.74568.284 1.02966 0l5.14154-5.14078c.2844-.28479.2844-.74626 0-1.03105l-5.1415-5.14072c-.28395-.28395-.74559-.28402-1.02958-.00016l-1.02784 1.02832 4.62772 4.62841c.284.28404.284.74452 0 1.02852-.2841.28399-.7446.28396-1.0286-.00008l-5.65584-5.65668 2.0558-2.05677c.852-.852 2.2348-.8521 3.08682-.00012z"/%3E%3Cpath d="m8.05051 5.76694c.40167 0 .72728.32561.72728.72727v5.14259c0 .4016-.32561.7272-.72728.7272-.40166 0-.72727-.3256-.72727-.7272v-5.14259c0-.40166.32561-.72727.72727-.72727z"/%3E%3C/g%3E%3C/svg%3E',
  plugin:
    'data:image/svg+xml,%3Csvg fill="none" height="16" viewBox="0 0 16 16" width="16" xmlns="http://www.w3.org/2000/svg"%3E%3Cg clip-rule="evenodd" fill="%23faa01f" fill-rule="evenodd"%3E%3Cpath d="m8.15745 11.7869c.40166 0 .72727.3256.72727.7273v2.2494c0 .4017-.32561.7273-.72727.7273s-.72727-.3256-.72727-.7273v-2.2494c0-.4017.32561-.7273.72727-.7273z"/%3E%3Cpath d="m6.68115 7.64045c0-.40166.32561-.72727.72727-.72727h1.49962c.40166 0 .72727.32561.72727.72727s-.32561.72727-.72727.72727h-1.49962c-.40166 0-.72727-.32561-.72727-.72727z"/%3E%3Cpath d="m3.65872 5.74339c-.00598 0-.01171.00238-.01593.0066-.00423.00423-.0066.00996-.0066.01594v2.63844c.00002.00332.00079.0066.00223.0096.00147.00304.0036.00572.00624.00782l.00082.00066 1.30984 1.04908c.00015.00011-.00014-.00012 0 0 .1728.13809.31281.31357.40886.51283.09613.19944.14621.41794.14653.63924v.0011 1.1397c0 .006.00237.0117.0066.0159.00422.0043.00996.0066.01593.0066h5.24866c.006 0 .0117-.0023.0159-.0066.0043-.0042.0066-.0099.0066-.0159v-1.1408c.0003-.2213.0504-.4398.1466-.63924.096-.19932.2357-.3745.4085-.51261.0001-.00007-.0001.00008 0 0l1.311-1.04996c.0026-.0021.0048-.00478.0062-.00782.0015-.003.0022-.00628.0023-.00961 0-.00004 0 .00005 0 0v-2.63843c0-.00598-.0024-.01171-.0066-.01594-.0043-.00422-.01-.0066-.016-.0066zm-1.04445-1.02191c.277-.27701.6527-.43263 1.04445-.43263h8.99768c.3918 0 .7675.15562 1.0445.43263.277.277.4326.6527.4326 1.04445v2.64036c-.0003.22138-.0504.43987-.1465.63929-.096.1992-.2356.37428-.4083.51235-.0002.00016-.0004.00032-.0006.00048l-1.3106 1.04969c-.0027.0022-.0048.0048-.0063.0079-.0014.003-.0022.0062-.0022.0096v1.1388c0 .3917-.1556.7674-.4326 1.0444-.2771.2771-.6528.4327-1.0445.4327h-5.24866c-.39175 0-.76745-.1556-1.04445-.4327-.27701-.277-.43263-.6527-.43263-1.0444v-1.1388c-.00003-.0034-.00079-.0066-.00223-.0096-.00147-.0031-.0036-.0057-.00624-.0079l-1.31067-1.04969c-.00014-.00011.00014.00011 0 0-.1728-.13809-.3128-.31357-.40886-.51283-.09613-.19942-.1462-.4179-.14652-.63929v-2.64036c0-.39175.15562-.76745.43263-1.04445z"/%3E%3Cpath d="m5.65843.727264c.40166 0 .72727.325616.72727.727276v3.1242c0 .40166-.32561.72727-.72727.72727-.40167 0-.72728-.32561-.72728-.72727v-3.1242c0-.40166.32561-.727276.72728-.727276z"/%3E%3Cpath d="m10.6574.727264c.4017 0 .7273.325616.7273.727276v3.1242c0 .40166-.3256.72727-.7273.72727-.4016 0-.72722-.32561-.72722-.72727v-3.1242c0-.40166.32562-.727276.72722-.727276z"/%3E%3C/g%3E%3C/svg%3E',
);

.add-icon {
  @each $name, $svg in $icons {
    &-#{$name} {
      @include _add-icon;
      &::before {
        background-image: url($svg);
      }
    }
  }
}
