/* ========== OVERLAY ========== */
.popup-overlay {
  position: fixed;
  top:0; left:0;
  width:100%; height:100%;
  background: rgba(0,0,0,0.55);
  display:none;
  justify-content:center;
  align-items:center;
  z-index:9999;
  animation: fadeIn .2s ease;
}

@keyframes fadeIn {
  from { opacity:0; }
  to   { opacity:1; }
}

/* ========== POPUP BOX ========== */
.popup-box {
  background:white;
  padding:28px 26px;
  width:90%;
  max-width:420px;
  border-radius:18px;
  box-shadow:0 8px 25px rgba(0,0,0,0.28);
  animation: popup .25s ease;
}

@keyframes popup {
  from { transform:scale(0.7); opacity:0; }
  to   { transform:scale(1);   opacity:1; }
}

/* ========== FORM INPUTS ========== */
.popup-box label {
  font-weight:600;
  color:#444;
  margin-bottom:4px;
  display:block;
}

.popup-box input,
.popup-box select,
.popup-box textarea {
  width:100%;
  padding:12px;
  border-radius:10px;
  border:2px solid #ffb1d8;
  background:white;
  font-size:15px;
  margin-bottom:14px;
  transition:.25s;
  outline:none;
}

.popup-box input:focus,
.popup-box select:focus,
.popup-box textarea:focus {
  border-color:#ff4da6;
  box-shadow:0 0 6px rgba(255, 71, 156, 0.35);
}

/* TEXTAREA */
.popup-box textarea {
  resize:none;
  height:90px;
}

/* ========== BUTTON GỬI ========== */
.btn-big {
  width:100%;
  padding:14px;
  border:none;
  border-radius:12px;
  background:#ff66b3;
  color:white;
  font-size:18px;
  cursor:pointer;
  transition:.25s;
  margin-top:6px;
}

.btn-big:hover {
  background:#ff3399;
  transform:translateY(-2px);
}

/* ========== BUTTON ĐÓNG ========== */
.close-btn {
  text-align:center;
  margin-top:14px;
  padding:10px;
  cursor:pointer;
  font-weight:bold;
  color:#d10066;
  font-size:16px;
  transition:.25s;
}

.close-btn:hover {
  color:#a80052;
  transform:translateY(-1px);
}

/* ========== SUCCESS POPUP SPECIAL BOX ========== */
#showSuccess .popup-box {
  max-width:460px;
}