/* ============================================================
   ETP /teste — popup de checkout em HTML/CSS/JS puro (sem
   Elementor). Mesmo padrão visual/técnico do popup do /teste2 e
   do MRM, na paleta dourada que o /teste já usa hoje (mesmo tom
   do .gradiente do site: linear-gradient(45deg,#92701d,#e2ce81)).
   Só estiliza o popup — não altera mais nada do visual do /teste.
   ============================================================ */
:root{
  --etp-gold-1:#e2ce81;
  --etp-gold-2:#caa63a;
  --etp-card-bg:linear-gradient(160deg,#16140d,#0a0906);
  --etp-card-border:rgba(226,206,129,.16);
}

.popup-overlay{
  display:none;
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.85);
  z-index:99999;
  align-items:center;
  justify-content:center;
  padding:16px;
}
.popup-overlay.active{ display:flex; }
.popup-box{
  background:var(--etp-card-bg);
  border:1px solid var(--etp-card-border);
  border-radius:16px;
  padding:36px 28px 32px;
  max-width:480px;
  width:100%;
  position:relative;
  text-align:center;
  box-shadow:0 24px 60px rgba(0,0,0,.5);
}
.popup-close{
  position:absolute;
  top:14px;
  right:18px;
  background:none;
  border:none;
  color:#8a8471;
  font-size:20px;
  cursor:pointer;
  line-height:1;
}
.popup-close:hover{ color:#fff; }
.popup-logo-img{
  max-width:200px;
  margin:0 auto 20px;
  border-radius:10px;
}
.popup-title{
  font-family:'DM Sans',sans-serif;
  font-size:clamp(18px,4vw,22px);
  font-weight:800;
  text-transform:uppercase;
  line-height:1.25;
  color:#fff;
  margin-bottom:12px;
}
.popup-sub{
  font-size:14px;
  color:#a99f83;
  line-height:1.6;
  margin-bottom:22px;
}
.popup-field{
  width:100%;
  background:#fff;
  border:1px solid #ddd;
  border-radius:10px;
  padding:14px 16px;
  font-size:15px;
  color:#111;
  margin-bottom:12px;
  font-family:'Inter',sans-serif;
  outline:none;
  transition:border .2s;
  box-sizing:border-box;
}
.popup-field::placeholder{ color:#999; }
.popup-field:focus{ border-color:var(--etp-gold-1); }
.popup-phone-wrap .iti{ width:100%; }
.popup-phone-wrap input{
  width:100%;
  background:#fff;
  border:1px solid #ddd;
  border-radius:10px;
  padding:14px 16px 14px 52px;
  font-size:15px;
  color:#111;
  font-family:'Inter',sans-serif;
  outline:none;
  box-sizing:border-box;
}
.popup-phone-wrap input:focus{ border-color:var(--etp-gold-1); }
.iti__country-list{ background:#1a1a1a; border:1px solid #2a2a2a; color:#fff; z-index:999999; }
.iti__selected-flag{ background:#1a1a1a !important; border-radius:10px 0 0 10px; }
.iti__selected-dial-code{ color:#fff !important; }
.iti__arrow{ border-top-color:#fff !important; }
.iti__country.iti__highlight{ background:#2a2a2a; }
.popup-btn{
  display:block;
  width:100%;
  background:var(--etp-gold-1);
  color:#1c1608;
  font-family:'DM Sans',sans-serif;
  font-size:16px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.3px;
  padding:16px 24px;
  border-radius:8px;
  border:none;
  cursor:pointer;
  margin-top:14px;
  transition:background .2s;
}
.popup-btn:hover{ background:var(--etp-gold-2); }
.popup-error{
  font-size:12px;
  color:#ff6b6b;
  margin-top:-8px;
  margin-bottom:8px;
  display:none;
  text-align:left;
}
