/* Common styles for icon classes */
.qs-icon {
  -webkit-mask: no-repeat center;
  mask: no-repeat center;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  background-color: #565656;
}

/* Specific icon styles */
.qs-icon_broadcast {
  -webkit-mask-image: url("/img/icons/icon_broadcast.svg");
  mask-image: url("/img/icons/icon_broadcast.svg");
}

.qs-icon_call-incoming {
  -webkit-mask-image: url("/img/icons/icon_phone_incoming.svg");
  mask-image: url("/img/icons/icon_phone_incoming.svg");
}

.qs-icon_call-outgoing {
  -webkit-mask-image: url("/img/icons/icon_phone_outgoing.svg");
  mask-image: url("/img/icons/icon_phone_outgoing.svg");
}

.qs-icon_call-answer {
  -webkit-mask-image: url("/img/icons/icon_phone_answer.svg");
  mask-image: url("/img/icons/icon_phone_answer.svg");
}

/* Selected state styles */
.qs-icon.selected {
  background-color: var(--company-base-color, #27B199);
}