.cmp-symptom-selector .wrapper {
  display: flex;
  transition: all 0.5s ease;
  position: relative;
  overflow: hidden;
}
.cmp-symptom-selector .wrapper #symptom-selector-back-btn {
  position: absolute;
  top: 0;
  left: 0;
  background: #292929;
  color: white;
  border: none;
  padding: 19px 45px;
  cursor: pointer;
  font-size: 15px;
  font-family: Inter, sans-serif;
  font-weight: 500;
  z-index: 2;
  display: none;
}
.cmp-symptom-selector .wrapper .svg-container {
  flex: 1;
  display: flex;
  justify-content: center;
  align-items: start;
  position: relative;
}
.cmp-symptom-selector .wrapper .svg-container svg {
  transition: transform 0.5s ease;
  max-height: 80vh;
}
.cmp-symptom-selector .wrapper .svg-container.shrink svg {
  transform: scale(0.8);
}
.cmp-symptom-selector .wrapper .svg-container.shrink .symptom-selector-back-btn {
  display: block;
}
.cmp-symptom-selector .wrapper .svg-container.shrink .icon-bg:not(.active):not(:hover) path {
  fill: #86898C;
}
.cmp-symptom-selector .wrapper .svg-container.shrink .icon-bg:not(.active):not(:hover) + text.label {
  opacity: 0;
}
.cmp-symptom-selector .wrapper .sidebar {
  width: 0;
  overflow: hidden;
  transition: width 0.5s ease;
  background: #292929;
  color: #fff;
}
.cmp-symptom-selector .wrapper .sidebar .symptom-content {
  display: none;
}
.cmp-symptom-selector .wrapper .sidebar.visible {
  width: 60%;
  border: 1px solid #000000;
}
.cmp-symptom-selector .wrapper .sidebar .heading {
  color: #000;
  background: #FEEB16;
  padding: 20px 70px;
  border-bottom: 1px solid #000000;
}
.cmp-symptom-selector .wrapper .sidebar .body {
  padding: 20px 70px 50px 70px;
}
.cmp-symptom-selector .wrapper .sidebar .body .buttons {
  margin-top: 20px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 52px;
}
.cmp-symptom-selector .wrapper .sidebar .body .symptom-area-button {
  background: #FEEB16;
  color: #000;
  text-align: center;
  padding: 8px 0;
  width: 100%;
}
.cmp-symptom-selector .wrapper .touchpoint {
  cursor: pointer;
}
.cmp-symptom-selector .wrapper .touchpoint .icon-bg {
  scale: 2.5;
}
.cmp-symptom-selector .wrapper .touchpoint .icon-bg path {
  transition: fill 0.2s ease-in-out;
}
.cmp-symptom-selector .wrapper .touchpoint .icon-bg .fa-icon {
  font-family: "Font Awesome 6 Pro";
  font-size: 10px;
  text-anchor: middle;
  font-weight: lighter;
}
.cmp-symptom-selector .wrapper .touchpoint .icon-bg .fa-icon[data-custom] {
  font-family: "Font Awesome Kit";
  font-size: 13px;
  transform: translateY(1px);
}
.cmp-symptom-selector .wrapper .touchpoint text.label {
  text-anchor: middle;
  transform: translateY(-30px);
  opacity: 1;
  transition: opacity 0.2s ease-in-out;
  cursor: default;
}
@media (max-width: 992px) {
  .cmp-symptom-selector .wrapper {
    flex-direction: column;
  }
  .cmp-symptom-selector .wrapper #symptom-selector-back-btn {
    padding: 10px 20px;
    font-size: 14px;
  }
  .cmp-symptom-selector .wrapper #symptom-selector-sidebar {
    width: 100%;
  }
  .cmp-symptom-selector .wrapper #symptom-selector-sidebar .symptom-content .heading {
    padding: 20px;
  }
  .cmp-symptom-selector .wrapper #symptom-selector-sidebar .symptom-content .body {
    padding: 20px;
  }
  .cmp-symptom-selector .wrapper #symptom-selector-sidebar .symptom-content .body .buttons {
    grid-template-columns: 1fr;
    gap: 25px;
  }
}