/* ===== Floating Contact Buttons ===== */

.pxth-floating-contact {
  position: fixed;
  right: 22px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 9999;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.pxth-float-btn {
  width: 58px;
  height: 58px;
  border-radius: 999px;
  border: 0;
  outline: none;
  text-decoration: none;
  cursor: pointer;

  display: flex;
  align-items: center;
  justify-content: center;

  color: #fff;
  font-family: Kanit, Arial, sans-serif;
  font-size: 15px;
  font-weight: 700;
  line-height: 1;

  box-shadow: 0 8px 22px rgba(0,0,0,.20);
  transition: transform .2s ease, box-shadow .2s ease, opacity .2s ease;
}

.pxth-float-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(0,0,0,.25);
}

.pxth-phone {
  background: #ff5b00;
}

.pxth-line {
  background: #00c300;
}

.pxth-line-oa {
  background: #06b800;
}

.pxth-email {
  background: #3d68ff;
}

.pxth-messenger {
  background: #0084ff;
}

.pxth-close {
  background: #0077b6;
}

.pxth-close span {
  font-size: 32px;
  font-weight: 300;
  margin-top: -3px;
}

/* ตอนกดปิด ให้เหลือแค่ปุ่ม x */
.pxth-floating-contact.is-collapsed .pxth-phone,
.pxth-floating-contact.is-collapsed .pxth-line,
.pxth-floating-contact.is-collapsed .pxth-line-oa,
.pxth-floating-contact.is-collapsed .pxth-email,
.pxth-floating-contact.is-collapsed .pxth-messenger {
  display: none;
}

.pxth-floating-contact.is-collapsed .pxth-close {
  opacity: .75;
}

/* มือถือ */
@media (max-width: 767px) {
  .pxth-floating-contact {
    right: 12px;
    top: auto;
    bottom: 20px;
    transform: none;
    gap: 9px;
  }

  .pxth-float-btn {
    width: 48px;
    height: 48px;
    font-size: 12px;
  }

  .pxth-close span {
    font-size: 28px;
  }
}