/*
 * Bocpak insère <i class="menu-icon bocpak-icon-eecom-…"></i>.
 * Chaque SVG sert de masque : l'icône suit la couleur et la taille choisies
 * dans les réglages du menu Bocpak (currentColor et 1em).
 */
[class*="bocpak-icon-eecom-"]::before {
  content: "";
  display: inline-block;
  width: 1em;
  height: 1em;
  background-color: currentColor;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
  vertical-align: -0.08em;
}

.bocpak-icon-eecom-gobelet-carton::before {
  -webkit-mask-image: url("../icons/gobelet-en-carton.svg");
  mask-image: url("../icons/gobelet-en-carton.svg");
}

.bocpak-icon-eecom-feuilles-metal::before {
  -webkit-mask-image: url("../icons/feuilles-de-metal.svg");
  mask-image: url("../icons/feuilles-de-metal.svg");
}

.bocpak-icon-eecom-conteneur-alimentaire::before {
  -webkit-mask-image: url("../icons/conteneur-alimentaire.svg");
  mask-image: url("../icons/conteneur-alimentaire.svg");
}

.bocpak-icon-eecom-rouleau-papier::before {
  -webkit-mask-image: url("../icons/rouleau-de-papier.svg");
  mask-image: url("../icons/rouleau-de-papier.svg");
}

.bocpak-icon-eecom-plateau::before {
  -webkit-mask-image: url("../icons/plateau.svg");
  mask-image: url("../icons/plateau.svg");
}

.bocpak-icon-eecom-vaisselle::before {
  -webkit-mask-image: url("../icons/vaisselle.svg");
  mask-image: url("../icons/vaisselle.svg");
}