/* ===== Popup Button ===== */
.vivr-popup .open-button {
  background-color: #555;
  color: white;
  padding: 16px 20px;
  border: none;
  cursor: pointer;
  opacity: 0.8;
  position: fixed;
  bottom: 23px;
  right: 28px;
  width: 280px;
}

/* ===== Popup Container ===== */
.vivr-popup .chat-popup {
  height: 95%;  /* ✅ ตามที่ต้องการ */
  display: none;
  position: fixed;
  bottom: 0.5rem;
  right: 0;
  width: 358px;
  height: 97%;
  max-width: 100%;
  margin-bottom: 1rem;
  box-shadow: 0 70px 40px rgba(0, 0, 0, .16);
  z-index: 1000000;
  border-radius: 15px;
}



/* ===== Icon ===== */
.vivr-popup .fo-icon {
  background-image: url('/ucng/TH/icon.png'); /* ✅ รูปกลับมา */
  background-repeat: no-repeat;
  background-position: center;
  background-size: 50%;
}



/* ===== Form Container ===== */
.vivr-popup .form-container {
  width: inherit;
  height: 98%;
  background-color: white;
}

.vivr-popup iframe {
  width: inherit;
  height: 100%;
  border: none;
}

/* ===== Hover ===== */
.vivr-popup .form-container .btn:hover,
.vivr-popup .open-button:hover {
  opacity: 1;
}

/* ===== Toggle Button ===== */
.vivr-popup #fo-toggle-button {
  background-color: #382b90; /* ✅ สีม่วงกลับมา */
  position: fixed;
  bottom: 30px;
  right: 30px;
  border-radius: 50%;
  height: 50px;
  width: 50px;
  cursor: pointer;
  box-shadow: 0 2px 2px rgba(0,0,0,0.14),
              0 1px 5px rgba(0,0,0,0.12),
              0 3px 1px rgba(0,0,0,0.2);
  z-index: 1000000;
  transition: 0.3s;
}

.vivr-popup #fo-toggle-button .fo-icon {
  height: 50px;
  width: 50px;
  background-size: 50% 50%;
  background-position: 50% 50%;
  background-repeat: no-repeat;
}

/* ===== Animation: Slide In ===== */
.vivr-popup .slide-in-bottom {
  animation: slide-in-bottom 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
}

@keyframes slide-in-bottom {
  0% {
    transform: translateY(1000px);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}

/* ===== Animation: Bounce Out ===== */
.vivr-popup .bounce-out-bottom {
  animation: bounce-out-bottom 1.5s both;
}

@keyframes bounce-out-bottom {
  0% { transform: translateY(0); }
  5% { transform: translateY(30px); }
  15% { transform: translateY(0); }
  25% { transform: translateY(38px); }
  38% { transform: translateY(0); }
  52% { transform: translateY(75px); }
  70% { transform: translateY(0); }
  85% { opacity: 1; }
  100% {
    transform: translateY(800px);
    opacity: 0;
  }
}

/* ===== Misc ===== */
.vivr-popup #closeFrame {
  cursor: pointer;
  font-family: Arial, Helvetica, sans-serif;
}

/* ===== Optional Background (ถ้ายังใช้อยู่) ===== */
/*body {
  background-image: url('/uc/TH/chat-mobile-masthead-50x856.jpg');
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}*/

#heading {
  font-size: 240%;
  color: white;
  position: fixed;
  left: 60px;
  top: 130px;
}

#desc {
  font-size: 100%;
  color: white;
  position: fixed;
  left: 60px;
  width: 280px;
  top: 260px;
}