#woo-chat-pwa.woo-chat-pwa{position:fixed;z-index:999999;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif}
#woo-chat-pwa .woo-chat-toggle{border:0;background:transparent;cursor:pointer;padding:0;width:56px;height:56px;border-radius:999px;box-shadow:0 10px 30px rgba(0,0,0,.35);position:relative;overflow:visible}
#woo-chat-pwa .woo-chat-unread{position:absolute;top:-6px;right:-6px;min-width:20px;height:20px;padding:0 6px;border-radius:999px;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:800;line-height:1;box-shadow:0 10px 20px rgba(0,0,0,.35)}
/* ensure hidden unread badge never shows */
#woo-chat-pwa .woo-chat-unread[hidden]{display:none !important}
#woo-chat-pwa .woo-chat-toggle img{width:56px;height:56px;display:block}
#woo-chat-pwa[data-open="0"] .woo-chat-icon-opened{display:none}
#woo-chat-pwa[data-open="1"] .woo-chat-icon-closed{display:none}

#woo-chat-pwa .woo-chat-panel{display:none;position:absolute;width:340px;max-width:calc(100vw - 24px);height:520px;max-height:calc(100vh - 120px);background:#0b141a;border-radius:18px;box-shadow:0 18px 50px rgba(0,0,0,.45);overflow:hidden}
#woo-chat-pwa[data-open="1"] .woo-chat-panel{display:flex;flex-direction:column}

#woo-chat-pwa .woo-chat-header{display:flex;align-items:center;justify-content:space-between;padding:12px 12px 12px 14px;background:#111b21;border-bottom:1px solid rgba(255,255,255,.06)}
#woo-chat-pwa .woo-chat-title{font-weight:600;letter-spacing:.2px}
#woo-chat-pwa .woo-chat-close{border:0;background:transparent;color:#cbd5e1;font-size:22px;line-height:1;padding:4px 8px;cursor:pointer}

#woo-chat-pwa .woo-chat-messages{flex:1;overflow:auto;padding:14px;background:#0b141a;background-size:cover;background-position:center}
#woo-chat-pwa .woo-chat-row{display:flex;margin:8px 0}
#woo-chat-pwa .woo-chat-row.me{justify-content:flex-end}
#woo-chat-pwa .woo-chat-bubble{max-width:78%;padding:10px 10px 8px;border-radius:14px;position:relative;white-space:pre-wrap;word-break:break-word}
#woo-chat-pwa .woo-chat-row.me .woo-chat-bubble{background:var(--wcpwa-bubble-me-bg,#005c4b)}
#woo-chat-pwa .woo-chat-row.them .woo-chat-bubble{background:var(--wcpwa-bubble-them-bg,#202c33)}
#woo-chat-pwa .woo-chat-time{display:block;font-size:11px;opacity:.75;margin-top:6px;text-align:right}

#woo-chat-pwa .woo-chat-actions{padding:10px 12px;background:#0b141a;border-top:1px solid rgba(255,255,255,.06)}
#woo-chat-pwa .woo-chat-help{width:100%;border:0;border-radius:12px;padding:10px 12px;font-weight:700;cursor:pointer}

#woo-chat-pwa .woo-chat-inputbar{display:flex;gap:8px;padding:10px 12px;background:#111b21;border-top:1px solid rgba(255,255,255,.06)}
#woo-chat-pwa .woo-chat-input{flex:1;border:1px solid rgba(255,255,255,.12);background:#0b141a;border-radius:999px;padding:10px 12px;outline:none}
#woo-chat-pwa .woo-chat-send{border:0;background:#25D366;color:#081018;border-radius:999px;padding:10px 14px;font-weight:700;cursor:pointer}

/* positions */
#woo-chat-pwa.pos-bottom-right{right:18px;bottom:18px}
#woo-chat-pwa.pos-bottom-left{left:18px;bottom:18px}
#woo-chat-pwa.pos-top-right{right:18px;top:18px}
#woo-chat-pwa.pos-top-left{left:18px;top:18px}
#woo-chat-pwa.pos-right{right:18px;top:50%;transform:translateY(-50%)}
#woo-chat-pwa.pos-left{left:18px;top:50%;transform:translateY(-50%)}
#woo-chat-pwa.pos-top{left:50%;top:18px;transform:translateX(-50%)}
#woo-chat-pwa.pos-bottom{left:50%;bottom:18px;transform:translateX(-50%)}

/* panel anchor near button */
#woo-chat-pwa.pos-bottom-right .woo-chat-panel{right:0;bottom:70px}
#woo-chat-pwa.pos-bottom-left .woo-chat-panel{left:0;bottom:70px}
#woo-chat-pwa.pos-top-right .woo-chat-panel{right:0;top:70px}
#woo-chat-pwa.pos-top-left .woo-chat-panel{left:0;top:70px}
#woo-chat-pwa.pos-right .woo-chat-panel{right:0;top:calc(50% - 260px)}
#woo-chat-pwa.pos-left .woo-chat-panel{left:0;top:calc(50% - 260px)}
#woo-chat-pwa.pos-top .woo-chat-panel{left:50%;transform:translateX(-50%);top:70px}
#woo-chat-pwa.pos-bottom .woo-chat-panel{left:50%;transform:translateX(-50%);bottom:70px}

@media (max-width:420px){
  #woo-chat-pwa .woo-chat-panel{width:calc(100vw - 24px);height:calc(100vh - 120px)}
}