/* Icon system.
 * Each icon lives in images/icons/ as a standalone SVG and is painted through a
 * CSS mask, so a single file serves every color: the icon takes `currentColor`
 * from its parent. Size comes from --icon-size, set by the consuming component.
 * Stroke weight is baked into the file, hence the -md / -bold variants. */

.icon {
  display: inline-block;
  flex: 0 0 auto;
  width: var(--icon-size, 20px);
  height: var(--icon-size, 20px);
  background-color: currentColor;
  -webkit-mask: var(--icon) center / contain no-repeat;
  mask: var(--icon) center / contain no-repeat;
}

.icon--menu {
  --icon: url("../../images/icons/menu.svg");
}

.icon--close {
  --icon: url("../../images/icons/close.svg");
}

.icon--close-md {
  --icon: url("../../images/icons/close-md.svg");
}

.icon--chevron-down {
  --icon: url("../../images/icons/chevron-down.svg");
}

.icon--chevron-down-md {
  --icon: url("../../images/icons/chevron-down-md.svg");
}

.icon--chevron-down-bold {
  --icon: url("../../images/icons/chevron-down-bold.svg");
}

.icon--check {
  --icon: url("../../images/icons/check.svg");
}

.icon--check-md {
  --icon: url("../../images/icons/check-md.svg");
}

.icon--check-bold {
  --icon: url("../../images/icons/check-bold.svg");
}

.icon--search {
  --icon: url("../../images/icons/search.svg");
}

.icon--shield-check {
  --icon: url("../../images/icons/shield-check.svg");
}

.icon--signature {
  --icon: url("../../images/icons/signature.svg");
}

.icon--chat {
  --icon: url("../../images/icons/chat.svg");
}

.icon--devices {
  --icon: url("../../images/icons/devices.svg");
}

.icon--document {
  --icon: url("../../images/icons/document.svg");
}

.icon--document-simple {
  --icon: url("../../images/icons/document-simple.svg");
}

.icon--layers {
  --icon: url("../../images/icons/layers.svg");
}

.icon--users-plus {
  --icon: url("../../images/icons/users-plus.svg");
}

.icon--arrow-right {
  --icon: url("../../images/icons/arrow-right.svg");
}

.icon--whatsapp {
  --icon: url("../../images/icons/whatsapp.svg");
}