/* =========================
   ProWeb WhatsApp Chat – Frontend Modal
   Modern look with green banner (like WhatsApp help widgets)
   Default styles play nicely with Elementor overrides you already added.
========================= */

/* Floating Button (Elementor may restyle; keep sensible defaults) */
.pwcw-widget.pwcw-right { position: fixed; right: 20px; bottom: 20px; z-index: 9999; }
.pwcw-widget.pwcw-left  { position: fixed; left:  20px; bottom: 20px; z-index: 9999; }
.pwcw-fab{
  width:56px;height:56px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:#25D366;color:#fff;border:none;cursor:pointer;
  box-shadow:0 8px 24px rgba(0,0,0,.18);
  transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.pwcw-fab:hover{ transform:translateY(-1px); box-shadow:0 10px 28px rgba(0,0,0,.22); }

/* Overlay */
.pwcw-modal{
  display:none; position:fixed; inset:0; z-index:10000;
  background: rgba(2,6,12,.55);
}

/* Card (container) */
.pwcw-card{
  position:relative;
  width: min(92vw, 520px);
  margin: 8vh auto;
  background:#fff;
  border-radius:16px;
  overflow:hidden;
  box-shadow: 0 24px 60px rgba(0,0,0,.18);
}

/* Close button (Elementor overrides allowed) */
.pwcw-close{
  position:absolute; top:12px; right:12px;
  width:32px;height:32px;border-radius:999px;
  border:1px solid rgba(0,0,0,.08);
  background:#fff;color:#111;display:flex;align-items:center;justify-content:center;
  cursor:pointer; line-height:1; padding:0;
  box-shadow:0 4px 10px rgba(0,0,0,.08);
}
.pwcw-close:hover{ background:#f5f5f5; }

/* ===== Banner (like screenshot) ===== */
.pwcw-banner{
  display:flex;gap:12px;align-items:center;
  padding:18px 18px;
  color:#fff;
  background: linear-gradient(180deg, #27d06a 0%, #21c35f 60%, #1fb357 100%);
}
.pwcw-badge{
  flex:0 0 auto;
  width:36px;height:36px;border-radius:999px;
  background:#fff;color:#25D366;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 6px 16px rgba(0,0,0,.12);
}
.pwcw-banner-text .pwcw-title{
  margin:0; font-size:18px; line-height:1.25; font-weight:800; color:#fff;
}
.pwcw-subtitle{
  margin:.15rem 0 0 0; font-size:14px; line-height:1.4; opacity:.95;
}
.pwcw-subtitle strong{ text-decoration:underline; }

/* Meta strip under banner */
.pwcw-meta{
  display:flex; align-items:center; gap:8px;
  padding:10px 16px; background:#f7faf9; border-bottom:1px solid #e8efe9; color:#667085; font-size:12.5px;
}
.pwcw-dot{ width:8px;height:8px;border-radius:999px;background:#25D366; display:inline-block; box-shadow:0 0 0 3px rgba(37,211,102,.2); }

/* Form area */
.pwcw-form{ padding:16px; }
.pwcw-grid{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
@media (max-width: 520px){ .pwcw-grid{ grid-template-columns:1fr; } }

.pwcw-field{ display:flex; flex-direction:column; gap:6px; }
.pwcw-label{ font-size:12px; color:#667085; font-weight:600; letter-spacing:.01em; }

.pwcw-input{
  width:100%;
  padding:10px 12px;
  background:#fff;
  border:1px solid #e4e7ec;
  border-radius:10px;
  color:#111827;
  transition:border-color .15s ease, box-shadow .15s ease, background .15s ease;
}
.pwcw-input:focus{
  outline:none;
  border-color:#25D366;
  box-shadow:0 0 0 3px rgba(37,211,102,.25);
  background:#fff;
}
.pwcw-textarea{ min-height:110px; resize:vertical; }

/* Actions */
.pwcw-actions{
  display:flex; gap:10px; justify-content:flex-end; margin-top:12px;
}
.pwcw-btn{
  border-radius:10px; border:1px solid transparent;
  padding:10px 14px; cursor:pointer; font-weight:600;
  transition:transform .1s ease, box-shadow .15s ease, background .15s ease, color .15s ease, border-color .15s ease;
}
.pwcw-btn:active{ transform:translateY(1px); }

/* Cancel (secondary) */
.pwcw-btn-cancel{
  background:#f7f8f9; color:#111827; border-color:#e6e7eb;
}
.pwcw-btn-cancel:hover{ background:#eef1f3; }

/* Primary */
.pwcw-btn-primary{
  background:#25D366; color:#fff; border-color:#20b95a;
  box-shadow:0 6px 18px rgba(37,211,102,.28);
}
.pwcw-btn-primary:hover{ background:#1fb357; }

/* Powered by */
.pwcw-powered{
  margin-top:10px; display:flex; align-items:center; gap:8px;
  color:#98a2b3; font-size:12px;
}
.pwcw-powered img{ display:block; }

/* Dark scheme tweaks */
@media (prefers-color-scheme: dark){
  .pwcw-card{ background:#0f172a; box-shadow:0 24px 60px rgba(0,0,0,.5); }
  .pwcw-close{ background:#0b1222; color:#e5e7eb; border-color:rgba(255,255,255,.08); }
  .pwcw-meta{ background:#0b1222; border-bottom-color:#1f2937; color:#9aa3b2; }
  .pwcw-input{ background:#0b1222; border-color:#1f2937; color:#e5e7eb; }
  .pwcw-btn-cancel{ background:#0b1222; color:#e5e7eb; border-color:#1f2937; }
  .pwcw-powered{ color:#9aa3b2; }
}