/* 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--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--chat {
  --icon: url("../../images/icons/chat.svg");
}


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

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

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

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

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

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

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

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

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

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

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

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

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

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

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