*{box-sizing:border-box}
.wa-popup-overlay{
  display:none;
  position:fixed;
  inset:0;
  background:rgba(0,0,0,0.55);
  z-index:99999;
  align-items:center;
  justify-content:center;
  padding:16px;
}
.wa-popup-overlay.active{display:flex;}
.wa-popup{
  background:linear-gradient(160deg,#fffdf5 0%,#fdf6e3 100%);
  border-radius:16px;
  width:100%;
  max-width:520px;
  max-height:90vh;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  font-family:sans-serif;
  box-shadow:0 8px 40px rgba(0,0,0,0.22);
}
.wa-popup-header{
  background:linear-gradient(135deg,#7a5c1e 0%,#a07828 60%,#c49a38 100%);
  padding:18px 22px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-shrink:0;
}
.wa-popup-header-left{display:flex;align-items:center;gap:12px;}
.wa-popup-logo{
  width:44px;height:44px;border-radius:50%;
  background:rgba(255,255,255,0.15);
  display:flex;align-items:center;
  justify-content:center;
  border:2px solid rgba(255,255,255,0.4);
  flex-shrink:0;
}
.wa-popup-logo svg{width:22px;height:22px;}
.wa-popup-title{color:#fff;font-size:15px;font-weight:600;font-family:Georgia,serif;margin:0 0 2px;}
.wa-popup-sub{color:rgba(255,255,255,0.78);font-size:11px;margin:0;}
.wa-popup-close{
  background:rgba(255,255,255,0.15);
  border:none;color:#fff;
  font-size:20px;cursor:pointer;
  width:30px;height:30px;
  border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;transition:background 0.2s;
}
.wa-popup-close:hover{background:rgba(255,255,255,0.28);}
.wa-popup-body{
  padding:20px 22px 24px;
  overflow-y:auto;
  flex:1;
}
.wa-popup-body::-webkit-scrollbar{width:5px;}
.wa-popup-body::-webkit-scrollbar-track{background:#fdf6e3;}
.wa-popup-body::-webkit-scrollbar-thumb{background:#e0c97a;border-radius:4px;}
.wa-popup-body::-webkit-scrollbar-thumb:hover{background:#a07828;}
.wa-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.wa-form-group{display:flex;flex-direction:column;gap:5px;}
.wa-form-group.full{grid-column:1/-1;}
.wa-form-group label{
  font-size:10px;letter-spacing:0.8px;
  text-transform:uppercase;color:#8a6e2f;font-weight:600;
}
.wa-form-group input,
.wa-form-group select{
  background:#fff;
  border:1.5px solid #e0c97a;
  border-radius:8px;
  padding:9px 12px;
  color:#4a3510;
  font-size:13px;
  font-family:sans-serif;
  outline:none;
  width:100%;
  transition:border 0.2s,box-shadow 0.2s;
}
.wa-form-group input::placeholder{color:#c4a96a;}
.wa-form-group input:focus,
.wa-form-group select:focus{
  border-color:#a07828;
  box-shadow:0 0 0 3px rgba(160,120,40,0.12);
}
.wa-form-group select{
  cursor:pointer;
  appearance:none;
  -webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23a07828' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 11px center;
  padding-right:30px;
}
.wa-form-group select option{background:#fff;color:#4a3510;}
.wa-form-divider{grid-column:1/-1;border:none;border-top:1px solid #e8d48a;margin:4px 0;}
 
/* Date picker icon */
input[type="date"]::-webkit-calendar-picker-indicator{
  filter:invert(0.4) sepia(1) saturate(3) hue-rotate(5deg);
  cursor:pointer;
}
 
/* Number input spinner */
.wa-form-group input[type="number"]::-webkit-outer-spin-button,
.wa-form-group input[type="number"]::-webkit-inner-spin-button{
  -webkit-appearance:auto;
  opacity:1;
  filter:invert(0.4) sepia(1) saturate(3) hue-rotate(5deg);
  cursor:pointer;
  margin-right:2px;
}
.wa-form-group input[type="number"]{
  -moz-appearance:number-input;
}
 
.wa-preview-box{
  background:#fff8e8;
  border:1px solid #e0c97a;
  border-radius:8px;
  padding:10px 13px;
  margin-top:12px;
  font-size:11px;
  color:#8a6e2f;
  line-height:1.7;
}
.wa-preview-label{
  color:#a07828;font-size:10px;
  letter-spacing:0.5px;text-transform:uppercase;
  display:block;margin-bottom:3px;
}
.wa-send-btn{
  width:100%;margin-top:16px;
  background:linear-gradient(135deg,#25a244,#1a7a33);
  border:none;border-radius:10px;
  padding:13px 20px;color:#fff;
  font-size:14px;font-weight:600;
  cursor:pointer;display:flex;
  align-items:center;justify-content:center;
  gap:10px;font-family:sans-serif;
  transition:opacity 0.2s,transform 0.1s;
  box-shadow:0 4px 14px rgba(25,120,50,0.25);
}
.wa-send-btn:hover{opacity:0.92;}
.wa-send-btn:active{transform:scale(0.98);}
.wa-send-btn svg{width:20px;height:20px;flex-shrink:0;}