#lsc-widget-root { --lsc-accent:#153b60; --lsc-on-accent:#fff; position:fixed; z-index:999999; right:20px; bottom:20px; font:14px/1.4 Arial,Helvetica,sans-serif; color:#17212b; }
#lsc-widget-root * { box-sizing:border-box; }
#lsc-widget-root button { cursor:pointer; font:inherit; }
#lsc-widget-root button:focus-visible,#lsc-widget-root input:focus-visible { outline:2px solid var(--lsc-accent); outline-offset:2px; }
.lsc-launcher { border:0; border-radius:999px; padding:13px 20px; color:var(--lsc-on-accent); background:var(--lsc-accent); box-shadow:0 5px 18px #0003; float:right; font-weight:700!important; }
.lsc-panel { width:min(420px,calc(100vw - 32px)); height:min(680px,calc(100vh - 40px)); height:min(680px,calc(100dvh - 40px)); display:flex; flex-direction:column; background:#fff; border:1px solid #d7dfe7; border-radius:15px; box-shadow:0 14px 38px #0004; overflow:hidden; }
.lsc-head { position:relative; flex:none; min-height:82px; padding:14px 18px; display:flex; align-items:center; gap:12px; background:var(--lsc-accent); color:var(--lsc-on-accent); }
.lsc-brand-mark { flex:none; width:50px; height:50px; border:2px solid #fff; border-radius:50%; display:grid; place-items:center; overflow:hidden; background:#fff; color:var(--lsc-accent); font-size:25px!important; font-weight:700; letter-spacing:-.06em; }
.lsc-brand-mark img,.lsc-message-avatar img { display:block; width:100%; height:100%; object-fit:contain; }
.lsc-head-identity { flex:1; min-width:0; }
.lsc-head-identity strong { display:block; font-size:17px; line-height:1.2; overflow-wrap:anywhere; }
.lsc-head-identity span { display:block; margin-top:4px; font-size:11px; opacity:.85; }
.lsc-head-actions { display:flex; gap:2px; align-self:flex-start; margin-top:-4px; }
.lsc-head-actions>button { width:28px; height:30px; padding:0; border:0; border-radius:5px; background:transparent; color:inherit; font-size:22px!important; line-height:1; }
.lsc-head-actions>button:hover { background:#ffffff2b; }
.lsc-options { position:absolute; top:54px; right:14px; min-width:154px; padding:5px; border:1px solid #dce4eb; border-radius:9px; background:#fff; color:#17212b; box-shadow:0 10px 25px #0003; z-index:2; }
.lsc-options[hidden] { display:none; }
.lsc-option { display:block; width:100%; padding:9px 11px; border:0; border-radius:6px; background:#fff; color:#17212b; text-align:left; font-size:13px!important; }
.lsc-option:hover { background:#f2f5f7; }
.lsc-history { flex:1; min-height:0; overflow-y:auto; overscroll-behavior:contain; padding:18px 18px 24px; background:#fff; }
.lsc-system-line { margin:0 0 18px; color:#6a7884; text-align:center; font-size:11px; }
.lsc-message-row { display:flex; align-items:flex-start; gap:8px; margin:0 0 13px; }
.lsc-message-row.lsc-visitor { justify-content:flex-end; }
.lsc-message-avatar { flex:none; width:23px; height:23px; display:grid; place-items:center; overflow:hidden; border-radius:50%; background:#fff; color:var(--lsc-accent); font-size:12px; font-weight:700; }
.lsc-message-content { max-width:78%; min-width:0; }
.lsc-message { padding:11px 14px; border-radius:12px 12px 12px 4px; background:#f0f2f4; color:#313b45; white-space:pre-wrap; overflow-wrap:anywhere; font-size:13px; line-height:1.4; }
.lsc-message-row.lsc-visitor .lsc-message { border-radius:12px 12px 4px 12px; background:var(--lsc-accent); color:var(--lsc-on-accent); }
.lsc-message-time { display:block; margin-top:4px; color:#6c7780; font-size:10px; text-align:right; }
.lsc-privacy { margin:2px 0 17px 31px; color:#687582; font-size:10px; line-height:1.4; }
.lsc-quick-replies { display:grid; gap:8px; margin:10px 0 14px 31px; }
.lsc-client-choices { margin-top:16px; }
.lsc-quick-reply,.lsc-quick-secondary { width:100%; min-height:41px; padding:9px 12px; border-radius:24px; background:#fff; text-align:center; font-size:12px!important; font-weight:700!important; line-height:1.3; }
.lsc-quick-reply { border:2px solid var(--lsc-accent); color:#17212b; }
.lsc-quick-secondary { border:1px solid #c7d2db; color:#334a5c; }
.lsc-quick-reply:hover,.lsc-quick-secondary:hover { background:#f5f8fa; }
.lsc-timeout-note { flex:none; margin:0; padding:5px 12px; color:#697987; background:#fff; font-size:10px; text-align:center; }
.lsc-compose { position:relative; flex:none; padding:10px 15px 14px; border-top:1px solid #e0e5e9; background:#fff; box-shadow:0 -5px 14px #0000000b; }
.lsc-compose input { width:100%; min-height:46px; border:1px solid #aab7c2; border-radius:999px; padding:10px 70px 10px 17px; color:#17212b; background:#fff; font-size:13px; }
.lsc-compose button { position:absolute; right:23px; top:50%; transform:translateY(-50%); border:0; border-radius:999px; padding:8px 11px; background:var(--lsc-accent); color:var(--lsc-on-accent); font-size:12px!important; font-weight:700!important; }
.lsc-compose button:disabled { opacity:0; pointer-events:none; }
.lsc-contact { display:grid; gap:9px; margin:14px 0 0 31px; padding:15px; border:1px solid #dce4eb; border-radius:12px; background:#f8fafb; }
.lsc-contact strong { font-size:14px; }
.lsc-contact small { color:#5c6e7b; line-height:1.4; }
.lsc-contact input { min-height:40px; width:100%; border:1px solid #b8c4ce; border-radius:6px; padding:9px; font-size:13px; }
.lsc-contact button { border:0; border-radius:6px; padding:10px; background:var(--lsc-accent); color:var(--lsc-on-accent); font-weight:700!important; }
.lsc-back { margin:8px 0 0 31px; padding:6px 0; border:0; background:transparent; color:#334a5c; text-decoration:underline; font-size:12px!important; }
.lsc-ended-notice { display:grid; gap:2px; margin:20px 0 18px; color:#263440; text-align:center; }
.lsc-ended-notice small { color:#71808c; font-size:10px; }
.lsc-ended-notice strong { font-size:12px; }
.lsc-ended-actions { display:grid; margin:0 0 8px 31px; }
.lsc-ended-actions button { width:100%; min-height:45px; padding:10px 12px; font-size:13px!important; font-weight:700!important; }
.lsc-ended-download { border:2px solid var(--lsc-accent); border-radius:9px 9px 0 0; background:#fff; color:#17212b; }
.lsc-ended-restart { border:2px solid var(--lsc-accent); border-top:0; border-radius:0 0 9px 9px; background:#f2f5f7; color:#17212b; }
.lsc-ended-exit { margin-top:14px; border:0; border-radius:999px; background:var(--lsc-accent); color:var(--lsc-on-accent); }
.lsc-ended-download:hover,.lsc-ended-restart:hover { background:#eaf0f4; }
.lsc-error { color:#9b1c1c; margin:5px 12px; }
.lsc-login { max-width:420px; margin:40px auto; padding:24px; border:1px solid #ddd; border-radius:10px; }
.lsc-standalone { margin:0; background:#f3f6f9; color:#17212b; font:15px/1.4 system-ui,sans-serif; }
.lsc-standalone-main { width:100%; margin:0; padding:0; }
.lsc-standalone .lsc-login { background:#fff; border-color:#d7dfe7; }
.lsc-standalone .lsc-login h2 { margin-top:0; }
.lsc-standalone .lsc-login button, .lsc-standalone .lsc-agent-compose button { padding:10px 16px; border:0; border-radius:7px; background:#153b60; color:#fff; cursor:pointer; }
.lsc-login form,.lsc-login label { display:grid; gap:8px; }
.lsc-login form { gap:16px; }
.lsc-login input { width:100%; padding:10px; }
#lsc-inbox-root { min-height:100vh; }
#lsc-inbox-root * { box-sizing:border-box; }
#lsc-inbox-root button,#lsc-inbox-root input,#lsc-inbox-root textarea { font:inherit; }
#lsc-inbox-root button { cursor:pointer; }
.lsc-desk { height:100vh; min-height:650px; display:flex; flex-direction:column; background:#fff; color:#1b2b3a; font:14px/1.45 system-ui,sans-serif; }
.lsc-desk-topbar { height:72px; flex:none; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:0 26px; border-bottom:1px solid #e0e7ed; background:#fff; z-index:3; }
.lsc-desk-title { display:flex; flex-direction:column; }
.lsc-desk-title strong { font-size:19px; letter-spacing:-.02em; }
.lsc-desk-title span { font-size:12px; color:#6a7b8b; }
.lsc-desk-top-actions { display:flex; align-items:center; gap:20px; }
.lsc-pending-pill { padding:6px 11px; border-radius:20px; background:#e7f0f6; color:#153b60; font-size:12px; font-weight:700; white-space:nowrap; }
.lsc-account-menu { position:relative; }
.lsc-account-trigger { border:1px solid #dce5eb; background:#fff; border-radius:8px; padding:8px 11px; color:#1b2b3a; font-weight:600!important; }
.lsc-account-options { position:absolute; right:0; top:calc(100% + 8px); width:180px; padding:6px; border:1px solid #dce5eb; border-radius:9px; box-shadow:0 10px 24px #102d4530; background:#fff; z-index:10; }
.lsc-account-option { display:block; width:100%; padding:9px; border:0; border-radius:6px; background:#fff; color:#1b2b3a; text-align:left; text-decoration:none; }
.lsc-account-option:hover { background:#f1f5f8; }
.lsc-desk-columns { flex:1; min-height:0; display:grid; grid-template-columns:220px 310px minmax(0,1fr); }
.lsc-company-pane { display:flex; flex-direction:column; min-width:0; padding:24px 12px; background:#123552; color:#fff; }
.lsc-company-pane h2 { margin:0 12px 22px; color:#b9cddd; font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; }
.lsc-company-button { display:flex; align-items:center; gap:10px; width:100%; min-height:48px; border:0; border-radius:8px; padding:8px 10px; margin-bottom:5px; background:transparent; color:#e7f0f7; text-align:left; }
.lsc-company-button:hover,.lsc-company-button.is-active { background:#ffffff1b; color:#fff; }
.lsc-company-mark { display:grid; place-items:center; width:29px; height:29px; flex:none; border-radius:8px; background:#ffffff21; font-size:11px; font-weight:700; }
.lsc-company-name { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:600; }
.lsc-company-count { display:grid; place-items:center; min-width:22px; height:22px; padding:0 5px; border-radius:12px; background:#e8f4fb; color:#113957; font-size:11px; font-weight:700; }
.lsc-company-footer { margin:auto 10px 12px; display:flex; align-items:center; gap:7px; color:#b6cad9; font-size:11px; }
.lsc-online-dot { width:7px; height:7px; border-radius:50%; background:#62d8a6; }
.lsc-alert-button { margin:0 10px; border:1px solid #ffffff55; border-radius:7px; padding:8px; background:transparent; color:#fff; font-size:11px!important; }
.lsc-conversation-pane { display:flex; flex-direction:column; min-width:0; border-right:1px solid #e0e7ed; background:#f9fbfc; }
.lsc-conversation-head { display:flex; align-items:center; gap:9px; padding:24px 18px 12px; }
.lsc-conversation-head h2 { margin:0; font-size:19px; }
.lsc-list-count { border-radius:12px; padding:2px 8px; background:#e9eff4; color:#627587; font-size:11px; font-weight:700; }
.lsc-conversation-filters { display:flex; gap:5px; padding:0 18px 14px; }
.lsc-filter { border:1px solid transparent; border-radius:7px; padding:6px 10px; background:transparent; color:#697c8c; font-size:12px!important; }
.lsc-filter.is-active { background:#e4eef5; color:#153b60; font-weight:700!important; }
.lsc-conversation-search { display:block; width:calc(100% - 36px); margin:0 18px 14px; border:1px solid #d8e1e8; border-radius:8px; padding:9px 11px; outline-color:#153b60; background:#fff; }
.lsc-conversation-list { flex:1; overflow-y:auto; min-height:0; }
.lsc-list-empty { padding:28px 18px; color:#708191; text-align:center; }
.lsc-conversation-row { display:flex; width:100%; gap:10px; border:0; border-bottom:1px solid #e6edf1; padding:14px 15px; background:transparent; color:#1b2b3a; text-align:left; }
.lsc-conversation-row:hover,.lsc-conversation-row.is-active { background:#eaf2f7; }
.lsc-conversation-row.is-active { box-shadow:inset 3px 0 #153b60; }
.lsc-client-avatar { display:grid; place-items:center; width:35px; height:35px; flex:none; border-radius:50%; background:#d9e8f1; color:#153b60; font-size:11px; font-weight:700; }
.lsc-client-details { display:block; flex:1; min-width:0; }
.lsc-client-title { display:flex; justify-content:space-between; gap:5px; align-items:baseline; }
.lsc-client-title strong { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:13px; }
.lsc-client-title time { color:#81919f; font-size:10px; white-space:nowrap; }
.lsc-client-preview { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#657789; font-size:12px; margin:3px 0; }
.lsc-client-meta { display:flex; flex-wrap:wrap; align-items:center; gap:5px; color:#6b7c8a; font-size:10px; text-transform:capitalize; }
.lsc-last-reply { display:block; margin-top:4px; color:#42617b; font-size:10px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.lsc-client-brand { color:#42617b; font-weight:600; }
.lsc-client-type { display:inline-block; width:max-content; max-width:100%; padding:2px 7px; border-radius:999px; background:#edf1f5; color:#43586b; font-size:10px; font-weight:700; line-height:1.4; white-space:nowrap; }
.lsc-client-type-existing { background:#e4f3e9; color:#18633b; }
.lsc-status-dot { display:inline-block; width:6px; height:6px; border-radius:50%; background:#9aa8b4; margin-left:4px; }
.lsc-status-dot.lsc-status-waiting { background:#e7a241; }
.lsc-status-dot.lsc-status-live { background:#2aaf7c; }
.lsc-chat-pane { display:flex; flex-direction:column; min-width:0; min-height:0; background:#fff; }
.lsc-chat-pane-head { display:flex; justify-content:space-between; align-items:center; gap:12px; min-height:81px; padding:12px 24px; border-bottom:1px solid #e4eaef; }
.lsc-chat-person { display:flex; align-items:center; gap:12px; min-width:0; }
.lsc-client-avatar-large { width:42px; height:42px; font-size:13px; }
.lsc-chat-person h2 { margin:0 0 3px; font-size:17px; }
.lsc-chat-person p { margin:0; color:#708191; font-size:11px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.lsc-chat-person .lsc-client-type { margin:0 0 4px; }
.lsc-chat-actions { display:flex; align-items:center; gap:8px; flex:none; }
.lsc-status-label { padding:5px 8px; border-radius:12px; background:#edf1f4; color:#536573; font-size:11px; text-transform:capitalize; }
.lsc-status-label.lsc-status-waiting { background:#fff1da; color:#925d0c; }
.lsc-status-label.lsc-status-live { background:#e2f6ee; color:#11714d; }
.lsc-take-button,.lsc-close-button { border:1px solid #cbd8e1; border-radius:7px; padding:7px 10px; background:#fff; color:#153b60; font-size:12px!important; }
.lsc-close-button { color:#975453; }
.lsc-chat-history { flex:1; min-height:0; overflow-y:auto; padding:24px; background:#f8fafb; }
.lsc-chat-message { max-width:min(78%,500px); margin:0 0 18px; }
.lsc-chat-message.is-outgoing { margin-left:auto; }
.lsc-message-author { display:block; margin-bottom:4px; color:#637587; font-size:10px; font-weight:600; }
.lsc-agent-tag { display:inline-block; padding:3px 7px; border-radius:999px; background:#e4eff8; color:#153b60; font-size:11px; font-weight:700; }
.lsc-message-recipient { color:#52697d; font-size:11px; }
.lsc-message-bubble { padding:11px 14px; border:1px solid #e1e8ed; border-radius:12px 12px 12px 3px; background:#fff; white-space:pre-wrap; overflow-wrap:anywhere; }
.lsc-chat-message.is-outgoing .lsc-message-bubble { border-color:#153b60; border-radius:12px 12px 3px 12px; background:#153b60; color:#fff; }
.lsc-chat-message.is-outgoing .lsc-message-author,.lsc-chat-message.is-outgoing .lsc-message-time { text-align:right; }
.lsc-message-time { display:block; margin-top:4px; color:#8796a3; font-size:10px; }
.lsc-agent-compose { display:flex; align-items:end; gap:12px; padding:16px 20px; border-top:1px solid #e4eaef; background:#fff; }
.lsc-agent-compose textarea { flex:1; min-width:0; min-height:66px; max-height:180px; resize:vertical; padding:11px 13px; border:1px solid #cbd8e1; border-radius:9px; outline-color:#153b60; }
.lsc-send-button { border:0; border-radius:8px; padding:11px 15px; background:#153b60; color:#fff; font-weight:700!important; white-space:nowrap; }
.lsc-send-button:disabled { opacity:.55; cursor:default!important; }
.lsc-chat-empty { display:grid; place-content:center; text-align:center; height:100%; padding:30px; color:#718392; }
.lsc-chat-empty h2 { margin:7px 0; color:#22384b; font-size:20px; }
.lsc-chat-empty p { max-width:320px; margin:0 auto; }
.lsc-empty-icon { font-size:48px; line-height:1; color:#9db7c9; }
.lsc-closed-note { padding:15px 20px; border-top:1px solid #e4eaef; color:#6b7d8d; text-align:center; }
.lsc-modal-backdrop { position:fixed; inset:0; display:grid; place-items:center; padding:16px; background:#122b4199; z-index:1000; }
.lsc-account-dialog { width:min(420px,100%); padding:22px; border-radius:12px; background:#fff; box-shadow:0 20px 55px #0004; }
.lsc-dialog-top { display:flex; justify-content:space-between; align-items:center; }
.lsc-dialog-top h2 { margin:0; font-size:20px; }
.lsc-dialog-close { border:0; background:transparent; font-size:25px!important; }
.lsc-account-form { display:grid; gap:16px; margin-top:20px; }
.lsc-account-form label { display:grid; gap:6px; font-weight:600; }
.lsc-account-form input { width:100%; border:1px solid #cbd8e1; border-radius:7px; padding:9px; }
.lsc-account-form input[readonly] { background:#f5f7f9; color:#657789; }
.lsc-account-form p { margin:0; color:#6d7e8d; font-size:12px; }
.lsc-account-form .lsc-send-button { justify-self:end; }
.lsc-profile { display:grid; justify-items:center; gap:7px; padding:24px 0 4px; }
.lsc-profile-avatar { display:grid; place-items:center; width:68px; height:68px; border-radius:50%; background:#d9e8f1; color:#153b60; font-size:23px; font-weight:700; }
.lsc-profile strong { margin-top:5px; font-size:18px; }
.lsc-profile span:not(.lsc-profile-avatar),.lsc-profile small { color:#667a8a; }
.lsc-profile-edit { margin-top:15px; border:1px solid #bed0dd; border-radius:7px; padding:9px 13px; background:#fff; color:#153b60; }
@media(max-width:1050px) { .lsc-desk-columns { grid-template-columns:180px 270px minmax(0,1fr); } .lsc-chat-pane-head { flex-wrap:wrap; } }
@media(max-width:720px) { .lsc-desk { height:auto; min-height:100vh; } .lsc-desk-topbar { padding:10px 14px; height:auto; min-height:64px; } .lsc-pending-pill { display:none; } .lsc-desk-columns { display:flex; flex-direction:column; min-height:0; } .lsc-company-pane { display:block; padding:12px; } .lsc-company-pane h2 { margin:0 0 8px; } .lsc-company-button { display:inline-flex; width:auto; min-height:36px; margin:0 5px 5px 0; } .lsc-company-footer,.lsc-alert-button { display:none; } .lsc-conversation-pane { max-height:290px; min-height:220px; border-right:0; border-bottom:1px solid #e0e7ed; } .lsc-conversation-head { padding-top:14px; } .lsc-conversation-list { max-height:180px; } .lsc-chat-pane { min-height:420px; } .lsc-chat-history { min-height:280px; } .lsc-chat-pane-head { padding:12px; } .lsc-agent-compose { padding:10px; } .lsc-agent-compose textarea { min-height:52px; } #lsc-widget-root { right:12px; bottom:12px; } }
@media(max-width:600px) { #lsc-widget-root { left:10px; right:10px; bottom:10px; } .lsc-panel { width:100%; height:min(700px,calc(100vh - 20px)); height:min(700px,calc(100dvh - 20px)); } .lsc-head { padding:13px 14px; min-height:82px; } .lsc-brand-mark { width:44px; height:44px; font-size:22px!important; } .lsc-head-identity strong { font-size:13px; } .lsc-history { padding:15px 13px 20px; } .lsc-quick-replies { margin-left:31px; } }
