/* PLWE v1.5.x */
:root {
  --plwe-primary: #2563EB;
  --plwe-accent: #FBBF24;
  --plwe-header-text: #ffffff;
  --plwe-dark: #1F1F1F;
  --plwe-bubble-author: #F3F4F6;
  --plwe-bubble-visitor: #FFF7D6;
  --plwe-dock-bg: #111827;
  --plwe-dock-text: #ffffff;
  --plwe-font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
  --plwe-font-size: 14px;
}
* { box-sizing: border-box; }
.plwe-unread-badge { display:inline-flex; min-width: 18px; height:18px; align-items:center; justify-content:center; padding:0 6px; border-radius:9999px; background:var(--plwe-accent); color:#111; font-size:12px; font-weight:700; }

/* ===== Visitor Floating Panel ===== */
.plwe-visitor-float { position: fixed; z-index: 99999; bottom: 88px; right: 16px; width: 360px; max-width: calc(100vw - 24px); border-radius: 24px; overflow: hidden; background: #fff; display:flex; flex-direction:column; font-family: var(--plwe-font-family); font-size: var(--plwe-font-size); box-shadow: 0 20px 40px rgba(0,0,0,.22); transform: translateY(10px); opacity: 0; pointer-events: none; transition: all .22s ease; }
.plwe-visitor-float.open { transform: translateY(0); opacity: 1; pointer-events: auto; }
.plwe-visitor-float.left-bottom { left: 16px; right: auto; }
.plwe-visitor-float.rtl .plwe-header .meta { text-align: right; }

.plwe-header { background: var(--plwe-accent); color: var(--plwe-header-text); padding: 12px 16px; display:flex; align-items:center; gap:12px; }
.plwe-header .avatar { width: 36px; height: 36px; border-radius: 9999px; overflow: hidden; background: rgba(0,0,0,.1); }
.plwe-header .meta { flex: 1; }
.plwe-header .title { font-weight: 800; line-height: 1.2; }
.plwe-header .status { font-size: 12px; opacity: .95; display:flex; align-items:center; gap:6px; }
.plwe-dot { width: 8px; height: 8px; border-radius: 9999px; background: #10B981; display:inline-block; }
.plwe-dot.off { background:#ef4444; }
.plwe-x { background: transparent; border: none; font-size: 18px; line-height: 1; cursor: pointer; color: var(--plwe-header-text); }
.plwe-body { background:#F9FAFB; }
.plwe-before { padding: 16px; display: grid; gap: 12px; }
.plwe-input { width: 100%; padding: 12px 14px; border-radius: 12px; border: 1px solid #e5e7eb; outline: none; }
.plwe-input:focus { border-color: var(--plwe-primary); box-shadow: 0 0 0 3px rgba(37,99,235,.15); }
.plwe-start { background: var(--plwe-accent); color: var(--plwe-header_text); border: none; border-radius: 12px; padding: 12px 16px; font-weight: 700; cursor: pointer; }
.plwe-after { display:none; height: 100%; }
.plwe-messages { padding: 12px; height: 320px; overflow-y: auto; background: #fff; display:flex; flex-direction: column; gap: 10px; }
.plwe-msg { max-width: 82%; padding: 8px 11px; border-radius: 12px; box-shadow: 0 1px 0 rgba(0,0,0,.04); }
.plwe-msg.visitor { background: var(--plwe-bubble-visitor); align-self: flex-end; border-top-right-radius: 4px; }
.plwe-msg.author  { background: var(--plwe-bubble-author); align-self: flex-start; border-top-left-radius: 4px; }
.plwe-time { font-size: 11px; opacity: .65; margin-top: 3px; }
.plwe-editor { padding: 10px; background: #F3F4F6; display:flex; gap: 8px; align-items: center; }
.plwe-ta { flex:1; resize: none; min-height: 50px; height:50px; padding: 12px 14px; border-radius: 14px; border:1px solid #e5e7eb; outline:none; }
.plwe-send { width: 42px; height: 42px; border: 1px solid #e5e7eb; border-radius: 12px; background: #fff; color: #111; font-weight: 900; cursor: pointer; display:flex; align-items:center; justify-content:center; }
.plwe-send:after { content: '➤'; font-size:16px; }

.plwe-error { color: #DC2626; font-size: 12px; padding: 0 16px 12px; display:none; }

/* Docked pill */
.plwe-dock { position: fixed; bottom: 16px; right: 16px; z-index: 99998; display: inline-flex; align-items:center; gap:12px; padding: 12px 16px; border-radius: 9999px; background: var(--plwe-dock-bg); color: var(--plwe-dock-text); font-family: var(--plwe-font-family); font-weight: 700; box-shadow: 0 12px 28px rgba(0,0,0,.18); cursor: pointer; }
.plwe-dock.left-bottom { left: 16px; right:auto; }
.plwe-dock .plwe-dock-icon { width: 28px; height: 28px; border-radius: 9999px; background: rgba(255,255,255,.08); display:flex; align-items:center; justify-content:center; }

/* ===== Author Inbox ===== */
.plwe-author-inbox { display: grid; grid-template-columns: 1fr 360px; gap: 16px; min-height: 560px; font-family: var(--plwe-font-family); font-size: var(--plwe-font-size); }
.plwe-inbox-view,.plwe-inbox-list { border:1px solid #e5e7eb; border-radius: 24px; overflow: hidden; background:#fff; box-shadow: 0 10px 24px rgba(0,0,0,.06); display:flex; flex-direction: column; }
.plwe-inbox-view .head,.plwe-inbox-list .head { background: var(--plwe-dark); color: #fff; padding: 14px 16px; font-weight: 700; display:flex; align-items:center; gap:12px; }
.plwe-head-back { display:none; border:0; background:transparent; color:#fff; font-size:20px; line-height:1; cursor:pointer; }
.plwe-inbox-view .messages { padding: 16px; height: 420px; overflow-y: auto; display:flex; flex-direction: column; gap: 10px; }
.plwe-controls { display:flex; gap: 8px; padding: 8px 16px 0 16px; justify-content:center; align-items:center; }
.plwe-chip-btn,.plwe-chip-link { background: #fff; color:#111; border:1px solid #e5e7eb; border-radius: 10px; padding: 6px 10px; font-weight:600; text-decoration:none; display:inline-flex; align-items:center; cursor:pointer; }
.plwe-chip-btn:hover,.plwe-chip-link:hover { background:#f3f4f6; }
.plwe-inbox-view .foot { padding: 8px 16px 12px 16px; display:flex; gap:12px; align-items:center; background:#F3F4F6; }
.plwe-arrow-send { width: 42px; height: 42px; border: 1px solid #e5e7eb; background:#fff; border-radius:12px; position: relative; cursor:pointer; flex: 0 0 auto; display:flex; align-items:center; justify-content:center; }
.plwe-arrow-send:before { content:'➤'; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); font-weight:900; }
.plwe-inbox-view textarea { flex:1; min-height: 50px; border:1px solid #E5E7EB; border-radius: 12px; padding: 12px 14px; outline:none; resize: vertical; background:#fff; }
.plwe-inbox-list .items { overflow-y:auto; flex:1; }
.plwe-inbox-item { padding: 14px 16px; border-top:1px solid #f3f4f6; cursor:pointer; display:flex; gap:10px; align-items:flex-start; }
.plwe-inbox-item:hover { background:#fafafa; }
.plwe-inbox-item .num { width: 26px; height: 26px; border-radius: 9999px; background: var(--plwe-accent) !important; color:#111 !important; font-weight:800; display:flex; align-items:center; justify-content:center; margin-inline-start:auto; }

/* Toggle switch for header checkbox */
.plwe-toggle-accept { appearance:none; -webkit-appearance:none; width:46px; height:26px; background:#d1d5db; border-radius:9999px; position:relative; outline:none; cursor:pointer; border:none; }
.plwe-toggle-accept::after { content:''; position:absolute; width:22px; height:22px; background:#fff; top:2px; left:2px; border-radius:9999px; box-shadow:0 1px 2px rgba(0,0,0,.2); transition: transform .2s ease; }
.plwe-toggle-accept:checked { background:#10B981; }
.plwe-toggle-accept:checked::after { transform: translateX(20px); }

/* Mobile overlay like WhatsApp */
@media (max-width: 900px) {
  .plwe-author-inbox { grid-template-columns: 1fr; }
  .plwe-inbox-view { position: fixed; inset: 0; border:0; border-radius: 0; z-index: 99999; transform: translateX(100%); transition: transform .22s ease; }
  .plwe-inbox-view.plwe-open { transform: translateX(0); }
  .plwe-head-back { display:inline-block; }
}

/* Chat bubbles shared */
.plwe-msg { max-width: 82%; padding: 8px 11px; border-radius: 12px; box-shadow: 0 1px 0 rgba(0,0,0,.04); }
.plwe-msg.author { background: var(--plwe-bubble-author); align-self:flex-start; border-top-left-radius: 4px; }
.plwe-msg.visitor { background: var(--plwe-bubble-visitor); align-self:flex-end; border-top-right-radius: 4px; }
.plwe-time { font-size: 11px; opacity: .65; margin-top: 3px; }