:root{ --phcw-primary:#111827; --phcw-accent:#0ea5e9; }

#phcw-root{ position:fixed; z-index:2147483000; right:16px; bottom:16px; font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif; }

#phcw-root .phcw-launcher{
  width:56px; height:56px; border-radius:50%; border:none; cursor:pointer;
  background: var(--phcw-accent);
  box-shadow: 0 10px 25px rgba(0,0,0,.25);
  display:flex; align-items:center; justify-content:center;
}

#phcw-root .phcw-launcher-icon{
  width:28px; height:28px; display:block;
  background-size:contain; background-repeat:no-repeat; background-position:center;
  /* default chat icon */
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000000'%3E%3Cpath d='M20 2H4a2 2 0 0 0-2 2v18l4-4h14a2 2 0 0 0 2-2V4a2 2 0 0 0-2-2zm-2 9H6V9h12v2zm0-3H6V6h12v2zm-5 6H6v-2h7v2z'/%3E%3C/svg%3E");
  filter: drop-shadow(0 1px 0 rgba(255,255,255,.25));
}

#phcw-root .phcw-overlay{
  position:fixed; inset:0; background:rgba(0,0,0,.55);
}

#phcw-root .phcw-modal{
  position:fixed;
  right:16px;
  bottom:88px;
  width:min(92vw, 420px);
  border-radius:24px;
  overflow:hidden;
  background: rgba(17,24,39,.92);
  color:#fff;
  box-shadow: 0 24px 60px rgba(0,0,0,.45);
  backdrop-filter: blur(10px);
}

#phcw-root .phcw-modal-header{
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 14px;
}

#phcw-root .phcw-header-center{ display:flex; gap:12px; align-items:center; }
#phcw-root .phcw-title{ font-size:22px; font-weight:700; line-height:1.1; }
#phcw-root .phcw-subtitle{ font-size:13px; opacity:.85; margin-top:2px; }

#phcw-root .phcw-logo{ width:48px; height:48px; border-radius:50%; object-fit:cover; background:#fff; }
#phcw-root .phcw-logo-fallback{ background:rgba(255,255,255,.15); }

#phcw-root .phcw-close,
#phcw-root .phcw-back{
  width:36px; height:36px; border-radius:50%; border:none; cursor:pointer;
  background:rgba(255,255,255,.12); color:#fff;
  display:flex; align-items:center; justify-content:center;
}
#phcw-root .phcw-back span{ font-size:22px; line-height:1; }
#phcw-root .phcw-close span{ font-size:22px; line-height:1; }

#phcw-root .phcw-modal-body{ padding: 0 14px 14px 14px; }

#phcw-root .phcw-helptext{ margin: 14px 0 6px 0; font-size:14px; opacity:.9; }

#phcw-root .phcw-h3{ margin: 10px 0 12px 0; font-size:18px; font-weight:700; }

#phcw-root .phcw-form{ display:flex; flex-direction:column; gap:10px; }
#phcw-root .phcw-input,
#phcw-root .phcw-textarea{
  width:100%; border:none; border-radius:12px;
  background: rgba(255,255,255,.85);
  padding: 14px 14px;
  font-size:14px;
}
#phcw-root .phcw-textarea{ min-height:120px; resize:vertical; }

#phcw-root .phcw-primary{
  margin-top:6px;
  width:100%;
  border:none;
  border-radius:14px;
  padding: 14px;
  font-size:16px;
  font-weight:700;
  cursor:pointer;
  background: rgba(0,0,0,.55);
  color:#fff;
  display:flex; align-items:center; justify-content:center;
  gap:10px;
}

#phcw-root .phcw-modal-footer{
  display:flex;
  gap:0;
  background: rgba(0,0,0,.25);
}

#phcw-root .phcw-tab{
  flex:1; border:none; background:transparent; color:#fff;
  padding: 12px 10px;
  cursor:pointer;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:6px;
}
#phcw-root .phcw-tab-icon{ width:22px; height:22px; display:block; background-repeat:no-repeat; background-size:contain; background-position:center; opacity:.95; }
#phcw-root .phcw-tab-label{ font-size:13px; opacity:.95; }

#phcw-root .phcw-ico-call{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'%3E%3Cpath d='M6.62 10.79a15.05 15.05 0 0 0 6.59 6.59l2.2-2.2a1 1 0 0 1 1.01-.24c1.12.37 2.33.57 3.58.57a1 1 0 0 1 1 1V20a1 1 0 0 1-1 1C10.07 21 3 13.93 3 5a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1c0 1.25.2 2.46.57 3.59a1 1 0 0 1-.25 1.01l-2.2 2.19z'/%3E%3C/svg%3E"); }
#phcw-root .phcw-ico-chat{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'%3E%3Cpath d='M20 2H4a2 2 0 0 0-2 2v18l4-4h14a2 2 0 0 0 2-2V4a2 2 0 0 0-2-2zm-2 9H6V9h12v2zm0-3H6V6h12v2zm-5 6H6v-2h7v2z'/%3E%3C/svg%3E"); }

@media (max-width: 600px){
  #phcw-root{ right: 12px; }
  #phcw-root .phcw-modal{ right:12px; width: min(94vw, 420px); bottom: 84px; }
}
