/* ✅ Button Styling */
.btn-orange {
  background-color: #F38221 !important;
  border: none;
}

.btn-orange:hover {
  background-color: #F38221;
}

.tec-button::before {
  background-image: url("https://www.theestheticclinics.com/treatments/wp-content/uploads/2025/09/petal-form-1.png");
  /* background-image: url("../assets/image/petal/petal.png"); */
  opacity: 1;
}

.tec-button:hover::before {
  opacity: 0;
}

/* ✅ Petal Animation on Button */

.tec-button {
  position: relative; /* ✅ Required */
  overflow: visible; /* Ensure petals are visible */
}

.tec-button::before,
.tec-button::after {
  content: "";
  position: absolute;
  top: -35px;
  right: -02px;
  width: 40px;
  height: 40px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  transition: opacity 0.4s ease;
  pointer-events: none;
}

.tec-button::before {
  background-image: url("https://www.theestheticclinics.com/treatments/wp-content/uploads/2025/09/petal-form-1.png");
  /* background-image: url("../assets/image/petal/petal.png"); */
  opacity: 1;
}

.tec-button:hover::before {
  opacity: 0;
}

.tec-button::after {
  background-image: url("https://www.theestheticclinics.com/treatments/wp-content/uploads/2025/09/petal.gif");
  /* background-image: url("../assets/image/petal/Motion-petal.gif"); */
  opacity: 0;
}

.tec-button:hover::after {
  opacity: 1;
}