/* Synofex Chat Widget v2.2 — Fixed Size Premium */
:root{--ncw-pri:#4e61ff;--ncw-pri-txt:#fff;--ncw-btn:#4e61ff;--ncw-btn-txt:#fff;--ncw-ubg:#4e61ff;--ncw-utxt:#fff;--ncw-bbg:#f0f1f5;--ncw-btxt:#1f2937}
#ncw-btn,#ncw-box,#ncw-box *{box-sizing:border-box;font-family:'Inter',system-ui,-apple-system,sans-serif;-webkit-font-smoothing:antialiased}
.ncw-hidden{display:none!important}

/* ===== FAB BUTTON — Chat Bubble Logo ===== */
#ncw-btn{position:fixed;bottom:24px;z-index:999998;width:60px;height:60px;border-radius:50%;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;outline:none;background:var(--ncw-btn);color:var(--ncw-btn-txt);box-shadow:0 4px 20px rgba(0,0,0,.18);transition:transform .3s cubic-bezier(.34,1.56,.64,1),box-shadow .3s}
#ncw-btn:hover{transform:scale(1.06);box-shadow:0 6px 28px rgba(0,0,0,.22)}
#ncw-btn:active{transform:scale(.95)}
#ncw-btn .ncw-btn-icon{display:flex;align-items:center;justify-content:center;transition:transform .4s cubic-bezier(.34,1.56,.64,1),opacity .25s}
#ncw-btn .ncw-svg-icon{width:28px;height:28px;color:var(--ncw-btn-txt)}
#ncw-btn .ncw-emoji-icon{font-size:26px;line-height:1}
#ncw-btn .ncw-btn-icon img{width:30px;height:30px;object-fit:contain;border-radius:6px}
#ncw-btn .ncw-btn-close-icon{position:absolute;display:flex;align-items:center;justify-content:center;opacity:0;transform:rotate(-90deg) scale(.5);transition:transform .4s cubic-bezier(.34,1.56,.64,1),opacity .25s}
#ncw-btn.open .ncw-btn-icon{opacity:0;transform:rotate(90deg) scale(.5)}
#ncw-btn.open .ncw-btn-close-icon{opacity:1;transform:rotate(0) scale(1)}
/* Ping */
#ncw-btn::before{content:'';position:absolute;inset:-4px;border-radius:50%;background:var(--ncw-btn);opacity:0;animation:ncw-ping 2.5s cubic-bezier(0,.4,.6,1) infinite;pointer-events:none}
#ncw-btn.open::before{animation:none;opacity:0}
@keyframes ncw-ping{0%{transform:scale(1);opacity:.35}100%{transform:scale(1.5);opacity:0}}

/* ===== CHAT BOX — Fixed Size ===== */
#ncw-box{position:fixed;bottom:96px;z-index:999999;width:380px;height:600px;border-radius:20px;background:#fff;box-shadow:0 12px 48px rgba(0,0,0,.15);display:none;flex-direction:column;overflow:hidden;opacity:0;transform:translateY(16px) scale(.96);transition:opacity .35s cubic-bezier(.16,1,.3,1),transform .35s cubic-bezier(.16,1,.3,1)}
#ncw-box.open{display:flex;opacity:1;transform:translateY(0) scale(1)}

/* ===== HEADER ===== */
#ncw-head{position:relative;flex-shrink:0;overflow:visible}
.ncw-head-bg{position:absolute;inset:0;background:linear-gradient(135deg,var(--ncw-pri) 0%,color-mix(in srgb,var(--ncw-pri) 70%,#6d28d9) 100%);z-index:0}
.ncw-head-bg::after{content:'';position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none'%3E%3Cg fill='%23fff' fill-opacity='.04'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E")}
.ncw-head-content{position:relative;z-index:1;padding:18px 16px 16px}
.ncw-head-row{display:flex;align-items:center;justify-content:space-between}
.ncw-head-identity{display:flex;align-items:center;gap:12px}
.ncw-head-avatar{position:relative;width:42px;height:42px;border-radius:12px;background:rgba(255,255,255,.18);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;overflow:hidden;flex-shrink:0;border:2px solid rgba(255,255,255,.25)}
.ncw-head-avatar img{width:100%;height:100%;object-fit:cover;border-radius:10px}
.ncw-head-avatar span{font-size:20px;color:#fff}
.ncw-head-avatar .ncw-svg-icon{width:22px;height:22px;color:#fff}
.ncw-status-dot{position:absolute;bottom:-1px;right:-1px;width:12px;height:12px;background:#22c55e;border:2.5px solid var(--ncw-pri);border-radius:50%;z-index:2}
.ncw-head-text h3{margin:0;font-size:16px;font-weight:700;color:#fff;line-height:1.2}
.ncw-head-status{display:flex;align-items:center;gap:5px;margin-top:2px;font-size:12px;color:rgba(255,255,255,.75);font-weight:500}
.ncw-status-indicator{width:6px;height:6px;background:#22c55e;border-radius:50%;animation:ncw-pulse-dot 2s ease infinite}
@keyframes ncw-pulse-dot{0%,100%{opacity:1}50%{opacity:.4}}
.ncw-head-actions{display:flex;gap:4px}
.ncw-hdr-btn{width:34px;height:34px;border-radius:10px;border:none;background:rgba(255,255,255,.12);color:rgba(255,255,255,.85);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.2s;backdrop-filter:blur(4px)}
.ncw-hdr-btn:hover{background:rgba(255,255,255,.25);color:#fff}

/* Menu */
#ncw-menu{display:none;position:absolute;right:16px;top:100%;margin-top:-6px;background:#fff;border-radius:12px;box-shadow:0 8px 32px rgba(0,0,0,.12);overflow:hidden;z-index:10;min-width:180px;border:1px solid #e5e7eb}
#ncw-menu.show{display:block;animation:ncw-menu-in .2s ease}
@keyframes ncw-menu-in{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.ncw-menu-item{display:flex;align-items:center;gap:10px;width:100%;padding:12px 16px;border:none;background:none;cursor:pointer;font-size:13px;font-weight:500;color:#334155;transition:.15s;font-family:inherit}
.ncw-menu-item:hover{background:#f1f5f9}
.ncw-menu-item+.ncw-menu-item{border-top:1px solid #f1f5f9}

/* ===== LEAD FORM ===== */
#ncw-lead{flex:1;overflow-y:auto;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,#f8fafc,#fff);padding:24px 20px}
.ncw-lead-inner{width:100%;max-width:300px;text-align:center}
.ncw-lead-icon{margin-bottom:16px}
.ncw-lead-avatar{width:56px;height:56px;margin:0 auto;border-radius:16px;background:linear-gradient(135deg,var(--ncw-pri),color-mix(in srgb,var(--ncw-pri) 70%,#6d28d9));display:flex;align-items:center;justify-content:center;color:#fff;box-shadow:0 4px 16px rgba(78,97,255,.25);overflow:hidden}
.ncw-lead-avatar .ncw-svg-icon{width:28px;height:28px;color:#fff}
.ncw-lead-avatar img{width:100%;height:100%;object-fit:cover}
.ncw-lead-avatar span{font-size:26px}
.ncw-lead-title{margin:0 0 6px;font-size:18px;font-weight:700;color:#0f172a}
.ncw-lead-sub{margin:0 0 20px;font-size:13px;color:#64748b;line-height:1.5}
.ncw-lead-fields{display:flex;flex-direction:column;gap:10px;margin-bottom:18px}
.ncw-lead-field{display:flex;align-items:center;gap:10px;background:#fff;border:1.5px solid #e2e8f0;border-radius:12px;padding:0 14px;transition:border-color .2s,box-shadow .2s}
.ncw-lead-field:focus-within{border-color:var(--ncw-pri);box-shadow:0 0 0 3px rgba(78,97,255,.1)}
.ncw-lead-field svg{flex-shrink:0;opacity:.6}
.ncw-lead-field:focus-within svg{opacity:1;stroke:var(--ncw-pri)}
.ncw-lead-field input{border:none;outline:none;padding:13px 0;font-size:14px;color:#1e293b;background:transparent;width:100%;font-family:inherit}
.ncw-lead-field input::placeholder{color:#94a3b8}
.ncw-lead-btn{width:100%;padding:14px;border:none;border-radius:12px;background:linear-gradient(135deg,var(--ncw-pri),color-mix(in srgb,var(--ncw-pri) 80%,#6d28d9));color:#fff;font-size:15px;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:transform .2s,box-shadow .2s;font-family:inherit}
.ncw-lead-btn:hover{transform:translateY(-1px);box-shadow:0 4px 16px rgba(78,97,255,.35)}
.ncw-lead-btn:active{transform:translateY(0)}
.ncw-lead-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}
.ncw-lead-privacy{margin:12px 0 0;font-size:11px;color:#94a3b8}
.ncw-lead-error{color:#ef4444;font-size:12px;margin-top:8px;font-weight:500}

/* ===== CHAT AREA ===== */
#ncw-chat-area{flex:1;display:flex;flex-direction:column;min-height:0}
#ncw-msgs{flex:1;overflow-y:auto;padding:20px 16px 8px;display:flex;flex-direction:column;gap:6px;scroll-behavior:smooth}
#ncw-msgs::-webkit-scrollbar{width:5px}
#ncw-msgs::-webkit-scrollbar-track{background:transparent}
#ncw-msgs::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:4px}

/* Messages */
.ncw-msg{display:flex;flex-direction:column;max-width:82%;animation:ncw-msg-in .3s ease}
@keyframes ncw-msg-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.ncw-msg.user{align-self:flex-end;align-items:flex-end}
.ncw-msg.bot{align-self:flex-start;align-items:flex-start}
.ncw-bub{padding:11px 16px;font-size:14px;line-height:1.55;word-break:break-word;border-radius:18px}
.ncw-msg.user .ncw-bub{background:var(--ncw-ubg);color:var(--ncw-utxt);border-bottom-right-radius:6px}
.ncw-msg.bot .ncw-bub{background:var(--ncw-bbg);color:var(--ncw-btxt);border-bottom-left-radius:6px}
.ncw-bub a{color:inherit;text-decoration:underline;text-underline-offset:2px}
.ncw-bub strong{font-weight:700}.ncw-bub em{font-style:italic}
.ncw-bub code{background:rgba(0,0,0,.06);padding:2px 5px;border-radius:4px;font-size:13px;font-family:'SF Mono',Monaco,Consolas,monospace}
.ncw-bub ul,.ncw-bub ol{margin:6px 0;padding-left:18px}.ncw-bub li{margin:3px 0}
.ncw-ts{font-size:10px;color:#94a3b8;margin-top:3px;padding:0 4px}

/* Suggestions */
#ncw-suggestions{display:flex;flex-wrap:wrap;gap:6px;padding:4px 16px 12px}
.ncw-sug{padding:7px 14px;border:1.5px solid #e2e8f0;border-radius:20px;background:#fff;font-size:13px;font-weight:500;color:#475569;cursor:pointer;transition:.2s;white-space:nowrap;font-family:inherit}
.ncw-sug:hover{border-color:var(--ncw-pri);color:var(--ncw-pri);background:#eef2ff}

/* Typing */
.ncw-typing{display:none;padding:0 16px 8px}
.ncw-typing.show{display:block}
.ncw-typing-dots{display:inline-flex;align-items:center;gap:4px;background:var(--ncw-bbg);padding:10px 16px;border-radius:18px;border-bottom-left-radius:6px}
.ncw-typing-dots span{width:7px;height:7px;background:#94a3b8;border-radius:50%;animation:ncw-bounce 1.4s ease-in-out infinite}
.ncw-typing-dots span:nth-child(2){animation-delay:.2s}
.ncw-typing-dots span:nth-child(3){animation-delay:.4s}
@keyframes ncw-bounce{0%,60%,100%{transform:translateY(0)}30%{transform:translateY(-6px)}}

/* Footer */
#ncw-foot{flex-shrink:0;border-top:1px solid #f1f5f9;padding:10px 12px 8px;background:#fff}
.ncw-input-row{display:flex;gap:8px;align-items:center}
#ncw-inp{flex:1;border:1.5px solid #e2e8f0;border-radius:12px;padding:11px 16px;font-size:14px;color:#1e293b;outline:none;transition:border-color .2s,box-shadow .2s;background:#fafbfc;font-family:inherit}
#ncw-inp:focus{border-color:var(--ncw-pri);box-shadow:0 0 0 3px rgba(78,97,255,.08);background:#fff}
#ncw-inp::placeholder{color:#94a3b8}
#ncw-snd{width:42px;height:42px;border-radius:12px;border:none;background:var(--ncw-pri);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:.2s}
#ncw-snd:hover{opacity:.9;transform:scale(1.05)}
#ncw-snd:active{transform:scale(.95)}
.ncw-branding{text-align:center;padding:6px 0 2px;font-size:11px;color:#94a3b8;display:flex;align-items:center;justify-content:center;gap:4px}
.ncw-branding a{display:inline-flex;align-items:center;gap:3px;color:#64748b;text-decoration:none;font-weight:600}
.ncw-branding a:hover{color:var(--ncw-pri)}
.ncw-branding img{width:12px;height:12px;object-fit:contain}

/* Toast */
#ncw-tst{position:absolute;top:10px;left:50%;transform:translateX(-50%);z-index:100;pointer-events:none}
.ncw-toast{padding:8px 16px;border-radius:10px;font-size:13px;font-weight:600;animation:ncw-toast-in .3s ease}
.ncw-toast.success{background:#ecfdf5;color:#059669;border:1px solid #a7f3d0}
.ncw-toast.error{background:#fef2f2;color:#dc2626;border:1px solid #fecaca}
@keyframes ncw-toast-in{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}

/* Overlays */
.ncw-overlay{display:none;position:absolute;inset:0;background:rgba(0,0,0,.4);backdrop-filter:blur(2px);z-index:50;align-items:center;justify-content:center;padding:24px}
.ncw-overlay.show{display:flex}
.ncw-popup{background:#fff;border-radius:16px;padding:28px 24px;text-align:center;max-width:300px;width:100%;box-shadow:0 16px 48px rgba(0,0,0,.15);animation:ncw-pop-in .3s ease}
@keyframes ncw-pop-in{from{opacity:0;transform:scale(.9)}to{opacity:1;transform:none}}
.ncw-popup-icon{width:48px;height:48px;border-radius:14px;display:flex;align-items:center;justify-content:center;margin:0 auto 14px}
.ncw-popup h3{margin:0 0 6px;font-size:17px;font-weight:700;color:#0f172a}
.ncw-popup p{margin:0 0 18px;font-size:13px;color:#64748b;line-height:1.5}
.ncw-popup-actions{display:flex;gap:10px;justify-content:center}
.ncw-btn-ghost{padding:9px 20px;border:1px solid #e5e7eb;border-radius:10px;background:#fff;color:#64748b;font-size:13px;font-weight:600;cursor:pointer;font-family:inherit}
.ncw-btn-ghost:hover{background:#f8fafc}
.ncw-btn-danger{padding:9px 20px;border:none;border-radius:10px;background:#ef4444;color:#fff;font-size:13px;font-weight:600;cursor:pointer;font-family:inherit}
.ncw-btn-danger:hover{background:#dc2626}
.ncw-stars{display:flex;gap:6px;justify-content:center;margin-top:8px}
.ncw-star{font-size:28px;color:#d1d5db;background:none;border:none;cursor:pointer;transition:.15s;padding:4px}
.ncw-star:hover,.ncw-star.active{color:#f59e0b;transform:scale(1.15)}

/* Panel */
.ncw-panel{display:none;position:absolute;inset:0;background:#fff;z-index:60;flex-direction:column;animation:ncw-slide-up .3s ease}
.ncw-panel.show{display:flex}
@keyframes ncw-slide-up{from{transform:translateY(100%)}to{transform:none}}
.ncw-panel-head{display:flex;justify-content:space-between;align-items:center;padding:16px 18px;border-bottom:1px solid #f1f5f9}
.ncw-panel-head h3{margin:0;font-size:16px;font-weight:700;color:#0f172a}
.ncw-panel-body{padding:20px 18px;flex:1;overflow-y:auto}
.ncw-panel-desc{margin:0 0 16px;font-size:13px;color:#64748b}
.ncw-field{width:100%;padding:11px 14px;border:1.5px solid #e2e8f0;border-radius:10px;font-size:14px;color:#1e293b;margin-bottom:10px;outline:none;transition:border-color .2s;background:#fff;font-family:inherit}
.ncw-field:focus{border-color:var(--ncw-pri)}
textarea.ncw-field{resize:vertical;min-height:80px}
.ncw-btn-primary-full{width:100%;padding:12px;border:none;border-radius:10px;background:var(--ncw-pri);color:#fff;font-size:14px;font-weight:600;cursor:pointer;font-family:inherit}
.ncw-btn-primary-full:hover{opacity:.9}

/* ===== MOBILE ===== */
@media(max-width:480px){
    #ncw-box{width:100%;height:100%;max-height:100vh;bottom:0;left:0!important;right:0!important;border-radius:0}
    #ncw-btn{bottom:16px;width:56px;height:56px}
}
