.container {
  display: flex;
  gap: 12px;
  -webkit-box-align: center;
  align-items: center;
  justify-content: left;
  text-align: left;
  border: 1px solid rgb(224, 224, 224);
  box-sizing: border-box;
  border-radius: 10px;
  min-height: 64px;
  width: 100%;
  cursor: pointer;
  padding-left: 24px;
  padding-right: 24px;
  margin-left: auto;
  margin-right: auto;
  box-shadow: rgba(84, 60, 151, 0.25) 2px 2px 6px;
  background: rgb(234, 238, 247);
}

.container.disabled {
  opacity: 0.5;
}

.container.active {
  background: linear-gradient(
    165.54deg,
    rgb(20, 19, 51) -33.39%,
    rgb(32, 34, 97) 15.89%,
    rgb(84, 60, 151) 55.84%,
    rgb(105, 57, 162) 74.96%
  );
}

.icon {
  width: 48px;
  height: 48px;
}

.answer {
  font-size: 14px;
  line-height: 20px;
  color: #000;
}

.active .answer {
  color: #fff;
}

.circle {
  background: rgb(251, 251, 255);
  border: 1px solid rgb(224, 224, 224);
  border-radius: 50%;
  width: 24px;
  height: 24px;
  margin-left: auto;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  -webkit-box-pack: center;
  justify-content: center;
}

.circle > img {
  display: block;
  width: 14px;
  height: 12px;
}