/* Isolation */
#wcw-root{all:initial;}
#wcw-root, #wcw-root *{
  box-sizing:border-box;
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}

/* Floating button (bigger) */
.wcw-fab{
  position:fixed;
  bottom:22px;
  width:68px;
  height:68px;
  border-radius:999px;
  background:#25D366;
  box-shadow:0 12px 30px rgba(0,0,0,.25);
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  z-index:2147483000;
}
.wcw-fab.wcw-left{left:22px;}
.wcw-fab.wcw-right{right:22px;}
.wcw-fab .wcw-icon-slot{display:flex;align-items:center;justify-content:center;}
.wcw-fab .wcw-icon-slot svg{width:34px;height:34px;fill:#fff;}
.wcw-fab .wcw-icon-slot img{width:34px;height:34px;object-fit:contain;}

/* Badge (orange bg, white number, circular) */
.wcw-badge{
  position:absolute;
  top:-6px;
  right:-6px;
  width:22px;
  height:22px;
  background:#ff8c00;
  color:#fff;
  border-radius:50%;
  border:2px solid #fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font:800 12px/1 system-ui,-apple-system,Segoe UI,Roboto,Arial;
}
.wcw-badge.jump{animation:wcwBadgeJump .35s ease-out;}
@keyframes wcwBadgeJump{
  0%{transform:translateY(6px) scale(.85);opacity:.4;}
  60%{transform:translateY(-2px) scale(1.1);opacity:1;}
  100%{transform:translateY(0) scale(1);opacity:1;}
}

/* Panel */
.wcw-panel{
  position:fixed;
  bottom:102px;
  border-radius:14px;
  overflow:hidden;
  box-shadow:0 18px 50px rgba(0,0,0,.35);
  background:#ECE5DD;
  z-index:2147483001;
  display:none;
}
.wcw-panel.wcw-left{left:22px;}
.wcw-panel.wcw-right{right:22px;}
.wcw-panel.open{display:flex;flex-direction:column;}

/* Header (WhatsApp colors) */
.wcw-header{
  background:#075E54;
  color:#fff;
  padding:12px 12px;
  display:flex;
  align-items:center;
  gap:10px;
}
.wcw-avatar{
  width:36px;
  height:36px;
  border-radius:999px;
  background:#25D366;
  display:flex;
  align-items:center;
  justify-content:center;
}
.wcw-avatar .wcw-icon-slot{display:flex;align-items:center;justify-content:center;}
.wcw-avatar .wcw-icon-slot svg{width:18px;height:18px;fill:#fff;}
.wcw-avatar .wcw-icon-slot img{width:18px;height:18px;object-fit:contain;}
.wcw-title{display:flex;flex-direction:column;line-height:1.1;}
.wcw-title strong{font-size:14px;}
.wcw-title span{font-size:12px;opacity:.9;}

/* Close button (whatsapp style) */
.wcw-close{
  margin-left:auto;
  background:transparent !important;
  border:0 !important;
  color:#fff !important;
  cursor:pointer;
  font-size:20px;
  line-height:1;
  width:32px;
  height:32px;
  border-radius:999px;
}
.wcw-close:hover{
  background:rgba(255,255,255,0.15) !important;
}

/* Messages area */
.wcw-body{
  padding:12px;
  overflow:auto;
  background-color:#ECE5DD;
  background-repeat:repeat;
  background-size:auto;
}
.wcw-bubble{
  max-width:86%;
  background:#fff;
  border-radius:10px;
  padding:8px 10px;
  margin:0 0 8px 0;
  box-shadow:0 1px 0 rgba(0,0,0,.06);
  font-size:13px;
  color:#111;
}
.wcw-bubble.me{
  background:#DCF8C6;
  margin-left:auto;
}
.wcw-meta{
  font-size:11px;
  opacity:.55;
  margin-top:4px;
  text-align:right;
}

/* Typing bubble */
.wcw-typing{
  display:inline-flex;
  align-items:center;
  gap:4px;
  padding:8px 10px;
  background:#fff;
  border-radius:10px;
  box-shadow:0 1px 0 rgba(0,0,0,.06);
  margin-bottom:8px;
}
.wcw-typing span{
  width:6px;
  height:6px;
  background:#999;
  border-radius:50%;
  animation:wcwTyping 1.4s infinite both;
}
.wcw-typing span:nth-child(2){animation-delay:.2s;}
.wcw-typing span:nth-child(3){animation-delay:.4s;}
@keyframes wcwTyping{
  0%{opacity:.2;}
  20%{opacity:1;}
  100%{opacity:.2;}
}

/* Footer */
.wcw-footer{
  background:#f0f0f0;
  padding:10px;
  display:flex;
  gap:8px;
  align-items:center;
  border-top:1px solid rgba(0,0,0,.08);
}
.wcw-input{
  flex:1;
  background:#fff;
  border:1px solid rgba(0,0,0,.12);
  border-radius:999px;
  padding:10px 12px;
  font-size:13px;
  outline:none;
}
.wcw-send{
  width:40px;
  height:40px;
  border-radius:10px;
  border:0 !important;
  cursor:pointer;
  background:#25D366 !important;
  display:flex;
  align-items:center;
  justify-content:center;
}
.wcw-send:hover{background:#20bd5a !important;}
.wcw-send svg{width:18px;height:18px;fill:#fff;}

/* Form */
.wcw-form{display:grid;gap:10px;}
.wcw-field label{display:block;font-size:12px;opacity:.85;margin-bottom:4px;}
.wcw-field input{
  width:100%;
  border:1px solid rgba(0,0,0,.14);
  border-radius:10px;
  padding:10px 10px;
  font-size:13px;
  outline:none;
  background:#fff;
}
.wcw-privacy{font-size:11px;opacity:.75;margin-top:4px;}
.wcw-privacy a{color:#075E54;text-decoration:underline;}


/* === v1.2.2 Layout Fix: input sempre no fundo ===
   Motivo: .wcw-panel.open estava com display:block e sobrescrevia o flex.
*/
.wcw-panel.open{display:flex;flex-direction:column;}
.wcw-body{
  flex:1 1 auto !important;
  height:auto !important; /* evita altura fixa via JS antigo */
  overflow:auto !important;
}
.wcw-footer{
  margin-top:auto !important;
}


/* === LAYOUT FIX v1.2.3: footer fixo no fundo e sem abrir sozinho === */
.wcw-panel.open{display:flex !important;flex-direction:column !important;}
.wcw-body{flex:1 1 auto !important;overflow-y:auto !important;min-height:0 !important;}
.wcw-footer{flex:0 0 auto !important;}

/* === WhatsApp official send icon === */
.wcw-send-btn svg{
  width:22px;
  height:22px;
  fill:#ffffff;
}

/* === Adjusted send icon size (bigger) === */
.wcw-send-btn svg{
  width: 28px;
  height: 28px;
}


/* WCW_MOBILE_ICON_FIX: ensure WhatsApp icon is centered and scales correctly on mobile */
.wcw-fab{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  overflow:hidden !important;
  line-height:1 !important;
}
.wcw-fab img,
.wcw-fab svg{
  display:block !important;
  width:60% !important;
  height:60% !important;
  max-width:70% !important;
  max-height:70% !important;
  object-fit:contain !important;
}
/* Some themes apply global img max-width:100% and inline svg styles; keep it stable */
.wcw-fab svg{
  flex:0 0 auto !important;
}
@media (max-width: 768px){
  .wcw-fab{
    -webkit-tap-highlight-color: transparent;
    transform: translateZ(0); /* avoid iOS scaling glitches */
  }
  .wcw-fab img,
  .wcw-fab svg{
    width:62% !important;
    height:62% !important;
  }
}


/* WCW_MOBILE_ICON_FIX_V2: Strong overrides to prevent theme SVG rules breaking icon on mobile */
#wcw-fab.wcw-fab{display:flex !important;align-items:center !important;justify-content:center !important;line-height:0 !important;}
#wcw-fab .wcw-icon-slot{width:100% !important;height:100% !important;display:flex !important;align-items:center !important;justify-content:center !important;line-height:0 !important;}
#wcw-fab .wcw-icon-slot svg,
#wcw-fab .wcw-icon-slot img{
  display:block !important;
  width:62% !important;
  height:62% !important;
  max-width:70% !important;
  max-height:70% !important;
  object-fit:contain !important;
}
#wcw-fab .wcw-icon-slot svg{fill:#fff !important;}

/* Header icon inside chat panel (mobile theme can affect SVG) */
#wcw-header-icon svg,
#wcw-header-icon img{
  display:block !important;
  width:22px !important;
  height:22px !important;
  object-fit:contain !important;
}
@media (max-width: 768px){
  #wcw-fab .wcw-icon-slot svg,
  #wcw-fab .wcw-icon-slot img{width:65% !important;height:65% !important;}
}


/* WCW_DESKTOP_BADGE_FIX: keep badge fully visible on desktop and still constrain icon */
.wcw-fab{ overflow:visible !important; }
.wcw-fab .wcw-icon-slot{
  width:34px;
  height:34px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden; /* constrain svg/img without clipping badge */
}
.wcw-fab .wcw-icon-slot svg,
.wcw-fab .wcw-icon-slot img{
  width:100% !important;
  height:100% !important;
  max-width:100% !important;
  max-height:100% !important;
  object-fit:contain !important;
}