:root { --ljcb-blue: #2855eb; }
#ljcb-widget, #ljcb-widget * { box-sizing: border-box; }
#ljcb-widget { position: fixed; right: 20px; bottom: 20px; z-index: 999999; display:flex; align-items:center; gap:12px; font-family:Arial,Helvetica,sans-serif; color:#30343b; }
#ljcb-widget button, #ljcb-widget input { font-family:inherit; }
#ljcb-widget button { -webkit-tap-highlight-color:transparent; }
#ljcb-widget .ljcb-label { border:0; border-radius:12px; background:#fff; color:#111827; padding:13px 20px; min-height:48px; font-size:14px; cursor:pointer; box-shadow:0 4px 14px rgba(0,0,0,.12); transition:transform .22s ease,box-shadow .22s ease,color .22s ease; }
#ljcb-widget .ljcb-label:hover { transform:translateY(-3px); color:var(--ljcb-blue); box-shadow:0 8px 22px rgba(40,85,235,.2); }
#ljcb-widget .ljcb-launcher { width:60px; height:60px; flex:0 0 60px; display:grid; place-items:center; border:0; border-radius:50%; color:#fff; background:var(--ljcb-blue); box-shadow:0 5px 18px rgba(40,85,235,.28); cursor:pointer; transition:transform .25s ease,box-shadow .25s ease,filter .25s ease; animation:ljcb-pulse 3s ease-in-out infinite; }
#ljcb-widget .ljcb-launcher svg { width:33px; height:33px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
#ljcb-widget .ljcb-launcher:hover { transform:translateY(-4px) scale(1.06) rotate(-3deg); box-shadow:0 10px 28px rgba(40,85,235,.42); filter:brightness(1.08); }
#ljcb-widget .ljcb-panel[hidden], #ljcb-widget [hidden] { display:none !important; }
#ljcb-widget .ljcb-panel { position:fixed; right:16px; bottom:24px; width:400px; height:600px; max-width:calc(100vw - 32px); max-height:calc(100dvh - 40px); background:#fff; border-radius:11px; box-shadow:0 8px 40px rgba(0,0,0,.2); overflow:hidden; display:flex; flex-direction:column; transform-origin:bottom right; animation:ljcb-panel-in .28s cubic-bezier(.2,.8,.2,1) both; }
#ljcb-widget .ljcb-header { height:70px; flex:0 0 70px; background:var(--ljcb-blue); color:#fff; display:flex; align-items:center; gap:10px; padding:0 16px; position:relative; overflow:hidden; }
#ljcb-widget .ljcb-header:after { content:""; position:absolute; top:0; left:-80%; width:50%; height:100%; background:linear-gradient(100deg,transparent,rgba(255,255,255,.12),transparent); animation:ljcb-shimmer 7s ease-in-out infinite; pointer-events:none; }
#ljcb-widget .ljcb-avatar { width:38px; height:38px; flex:0 0 38px; border-radius:50%; display:grid; place-items:center; background:#fff; color:var(--ljcb-blue); }
#ljcb-widget .ljcb-avatar svg { width:25px; height:25px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
#ljcb-widget .ljcb-business-name { font-size:16px; font-weight:600; color:#fff; }
#ljcb-widget .ljcb-online { margin-left:auto; font-size:10px; color:#e7edff; white-space:nowrap; }
#ljcb-widget .ljcb-online i { display:inline-block; width:6px; height:6px; background:#a5f3c3; border-radius:50%; margin-right:3px; box-shadow:0 0 0 3px rgba(165,243,195,.15); }
#ljcb-widget .ljcb-close { margin-left:5px; border:0; background:transparent; color:#fff; font-size:27px; font-weight:300; cursor:pointer; width:28px; height:36px; padding:0; line-height:1; transition:transform .2s ease,opacity .2s ease; }
#ljcb-widget .ljcb-close:hover { transform:rotate(90deg); opacity:.75; }
#ljcb-widget .ljcb-body { flex:1; min-height:0; overflow-y:auto; background:#fff; padding:10px 16px 16px; scrollbar-width:thin; }
#ljcb-widget .ljcb-intro { margin:0 0 12px; padding:12px 14px; background:#edf1ff; border-radius:9px; font-size:15px; line-height:1.45; animation:ljcb-fade-up .4s ease both; }
#ljcb-widget .ljcb-field { display:flex; align-items:center; position:relative; margin:0 0 5px; border-bottom:1px solid #c9cdd6; transition:border-color .2s ease,box-shadow .2s ease; animation:ljcb-fade-up .4s ease both; }
#ljcb-widget .ljcb-field:nth-of-type(2) { animation-delay:.06s; } #ljcb-widget .ljcb-field:nth-of-type(3) { animation-delay:.12s; }
#ljcb-widget .ljcb-field:focus-within { border-color:var(--ljcb-blue); box-shadow:0 1px 0 var(--ljcb-blue); }
#ljcb-widget .ljcb-field input { width:100%; height:41px; border:0 !important; outline:0 !important; box-shadow:none !important; background:transparent !important; color:#262a33; padding:0 36px 0 9px; font-size:14px; }
#ljcb-widget .ljcb-field input::placeholder { color:#8a8d96; font-style:italic; opacity:1; }
#ljcb-widget .ljcb-field-icon { position:absolute; right:8px; font-size:17px; color:#4d535d; pointer-events:none; }
#ljcb-widget .ljcb-consent { display:flex; gap:7px; align-items:flex-start; margin:14px 0 8px; font-size:11px; line-height:1.4; color:#555b65; }
#ljcb-widget .ljcb-consent input { margin:2px 0 0; accent-color:var(--ljcb-blue); }
#ljcb-widget .ljcb-primary { width:100%; min-height:42px; border:0; border-radius:8px; margin-top:8px; background:var(--ljcb-blue); color:#fff; font-size:13px; font-weight:700; cursor:pointer; transition:transform .2s ease,box-shadow .2s ease,filter .2s ease; animation:ljcb-fade-up .45s .15s ease both; }
#ljcb-widget .ljcb-primary:hover { transform:translateY(-2px); box-shadow:0 6px 18px rgba(40,85,235,.28); filter:brightness(1.05); }
#ljcb-widget button:disabled { opacity:.65; cursor:wait; }
#ljcb-widget .ljcb-send-icon { margin-right:7px; display:inline-block; transition:transform .2s ease; } #ljcb-widget .ljcb-primary:hover .ljcb-send-icon { transform:translate(3px,-2px); }
#ljcb-widget .ljcb-privacy { text-align:center; color:#858b96; font-size:10px; margin:10px 0 0; }
#ljcb-widget .ljcb-error { color:#b42318; font-size:12px; margin:7px 0 0; }
#ljcb-widget .ljcb-messages { display:flex; flex-direction:column; gap:11px; padding:5px 0 14px; }
#ljcb-widget .ljcb-message { display:flex; flex-direction:column; max-width:91%; animation:ljcb-fade-up .25s ease both; }
#ljcb-widget .ljcb-bot { align-self:flex-start; } #ljcb-widget .ljcb-visitor { align-self:flex-end; align-items:flex-end; }
#ljcb-widget .ljcb-bubble { padding:10px 12px; font-size:14px; line-height:1.45; border-radius:12px 12px 12px 3px; background:#edf1ff; color:#343944; overflow-wrap:anywhere; }
#ljcb-widget .ljcb-visitor .ljcb-bubble { background:var(--ljcb-blue); color:#fff; border-radius:12px 12px 3px 12px; }
#ljcb-widget .ljcb-message time { font-size:10px; color:#9399a4; margin:4px 3px 0; }
#ljcb-widget .ljcb-quick-replies { display:flex; flex-wrap:wrap; gap:7px; margin:0 0 12px; }
#ljcb-widget .ljcb-quick-replies button { border:1px solid #cdd7ff; background:#fff; color:var(--ljcb-blue); border-radius:18px; padding:7px 10px; font-size:11px; cursor:pointer; transition:background .2s ease,color .2s ease,transform .2s ease; }
#ljcb-widget .ljcb-quick-replies button:hover { background:var(--ljcb-blue); color:#fff; transform:translateY(-2px); }
#ljcb-widget .ljcb-message-form { display:flex; align-items:center; gap:8px; padding:8px; border:1px solid #e0e4ed; border-radius:10px; background:#fff; position:sticky; bottom:0; }
#ljcb-widget .ljcb-message-form input { flex:1; min-width:0; height:34px; border:0 !important; outline:0 !important; box-shadow:none !important; background:transparent !important; font-size:13px; color:#30343b; }
#ljcb-widget .ljcb-message-form button { width:35px; height:35px; border:0; border-radius:8px; background:var(--ljcb-blue); color:#fff; cursor:pointer; transition:transform .2s ease; }
#ljcb-widget .ljcb-message-form button:hover { transform:scale(1.06); }
#ljcb-widget .ljcb-typing .ljcb-bubble { display:flex; gap:4px; align-items:center; min-width:48px; }
#ljcb-widget .ljcb-typing i { width:5px; height:5px; border-radius:50%; background:#7c8bc3; animation:ljcb-dot 1s infinite ease-in-out; } #ljcb-widget .ljcb-typing i:nth-child(2) { animation-delay:.15s; } #ljcb-widget .ljcb-typing i:nth-child(3) { animation-delay:.3s; }
#ljcb-widget .screen-reader-text { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }
@keyframes ljcb-panel-in { from { opacity:0; transform:translateY(18px) scale(.94); } to { opacity:1; transform:translateY(0) scale(1); } }
@keyframes ljcb-fade-up { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:translateY(0); } }
@keyframes ljcb-shimmer { 0%,70%,100% { left:-80%; } 85% { left:140%; } }
@keyframes ljcb-dot { 0%,60%,100% { transform:translateY(0); opacity:.55; } 30% { transform:translateY(-4px); opacity:1; } }
@keyframes ljcb-pulse { 0%,100% { box-shadow:0 5px 18px rgba(40,85,235,.28); } 50% { box-shadow:0 5px 24px rgba(40,85,235,.42); } }
@media (max-width:480px) { #ljcb-widget { right:14px; bottom:14px; gap:9px; } #ljcb-widget .ljcb-launcher { width:54px; height:54px; flex-basis:54px; } #ljcb-widget .ljcb-label { min-height:44px; padding:11px 16px; } #ljcb-widget .ljcb-panel { right:10px; bottom:10px; width:calc(100vw - 20px); height:min(620px,calc(100dvh - 20px)); max-width:none; max-height:none; border-radius:12px; } #ljcb-widget .ljcb-header { height:64px; flex-basis:64px; } }
@media (prefers-reduced-motion: reduce) { #ljcb-widget *, #ljcb-widget *:before, #ljcb-widget *:after { animation:none!important; transition:none!important; scroll-behavior:auto!important; } }