.help-open {
  position: fixed;
  bottom: 20px;
  right: 20px;
  height: 38px;
  transition: all 0.3s ease-in-out;
  z-index: 12000;
  border: #151515 2px solid;
  border-radius: 40px;
  color: #151515;
  background-color: #FFB82A;
  font-weight: 600;
  padding: 0 12px 0 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.help-open:hover {
  transform: scale(1.01);
  opacity: 1;
}
.help-open:active {
  transform: scale(1.02);
  opacity: 1;
}

.help-box {
  position: fixed;
  bottom: 70px;
  right: 20px;
  z-index: 1000;
  display: flex;
  justify-content: flex-start;
  flex-direction: column;
  align-items: center;
  padding: 20px;
  border-radius: 6px;
  border: #A4A799 1px solid;
  box-shadow: #A4A799 1px 0px 32px -8px;
  max-height: 80vh;
  max-width: 30vw;
  background-color: #F9F9F9;
}
.help-box .popup-title {
  display: flex;
  justify-content: space-between;
  width: 100%;
}
.help-box .popup-body .tutorial-content {
  overflow-y: auto;
  max-height: 40vh;
}
.help-box .popup-body .tutorial-content iframe {
  width: 100%;
}
.help-box .popup-body .contact-whatsapp {
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}
.help-box .open-ticket {
  cursor: pointer;
}
.help-box .open-ticket:hover .help-icon {
  background-color: #FFB82A;
  color: #151515;
}
.help-box .popup-close {
  cursor: pointer;
}

.help-icon {
  border: #FFB82A 3px solid;
  color: #FFB82A;
  border-radius: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px 12px;
  margin-right: 12px;
}

.remove-create-ticket {
  position: absolute;
  right: 42px;
  top: 42px;
  cursor: pointer;
}

@media (max-width: 800px) {
  .help-box {
    width: 40px;
    height: 40px;
  }
}