@satek-team-intern/chatbot-widget 0.10.7 → 0.10.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -8,7 +8,7 @@ import { createMp3Encoder as T } from "wasm-media-encoders";
|
|
|
8
8
|
import { Fragment as E, jsx as D, jsxs as O } from "react/jsx-runtime";
|
|
9
9
|
//#endregion
|
|
10
10
|
//#region src/styles/index.ts
|
|
11
|
-
var k = "\n #chat-internal-root{z-index:99999;pointer-events:none;--font-size-600:16px;--font-size-500:14px;--font-size-400:13px;--font-size-300:12px;font-size:var(--font-size-500);font-family:Inter,-apple-system,sans-serif;font-weight:400;line-height:20px;display:block;position:fixed;bottom:0;right:0}#chat-internal-root *{box-sizing:border-box;pointer-events:auto}#chat-internal-root ::-webkit-scrollbar{width:5px;height:5px}#chat-internal-root ::-webkit-scrollbar-thumb{background-color:#0000001a;border-radius:4px}#chat-internal-root ::-webkit-scrollbar-thumb:hover{background-color:#0003}.chatbot-container{width:100%;height:100%;position:relative}\n .floating-button{background:var(--primary);color:#fff;cursor:pointer;z-index:99999;border:none;border-radius:20px 20px 20px 6px;outline:none;justify-content:center;align-items:center;width:46px;height:46px;display:flex;position:fixed;bottom:24px;right:24px}.floating-button:active{transform:scale(.95)}.floating-button .icon{z-index:10;width:24px;height:24px;position:relative}\n .chat-window{--primary:#155dfc;--chat-bg:#fff;--chat-text:#101828;--chat-subtext:#6a7282;--chat-header-bg:color-mix(in srgb, var(--primary) 10%, #f9f9f9);--chat-border:#e5e7eb;--sidebar-bg:#fff;--chat-main-name:#101828;--chat-list-bg:#f9fafb80;--container-bg:#fff;--message-bubble-other:#f3f4f6;--input-background:#f3f4f6;--color-input:#000;--label-profile:#6a7282;--icon-owner:#000}.chat-window.dark-theme{--chat-bg:color-mix(in srgb, var(--primary), #0f172a99 85%);--chat-text:#f8fafc;--chat-subtext:#94a3b8;--chat-header-bg:color-mix(in srgb, var(--primary), #1e293b99 80%);--chat-border:#2d2d2d;--sidebar-bg:color-mix(in srgb, var(--primary), #0f172a66 95%);--container-bg:#1a1a1a;--chat-main-name:#fff;--chat-list-bg:#1f1f1f;--message-bubble-other:#4f4f4f;--input-background:#ffffff1a;--color-input:#fff;--label-profile:#9ca3af;--icon-owner:#f2b90d}.chat-window{background:var(--chat-bg);-webkit-backdrop-filter:blur(20px)saturate(180%);backdrop-filter:blur(20px)saturate(180%);border:1px solid var(--chat-border);z-index:99998;width:384px;height:640px;color:var(--chat-text);transform-origin:100% 100%;border-radius:14px;flex-direction:column;max-width:100%;max-height:100%;margin:0;transition:none;animation:.6s cubic-bezier(.34,1.56,.64,1) slideUp;display:flex;position:fixed;bottom:20px;right:20px;overflow:hidden;transform:translate(0);box-shadow:0 8px 32px #0000005e,inset 0 0 0 1px #ffffff0d}.chat-window.fullpage{--chat-bg:#fff;--chat-header-bg:#fff;--sidebar-bg:#fff;--app-sidebar-bg:color-mix(in srgb, var(--primary) 10%, #f9f9f9);--active-item-bg:#f1f5f9;-webkit-backdrop-filter:none;z-index:9999;border-radius:16px;flex-direction:column;display:flex;transform:translate(0)}.chat-main-layout{--chat-bg:#fff;--chat-header-bg:#fff;--sidebar-bg:#fff;--active-item-bg:#f1f5f9;-webkit-backdrop-filter:none;z-index:9999;background-color:var(--app-sidebar-bg);border-radius:0;flex-direction:row;flex:1;width:100%;max-width:none;height:100vh;display:flex;inset:0;overflow:hidden;transform:none}.chat-window.dark-theme{--chat-bg:#0f172a;--chat-header-bg:color-mix(in srgb, var(--primary) 18%, #0a0a0a);--sidebar-bg:#0f172a;--active-item-bg:#334155;--app-sidebar-bg:color-mix(in srgb, var(--primary) 18%, #0a0a0a);overflow:hidden}.chat-header{background:var(--chat-header-bg);color:var(--chat-text);border-bottom:1px solid var(--chat-border);flex-shrink:0;justify-content:space-between;align-items:center;padding:12px 16px 8px;display:flex}.chat-window.fullpage .chat-header{border-bottom:none}.header-info{align-items:center;gap:8px;display:flex}.header-logo{flex-shrink:0;justify-content:center;align-items:center;display:flex}.header-logo img,.header-logo .satek-icon{object-fit:contain;width:22px;height:22px}.back-btn{color:#64748b;cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;margin-right:8px;padding:0;display:flex}.header-info-text{align-items:center;gap:6px;min-width:0;display:flex}.header-dot{color:var(--chat-subtext);opacity:.6}.header-title{color:var(--chat-text);white-space:nowrap;text-overflow:ellipsis;font-size:var(--font-size-600);overflow:hidden}.header-subtitle{color:var(--chat-subtext);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.chat-body-container{flex-direction:row;flex:1;display:flex;position:relative;overflow:hidden}.chat-sidebar{background:var(--chat-list-bg);border-right:1px solid #0000000d;flex-direction:column;width:100%;transition:all .3s;display:flex}.chat-sidebar.is-full{flex-shrink:0;width:320px}.chat-search-bar{background:0 0;align-items:center;gap:4px;padding:12px 12px 4px;display:flex}.search-input-wrapper{flex:1;align-items:center;display:flex;position:relative}.search-icon{width:16px;height:16px;color:var(--chat-subtext);pointer-events:none;position:absolute;left:12px}.search-input{background:var(--input-background);width:100%;font-size:var(--font-size-400);color:var(--color-input);border:1px solid #0000;border-radius:8px;outline:none;padding:8px 36px;transition:all .3s}.search-input:focus{background:var(--container-bg);border-color:#a855f74d;box-shadow:0 4px 12px #00000008}.clear-search{color:var(--chat-subtext);font-size:var(--font-size-600);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;padding:4px;display:flex;position:absolute;right:10px}.clear-search:hover{color:#64748b}.sidebar-scroll{flex:1;padding:0 8px 20px;overflow-y:auto}.chat-filter-tabs{gap:24px;margin:0 12px;display:flex;position:relative}.chat-filter-tabs:before{content:\"\";background-color:var(--chat-border);height:.5px;position:absolute;bottom:0;left:0;right:0}.chat-filter-tabs button{font-size:var(--font-size-400);cursor:pointer;color:var(--chat-subtext);background:0 0;border:none;justify-content:center;align-items:center;gap:6px;min-width:26px;padding:8px 0;transition:all .2s;display:flex;position:relative}.chat-filter-tabs button.active{color:var(--primary)}.chat-filter-tabs button.active:after{content:\"\";background-color:var(--primary);z-index:1;border-radius:2px;height:2px;position:absolute;bottom:-1px;left:0;right:0}.filter-unread-badge-container{align-items:center;gap:6px;display:flex}.filter-unread-badge{color:#fff;background-color:#f04438;border-radius:9px;justify-content:center;align-items:center;min-width:16px;height:16px;padding:0 4px;font-size:10px;font-weight:600;display:flex}.sidebar-scroll::-webkit-scrollbar{width:5px;margin-left:10px}.sidebar-scroll::-webkit-scrollbar-thumb{background:#0000000d;border-radius:10px}.chat-main{background:#ffffff1a;flex-direction:column;flex:1;display:flex;position:relative;overflow:hidden}.drag-overlay-full{pointer-events:none;z-index:10;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#0009;border:3px dashed #a855f7cc;justify-content:center;align-items:center;animation:.2s fadeIn;display:flex;position:absolute;inset:0}.drag-overlay-full .drag-content{color:#fff;text-shadow:0 2px 4px #0000004d;flex-direction:row;align-items:center;gap:12px;display:flex}.drag-overlay-full .drag-icon{font-size:20px;animation:.6s ease-in-out infinite bounce}.chat-list{background:0 0;flex:1;overflow-y:auto}.chat-item{cursor:pointer;border-radius:8px;align-items:center;gap:12px;height:54px;padding:8px;display:flex;position:relative}.chat-item:hover{background:color-mix(in srgb, var(--primary) 5%, #fff)}.chat-item.active{background:color-mix(in srgb, var(--primary) 10%, #fff)}.dark-theme .chat-item:hover,.dark-theme .chat-item.active{background:color-mix(in srgb, var(--primary) 15%, transparent)}.chat-item-avatar{justify-content:center;align-items:center;width:32px;height:32px;display:flex;position:relative}.online-indicator{z-index:1;background-color:#22c55e;border:2px solid #fff;border-radius:50%;width:12px;height:12px;position:absolute;bottom:-3px;right:2px}.chat-item-info{flex:1;overflow:hidden}.chat-item-name{color:var(--chat-text);white-space:nowrap;text-overflow:ellipsis;text-transform:capitalize;overflow:hidden}.chat-item-last{flex:1;min-width:0}.last-message-text{color:var(--chat-subtext);white-space:nowrap;text-overflow:ellipsis;min-width:0;font-size:var(--font-size-300);flex:1;display:block;overflow:hidden}.info-bottom-right{flex-shrink:0;align-items:center;gap:4px;margin-top:4px;display:flex}.mute-icon-list{color:#94a3b8;flex-shrink:0}.chat-item.active .chat-item-last{color:var(--chat-text)}.unread-badge{color:#fff;z-index:2;background:linear-gradient(135deg,#f43f5e,#e11d48);border:2px solid #fff;border-radius:50%;justify-content:center;align-items:center;min-width:18px;height:18px;padding:10px 7px;font-size:10px;font-weight:700;display:flex;position:absolute;top:-4px;right:-4px;box-shadow:0 2px 4px #0000001a}.info-top-row{justify-content:space-between;align-items:baseline;display:flex}.info-bottom-row{justify-content:space-between;align-items:center;line-height:17px;display:flex}.chat-item-time{color:var(--chat-subtext);white-space:nowrap;font-size:var(--font-size-300);line-height:17px}.unread-badge-circle{background-color:var(--primary);color:#fff;border-radius:9px;justify-content:center;align-items:center;min-width:18px;height:18px;margin-left:8px;padding:0 5px;font-size:10px;font-weight:600;display:flex}.chat-list-section{margin-bottom:16px}.empty-chat-list{padding:12px 8px 4px}.section-header{color:#64748b;text-transform:none;align-items:center;gap:6px;padding:8px 8px 4px;display:flex}.section-icon{color:#94a3b8}.chat-options-wrapper{opacity:0;pointer-events:none;z-index:100;justify-content:center;align-items:center;transition:all .2s cubic-bezier(.4,0,.2,1);display:flex;position:absolute;top:50%;right:12px;transform:translateY(-50%)scale(.8)}.chat-item:hover .chat-options-wrapper,.chat-item.has-open-dropdown .chat-options-wrapper{opacity:1;pointer-events:auto;transform:translateY(-50%)scale(1)}.chat-options-btn{-webkit-backdrop-filter:blur(8px);color:#64748b;cursor:pointer;background:#ffffff26;border:1px solid #fff3;border-radius:10px;justify-content:center;align-items:center;width:32px;height:32px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex}.chat-options-btn:hover,.chat-options-btn.active{color:#1e293b;background:#ffffff4d;border-color:#fff6;transform:scale(1.05)}.chat-options-btn svg{width:18px;height:18px}.chat-options-dropdown{-webkit-backdrop-filter:blur(20px)saturate(160%);z-index:1000;background:#ffffffe6;border:1px solid #fff9;border-radius:14px;flex-direction:column;gap:4px;min-width:160px;padding:6px;animation:.2s cubic-bezier(.4,0,.2,1) dropdownFadeIn;display:flex;position:absolute;top:calc(100% + 8px);right:0;box-shadow:0 10px 25px -5px #0000001a,0 8px 10px -6px #0000001a}@keyframes dropdownFadeIn{0%{opacity:0;transform:translateY(-10px)scale(.95)}to{opacity:1;transform:translateY(0)scale(1)}}.dropdown-item{font-size:var(--font-size-400);color:#334155;cursor:pointer;border-radius:10px;align-items:center;gap:10px;padding:8px 12px;transition:all .2s;display:flex}.dropdown-item:hover{color:#0f172a;background:#0000000a}.dropdown-item.delete{color:#ef4444}.dropdown-item.delete:hover{color:#dc2626;background:#ef444414}.dropdown-icon{flex-shrink:0;width:16px;height:16px}.header-actions{gap:4px;display:flex}.action-btn{color:#667085;cursor:pointer;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;width:28px;height:28px;padding:6px;transition:all .2s;display:flex}.action-btn:hover{color:#101828;background:#f2f4f7}.action-btn.close-btn:hover{color:#ef4444;background:#fee2e2}.add-group-btn{color:#667085;cursor:pointer;background:#f9fafb;border:1px solid #f2f4f7;border-radius:8px;justify-content:center;align-items:center;width:28px;height:28px;transition:all .2s;display:flex}.add-group-btn:hover{color:#101828;background:#f2f4f7;border-color:#eaecf0}.modal-overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:100000;background:#0006;justify-content:center;align-items:center;animation:.3s modalFadeIn;display:flex;position:absolute;inset:0}.modal-content{background:color-mix(in srgb, var(--primary), #ffffffb3 92%);-webkit-backdrop-filter:blur(30px)saturate(150%);border:1px solid #fffc;border-radius:36px;width:90%;max-width:380px;height:85%;padding:32px;animation:.4s cubic-bezier(.175,.885,.32,1.275) modalPopUp;overflow-y:auto;box-shadow:0 30px 60px #00000014}.dark-theme .modal-content{background:color-mix(in srgb, var(--primary), #1e293bb3 90%);color:#f8fafc;border-color:#ffffff1a}.modal-content::-webkit-scrollbar-track{margin:10px 0}.modal-title{color:var(--chat-text);text-align:center;margin-bottom:24px}.members-section{margin-bottom:24px}.section-title{color:#64748b;padding-left:4px;display:block}.members-list{min-height:450px;margin:0 -4px;padding:4px;overflow-y:auto}.members-list::-webkit-scrollbar{width:5px}.members-list::-webkit-scrollbar-thumb{background:#4f46e533;border-radius:10px}.member-item{cursor:pointer;background:#fff6;border:1px solid #0000;border-radius:16px;align-items:center;gap:14px;padding:12px;transition:all .2s cubic-bezier(.4,0,.2,1);display:flex}.member-item:hover{background:#fffc}.remove-member-btn{color:#94a3b8;cursor:pointer;background:0 0;border:none;border-radius:8px;justify-content:center;align-items:center;margin-left:auto;padding:6px;transition:all .2s;display:flex}.remove-member-btn:hover{color:#ef4444;background:#ef44441a;transform:scale(1.1)}.remove-member-btn svg{width:18px;height:18px}.member-name{color:var(--chat-text);flex:1}.member-item.selected .member-check{background:linear-gradient(135deg,#6366f1,#4f46e5);border-color:#4f46e5;transform:scale(1.1)}.modal-actions{gap:12px;margin-top:8px;display:flex}.empty-chat-state{color:#64748b;text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;padding:40px;display:flex}.empty-icon{opacity:.5;margin-bottom:20px;font-size:48px}.empty-chat-state h3{color:var(--chat-text);margin-bottom:0;font-size:16px;font-weight:700}.empty-chat-state p{opacity:.8;font-size:14px}.modal-search-wrapper{margin-bottom:20px}.no-members-found{text-align:center;text-align:center;color:#9ca3af;background:#ffffff4d;border:1px dashed #0000000d;border-radius:16px;padding:20px}.member-item.loading{cursor:not-allowed;opacity:.6}.member-add-action{font-size:var(--font-size-400);color:var(--primary);background:color-mix(in srgb, var(--primary) 10%, transparent);border-radius:6px;margin-left:auto;padding:4px 12px;font-weight:500;transition:all .2s}.member-item:hover .member-add-action{background:var(--primary);color:#fff}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-12px)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes modalFadeIn{0%{opacity:0}to{opacity:1}}@keyframes modalPopUp{0%{opacity:0;transform:scale(.8)translateY(30px)}to{opacity:1;transform:scale(1)translateY(0)}}@keyframes slideUp{0%{opacity:0;transform:translateY(40px)scale(.9)}to{opacity:1;transform:translateY(0)scale(1)}}.theme-modal{max-width:300px!important;height:auto!important;padding:24px!important}.modal-header{justify-content:space-between;align-items:center;display:flex}.close-modal-btn{color:#94a3b8;cursor:pointer;background:0 0;border:none;padding:4px;font-size:24px;line-height:1}.contact-categories{flex-direction:column;gap:8px;padding:8px;display:flex}.category-item{cursor:pointer;color:var(--chat-text);border-radius:8px;align-items:center;gap:12px;width:100%;height:40px;padding:10px 12px;font-weight:500;transition:all .2s;display:flex}.category-item:hover{background:color-mix(in srgb, var(--primary) 5%, #fff);color:var(--primary)}.category-item.active{background:color-mix(in srgb, var(--primary) 10%, #fff);color:var(--primary)}.category-item .count{color:#99a1af;border-radius:10px;margin-left:auto;padding:2px 8px}.contact-list-view{background:var(--container-bg);flex-direction:column;flex:1;height:100%;display:flex}.contact-list-header{border-bottom:1px solid var(--chat-border);color:var(--chat-text);height:45px;padding:10px 16px}.contact-list-toolbar{justify-content:space-between;align-items:center;padding:12px 16px 20px;display:flex}.toolbar-left{align-items:center;gap:20px;display:flex}.toolbar-left span{color:#64748b;font-weight:500}.toolbar-search{background:var(--input-background);border-radius:6px;align-items:center;gap:8px;width:300px;height:36px;padding:12px;display:flex}.toolbar-search input{font-size:var(--font-size-400);width:100%;color:var(--color-input);background:0 0;border:none;outline:none}.toolbar-right{gap:12px;height:36px;display:flex}.filter-select{cursor:pointer;font-size:var(--font-size-400);color:#1e293b;background:#f3f4f6;border-radius:6px;align-items:center;gap:8px;padding:9px 12px;display:flex}.dropdown-select{z-index:10;background:#fff;border:1px solid #e2e8f0;border-radius:8px;min-width:150px;margin-top:8px;position:absolute;top:100%;right:0;box-shadow:0 4px 6px #0000001a}.dropdown-select .dropdown-item{cursor:pointer;border-bottom:1px solid #e2e8f0;border-radius:0;align-items:center;gap:8px;height:40px;padding:12px 16px;display:flex}.dropdown-select .dropdown-item div{padding-top:3px}.contact-scroll-area{flex:1;padding:0 16px 16px;overflow-y:auto}.letter-title{color:var(--chat-subtext)}.contact-item-row{justify-content:space-between;align-items:center;height:64px;padding:12px 0;display:flex}.contact-item-left{cursor:pointer;align-items:center;gap:16px;display:flex}.contact-avatar{width:32px;height:32px;position:relative}.contact-avatar img{object-fit:cover;border-radius:50%;width:100%;height:100%}.contact-avatar .online-status{background:#22c55e;border:2px solid #fff;border-radius:50%;width:10px;height:10px;position:absolute;bottom:0;right:0}.contact-info{flex-direction:column;display:flex}.contact-name{color:var(--chat-text)}.contact-role{color:var(--chat-subtext)}.contact-item-actions{gap:8px;display:flex}.contact-action-btn{color:#64748b;cursor:pointer;background:#fff;border:1px solid #e2e8f0;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;transition:all .2s;display:flex}.contact-action-btn:hover{color:#1e293b;background:#f1f5f9;border-color:#cbd5e1}.chat-window.fullpage .chat-body-container{background:var(--container-bg);border-top-left-radius:8px;overflow:hidden;flex:1!important;width:100%!important;height:100%!important;display:flex!important}.chat-window.fullpage .chat-sidebar{background:var(--container-bg);flex-direction:column;flex-shrink:0;width:312px;display:flex}.chat-window.fullpage .chat-main{background:var(--container-bg);flex-direction:column;flex:1;display:flex;position:relative}.chat-main-header{background:var(--container-bg);border-bottom:1px solid var(--chat-border);flex-shrink:0;justify-content:space-between;align-items:center;min-height:64px;padding:12px 16px;display:flex}.chat-main-info{align-items:center;gap:10px;min-width:0;display:flex}.chat-main-avatar{flex-shrink:0;width:32px;height:32px}.chat-main-text{text-transform:capitalize;flex-direction:column;min-width:0;display:flex}.chat-main-text-container{align-items:center;gap:6px;display:flex}.chat-main-name{color:var(--chat-main-name);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.chat-main-status{font-size:var(--font-size-300);color:#94a3b8;line-height:17px}.chat-main-actions{flex-shrink:0;gap:4px;display:flex}.main-action-btn{color:#64748b;cursor:pointer;background:0 0;border:none;border-radius:8px;justify-content:center;align-items:center;width:28px;height:28px;transition:all .2s;display:flex}.main-action-btn:hover{color:var(--primary);background:#f1f5f9}.chat-window.fullpage .chat-main-header{min-height:69px;padding:10px 16px}.chat-window.fullpage .chat-main-actions{gap:8px;display:flex}.chat-window.fullpage .header-info-text{flex-direction:row;align-items:center;gap:6px}.chat-window.fullpage .header-subtitle{margin-top:0}.chat-window.fullpage .chat-header .action-btn.theme-toggle{box-shadow:none;background:0 0}.chat-window.fullpage .chat-header{background-color:var(--app-sidebar-bg);height:45px;padding:8px 12px}.search-section-title{font-size:var(--font-size-500);color:var(--chat-subtext);align-items:center;gap:8px;padding:8px 8px 4px;display:flex}.search-count{font-size:var(--font-size-500);color:#3b82f6;font-weight:500}.search-section-content{flex-direction:column;gap:8px;display:flex}.search-result-item{cursor:pointer;border-radius:12px;align-items:center;gap:12px;height:54px;padding:8px;transition:all .2s;display:flex}.search-result-item:hover{background:#00000008}.search-result-avatar{border-radius:50%;flex-shrink:0;width:32px;height:32px;overflow:hidden}.search-result-avatar img{object-fit:cover;border-radius:50%;width:100%;height:100%}.avatar-placeholder{color:#fff;background:linear-gradient(135deg,#3b82f6,#2563eb);justify-content:center;align-items:center;width:100%;height:100%;font-size:18px;font-weight:600;display:flex}.search-result-info{flex:1;min-width:0}.search-result-name{color:var(--chat-text);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.search-result-sub{font-size:var(--font-size-300);color:#64748b;margin-top:2px}.search-view-all{color:#64748b;width:100%;font-size:var(--font-size-500);cursor:pointer;background:#00000008;border:none;border-radius:8px;margin-top:12px;padding:10px;font-weight:500;transition:all .2s}.search-view-all:hover{color:#1e293b;background:#0000000f}.message-result .search-result-top{justify-content:space-between;align-items:center;margin-bottom:2px;display:flex}.search-result-date{font-size:var(--font-size-300);color:#94a3b8}.search-result-text{font-size:var(--font-size-300);color:#475569;-webkit-line-clamp:2;line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.file-icon-wrapper{color:#3b82f6;background:#3b82f61a;border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;display:flex}.highlight-match{color:var(--primary);font-weight:500}.resize-handle.ne{cursor:ne-resize;z-index:10001;width:15px;height:15px;position:absolute;top:0;right:0}.resize-handle.nw{cursor:nw-resize;z-index:10001;width:15px;height:15px;position:absolute;top:0;left:0}.resize-handle.se{cursor:se-resize;z-index:10001;width:15px;height:15px;position:absolute;bottom:0;right:0}.resize-handle.sw{cursor:sw-resize;z-index:10001;width:15px;height:15px;position:absolute;bottom:0;left:0}.hidden-in-popup{display:none}.chat-window:not(.fullpage) .side-bar-info-chat{border-left:none;flex:1;width:100%;max-width:none}\n .chat-input-area{background:var(--container-bg);border-top:var(--chat-border);align-items:center;gap:12px;padding:12px 16px;transition:all .3s;display:flex;position:relative}.chat-input-actions{flex-shrink:0;align-items:center;gap:8px;display:flex;position:relative}.chat-input-actions .action-btn{color:#6b7280;cursor:pointer;background:0 0;border:none;border-radius:8px;justify-content:center;align-items:center;padding:6px;transition:all .2s;display:flex}.chat-input-actions .action-btn:hover{color:#374151;background:#f3f4f6}.chat-input-actions .action-btn.active{color:var(--primary);background:#f3f4f6}.chat-input-container{flex:1;align-items:center;display:flex}.chat-input{background:var(--input-background);border:1px solid var(--chat-border);width:100%;color:var(--chat-text);border-radius:8px;outline:none}textarea.chat-input{box-sizing:border-box;white-space:pre-wrap;resize:none;border:1px solid var(--chat-border);font-family:Inter,sans-serif;line-height:24px;font-size:var(--font-size-500);border-radius:4px;min-height:36px;max-height:120px;padding:5px 12px;overflow-y:auto}.chat-input::placeholder{color:#9ca3af}.chat-input:focus{background:var(--input-background);border-color:#3b82f64d}.chat-input:disabled{opacity:.6;cursor:not-allowed}.chat-window:has(.main-action-btn.active) .chat-input-actions>.action-btn:not(.emoji-picker-btn){display:none}.chat-window:has(.main-action-btn.active) .chat-input-actions>.add-menu-wrapper{display:block}.send-btn{cursor:pointer;color:#fff;background:var(--primary,#8aaeff);width:36px;height:36px;box-shadow:none;border:none;border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;transition:all .2s;display:flex}.send-btn:hover:not(:disabled){filter:brightness(.9);transform:translateY(-1px)}.send-btn:disabled{opacity:.6;cursor:not-allowed;background:#d1d5db}.send-btn svg{width:18px;height:18px}.emoji-picker{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);z-index:10;background:#fffffff2;border:1px solid #0000000d;border-radius:20px;grid-template-columns:repeat(5,1fr);gap:8px;margin-bottom:10px;padding:12px;animation:.3s cubic-bezier(.34,1.56,.64,1) emojiSlideUp;display:grid;position:absolute;bottom:100%;left:16px;box-shadow:0 10px 30px #0000001a}@keyframes emojiSlideUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.emoji-btn{font-size:var(--font-size-600);cursor:pointer;background:0 0;border:none;border-radius:8px;justify-content:center;align-items:center;padding:4px;transition:all .2s;display:flex}.emoji-btn:hover{background:#fff;transform:scale(1.2);box-shadow:0 2px 5px #0000000d}.selected-files-list{background:#ffffff1a;border-bottom:1px solid #fff3;flex-wrap:nowrap;gap:12px;height:100px;padding:12px 20px;display:flex;overflow:auto hidden}.selected-file-item{background:#fef2f280;border-radius:12px;flex-direction:column;align-items:center;gap:8px;padding:8px;transition:all .2s;display:flex;position:relative;box-shadow:0 2px 8px #00000014}.selected-file-item.other-file{flex-direction:row}.selected-file-item:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000001f}.file-preview-image{object-fit:cover;border-radius:8px;width:54px;height:54px;display:block}.file-content-wrapper{flex-direction:row;align-items:center;gap:6px;max-width:240px;display:flex}.selected-files-list .file-icon{border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;display:flex}.selected-files-list .file-info{flex-direction:column;gap:2px;min-width:0;display:flex}.selected-files-list .file-name{color:#0a0a0a;white-space:nowrap;text-overflow:ellipsis;width:400px;max-width:100%;overflow:hidden}.selected-files-list .file-size{font-size:var(--font-size-300);color:#94a3b8;white-space:nowrap;text-overflow:ellipsis;max-width:120px;overflow:hidden}.remove-file-btn{color:#fff;cursor:pointer;background:#ef4444;border:none;border-radius:50%;justify-content:center;align-items:center;width:20px;height:20px;transition:all .2s;display:flex;position:absolute;top:-8px;right:-8px;box-shadow:0 2px 8px #ef44444d}.remove-file-btn:hover{background:#dc2626;transform:scale(1.1);box-shadow:0 4px 12px #ef444466}.remove-file-btn:disabled{opacity:.5;cursor:not-allowed}.selected-file-item.error-file-item{border:2px solid #ef4444;animation:.3s ease-in-out errorShake}@keyframes errorShake{0%{transform:translate(-3px)}50%{transform:translate(3px)}to{transform:translate(0)}}.selected-file-item.error-file-item:hover{background:#fef2f2b3;border-color:#dc2626}.selected-files-list .file-size.error-size{color:#ef4444}.reply-input-preview{background:color-mix(in srgb, var(--primary) 8%, #fff);border-left:3px solid var(--primary);border-top-left-radius:4px;border-bottom-left-radius:4px;justify-content:space-between;align-items:center;margin:0 10px 10px;padding:5px 20px;animation:.3s slideUp;display:flex;position:relative}.reply-content{flex-direction:column;flex:1;gap:2px;min-width:0;padding-left:18px;display:flex}.reply-user,.reply-user span{color:var(--primary,#155dfc)}.reply-text{color:#4a5565;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.close-reply{color:#9ca3af;cursor:pointer;font-size:var(--font-size-500);background:0 0;border:none;transition:all .2s;position:absolute;top:0;right:0}.reply-icon{color:var(--primary,#155dfc);position:absolute;top:6px;left:10px}.close-reply:hover{color:#ef4444;transform:scale(1.1)}@keyframes slideUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.voice-recording-container{background:linear-gradient(135deg,#ef44441a,#ef44440d);border:1px solid #ef444433;flex:1;align-items:center;gap:12px;padding:12px 16px;animation:.2s slideUp;display:flex}.voice-recording-controls{gap:4px;display:flex}.voice-recording-info{flex:1;align-items:center;gap:8px;display:flex}.recording-indicator{font-size:var(--font-size-400);color:#374151;align-items:center;gap:6px;font-weight:500;display:flex}.recording-dot{background:#ef4444;border-radius:50%;width:8px;height:8px;animation:1.5s ease-in-out infinite recordingPulse}@keyframes recordingPulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(1.2)}}.recording-duration{font-size:var(--font-size-400);color:#374151;text-align:right;min-width:45px;font-weight:600}.voice-recorded-container{background:linear-gradient(135deg,#3b82f61a,#3b82f60d);border:1px solid #3b82f633;flex:1;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;animation:.2s slideUp;display:flex}.voice-recorded-info{font-size:var(--font-size-400);flex:1;align-items:center;gap:8px;display:flex}.voice-label{color:#1f2937;white-space:nowrap;font-weight:500}.voice-duration{color:#3b82f6;text-align:right;min-width:45px;margin-left:auto;font-weight:600}.voice-control-btn{color:#1f2937;cursor:pointer;width:32px;height:32px;font-size:var(--font-size-500);background:#fff;border:1px solid #0000001a;border-radius:6px;justify-content:center;align-items:center;transition:all .2s;display:flex}.voice-control-btn:hover{background:#f9fafb;transform:scale(1.05)}.voice-control-btn.cancel-btn{color:#ef4444;background:#ef44440d;border-color:#ef44441a}.voice-control-btn.add-btn{color:#fff;background:#8aaeff;border-color:#8aaeff}.add-menu-wrapper{position:relative}.add-menu-dropdown{z-index:1000;background:#fff;border:1px solid #e0e0e0;border-radius:8px;flex-direction:column;min-width:150px;display:flex;position:absolute;bottom:30px;left:0;box-shadow:0 2px 8px #00000026}.add-menu-item{cursor:pointer;font-size:var(--font-size-500);background:0 0;border:none;align-items:center;gap:12px;padding:12px 16px;transition:background-color .2s;display:flex}.add-menu-item:hover:not(:disabled){background-color:#f5f5f5}.add-menu-item:disabled{opacity:.5;cursor:not-allowed}.add-menu-item:first-child{border-radius:8px 8px 0 0}.add-menu-item:last-child{border-radius:0 0 8px 8px}.add-menu-item span{white-space:nowrap}\n .message-list-wrapper{flex-direction:column;flex:1;display:flex;position:relative;overflow:hidden}.message-list{background:var(--chat-list-bg);flex-direction:column-reverse;flex:1;gap:20px;padding:24px 20px;display:flex;overflow:hidden auto}.chat-date-divider{justify-content:center;align-items:center;width:100%;margin:20px 0;display:flex}.chat-date-divider span{background:var(--message-bubble-other);color:var(--chat-text);font-size:var(--font-size-300);border-radius:20px;padding:4px 16px;font-weight:500;box-shadow:0 1px 2px #0000000d}.message-item{gap:4px 8px;max-width:70%;display:flex;position:relative}.message-content{flex-direction:column;width:fit-content;max-width:100%;display:flex}.message-item.current-user .message-content{align-items:flex-end}.message-item.other-user .message-content{align-items:flex-start}.message-content-container{flex-direction:column;gap:12px;min-width:0;max-width:100%;display:flex;position:relative}.message-item.current-user{flex-direction:row-reverse;align-self:flex-end}.message-item.other-user{align-self:flex-start}.message-bubble.current-user{background:var(--primary,#155dfc);border-bottom-right-radius:8px;align-self:flex-end}.message-bubble.other-user{background:var(--message-bubble-other);border-top-left-radius:8px;align-self:flex-start}.message-avatar{object-fit:cover;cursor:pointer;border:2px solid #ffffff4d;border-radius:50%;flex-shrink:0;width:40px;height:40px;transition:transform .2s;box-shadow:0 4px 12px #00000026}.message-bubble{border-radius:16px;flex-direction:column;gap:4px;width:100%;padding:6px 12px;display:flex;position:relative}.message-files{flex-wrap:wrap;align-content:start;align-items:center;gap:8px;max-width:100%;display:flex}.message-files>*{width:100%;max-height:250px}.message-item.current-user .message-files{justify-content:flex-end;align-self:flex-end}.message-item.other-user .message-files{justify-content:flex-start;align-self:flex-start}.file-item{cursor:pointer;background:#f3f4f6;border-radius:14px;align-items:center;gap:4px;height:64px;max-height:64px;padding:8px;text-decoration:none;transition:all .2s;display:flex}.message-item .file-item{flex:1 0 100%}.message-item .file-item .file-name{white-space:nowrap;text-overflow:ellipsis;color:#0a0a0a;overflow:hidden}.chatbot-container.popup .message-item .file-item{max-width:263px}.file-item:hover{background:#ececf0ca;transform:translate(4px)}.file-info{flex-direction:column;flex:1;min-width:0;display:flex}.file-size{font-size:var(--font-size-300);color:#717182;line-height:16px}.file-download-button{cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;width:48px;height:100%;display:flex}.file-image-wrapper{border-radius:8px;justify-content:center;align-items:center;max-width:100%;max-height:100%;margin-top:0;display:flex;position:relative;overflow:hidden}.file-image{object-fit:contain;cursor:pointer;border:1px solid #fff3;border-radius:8px;width:100%;height:auto;transition:transform .2s}.file-image:hover{transform:scale(1.05)}.image-overlay-more{cursor:pointer;background:#00000080;border-radius:8px;justify-content:center;align-items:center;width:100%;height:100%;transition:all .2s;display:flex;position:absolute;top:0;left:0}.image-overlay-more:hover{background:#000000a6}.image-overlay-text{color:#fff;text-shadow:0 2px 4px #0000004d;font-size:28px;font-weight:600}.user .file-image{border-color:#ffffff4d}.message-actions-bar{-webkit-backdrop-filter:none;box-shadow:none;opacity:0;pointer-events:none;z-index:100;background:0 0;border:none;gap:2px;padding:0;transition:all .2s;display:flex;position:absolute;bottom:0}.message-item:hover .message-actions-bar,.message-actions-bar:hover{opacity:1;pointer-events:auto}.message-item.current-user .message-actions-bar{right:calc(100% + 8px)}.message-item.other-user .message-actions-bar{left:calc(100% + 8px)}.chat-window:not(.fullpage) .message-list{overflow-x:hidden}.chat-window:not(.fullpage) .message-item.current-user .message-actions-bar,.chat-window:not(.fullpage) .message-item.other-user .message-actions-bar{-webkit-backdrop-filter:blur(8px);background:#ffffffe6;border:1px solid #0000000d;border-radius:20px;gap:2px;padding:2px 6px;display:flex;inset:auto 0 -22px auto;transform:none;box-shadow:0 2px 8px #00000014}.chat-window:not(.fullpage) .message-item.other-user .message-member-name{margin-right:0}.chat-window:not(.fullpage) .action-icon svg{width:13px;height:13px}.chat-window:not(.fullpage) .action-icon{width:26px;height:26px}.action-icon{color:#64748b;cursor:pointer;background:0 0;border:none;border-radius:8px;justify-content:center;align-items:center;width:30px;height:30px;display:flex}.action-icon.is-hidden{display:none}.action-icon svg{stroke-width:2.2px;width:16px;height:16px}.action-icon:hover{background:#0000000d;transform:translateY(-2px)}.action-icon[title=Xóa]:hover,.action-icon[title=Thu\\ hồi]:hover{color:#ef4444;background:#ef44441a}.action-icon[title=Trả\\ lời]:hover{color:#3b82f6;background:#3b82f61a}.action-icon[title=Thích]:hover{color:#f59e0b;background:#f59e0b1a}.action-icon[title=Yêu\\ thích]:hover{color:#ec4899;background:#ec48991a}.message-reactions-badge{font-size:var(--font-size-400);z-index:2;background:#fffffff2;border:1px solid #0000000d;border-radius:10px;align-items:center;gap:2px;padding:2px 6px;animation:.3s cubic-bezier(.175,.885,.32,1.275) popIn;display:flex;position:absolute;bottom:-11px;box-shadow:0 2px 8px #0000001a}.message-reactions-badge span{line-height:1}.message-item.current-user .message-reactions-badge{right:8px}.message-item.other-user .message-reactions-badge{left:8px}@keyframes popIn{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}.message-bubble-group{flex-direction:column;gap:2px;min-width:0;max-width:100%;display:flex}.message-item.current-user .message-bubble-group,.message-item.other-user .message-bubble-group{align-items:stretch}.message-reply-preview{font-size:var(--font-size-300);cursor:pointer;border-radius:2px;min-width:120px;max-width:100%;margin-bottom:2px;padding:6px 10px;transition:all .2s;overflow:hidden}.message-item.current-user .message-reply-preview{border-left:3px solid color-mix(in srgb, var(--primary,#155dfc) 50%, #fff);background:#f0f3f4;align-self:flex-end}.message-item.other-user .message-reply-preview{background:#f3f4f6cc;border-left:3px solid #94a3b8;align-self:flex-start}.message-item.current-user .message-reply-preview:hover{background:color-mix(in srgb, var(--primary) 10%, #f3f4f6)}.message-item.other-user .message-reply-preview:hover{background:#f3f4f6}.message-reply-header{align-items:center;gap:4px;display:flex}.message-reply-icon{color:#000}.reply-user-name{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.message-item.current-user .reply-user-name{color:#101828}.message-item.other-user .reply-user-name{color:#475569}.reply-content-text{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.message-item.current-user .reply-content-text{color:#6a7282}.message-item.other-user .reply-content-text{color:#64748b}.message-text{overflow-wrap:break-word;word-break:break-word;white-space:pre-line;width:auto;min-width:0;max-width:100%;display:inline-block}.message-text a{word-break:break-all;white-space:nowrap;text-overflow:ellipsis;vertical-align:bottom;max-width:100%;text-decoration:underline;display:inline-block;overflow:hidden}.message-bubble.other-user .message-text{color:var(--chat-text)}.message-bubble.other-user .message-text a:-webkit-any-link{color:var(--chat-text)}.message-bubble.current-user .message-text{color:var(--primary-contrast,#f8fafc)}.message-bubble.current-user .message-text a:-webkit-any-link{color:var(--primary-contrast,#f8fafc)}.message-bubble.other-user.revoked .message-text,.message-bubble.current-user.revoked .message-text{color:color-mix(in srgb, var(--chat-text), transparent 50%)}.message-member-name{font-size:var(--font-size-500);color:#4a5565;white-space:nowrap;text-overflow:ellipsis;cursor:pointer;min-width:0;margin-bottom:4px;overflow:hidden}.scroll-bottom-btn{-webkit-backdrop-filter:blur(8px);cursor:pointer;width:40px;height:40px;color:var(--primary);z-index:1000;background:#ffffffb3;border:1px solid #ffffff4d;border-radius:50%;justify-content:center;align-items:center;font-size:20px;transition:all .3s cubic-bezier(.4,0,.2,1);animation:.3s fadeInPop;display:flex;position:absolute;bottom:20px;right:20px;box-shadow:0 4px 15px #00000026}.scroll-bottom-btn:hover{background:#fff;transform:translateY(-4px);box-shadow:0 6px 20px #0003}.unread-dot{background-color:#ff4d4f;border:2px solid #fff;border-radius:50%;width:10px;height:10px;position:absolute;top:0;right:0}@keyframes fadeInPop{0%{opacity:0;transform:scale(.5)translateY(20px)}to{opacity:1;transform:scale(1)translateY(0)}}.message-time{z-index:10;height:40px;display:none;position:absolute;top:-32px}.message-time>div{color:#99a1af;font-size:var(--font-size-300);white-space:nowrap;background:#fff;border-radius:10px;width:fit-content;padding:4px 10px;box-shadow:0 4px 4px #0000000d}.message-content:hover .message-time,.message-time:hover{display:block}.message-item.current-user .message-time{text-align:right}.message-item.other-user .message-time{text-align:left}.message-item-status{color:var(--chat-text);font-weight:400;font-size:var(--font-size-300);margin-left:4px}.message-item-status.seen{color:#3b82f6;font-weight:600}.message-item-status.sent{color:#99a1af;font-weight:400}.message-item-status.seen svg{margin-bottom:-2px}.message-bubble.revoked{opacity:.8;font-style:italic;font-size:var(--font-size-400);background:#ffffff0d;border:1px dashed #fff3}@keyframes highlight-fade{0%{background-color:rgba(var(--primary-rgb), .2);transform:scale(1.02)}to{background-color:color-mix(in srgb, var(--primary) 10%, #f3f4f6);transform:scale(1)}}.highlight-message .message-bubble{animation:2s ease-out highlight-fade}.see-more-btn{color:var(--primary);cursor:pointer;margin-left:8px;font-weight:600;text-decoration:none;transition:all .2s;display:inline-block}.message-bubble.current-user .see-more-btn{color:#ffffffe6;text-decoration:underline}.see-more-btn:hover{filter:brightness(1.1);text-decoration:underline}.message-bubble.current-user .see-more-btn:hover{color:#fff}.initial-messages-loading{background:var(--chat-list-bg);z-index:10;width:100%;height:100%;color:var(--chat-subtext);flex-direction:column;justify-content:center;align-items:center;gap:12px;display:flex;position:absolute;top:0;left:0}.spinner{border:3px solid color-mix(in srgb, var(--primary,#155dfc) 10%, transparent);border-top-color:var(--primary,#155dfc);border-radius:50%;width:32px;height:32px;animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}\n .file-viewer-overlay{z-index:100001;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#000000e6;justify-content:center;align-items:center;animation:.2s ease-in-out fadeIn;display:flex;position:fixed;inset:0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.file-viewer-content{flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;animation:.3s ease-out slideUp;display:flex;position:relative}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.file-viewer-main{border-radius:8px;justify-content:center;align-items:center;max-width:100%;max-height:70vh;display:flex;position:relative;overflow:hidden}.file-viewer-image{object-fit:contain;border-radius:8px;max-width:100%;max-height:70vh;box-shadow:0 10px 40px #0000004d}.file-viewer-main:has(.file-viewer-video){overflow:visible}.file-viewer-video{object-fit:contain;border-radius:8px;max-width:100%;max-height:100%;box-shadow:0 10px 40px #0000004d}.video-container{justify-content:center;width:85vw;height:78vh;display:flex;overflow:visible}.file-viewer-close{color:#fff;cursor:pointer;z-index:100001;text-align:center;background:#fff3;border:1px solid #ffffff4d;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;padding:0;transition:all .2s;display:flex;position:absolute;top:30px;right:70px}.file-viewer-close:hover{background:#ffffff4d;border-color:#fff6;transform:scale(1.1)}.file-viewer-close:active{transform:scale(.95)}.file-viewer-nav{color:#fff;cursor:pointer;z-index:100001;text-align:center;background:#ffffff26;border:1px solid #fff3;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;padding:0;transition:all .2s;display:flex;position:absolute;top:50%;transform:translateY(-50%)}.file-viewer-nav:hover{background:#ffffff40;border-color:#ffffff4d}.file-viewer-nav:active{transform:translateY(-50%)scale(.95)}.file-viewer-prev{left:70px}.file-viewer-next{right:70px}@media (width<=768px){.file-viewer-prev{left:10px}.file-viewer-next{right:10px}.file-viewer-close{top:10px;right:10px}}.file-viewer-counter{color:#fff;font-size:var(--font-size-300);white-space:nowrap;z-index:100001;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#00000080;border-radius:20px;padding:6px 12px;position:absolute;bottom:20px;left:50%;transform:translate(-50%)}.file-viewer-thumbnails-container{z-index:100001;opacity:0;pointer-events:none;visibility:hidden;justify-content:center;align-items:center;gap:2rem;width:100%;padding-bottom:3.5rem;display:flex;position:absolute;bottom:0;left:50%;transform:translate(-50%)}.file-viewer-thumbnails{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#0000004d;border-radius:8px;gap:8px;max-width:60%;padding-top:12px;padding-bottom:12px;display:flex;overflow-x:auto;-webkit-mask-image:linear-gradient(90deg,#0000 0%,#000 10% 90%,#0000 100%);mask-image:linear-gradient(90deg,#0000 0%,#000 10% 90%,#0000 100%)}.file-viewer-counter:hover~.file-viewer-thumbnails-container,.file-viewer-thumbnails-container:hover{opacity:1;visibility:visible;pointer-events:auto}.file-viewer-thumbnails::-webkit-scrollbar{height:4px}.file-viewer-thumbnails::-webkit-scrollbar-thumb{background:#ffffff4d;border-radius:2px}.file-viewer-thumbnails::-webkit-scrollbar-thumb:hover{background:#ffffff80}.file-viewer-thumbnails-scroll-btn{color:#fff;cursor:pointer;z-index:100002;-webkit-backdrop-filter:blur(10px)saturate(180%);backdrop-filter:blur(10px)saturate(180%);background:#fff3;border:1px solid #ffffff4d;border-radius:8px;justify-content:center;align-items:center;width:32px;height:32px;padding:0;transition:all .3s;display:flex;box-shadow:0 8px 32px #1f26875e}.file-viewer-thumbnails-scroll-btn:hover{background:#ffffff4d;border-color:#ffffff80;transform:scale(1.05);box-shadow:0 8px 32px #1f268780}.file-viewer-thumbnails-scroll-btn:active{transform:scale(.95)}.file-viewer-thumbnail{cursor:pointer;background:#0000004d;border:2px solid #0000;border-radius:4px;width:60px;min-width:60px;height:60px;padding:0;transition:all .2s;overflow:hidden}.file-viewer-thumbnail:hover{background:#0006;border-color:#ffffff80}.file-viewer-thumbnail.active{background:#0003;border-color:#fffc}.thumbnail-image{object-fit:cover;width:100%;height:100%}.thumbnail-video{object-fit:cover;z-index:1;cursor:pointer;width:100%;height:100%}.video-thumbnail-container{border-radius:4px;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:relative;overflow:hidden}.play-icon-overlay{z-index:2;pointer-events:none;cursor:pointer;background-color:#00000080;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;display:flex;position:absolute}.play-arrow{color:#fff;margin-bottom:3px;margin-left:2px;font-size:18px}.file-viewer-overlay:has(.file-viewer-audio){background:0 0}.file-viewer-main:has(.file-viewer-audio){overflow:visible}.audio-container{justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;overflow:visible}.audio-player-wrapper{-webkit-backdrop-filter:blur(30px)saturate(150%);backdrop-filter:blur(30px)saturate(150%);color:#1e293b;z-index:1000;background:#ffffff4d;border:1px solid #ffffff80;border-radius:8px;flex-direction:column;flex-shrink:0;justify-content:center;align-items:center;gap:12px;width:100%;max-width:500px;padding:24px 20px;display:flex;position:relative;box-shadow:0 0 0 100vmax #000000e6}.file-viewer-audio{width:100%;height:40px}.file-viewer-audio::-webkit-media-controls-panel{background-color:#ffffff1a}.audio-name{color:#000;font-size:var(--font-size-600);text-align:center;word-break:break-word;max-width:100%;margin:0;font-weight:700}.audio-thumbnail-container{background:linear-gradient(135deg,#6496ff80 0%,#c864ff80 100%);border-radius:4px;justify-content:center;align-items:center;width:100%;height:100%;display:flex}.audio-thumbnail-icon{font-size:28px}.pdf-thumbnail-container{background:linear-gradient(135deg,#f5222dcc 0%,#ff7a45cc 100%);border-radius:4px;justify-content:center;align-items:center;width:100%;height:100%;display:flex}.pdf-thumbnail-icon{font-size:28px}@media (width<=1024px){.file-viewer-content{max-width:95%}.file-viewer-image{max-height:60vh}}@media (width<=600px){.file-viewer-overlay{inset:0}.file-viewer-content{max-width:100%;max-height:100vh}.file-viewer-main,.file-viewer-image{max-height:50vh}.file-viewer-prev{left:10px}.file-viewer-next{right:10px}.file-viewer-close{top:10px;right:10px}.file-viewer-counter{font-size:var(--font-size-300);padding:6px 12px;bottom:60px}.file-viewer-thumbnails{max-width:100%;padding:8px}.file-viewer-thumbnail{width:50px;min-width:50px;height:50px}}.file-viewer-main:has(.file-viewer-pdf){overflow:visible}.file-viewer-content:has(.file-viewer-pdf) .file-viewer-close{top:5rem}.pdf-container{justify-content:center;width:100vw;height:100vh;display:flex;overflow:visible}.pdf-status{color:#fff}.pdf-status.pdf-error{text-align:center;color:red;padding:20px}.file-viewer-pdf{object-fit:contain;border-radius:8px;max-width:100%;max-height:100%;box-shadow:0 10px 40px #0000004d}\n .toast-container{z-index:100000;pointer-events:none;flex-direction:column;gap:10px;display:flex;position:absolute;bottom:24px;right:24px}.confirm-overlay{z-index:100001;-webkit-backdrop-filter:blur(8px);pointer-events:auto;border-radius:inherit;background:#0f172a66;justify-content:center;align-items:center;animation:.3s ease-out confirm-fade-in;display:flex;position:absolute;inset:0}@keyframes confirm-fade-in{0%{opacity:0}to{opacity:1}}.confirm-toast{text-align:center;background:#fff;border:1px solid #fffc;border-radius:24px;flex-direction:column;align-items:center;gap:0;width:420px;min-width:420px;animation:.4s cubic-bezier(.175,.885,.32,1.275) confirm-pop-up;display:flex;overflow:visible;box-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a,0 0 0 1px #0000000d;padding:32px!important}.confirm-toast:before{display:none}@keyframes confirm-pop-up{0%{opacity:0;transform:scale(.9)translateY(20px)}to{opacity:1;transform:scale(1)translateY(0)}}.confirm-modal-content{flex-direction:column;align-items:center;width:100%;display:flex}.confirm-toast .toast-message{color:#64748b;margin-bottom:32px;font-weight:500;line-height:1.6}.confirm-toast .toast-actions{gap:12px;width:100%;display:flex}.confirm-toast .toast-btn{border-radius:16px;flex:1;padding:14px;font-weight:700}.confirm-toast .toast-btn.cancel{color:#475569;background:#f1f5f9;border:none}.confirm-toast .toast-btn.cancel:hover{color:#1e293b;background:#e2e8f0}.dark-theme .confirm-toast{background:#1e293b;border-color:#ffffff1a}.dark-theme .confirm-title{color:#f8fafc}.dark-theme .confirm-toast .toast-message{color:#94a3b8}.dark-theme .confirm-toast .toast-btn.cancel{color:#cbd5e1;background:#334155}.dark-theme .confirm-toast .toast-btn.cancel:hover{color:#f8fafc;background:#475569}.dark-theme .confirm-toast.warning .confirm-icon{background:#f59e0b26}.toast-item{pointer-events:auto;color:#1e293b;background:#fff;border:1px solid #fff9;border-radius:20px;align-items:center;gap:12px;min-width:500px;max-width:calc(100% - 40px);padding:12px 16px;font-weight:500;animation:.4s cubic-bezier(.175,.885,.32,1.275) toast-pop-in;display:flex;position:relative;overflow:hidden;box-shadow:0 4px 6px -1px #0000000d,0 10px 15px -3px #0000001a}.toast-item:before{content:\"\";width:4px;transition:background .3s;position:absolute;top:0;bottom:0;left:0}.toast-item.success:before{background:#10b981}.toast-item.error:before{background:#ef4444}.toast-item.info:before{background:#3b82f6}.toast-item.warning:before{background:#f59e0b}.toast-item span{background:#00000008;border-radius:50%;justify-content:center;align-items:center;width:28px;height:28px;display:flex}.toast-item button{cursor:pointer;color:#94a3b8;background:0 0;border:none;border-radius:5px;justify-content:center;align-items:center;padding:4px;transition:all .2s;display:flex}.toast-item button:hover{color:#1e293b;background:#0000000d}@keyframes toast-pop-in{0%{opacity:0;transform:translate(20px)scale(.9)}to{opacity:1;transform:translate(0)scale(1)}}.dark-theme .toast-item{color:#f8fafc;background:#1e293b;border-color:#ffffff14;box-shadow:0 20px 25px -5px #0003}.dark-theme .toast-item span{background:#ffffff0d}.toast-message{flex:1}.toast-actions{align-items:center;gap:12px;display:flex}.toast-btn{cursor:pointer;white-space:nowrap;border-radius:10px;justify-content:center;align-items:center;padding:8px 20px;font-weight:600;transition:all .2s cubic-bezier(.4,0,.2,1);display:flex}.toast-btn.cancel{color:#64748b;background:0 0;border:1px solid #00000014}.dark-theme .toast-btn.cancel{color:#94a3b8;border-color:#ffffff1a}.toast-btn.cancel:hover{background:#0000000d}.dark-theme .toast-btn.cancel:hover{background:#ffffff0d}.toast-btn.confirm{color:#fff;border:none;box-shadow:0 4px 6px -1px #0000001a}.toast-btn.confirm:hover{filter:brightness(1.1);transform:translateY(-1px);box-shadow:0 10px 15px -3px #0000001a}.toast-btn.confirm:active{transform:translateY(0)}.toast-item.warning .toast-btn.confirm{background:linear-gradient(135deg,#f59e0b,#d97706)}.toast-item.success .toast-btn.confirm{background:linear-gradient(135deg,#10b981,#059669)}.toast-item.info .toast-btn.confirm{background:linear-gradient(135deg,#3b82f6,#2563eb)}.toast-item.error .toast-btn.confirm{background:linear-gradient(135deg,#ef4444,#dc2626)}.toast-close-btn{cursor:pointer;opacity:.5;color:inherit;font-size:var(--font-size-500);background:0 0;border:none;justify-content:center;align-items:center;padding:0 0 0 8px;display:flex}.chat-window:not(.fullpage) .toast-container{gap:8px;width:auto;bottom:12px;left:12px;right:12px}.chat-window:not(.fullpage) .toast-item{border-radius:14px;width:100%;min-width:0;max-width:100%;padding:10px 12px;box-shadow:0 4px 12px #0000001a}.chat-window:not(.fullpage) .toast-message{font-size:var(--font-size-400);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.chat-window:not(.fullpage) .confirm-toast{border-radius:20px;width:85%;min-width:260px;max-width:320px;padding:20px!important}.chat-window:not(.fullpage) .confirm-toast .toast-message{white-space:normal;font-size:var(--font-size-400);margin-bottom:20px}.chat-window:not(.fullpage) .confirm-toast .toast-btn{font-size:var(--font-size-400);border-radius:12px;padding:10px}\n .side-bar-info-chat{background:var(--container-bg);border-left:1px solid var(--chat-border);flex-direction:column;flex-shrink:0;width:274px;display:flex}.info-header{justify-content:flex-end;padding:16px;display:flex}.close-info-btn{color:#64748b;cursor:pointer;background:0 0;border:none;border-radius:4px;padding:4px}.close-info-btn:hover{background:#f1f5f9}.info-content-scroll{flex-direction:column;flex:1;padding:0 20px 20px;display:flex;overflow-y:auto}.info-content-scroll::-webkit-scrollbar{width:4px}.info-content-scroll::-webkit-scrollbar-thumb{background:#e2e8f0;border-radius:10px}.info-basic-section{text-align:center;flex-direction:column;align-items:center;display:flex}.info-avatar-large{width:80px;height:80px;font-size:30px}.info-main-details{flex-direction:column;display:flex}.info-chat-name{color:var(--chat-text);text-transform:capitalize;justify-content:center;align-items:center;gap:8px;margin-top:12px;display:flex}.info-status-icons{color:#94a3b8;cursor:pointer;gap:4px;display:flex}.info-status-icons:hover{color:var(--primary)}.info-member{font-size:var(--font-size-300);color:var(--chat-subtext);margin-bottom:8px}.info-member-count{color:#64748b;margin-top:0;margin-bottom:8px}.info-quick-actions{justify-content:space-around;display:flex}.action-item{cursor:pointer;flex-direction:column;justify-content:center;align-items:center;display:flex}.action-icon-info{color:#475569;background:#f8fafc;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:4px;width:80px;height:56px;padding:8px 0;transition:all .2s;display:flex}.dark-theme .action-icon-info{color:#fff;background:#4f4f4f}.action-item:hover .action-icon-info{color:var(--primary);background:#f1f5f9}.dark-theme .action-item:hover .action-icon-info{color:var(--primary);background:#ffffff14}.action-item span{font-size:var(--font-size-400);color:var(--chat-text);font-weight:500}.menu-item{cursor:pointer;color:#1e293b;font-weight:500;font-size:var(--font-size-500);border-radius:8px;justify-content:space-between;align-items:center;padding:10px 12px;display:flex}.menu-item:hover{background:#f8fafc}.menu-left{align-items:center;gap:12px;display:flex}.info-members-section{padding:16px 0}.section-title-row{color:#64748b;justify-content:space-between;align-items:center;margin-bottom:12px;padding:0 4px;display:flex}.title-actions{color:#94a3b8;gap:8px;display:flex}.title-actions svg{cursor:pointer}.arrow-icon{transition:transform .2s}.arrow-icon.collapsed{transform:rotate(-180deg)}.member-item-left.clickable{cursor:pointer}.members-compact-list{flex-direction:column;display:flex}.members-facepile{align-items:center;padding:8px 4px;display:flex}.facepile-item{z-index:1;border:2px solid #fff;border-radius:50%;width:32px;height:32px;margin-left:-8px;transition:transform .2s;position:relative}.facepile-item:first-child{margin-left:0}.facepile-item:hover{z-index:10;transform:translateY(-4px)}.facepile-item .member-avatar-small{width:100%;height:100%}.facepile-item .online-status{border-width:1.5px;width:8px;height:8px;bottom:0;right:0}.facepile-more{color:#64748b;width:32px;height:32px;font-size:var(--font-size-300);z-index:0;cursor:pointer;background:#f1f5f9;border:2px solid #fff;border-radius:50%;justify-content:center;align-items:center;margin-left:-8px;font-weight:700;display:flex}.facepile-more:hover{background:#e2e8f0}.member-compact-item{border-radius:8px;justify-content:space-between;align-items:center;padding:8px;transition:background .2s;display:flex;position:relative}.member-compact-item:hover{background:#f8fafc}.dark-theme .member-compact-item:hover{background:color-mix(in srgb, var(--primary) 10%, transparent)}.member-item-left{align-items:center;gap:8px;display:flex}.member-avatar-small{border-radius:50%;width:32px;height:32px;position:relative}.member-avatar-small img,.member-img{object-fit:cover;border-radius:50%;width:100%;height:100%;display:block}.member-initials{background:var(--primary);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:100%;height:100%;font-weight:600;display:flex}.member-info{flex-direction:column;gap:2px;display:flex}.member-options-container{align-items:center;display:flex;position:relative}.member-options-btn{color:#94a3b8;cursor:pointer;opacity:0;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;padding:6px;transition:all .2s;display:flex}.member-compact-item:hover .member-options-btn{opacity:1}.member-options-btn:hover{color:#475569;background:#e2e8f0}.member-dropdown-menu{z-index:100;background:#fff;border:1px solid #f1f5f9;border-radius:12px;width:190px;margin-top:4px;padding:6px;animation:.2s fadeIn;position:absolute;top:100%;right:0;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d}@keyframes fadeIn{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}.dropdown-item{color:#1e293b;cursor:pointer;background:0 0;border:none;border-radius:8px;align-items:center;gap:10px;width:100%;transition:all .2s;display:flex}.dropdown-item:hover{background:#f1f5f9}.dropdown-item.delete{color:#ef4444}.dropdown-item.delete:hover{background:#fef2f2}.dropdown-item svg{flex-shrink:0}.member-name-row{align-items:center;gap:4px;width:fit-content;display:flex}.member-name-row>.member-name{white-space:nowrap;text-overflow:ellipsis;text-transform:capitalize;max-width:144px;overflow:hidden}.dark-theme .owner-icon{color:var(--icon-owner)}.member-role{font-size:var(--font-size-300);color:#64748b}.online-status{background:#22c55e;border:2px solid #fff;border-radius:50%;width:10px;height:10px;position:absolute;bottom:0;right:0}.info-summary-section{padding:16px 0}.info-summary-section .section-title{color:#64748b;font-weight:600;font-size:var(--font-size-500);margin-bottom:12px}.summary-tabs{background:#f1f5f9;border-radius:8px;margin-bottom:16px;padding:4px;display:flex}.tab-item{text-align:center;font-size:var(--font-size-400);color:#64748b;cursor:pointer;border-radius:6px;flex:1;padding:6px}.tab-item.active{color:#1e293b;background:#fff;font-weight:600;box-shadow:0 1px 3px #0000001a}.files-list .file-item{border-radius:8px;align-items:center;gap:12px;padding:8px;display:flex}.files-list .file-item:hover{background:#f8fafc}.files-list .file-icon{background:#f1f5f9;border-radius:8px;justify-content:center;align-items:center;width:40px;height:40px;display:flex}.files-list .file-details{flex-direction:column;flex:1;min-width:0;display:flex}.files-list .file-name{font-size:var(--font-size-500);color:#1e293b;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.files-list .file-size{font-size:var(--font-size-300);color:#94a3b8}.files-list .file-download-btn{color:#94a3b8;cursor:pointer;background:0 0;border:none;padding:4px}.files-list .file-download-btn:hover{color:var(--primary)}.group-management-view,.main-info-view{animation:.25s ease-out fadeInSlide}@keyframes fadeInSlide{0%{opacity:0;transform:translate(15px)}to{opacity:1;transform:translate(0)}}.header-left{flex:1;align-items:center;gap:12px;display:flex}.back-info-btn{color:#64748b;cursor:pointer;background:0 0;border:none;border-radius:4px;justify-content:center;align-items:center;padding:4px;display:flex}.back-info-btn:hover{background:#f1f5f9}.management-section{padding:16px 0}.management-section.border-top{border-top:1px solid #f1f5f9}.section-subtitle{font-size:var(--font-size-500);color:#64748b;margin-bottom:16px;padding:0 4px}.settings-list{flex-direction:column;display:flex}.setting-item{cursor:pointer;justify-content:space-between;align-items:center;padding:12px 4px;transition:background .2s;display:flex}.setting-item span{font-size:var(--font-size-500);color:#1e293b;flex:1;padding-right:12px;line-height:1.4}.setting-item input[type=checkbox]{width:18px;height:18px;accent-color:var(--primary);cursor:pointer}.setting-item-switch{justify-content:space-between;align-items:center;padding:12px 4px;display:flex}.setting-info{flex:1;align-items:center;gap:8px;display:flex}.setting-info span{max-width:200px;font-size:var(--font-size-500);color:#1e293b;line-height:1.4}.help-icon{color:#94a3b8;cursor:pointer}.switch{flex-shrink:0;width:36px;height:20px;display:inline-block;position:relative}.switch input{opacity:0;width:0;height:0}.slider{cursor:pointer;background-color:#e2e8f0;transition:all .4s;position:absolute;inset:0}.slider:before{content:\"\";background-color:#fff;width:14px;height:14px;transition:all .4s;position:absolute;bottom:3px;left:3px}input:checked+.slider{background-color:var(--primary)}input:checked+.slider:before{transform:translate(16px)}.slider.round{border-radius:20px}.slider.round:before{border-radius:50%}.management-menu{flex-direction:column;display:flex}.management-menu .menu-item{padding:12px 4px}.management-menu .menu-left svg{color:#64748b}.info-panel-clear-history{color:#d4183d;cursor:pointer;background:0 0;border:none;place-self:center;gap:4px;padding:7px 12px;display:flex}.info-panel-clear-history>span{margin-top:1px}\n .app-sidebar{background:var(--app-sidebar-bg);flex-direction:column;flex-shrink:0;align-items:center;gap:32px;width:64px;padding:12px 12px 24px;display:flex}.app-nav{flex-direction:column;flex:1;gap:16px;display:flex}.nav-item{color:#64748b;cursor:pointer;border-radius:12px;justify-content:center;align-items:center;width:40px;height:40px;transition:all .2s;display:flex}.nav-item:hover{background:var(--active-item-bg);color:var(--primary)}.nav-item.active{background:var(--primary);color:var(--primary-contrast)}.nav-separator{opacity:.8;background:#98a8b3;width:40px;height:1px;margin:4px 0}.app-sidebar-footer{flex-direction:column;align-items:center;gap:20px;padding-bottom:8px;display:flex}.app-avatar{background:#f1f5f9;border:2px solid #fff;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;display:flex;overflow:hidden;box-shadow:0 2px 8px #0000000d}.app-avatar img{object-fit:cover;border-radius:50%;width:100%;height:100%}.app-avatar-fallback{color:#64748b;justify-content:center;align-items:center;width:100%;height:100%;font-weight:700;display:flex}\n .modal-overlay{z-index:9999;-webkit-backdrop-filter:blur();backdrop-filter:blur();background:#0006;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.profile-modal-content{background:var(--container-bg);border-radius:20px;flex-direction:column;gap:12px;width:400px;padding:20px;animation:.3s cubic-bezier(.34,1.56,.64,1) modalScaleUp;display:flex;box-shadow:0 20px 40px #0003}.profile-modal-content .close-modal-btn{align-self:flex-end}@keyframes modalScaleUp{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.profile-header{text-align:center}.profile-avatar-wrapper{width:90px;height:90px;margin:-12px auto 12px;position:relative}.profile-avatar-wrapper img{object-fit:cover;border:4px solid #f8fafc;border-radius:50%;width:100%;height:100%}.profile-avatar-placeholder{color:#fff;background:#3b82f6;border:4px solid #f8fafc;border-radius:50%;justify-content:center;align-items:center;width:100%;height:100%;font-size:30px;font-weight:600;display:flex}.profile-online-status{background:#22c55e;border:3px solid #fff;border-radius:50%;width:16px;height:16px;position:absolute;bottom:5px;right:5px}.profile-name{font-size:var(--font-size-600);color:var(--chat-text);font-weight:600}.status-text{font-size:var(--font-size-300);color:#64748b}.profile-actions{gap:12px;display:flex}.profile-action-btn{cursor:pointer;color:#475569;background:#f8fafc;border:none;border-radius:12px;flex-direction:column;flex:1;align-items:center;gap:6px;padding:12px 8px;transition:all .2s;display:flex}.dark-theme .profile-action-btn{background:var(--message-bubble-other);color:var(--chat-text)}.dark-theme .profile-action-btn svg{color:var(--chat-text)}.dark-theme .profile-action-btn:hover{color:var(--primary);background:#ffffff14;transform:translateY(-2px)}.profile-action-btn:hover{color:var(--primary);background:#f1f5f9;transform:translateY(-2px)}.profile-action-btn svg{color:#64748b;transition:color .2s}.profile-action-btn:hover svg{color:var(--primary)}.profile-action-btn span{font-size:var(--font-size-400);font-weight:600}.profile-details{padding-top:10px}.detail-item{font-size:var(--font-size-400);border-bottom:1px solid var(--chat-border);justify-content:flex-start;align-items:center;padding:12px 0;display:flex}.detail-item:last-child{border-bottom:none}.detail-item .label{color:var(--label-profile);flex-shrink:0;width:110px}.detail-item .value{font-size:var(--font-size-400);color:var(--chat-text)}.value.email,.value.phone{color:var(--primary);cursor:pointer}.value.email:hover,.value.phone:hover{text-decoration:underline}\n .modal-content.add-chat-modal{background:var(--container-bg);border:1px solid #0000000d;border-radius:10px;flex-direction:column;width:90%;max-width:450px;height:auto;min-height:430px;max-height:90vh;padding:0;display:flex;position:relative;overflow:hidden;box-shadow:0 10px 40px #0000001a}.add-chat-modal .modal-header{justify-content:space-between;align-items:center;padding:16px 20px 0;display:flex}.add-chat-modal .modal-title{color:var(--chat-text);text-align:left;margin:0}.add-chat-modal .close-modal-btn{color:#6b7280;cursor:pointer;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;padding:4px;transition:background .2s;display:flex}.add-chat-modal .close-modal-btn:hover{color:#111827;background:#f3f4f6}.add-chat-modal .modal-body{flex-direction:column;flex:1;gap:8px;padding:20px 20px 0;display:flex;overflow:hidden}.add-chat-modal .group-info-section{align-items:center;gap:8px;display:flex}.add-chat-modal .group-avatar-upload{flex-shrink:0}.add-chat-modal .avatar-placeholder{color:#9ca3af;cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;padding:0;display:flex;position:relative}.add-chat-modal .upload-icon{color:#6b7280;background:#f3f4f6;border:1px solid #e5e7eb;border-radius:50%;justify-content:center;align-items:center;width:18px;height:18px;display:flex;position:absolute;bottom:-2px;right:-2px}.add-chat-modal .preview-avatar{object-fit:cover;border-radius:100%;width:100%;height:100%}.add-chat-modal .group-name-input{border:none;border-bottom:1px solid var(--chat-border);font-size:var(--font-size-500);outline:none;flex:1;padding:8px 0;transition:border-color .2s}.dark-theme .add-chat-modal .group-name-input{color:var(--chat-text);background:0 0}.add-chat-modal .group-name-input:focus{border-bottom-color:var(--primary)}.add-chat-modal .search-section .chat-search-bar{padding:0}.add-chat-modal .search-section .search-input{background:var(--input-background);color:var(--chat-text);font-size:var(--font-size-400);border-radius:20px;padding:10px 16px 10px 40px}.add-chat-modal .search-section .search-icon{left:16px}.add-chat-modal .selected-members-tags{flex-wrap:wrap;gap:8px;display:flex}.add-chat-modal .member-tag{background:color-mix(in srgb, var(--primary) 8%, #fff);color:var(--primary);font-size:var(--font-size-500);border-radius:100px;align-items:center;gap:6px;padding:4px 10px;display:flex}.add-chat-modal .remove-tag-btn{color:var(--primary);cursor:pointer;opacity:.7;background:0 0;border:none;justify-content:center;align-items:center;padding:2px;transition:opacity .2s;display:flex}.add-chat-modal .remove-tag-btn:hover{opacity:1}.modal-content.add-chat-modal.has-tags{height:550px}.add-chat-modal .members-list-container{border-top:1px solid var(--chat-border);flex:1;margin:0 -20px;padding:0 7px;overflow-y:hidden}.add-chat-modal .members-list{margin:0;padding:12px 0}.add-chat-modal .member-item{cursor:pointer;background:0 0;border-radius:10px;align-items:center;gap:12px;padding:10px 12px;transition:background .2s;display:flex}.add-chat-modal .member-item.selected{background:color-mix(in srgb, var(--primary) 8%, #fff)}.add-chat-modal .member-item:hover{background:color-mix(in srgb, var(--primary) 5%, #fff)}.add-chat-modal .member-item.selected:hover{background:color-mix(in srgb, var(--primary) 10%, #fff)}.dark-theme .add-chat-modal .member-item:hover{background:color-mix(in srgb, var(--primary) 10%, transparent)}.dark-theme .add-chat-modal .member-item.selected{background:color-mix(in srgb, var(--primary) 15%, transparent)}.add-chat-modal .member-checkbox{flex-shrink:0}.add-chat-modal .checkbox-custom{border:1.5px solid #d1d5db;border-radius:4px;justify-content:center;align-items:center;width:20px;height:20px;transition:all .2s;display:flex}.add-chat-modal .checkbox-custom.checked{background:var(--primary);border-color:var(--primary)}.add-chat-modal .member-avatar-wrapper{width:32px;height:32px;position:relative}.add-chat-modal .member-avatar{color:#4b5563;background:#f3f4f6;border:none;border-radius:50%;justify-content:center;align-items:center;width:100%;height:100%;font-weight:600;display:flex;overflow:hidden}.add-chat-modal .member-avatar img{object-fit:cover;width:100%;height:100%}.add-chat-modal .avatar-letter{color:#fff;background:linear-gradient(135deg,#6366f1,#a855f7);justify-content:center;align-items:center;width:100%;height:100%;display:flex}.add-chat-modal .status-dot{width:12px;height:12px;position:absolute;bottom:-1px;right:-1px}.add-chat-modal .member-name{font-size:var(--font-size-500);color:var(--chat-text)}.add-chat-modal .modal-footer{border-top:1px solid var(--chat-border);justify-content:flex-end;gap:12px;padding:11px 20px;display:flex}.add-chat-modal .footer-btn{cursor:pointer;border:none;border-radius:10px;padding:10px 24px;transition:all .2s}.add-chat-modal .footer-btn.cancel{color:#4b5563;background:#f3f4f6}.add-chat-modal .footer-btn.cancel:hover{background:#e5e7eb}.add-chat-modal .footer-btn.confirm{background:var(--primary);color:#fff}.add-chat-modal .footer-btn.confirm:hover:not(.disabled){background:color-mix(in srgb, var(--primary) 85%, #000)}.add-chat-modal .footer-btn.disabled{opacity:.6;cursor:not-allowed}.display-none{display:none}.chat-window:not(.fullpage) .modal-content.add-chat-modal,.chat-window:not(.fullpage) .modal-content.update-group-modal{max-width:380px;min-height:auto}.modal-content.update-group-modal{background:var(--container-bg);border:1px solid #0000000d;border-radius:10px;flex-direction:column;width:90%;max-width:450px;height:auto;min-height:430px;max-height:90vh;padding:0;display:flex;position:relative;overflow:hidden;box-shadow:0 10px 40px #0000001a}.update-group-modal .modal-header{justify-content:space-between;align-items:center;padding:16px 20px 0;display:flex}.update-group-modal .modal-title{color:var(--chat-text);text-align:left;margin:0}.update-group-modal .close-modal-btn{color:#6b7280;cursor:pointer;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;padding:4px;transition:background .2s;display:flex}.update-group-modal .close-modal-btn:hover{color:#111827;background:#f3f4f6}.update-group-modal .modal-body{flex-direction:column;flex:1;gap:8px;padding:20px 20px 0;display:flex;overflow:hidden}.update-group-modal .group-info-section{align-items:center;gap:8px;display:flex}.update-group-modal .group-avatar-upload{cursor:pointer;flex-shrink:0}.update-group-modal .group-avatar-upload input{display:none}.update-group-modal .avatar-placeholder{color:#9ca3af;cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;padding:0;display:flex;position:relative}.update-group-modal .avatar-placeholder img{object-fit:cover;border-radius:50%;width:100%;height:100%}.update-group-modal .group-name-input{border:none;border-bottom:1px solid var(--chat-border);font-size:var(--font-size-500);outline:none;flex:1;padding:8px 0;transition:border-color .2s}.dark-theme .update-group-modal .group-name-input{color:var(--chat-text);background:0 0}.update-group-modal .group-name-input:focus{border-bottom-color:var(--primary)}.update-group-modal .members-section{margin-top:8px}.update-group-modal .section-title{padding-left:0;display:block}.update-group-modal .members-list-container{border-top:none;flex:1;height:450px;margin:0 -20px;padding:0 7px;overflow-y:hidden}.update-group-modal .members-list{margin:0;padding:12px 0}.update-group-modal .member-item{cursor:default;background:0 0;border-radius:10px;align-items:center;gap:12px;padding:10px 12px;transition:background .2s;display:flex}.update-group-modal .member-item:hover{background:#f9fafb}.dark-theme .update-group-modal .member-item:hover{background:color-mix(in srgb, var(--primary) 10%, transparent)}.update-group-modal .member-avatar-wrapper{width:32px;height:32px;position:relative}.update-group-modal .status-dot{width:12px;height:12px;position:absolute;bottom:-1px;right:-1px}.update-group-modal .member-info-wrapper{flex-direction:column;flex:1;gap:2px;display:flex}.update-group-modal .member-name-row{align-items:center;gap:4px;width:fit-content;display:flex}.update-group-modal .member-name{font-size:var(--font-size-500);color:var(--chat-text)}.update-group-modal .owner-icon{color:#64748b}.update-group-modal .member-role{font-size:var(--font-size-300);color:#64748b}.update-group-modal .remove-member-btn{color:#ef4444;cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;padding:4px;display:flex}.update-group-modal .modal-footer{border-top:1px solid var(--chat-border);justify-content:flex-end;gap:12px;padding:11px 20px;display:flex}.update-group-modal .footer-btn{cursor:pointer;border:none;border-radius:10px;padding:10px 24px;transition:all .2s}.update-group-modal .footer-btn.cancel{color:#4b5563;background:#f3f4f6}.update-group-modal .footer-btn.cancel:hover{background:#e5e7eb}.update-group-modal .footer-btn.confirm{background:var(--primary);color:#fff}.update-group-modal .footer-btn.confirm:hover:not(.disabled){background:color-mix(in srgb, var(--primary) 85%, #000)}.update-group-modal .footer-btn.disabled{opacity:.6;cursor:not-allowed}.chat-window:not(.fullpage) .modal-overlay{border-top:1px solid var(--chat-border);top:52px}.chat-window:not(.fullpage) .modal-content.is-popup-fullscreen{width:100%;max-width:100%;height:100%;max-height:100%;box-shadow:none;border:none;border-radius:0;padding:0;animation:none}.is-popup-fullscreen .modal-header{border-bottom:1px solid var(--chat-border);justify-content:flex-start;align-items:center;min-height:60px;padding:12px 16px}.is-popup-fullscreen .modal-header .group-info-section{flex:1;align-items:center;gap:12px;margin-left:4px;display:flex}.is-popup-fullscreen .modal-header .group-name-input{border:none;border-bottom:1px solid var(--chat-border);color:var(--chat-text);background:0 0;outline:none;width:100%;padding:6px 0}.is-popup-fullscreen .modal-title{margin:0}.is-popup-fullscreen .back-modal-btn{color:#64748b;cursor:pointer;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;padding:4px;display:flex}.is-popup-fullscreen .back-modal-btn:hover{color:#0f172a;background:#f1f5f9}.is-popup-fullscreen .modal-body{padding:16px 16px 0}.is-popup-fullscreen .modal-footer{padding:12px 16px}\n .contact-list-header>div{align-items:center;gap:8px;display:flex}.contact-list-toolbar{gap:12px}.toolbar-search{flex:1}.filter-select{position:relative}.avatar-placeholder{color:#fff;width:40px;height:40px;font-size:var(--font-size-600);background:#3b82f6;border-radius:50%;justify-content:center;align-items:center;font-weight:600;display:flex}.online-status.is-online{background:#22c55e}.online-status.is-offline{background:#94a3b8}.contact-action-btn{background:0 0;border:none}\n .chat-avatar-emoji{background-color:#fff;border-radius:100%;justify-content:center;align-items:center;width:100%;height:100%;display:flex}.chat-avatar-img{object-fit:cover;border-radius:100%;width:100%;height:100%}\n .theme-setting-wrapper{flex-direction:column;justify-content:center;align-items:center;gap:12px;width:626px;margin:0 auto;display:flex}.them-setting-header{justify-content:space-between;align-items:center;width:100%;display:flex}.theme-setting-title{font-weight:600}.theme-setting-save-btn{background-color:var(--primary);color:#fff;border:none;border-radius:16px;padding:6px 12px}.theme-setting-cards-list{flex-direction:column;gap:8px;width:100%;display:flex}.theme-setting-card{border:1px solid var(--chat-border);border-radius:10px;width:100%;padding:16px 18px}.card-header-row{align-items:center;gap:8px;display:flex}.theme-toggle-row{justify-content:space-between;align-items:center;gap:12px;margin-top:12px;display:flex}.theme-mode-btn{cursor:pointer;border:2px solid #e5e7eb;border-radius:8px;width:50%;padding:12px 0}.theme-mode-btn-content{justify-content:center;align-items:center;gap:6px;font-weight:500;display:flex}.theme-mode-btn.active{background-color:color-mix(in srgb, var(--primary,#155dfc) 8%, #fff);border:2px solid var(--primary);color:var(--primary)}.color-presets-container{align-items:center;width:100%;margin-top:12px;display:flex;position:relative}.color-presets-grid{flex-wrap:wrap;gap:10px 8px;max-width:calc(100% - 60px);display:flex}.color-capsule{cursor:pointer;white-space:nowrap;border:1px solid #0000;border-radius:33554400px;align-items:center;gap:6px;padding:6px 12px;transition:all .2s;display:flex}.color-capsule.active{border:1.5px solid #0f172a}.color-dot{border-radius:50%;width:12px;height:12px;display:block}.color-name{font-weight:500}.color-capsule.blue{color:#2563eb;background-color:#dbeafe}.blue-dot{background-color:#2563eb}.color-capsule.purple{color:#7c3aed;background-color:#ede9fe}.purple-dot{background-color:#7c3aed}.color-capsule.pink{color:#db2777;background-color:#fce7f3}.pink-dot{background-color:#db2777}.color-capsule.red{color:#dc2626;background-color:#fee2e2}.red-dot{background-color:#dc2626}.color-capsule.orange{color:#ea580c;background-color:#ffedd5}.orange-dot{background-color:#ea580c}.color-capsule.green{color:#059669;background-color:#d1fae5}.green-dot{background-color:#059669}.color-capsule.gray{color:#4b5563;background-color:#f3f4f6}.gray-dot{background-color:#4b5563}.toggle-setting-row{justify-content:space-between;align-items:center;gap:20px;margin-top:12px;display:flex}.toggle-setting-info{flex-direction:column;gap:4px;display:flex}.toggle-setting-label{color:#111827;font-weight:400}.toggle-setting-desc{color:#6a7282;margin:0;line-height:24px}.ui-toggle-switch{flex-shrink:0;width:44px;height:24px;display:inline-block;position:relative}.ui-toggle-switch input{opacity:0;width:0;height:0}.toggle-slider{cursor:pointer;background-color:#e5e7eb;border-radius:24px;transition:all .3s cubic-bezier(.4,0,.2,1);position:absolute;inset:0}.toggle-slider:before{content:\"\";background-color:#fff;border-radius:50%;width:18px;height:18px;transition:all .3s cubic-bezier(.4,0,.2,1);position:absolute;bottom:3px;left:3px;box-shadow:0 1px 3px #00000026}input:checked+.toggle-slider{background-color:#2563eb}input:checked+.toggle-slider:before{transform:translate(20px)}\n .message-item .detect-url-container{flex-direction:column;gap:8px;display:flex}.message-item .detect-url-item{color:inherit;background-color:#f3f4f6;border-radius:12px;gap:4px;padding:8px 14px;text-decoration:none;display:block}.detect-url-item .detect-url-header{color:#0a0a0a;font-size:var(--font-size-300);align-items:center;gap:6px;display:flex}.detect-url-item .detect-url-title{font-size:var(--font-size-500);color:#0a0a0a;word-break:break-word;text-transform:capitalize;line-height:20px}.detect-url-item .detect-url-path{font-size:var(--font-size-300);color:#717182;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}\n", A = (e, t = 0, n = "Hội thoại không tên") => e ? e.name ? e.name : e.type === "group" ? n : e.members?.find((e) => e.id !== t)?.name ?? n : n, j = new Set([
|
|
11
|
+
var k = "\n #chat-internal-root{z-index:99999;pointer-events:none;--font-size-600:16px;--font-size-500:14px;--font-size-400:13px;--font-size-300:12px;font-size:var(--font-size-500);font-family:Inter,-apple-system,sans-serif;font-weight:400;line-height:20px;display:block;position:fixed;bottom:0;right:0}#chat-internal-root *{box-sizing:border-box;pointer-events:auto}#chat-internal-root ::-webkit-scrollbar{width:5px;height:5px}#chat-internal-root ::-webkit-scrollbar-thumb{background-color:#0000001a;border-radius:4px}#chat-internal-root ::-webkit-scrollbar-thumb:hover{background-color:#0003}.chatbot-container{width:100%;height:100%;position:relative}\n .floating-button{background:var(--primary);color:#fff;cursor:pointer;z-index:99999;border:none;border-radius:20px 20px 20px 6px;outline:none;justify-content:center;align-items:center;width:46px;height:46px;display:flex;position:fixed;bottom:24px;right:24px}.floating-button:active{transform:scale(.95)}.floating-button .icon{z-index:10;width:24px;height:24px;position:relative}\n .chat-window{--primary:#155dfc;--chat-bg:#fff;--chat-text:#101828;--chat-subtext:#6a7282;--chat-header-bg:#f9f9f9;--chat-border:#e5e7eb;--sidebar-bg:#fff;--chat-main-name:#101828;--chat-list-bg:#f9fafb80;--container-bg:#fff;--message-bubble-other:#f3f4f6;--input-background:#f3f4f6;--color-input:#000;--label-profile:#6a7282;--icon-owner:#000;--app-sidebar-bg:#f9f9f9}.chat-window.dark-theme{--chat-bg:color-mix(in srgb, var(--primary), #0f172a99 85%);--chat-text:#f8fafc;--chat-subtext:#94a3b8;--chat-header-bg:#0a0a0a;--chat-border:#2d2d2d;--sidebar-bg:color-mix(in srgb, var(--primary), #0f172a66 95%);--container-bg:#1a1a1a;--chat-main-name:#fff;--chat-list-bg:#1f1f1f;--message-bubble-other:#4f4f4f;--input-background:#ffffff1a;--color-input:#fff;--label-profile:#9ca3af;--icon-owner:#f2b90d;--active-item-bg:#334155;--app-sidebar-bg:#0a0a0a;overflow:hidden}.chat-window{background:var(--chat-bg);-webkit-backdrop-filter:blur(20px)saturate(180%);backdrop-filter:blur(20px)saturate(180%);border:1px solid var(--chat-border);z-index:99998;width:384px;height:640px;color:var(--chat-text);transform-origin:100% 100%;border-radius:14px;flex-direction:column;max-width:100%;max-height:100%;margin:0;transition:none;animation:.6s cubic-bezier(.34,1.56,.64,1) slideUp;display:flex;position:fixed;bottom:20px;right:20px;overflow:hidden;transform:translate(0);box-shadow:0 8px 32px #0000005e,inset 0 0 0 1px #ffffff0d}.chat-window.fullpage{-webkit-backdrop-filter:none;z-index:9999;border-radius:16px;flex-direction:column;display:flex;transform:translate(0)}.chat-main-layout{--chat-bg:#fff;--chat-header-bg:#fff;--sidebar-bg:#fff;--active-item-bg:#f1f5f9;-webkit-backdrop-filter:none;z-index:9999;background-color:var(--app-sidebar-bg);border-radius:0;flex-direction:row;flex:1;width:100%;max-width:none;height:100vh;display:flex;inset:0;overflow:hidden;transform:none}.chat-header{background:var(--chat-header-bg);color:var(--chat-text);border-bottom:1px solid var(--chat-border);flex-shrink:0;justify-content:space-between;align-items:center;padding:12px 16px 8px;display:flex}.chat-window.fullpage .chat-header{border-bottom:none}.header-info{align-items:center;gap:8px;display:flex}.header-logo{flex-shrink:0;justify-content:center;align-items:center;display:flex}.header-logo img,.header-logo .satek-icon{object-fit:contain;width:22px;height:22px}.back-btn{color:#64748b;cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;margin-right:8px;padding:0;display:flex}.header-info-text{align-items:center;gap:6px;min-width:0;display:flex}.header-dot{color:var(--chat-subtext);opacity:.6}.header-title{color:var(--chat-text);white-space:nowrap;text-overflow:ellipsis;font-size:var(--font-size-600);overflow:hidden}.header-subtitle{color:var(--chat-subtext);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.chat-body-container{flex-direction:row;flex:1;display:flex;position:relative;overflow:hidden}.chat-sidebar{background:var(--chat-list-bg);border-right:1px solid #0000000d;flex-direction:column;width:100%;transition:all .3s;display:flex}.chat-sidebar.is-full{flex-shrink:0;width:320px}.chat-search-bar{background:0 0;align-items:center;gap:4px;padding:12px 12px 4px;display:flex}.search-input-wrapper{flex:1;align-items:center;display:flex;position:relative}.search-icon{width:16px;height:16px;color:var(--chat-subtext);pointer-events:none;position:absolute;left:12px}.search-input{background:var(--input-background);width:100%;font-size:var(--font-size-400);color:var(--color-input);border:1px solid #0000;border-radius:8px;outline:none;padding:8px 36px;transition:all .3s}.search-input:focus{background:var(--container-bg);border-color:#a855f74d;box-shadow:0 4px 12px #00000008}.clear-search{color:var(--chat-subtext);font-size:var(--font-size-600);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;padding:4px;display:flex;position:absolute;right:10px}.clear-search:hover{color:#64748b}.sidebar-scroll{flex:1;padding:0 8px 20px;overflow-y:auto}.chat-filter-tabs{gap:24px;margin:0 12px;display:flex;position:relative}.chat-filter-tabs:before{content:\"\";background-color:var(--chat-border);height:.5px;position:absolute;bottom:0;left:0;right:0}.chat-filter-tabs button{font-size:var(--font-size-400);cursor:pointer;color:var(--chat-subtext);background:0 0;border:none;justify-content:center;align-items:center;gap:6px;min-width:26px;padding:8px 0;transition:all .2s;display:flex;position:relative}.chat-filter-tabs button.active{color:var(--primary)}.chat-filter-tabs button.active:after{content:\"\";background-color:var(--primary);z-index:1;border-radius:2px;height:2px;position:absolute;bottom:-1px;left:0;right:0}.filter-unread-badge-container{align-items:center;gap:6px;display:flex}.filter-unread-badge{color:#fff;background-color:#f04438;border-radius:9px;justify-content:center;align-items:center;min-width:16px;height:16px;padding:0 4px;font-size:10px;font-weight:600;display:flex}.sidebar-scroll::-webkit-scrollbar{width:5px;margin-left:10px}.sidebar-scroll::-webkit-scrollbar-thumb{background:#0000000d;border-radius:10px}.chat-main{background:#ffffff1a;flex-direction:column;flex:1;display:flex;position:relative;overflow:hidden}.drag-overlay-full{pointer-events:none;z-index:10;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#0009;border:3px dashed #a855f7cc;justify-content:center;align-items:center;animation:.2s fadeIn;display:flex;position:absolute;inset:0}.drag-overlay-full .drag-content{color:#fff;text-shadow:0 2px 4px #0000004d;flex-direction:row;align-items:center;gap:12px;display:flex}.drag-overlay-full .drag-icon{font-size:20px;animation:.6s ease-in-out infinite bounce}.chat-list{background:0 0;flex:1;overflow-y:auto}.chat-item{cursor:pointer;border-radius:8px;align-items:center;gap:12px;height:54px;padding:8px;display:flex;position:relative}.chat-item:hover{background:color-mix(in srgb, var(--primary) 5%, #fff)}.chat-item.active{background:color-mix(in srgb, var(--primary) 10%, #fff)}.dark-theme .chat-item:hover,.dark-theme .chat-item.active{background:color-mix(in srgb, var(--primary) 15%, transparent)}.chat-item-avatar{justify-content:center;align-items:center;width:32px;height:32px;display:flex;position:relative}.online-indicator{z-index:1;background-color:#22c55e;border:2px solid #fff;border-radius:50%;width:12px;height:12px;position:absolute;bottom:-3px;right:2px}.chat-item-info{flex:1;overflow:hidden}.chat-item-name{color:var(--chat-text);white-space:nowrap;text-overflow:ellipsis;text-transform:capitalize;overflow:hidden}.chat-item-last{flex:1;min-width:0}.last-message-text{color:var(--chat-subtext);white-space:nowrap;text-overflow:ellipsis;min-width:0;font-size:var(--font-size-300);flex:1;display:block;overflow:hidden}.info-bottom-right{flex-shrink:0;align-items:center;gap:4px;margin-top:4px;display:flex}.mute-icon-list{color:#94a3b8;flex-shrink:0}.chat-item.active .chat-item-last{color:var(--chat-text)}.unread-badge{color:#fff;z-index:2;background:linear-gradient(135deg,#f43f5e,#e11d48);border:2px solid #fff;border-radius:50%;justify-content:center;align-items:center;min-width:18px;height:18px;padding:10px 7px;font-size:10px;font-weight:700;display:flex;position:absolute;top:-4px;right:-4px;box-shadow:0 2px 4px #0000001a}.info-top-row{justify-content:space-between;align-items:baseline;display:flex}.info-bottom-row{justify-content:space-between;align-items:center;line-height:17px;display:flex}.chat-item-time{color:var(--chat-subtext);white-space:nowrap;font-size:var(--font-size-300);line-height:17px}.unread-badge-circle{background-color:var(--primary);color:#fff;border-radius:9px;justify-content:center;align-items:center;min-width:18px;height:18px;margin-left:8px;padding:0 5px;font-size:10px;font-weight:600;display:flex}.chat-list-section{margin-bottom:16px}.empty-chat-list{padding:12px 8px 4px}.section-header{color:#64748b;text-transform:none;align-items:center;gap:6px;padding:8px 8px 4px;display:flex}.section-icon{color:#94a3b8}.chat-options-wrapper{opacity:0;pointer-events:none;z-index:100;justify-content:center;align-items:center;transition:all .2s cubic-bezier(.4,0,.2,1);display:flex;position:absolute;top:50%;right:12px;transform:translateY(-50%)scale(.8)}.chat-item:hover .chat-options-wrapper,.chat-item.has-open-dropdown .chat-options-wrapper{opacity:1;pointer-events:auto;transform:translateY(-50%)scale(1)}.chat-options-btn{-webkit-backdrop-filter:blur(8px);color:#64748b;cursor:pointer;background:#ffffff26;border:1px solid #fff3;border-radius:10px;justify-content:center;align-items:center;width:32px;height:32px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex}.chat-options-btn:hover,.chat-options-btn.active{color:#1e293b;background:#ffffff4d;border-color:#fff6;transform:scale(1.05)}.chat-options-btn svg{width:18px;height:18px}.chat-options-dropdown{-webkit-backdrop-filter:blur(20px)saturate(160%);z-index:1000;background:#ffffffe6;border:1px solid #fff9;border-radius:14px;flex-direction:column;gap:4px;min-width:160px;padding:6px;animation:.2s cubic-bezier(.4,0,.2,1) dropdownFadeIn;display:flex;position:absolute;top:calc(100% + 8px);right:0;box-shadow:0 10px 25px -5px #0000001a,0 8px 10px -6px #0000001a}@keyframes dropdownFadeIn{0%{opacity:0;transform:translateY(-10px)scale(.95)}to{opacity:1;transform:translateY(0)scale(1)}}.dropdown-item{font-size:var(--font-size-400);color:#334155;cursor:pointer;border-radius:10px;align-items:center;gap:10px;padding:8px 12px;transition:all .2s;display:flex}.dropdown-item:hover{color:#0f172a;background:#0000000a}.dropdown-item.delete{color:#ef4444}.dropdown-item.delete:hover{color:#dc2626;background:#ef444414}.dropdown-icon{flex-shrink:0;width:16px;height:16px}.header-actions{gap:4px;display:flex}.action-btn{color:#667085;cursor:pointer;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;width:28px;height:28px;padding:6px;transition:all .2s;display:flex}.action-btn:hover{color:#101828;background:#f2f4f7}.action-btn.close-btn:hover{color:#ef4444;background:#fee2e2}.add-group-btn{color:#667085;cursor:pointer;background:#f9fafb;border:1px solid #f2f4f7;border-radius:8px;justify-content:center;align-items:center;width:28px;height:28px;transition:all .2s;display:flex}.add-group-btn:hover{color:#101828;background:#f2f4f7;border-color:#eaecf0}.modal-overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:100000;background:#0006;justify-content:center;align-items:center;animation:.3s modalFadeIn;display:flex;position:absolute;inset:0}.modal-content{background:color-mix(in srgb, var(--primary), #ffffffb3 92%);-webkit-backdrop-filter:blur(30px)saturate(150%);border:1px solid #fffc;border-radius:36px;width:90%;max-width:380px;height:85%;padding:32px;animation:.4s cubic-bezier(.175,.885,.32,1.275) modalPopUp;overflow-y:auto;box-shadow:0 30px 60px #00000014}.dark-theme .modal-content{background:color-mix(in srgb, var(--primary), #1e293bb3 90%);color:#f8fafc;border-color:#ffffff1a}.modal-content::-webkit-scrollbar-track{margin:10px 0}.modal-title{color:var(--chat-text);text-align:center;margin-bottom:24px}.members-section{margin-bottom:24px}.section-title{color:#64748b;padding-left:4px;display:block}.members-list{min-height:450px;margin:0 -4px;padding:4px;overflow-y:auto}.members-list::-webkit-scrollbar{width:5px}.members-list::-webkit-scrollbar-thumb{background:#4f46e533;border-radius:10px}.member-item{cursor:pointer;background:#fff6;border:1px solid #0000;border-radius:16px;align-items:center;gap:14px;padding:12px;transition:all .2s cubic-bezier(.4,0,.2,1);display:flex}.member-item:hover{background:#fffc}.remove-member-btn{color:#94a3b8;cursor:pointer;background:0 0;border:none;border-radius:8px;justify-content:center;align-items:center;margin-left:auto;padding:6px;transition:all .2s;display:flex}.remove-member-btn:hover{color:#ef4444;background:#ef44441a;transform:scale(1.1)}.remove-member-btn svg{width:18px;height:18px}.member-name{color:var(--chat-text);flex:1}.member-item.selected .member-check{background:linear-gradient(135deg,#6366f1,#4f46e5);border-color:#4f46e5;transform:scale(1.1)}.modal-actions{gap:12px;margin-top:8px;display:flex}.empty-chat-state{color:#64748b;text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;padding:40px;display:flex}.empty-icon{opacity:.5;margin-bottom:20px;font-size:48px}.empty-chat-state h3{color:var(--chat-text);margin-bottom:0;font-size:16px;font-weight:700}.empty-chat-state p{opacity:.8;font-size:14px}.modal-search-wrapper{margin-bottom:20px}.no-members-found{text-align:center;text-align:center;color:#9ca3af;background:#ffffff4d;border:1px dashed #0000000d;border-radius:16px;padding:20px}.member-item.loading{cursor:not-allowed;opacity:.6}.member-add-action{font-size:var(--font-size-400);color:var(--primary);background:color-mix(in srgb, var(--primary) 10%, transparent);border-radius:6px;margin-left:auto;padding:4px 12px;font-weight:500;transition:all .2s}.member-item:hover .member-add-action{background:var(--primary);color:#fff}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-12px)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes modalFadeIn{0%{opacity:0}to{opacity:1}}@keyframes modalPopUp{0%{opacity:0;transform:scale(.8)translateY(30px)}to{opacity:1;transform:scale(1)translateY(0)}}@keyframes slideUp{0%{opacity:0;transform:translateY(40px)scale(.9)}to{opacity:1;transform:translateY(0)scale(1)}}.theme-modal{max-width:300px!important;height:auto!important;padding:24px!important}.modal-header{justify-content:space-between;align-items:center;display:flex}.close-modal-btn{color:#94a3b8;cursor:pointer;background:0 0;border:none;padding:4px;font-size:24px;line-height:1}.contact-categories{flex-direction:column;gap:8px;padding:8px;display:flex}.category-item{cursor:pointer;color:var(--chat-text);border-radius:8px;align-items:center;gap:12px;width:100%;height:40px;padding:10px 12px;font-weight:500;transition:all .2s;display:flex}.category-item:hover{background:color-mix(in srgb, var(--primary) 5%, #fff);color:var(--primary)}.category-item.active{background:color-mix(in srgb, var(--primary) 10%, #fff);color:var(--primary)}.category-item .count{color:#99a1af;border-radius:10px;margin-left:auto;padding:2px 8px}.contact-list-view{background:var(--container-bg);flex-direction:column;flex:1;height:100%;display:flex}.contact-list-header{border-bottom:1px solid var(--chat-border);color:var(--chat-text);height:45px;padding:10px 16px}.contact-list-toolbar{justify-content:space-between;align-items:center;padding:12px 16px 20px;display:flex}.toolbar-left{align-items:center;gap:20px;display:flex}.toolbar-left span{color:#64748b;font-weight:500}.toolbar-search{background:var(--input-background);border-radius:6px;align-items:center;gap:8px;width:300px;height:36px;padding:12px;display:flex}.toolbar-search input{font-size:var(--font-size-400);width:100%;color:var(--color-input);background:0 0;border:none;outline:none}.toolbar-right{gap:12px;height:36px;display:flex}.filter-select{cursor:pointer;font-size:var(--font-size-400);color:#1e293b;background:#f3f4f6;border-radius:6px;align-items:center;gap:8px;padding:9px 12px;display:flex}.dropdown-select{z-index:10;background:#fff;border:1px solid #e2e8f0;border-radius:8px;min-width:150px;margin-top:8px;position:absolute;top:100%;right:0;box-shadow:0 4px 6px #0000001a}.dropdown-select .dropdown-item{cursor:pointer;border-bottom:1px solid #e2e8f0;border-radius:0;align-items:center;gap:8px;height:40px;padding:12px 16px;display:flex}.dropdown-select .dropdown-item div{padding-top:3px}.contact-scroll-area{flex:1;padding:0 16px 16px;overflow-y:auto}.letter-title{color:var(--chat-subtext)}.contact-item-row{justify-content:space-between;align-items:center;height:64px;padding:12px 0;display:flex}.contact-item-left{cursor:pointer;align-items:center;gap:16px;display:flex}.contact-avatar{width:32px;height:32px;position:relative}.contact-avatar img{object-fit:cover;border-radius:50%;width:100%;height:100%}.contact-avatar .online-status{background:#22c55e;border:2px solid #fff;border-radius:50%;width:10px;height:10px;position:absolute;bottom:0;right:0}.contact-info{flex-direction:column;display:flex}.contact-name{color:var(--chat-text)}.contact-role{color:var(--chat-subtext)}.contact-item-actions{gap:8px;display:flex}.contact-action-btn{color:#64748b;cursor:pointer;background:#fff;border:1px solid #e2e8f0;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;transition:all .2s;display:flex}.contact-action-btn:hover{color:#1e293b;background:#f1f5f9;border-color:#cbd5e1}.chat-window.fullpage .chat-body-container{background:var(--container-bg);border-top-left-radius:8px;overflow:hidden;flex:1!important;width:100%!important;height:100%!important;display:flex!important}.chat-window.fullpage .chat-sidebar{background:var(--container-bg);flex-direction:column;flex-shrink:0;width:312px;display:flex}.chat-window.fullpage .chat-main{background:var(--container-bg);flex-direction:column;flex:1;display:flex;position:relative}.chat-main-header{background:var(--container-bg);border-bottom:1px solid var(--chat-border);flex-shrink:0;justify-content:space-between;align-items:center;min-height:64px;padding:12px 16px;display:flex}.chat-main-info{align-items:center;gap:10px;min-width:0;display:flex}.chat-main-avatar{flex-shrink:0;width:32px;height:32px}.chat-main-text{text-transform:capitalize;flex-direction:column;min-width:0;display:flex}.chat-main-text-container{align-items:center;gap:6px;display:flex}.chat-main-name{color:var(--chat-main-name);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.chat-main-status{font-size:var(--font-size-300);color:#94a3b8;line-height:17px}.chat-main-actions{flex-shrink:0;gap:4px;display:flex}.main-action-btn{color:#64748b;cursor:pointer;background:0 0;border:none;border-radius:8px;justify-content:center;align-items:center;width:28px;height:28px;transition:all .2s;display:flex}.main-action-btn:hover{color:var(--primary);background:#f1f5f9}.chat-window.fullpage .chat-main-header{min-height:69px;padding:10px 16px}.chat-window.fullpage .chat-main-actions{gap:8px;display:flex}.chat-window.fullpage .header-info-text{flex-direction:row;align-items:center;gap:6px}.chat-window.fullpage .header-subtitle{margin-top:0}.chat-window.fullpage .chat-header .action-btn.theme-toggle{box-shadow:none;background:0 0}.chat-window.fullpage .chat-header{background-color:var(--app-sidebar-bg);height:45px;padding:8px 12px}.search-section-title{font-size:var(--font-size-500);color:var(--chat-subtext);align-items:center;gap:8px;padding:8px 8px 4px;display:flex}.search-count{font-size:var(--font-size-500);color:#3b82f6;font-weight:500}.search-section-content{flex-direction:column;gap:8px;display:flex}.search-result-item{cursor:pointer;border-radius:12px;align-items:center;gap:12px;height:54px;padding:8px;transition:all .2s;display:flex}.search-result-item:hover{background:#00000008}.search-result-avatar{border-radius:50%;flex-shrink:0;width:32px;height:32px;overflow:hidden}.search-result-avatar img{object-fit:cover;border-radius:50%;width:100%;height:100%}.avatar-placeholder{color:#fff;background:linear-gradient(135deg,#3b82f6,#2563eb);justify-content:center;align-items:center;width:100%;height:100%;font-size:18px;font-weight:600;display:flex}.search-result-info{flex:1;min-width:0}.search-result-name{color:var(--chat-text);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.search-result-sub{font-size:var(--font-size-300);color:#64748b;margin-top:2px}.search-view-all{color:#64748b;width:100%;font-size:var(--font-size-500);cursor:pointer;background:#00000008;border:none;border-radius:8px;margin-top:12px;padding:10px;font-weight:500;transition:all .2s}.search-view-all:hover{color:#1e293b;background:#0000000f}.message-result .search-result-top{justify-content:space-between;align-items:center;margin-bottom:2px;display:flex}.search-result-date{font-size:var(--font-size-300);color:#94a3b8}.search-result-text{font-size:var(--font-size-300);color:#475569;-webkit-line-clamp:2;line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.file-icon-wrapper{color:#3b82f6;background:#3b82f61a;border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;display:flex}.highlight-match{color:var(--primary);font-weight:500}.resize-handle.ne{cursor:ne-resize;z-index:10001;width:15px;height:15px;position:absolute;top:0;right:0}.resize-handle.nw{cursor:nw-resize;z-index:10001;width:15px;height:15px;position:absolute;top:0;left:0}.resize-handle.se{cursor:se-resize;z-index:10001;width:15px;height:15px;position:absolute;bottom:0;right:0}.resize-handle.sw{cursor:sw-resize;z-index:10001;width:15px;height:15px;position:absolute;bottom:0;left:0}.resize-handle.n{cursor:n-resize;z-index:10001;height:6px;position:absolute;top:0;left:15px;right:15px}.resize-handle.s{cursor:s-resize;z-index:10001;height:6px;position:absolute;bottom:0;left:15px;right:15px}.resize-handle.e{cursor:e-resize;z-index:10001;width:6px;position:absolute;top:15px;bottom:15px;right:0}.resize-handle.w{cursor:w-resize;z-index:10001;width:6px;position:absolute;top:15px;bottom:15px;left:0}.hidden-in-popup{display:none}.chat-window:not(.fullpage) .side-bar-info-chat{border-left:none;flex:1;width:100%;max-width:none}\n .chat-input-area{background:var(--container-bg);border-top:var(--chat-border);align-items:center;gap:12px;padding:12px 16px;transition:all .3s;display:flex;position:relative}.chat-input-actions{flex-shrink:0;align-items:center;gap:8px;display:flex;position:relative}.chat-input-actions .action-btn{color:#6b7280;cursor:pointer;background:0 0;border:none;border-radius:8px;justify-content:center;align-items:center;padding:6px;transition:all .2s;display:flex}.chat-input-actions .action-btn:hover{color:#374151;background:#f3f4f6}.chat-input-actions .action-btn.active{color:var(--primary);background:#f3f4f6}.chat-input-container{flex:1;align-items:center;display:flex}.chat-input{background:var(--input-background);border:1px solid var(--chat-border);width:100%;color:var(--chat-text);border-radius:8px;outline:none}textarea.chat-input{box-sizing:border-box;white-space:pre-wrap;resize:none;border:1px solid var(--chat-border);font-family:Inter,sans-serif;line-height:24px;font-size:var(--font-size-500);border-radius:4px;min-height:36px;max-height:120px;padding:5px 12px;overflow-y:auto}.chat-input::placeholder{color:#9ca3af}.chat-input:focus{background:var(--input-background);border-color:#3b82f64d}.chat-input:disabled{opacity:.6;cursor:not-allowed}.chat-window:has(.main-action-btn.active) .chat-input-actions>.action-btn:not(.emoji-picker-btn){display:none}.chat-window:has(.main-action-btn.active) .chat-input-actions>.add-menu-wrapper{display:block}.send-btn{cursor:pointer;color:#fff;background:var(--primary,#8aaeff);width:36px;height:36px;box-shadow:none;border:none;border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;transition:all .2s;display:flex}.send-btn:hover:not(:disabled){filter:brightness(.9);transform:translateY(-1px)}.send-btn:disabled{opacity:.6;cursor:not-allowed;background:#d1d5db}.send-btn svg{width:18px;height:18px}.emoji-picker{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);z-index:10;background:#fffffff2;border:1px solid #0000000d;border-radius:20px;grid-template-columns:repeat(5,1fr);gap:8px;margin-bottom:10px;padding:12px;animation:.3s cubic-bezier(.34,1.56,.64,1) emojiSlideUp;display:grid;position:absolute;bottom:100%;left:16px;box-shadow:0 10px 30px #0000001a}@keyframes emojiSlideUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.emoji-btn{font-size:var(--font-size-600);cursor:pointer;background:0 0;border:none;border-radius:8px;justify-content:center;align-items:center;padding:4px;transition:all .2s;display:flex}.emoji-btn:hover{background:#fff;transform:scale(1.2);box-shadow:0 2px 5px #0000000d}.selected-files-list{background:#ffffff1a;border-bottom:1px solid #fff3;flex-wrap:nowrap;gap:12px;height:100px;padding:12px 20px;display:flex;overflow:auto hidden}.selected-file-item{background:#fef2f280;border-radius:12px;flex-direction:column;align-items:center;gap:8px;padding:8px;transition:all .2s;display:flex;position:relative;box-shadow:0 2px 8px #00000014}.selected-file-item.other-file{flex-direction:row}.selected-file-item:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000001f}.file-preview-image{object-fit:cover;border-radius:8px;width:54px;height:54px;display:block}.file-content-wrapper{flex-direction:row;align-items:center;gap:6px;max-width:240px;display:flex}.selected-files-list .file-icon{border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;display:flex}.selected-files-list .file-info{flex-direction:column;gap:2px;min-width:0;display:flex}.selected-files-list .file-name{color:#0a0a0a;white-space:nowrap;text-overflow:ellipsis;width:400px;max-width:100%;overflow:hidden}.selected-files-list .file-size{font-size:var(--font-size-300);color:#94a3b8;white-space:nowrap;text-overflow:ellipsis;max-width:120px;overflow:hidden}.remove-file-btn{color:#fff;cursor:pointer;background:#ef4444;border:none;border-radius:50%;justify-content:center;align-items:center;width:20px;height:20px;transition:all .2s;display:flex;position:absolute;top:-8px;right:-8px;box-shadow:0 2px 8px #ef44444d}.remove-file-btn:hover{background:#dc2626;transform:scale(1.1);box-shadow:0 4px 12px #ef444466}.remove-file-btn:disabled{opacity:.5;cursor:not-allowed}.selected-file-item.error-file-item{border:2px solid #ef4444;animation:.3s ease-in-out errorShake}@keyframes errorShake{0%{transform:translate(-3px)}50%{transform:translate(3px)}to{transform:translate(0)}}.selected-file-item.error-file-item:hover{background:#fef2f2b3;border-color:#dc2626}.selected-files-list .file-size.error-size{color:#ef4444}.reply-input-preview{background:color-mix(in srgb, var(--primary) 8%, #fff);border-left:3px solid var(--primary);border-top-left-radius:4px;border-bottom-left-radius:4px;justify-content:space-between;align-items:center;margin:0 10px 10px;padding:5px 20px;animation:.3s slideUp;display:flex;position:relative}.reply-content{flex-direction:column;flex:1;gap:2px;min-width:0;padding-left:18px;display:flex}.reply-user,.reply-user span{color:var(--primary,#155dfc)}.reply-text{color:#4a5565;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.close-reply{color:#9ca3af;cursor:pointer;font-size:var(--font-size-500);background:0 0;border:none;transition:all .2s;position:absolute;top:0;right:0}.reply-icon{color:var(--primary,#155dfc);position:absolute;top:6px;left:10px}.close-reply:hover{color:#ef4444;transform:scale(1.1)}@keyframes slideUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.voice-recording-container{background:linear-gradient(135deg,#ef44441a,#ef44440d);border:1px solid #ef444433;flex:1;align-items:center;gap:12px;padding:12px 16px;animation:.2s slideUp;display:flex}.voice-recording-controls{gap:4px;display:flex}.voice-recording-info{flex:1;align-items:center;gap:8px;display:flex}.recording-indicator{font-size:var(--font-size-400);color:#374151;align-items:center;gap:6px;font-weight:500;display:flex}.recording-dot{background:#ef4444;border-radius:50%;width:8px;height:8px;animation:1.5s ease-in-out infinite recordingPulse}@keyframes recordingPulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(1.2)}}.recording-duration{font-size:var(--font-size-400);color:#374151;text-align:right;min-width:45px;font-weight:600}.voice-recorded-container{background:linear-gradient(135deg,#3b82f61a,#3b82f60d);border:1px solid #3b82f633;flex:1;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;animation:.2s slideUp;display:flex}.voice-recorded-info{font-size:var(--font-size-400);flex:1;align-items:center;gap:8px;display:flex}.voice-label{color:#1f2937;white-space:nowrap;font-weight:500}.voice-duration{color:#3b82f6;text-align:right;min-width:45px;margin-left:auto;font-weight:600}.voice-control-btn{color:#1f2937;cursor:pointer;width:32px;height:32px;font-size:var(--font-size-500);background:#fff;border:1px solid #0000001a;border-radius:6px;justify-content:center;align-items:center;transition:all .2s;display:flex}.voice-control-btn:hover{background:#f9fafb;transform:scale(1.05)}.voice-control-btn.cancel-btn{color:#ef4444;background:#ef44440d;border-color:#ef44441a}.voice-control-btn.add-btn{color:#fff;background:#8aaeff;border-color:#8aaeff}.add-menu-wrapper{position:relative}.add-menu-dropdown{z-index:1000;background:#fff;border:1px solid #e0e0e0;border-radius:8px;flex-direction:column;min-width:150px;display:flex;position:absolute;bottom:30px;left:0;box-shadow:0 2px 8px #00000026}.add-menu-item{cursor:pointer;font-size:var(--font-size-500);background:0 0;border:none;align-items:center;gap:12px;padding:12px 16px;transition:background-color .2s;display:flex}.add-menu-item:hover:not(:disabled){background-color:#f5f5f5}.add-menu-item:disabled{opacity:.5;cursor:not-allowed}.add-menu-item:first-child{border-radius:8px 8px 0 0}.add-menu-item:last-child{border-radius:0 0 8px 8px}.add-menu-item span{white-space:nowrap}\n .message-list-wrapper{flex-direction:column;flex:1;display:flex;position:relative;overflow:hidden}.message-list{background:var(--chat-list-bg);flex-direction:column-reverse;flex:1;gap:20px;padding:24px 20px;display:flex;overflow:hidden auto}.chat-date-divider{justify-content:center;align-items:center;width:100%;margin:20px 0;display:flex}.chat-date-divider span{background:var(--message-bubble-other);color:var(--chat-text);font-size:var(--font-size-300);border-radius:20px;padding:4px 16px;font-weight:500;box-shadow:0 1px 2px #0000000d}.message-item{gap:4px 8px;max-width:70%;display:flex;position:relative}.message-content{flex-direction:column;width:fit-content;max-width:100%;display:flex}.message-item.current-user .message-content{align-items:flex-end}.message-item.other-user .message-content{align-items:flex-start}.message-content-container{flex-direction:column;gap:12px;min-width:0;max-width:100%;display:flex;position:relative}.message-item.current-user{flex-direction:row-reverse;align-self:flex-end}.message-item.other-user{align-self:flex-start}.message-bubble.current-user{background:var(--primary,#155dfc);border-bottom-right-radius:8px;align-self:flex-end}.message-bubble.other-user{background:var(--message-bubble-other);border-top-left-radius:8px;align-self:flex-start}.message-avatar{object-fit:cover;cursor:pointer;border:2px solid #ffffff4d;border-radius:50%;flex-shrink:0;width:40px;height:40px;transition:transform .2s;box-shadow:0 4px 12px #00000026}.message-bubble{border-radius:16px;flex-direction:column;gap:4px;width:100%;padding:6px 12px;display:flex;position:relative}.message-files{flex-wrap:wrap;align-content:start;align-items:center;gap:8px;max-width:100%;display:flex}.message-files>*{width:100%;max-height:250px}.message-item.current-user .message-files{justify-content:flex-end;align-self:flex-end}.message-item.other-user .message-files{justify-content:flex-start;align-self:flex-start}.file-item{cursor:pointer;background:#f3f4f6;border-radius:14px;align-items:center;gap:4px;height:64px;max-height:64px;padding:8px;text-decoration:none;transition:all .2s;display:flex}.message-item .file-item{flex:1 0 100%}.message-item .file-item .file-name{white-space:nowrap;text-overflow:ellipsis;color:#0a0a0a;overflow:hidden}.chatbot-container.popup .message-item .file-item{max-width:263px}.file-item:hover{background:#ececf0ca;transform:translate(4px)}.file-info{flex-direction:column;flex:1;min-width:0;display:flex}.file-size{font-size:var(--font-size-300);color:#717182;line-height:16px}.file-download-button{cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;width:48px;height:100%;display:flex}.file-image-wrapper{border-radius:8px;justify-content:center;align-items:center;max-width:100%;max-height:100%;margin-top:0;display:flex;position:relative;overflow:hidden}.file-image{object-fit:contain;cursor:pointer;border:1px solid #fff3;border-radius:8px;width:100%;height:auto;transition:transform .2s}.file-image:hover{transform:scale(1.05)}.image-overlay-more{cursor:pointer;background:#00000080;border-radius:8px;justify-content:center;align-items:center;width:100%;height:100%;transition:all .2s;display:flex;position:absolute;top:0;left:0}.image-overlay-more:hover{background:#000000a6}.image-overlay-text{color:#fff;text-shadow:0 2px 4px #0000004d;font-size:28px;font-weight:600}.user .file-image{border-color:#ffffff4d}.message-actions-bar{-webkit-backdrop-filter:none;box-shadow:none;opacity:0;pointer-events:none;z-index:100;background:0 0;border:none;gap:2px;padding:0;transition:all .2s;display:flex;position:absolute;bottom:0}.message-item:hover .message-actions-bar,.message-actions-bar:hover{opacity:1;pointer-events:auto}.message-item.current-user .message-actions-bar{right:calc(100% + 8px)}.message-item.other-user .message-actions-bar{left:calc(100% + 8px)}.chat-window:not(.fullpage) .message-list{overflow-x:hidden}.chat-window:not(.fullpage) .message-item.current-user .message-actions-bar,.chat-window:not(.fullpage) .message-item.other-user .message-actions-bar{-webkit-backdrop-filter:blur(8px);background:#ffffffe6;border:1px solid #0000000d;border-radius:20px;gap:2px;padding:2px 6px;display:flex;inset:auto 0 -22px auto;transform:none;box-shadow:0 2px 8px #00000014}.chat-window:not(.fullpage) .message-item.other-user .message-member-name{margin-right:0}.chat-window:not(.fullpage) .action-icon svg{width:13px;height:13px}.chat-window:not(.fullpage) .action-icon{width:26px;height:26px}.action-icon{color:#64748b;cursor:pointer;background:0 0;border:none;border-radius:8px;justify-content:center;align-items:center;width:30px;height:30px;display:flex}.action-icon.is-hidden{display:none}.action-icon svg{stroke-width:2.2px;width:16px;height:16px}.action-icon:hover{background:#0000000d;transform:translateY(-2px)}.action-icon[title=Xóa]:hover,.action-icon[title=Thu\\ hồi]:hover{color:#ef4444;background:#ef44441a}.action-icon[title=Trả\\ lời]:hover{color:#3b82f6;background:#3b82f61a}.action-icon[title=Thích]:hover{color:#f59e0b;background:#f59e0b1a}.action-icon[title=Yêu\\ thích]:hover{color:#ec4899;background:#ec48991a}.message-reactions-badge{font-size:var(--font-size-400);z-index:2;background:#fffffff2;border:1px solid #0000000d;border-radius:10px;align-items:center;gap:2px;padding:2px 6px;animation:.3s cubic-bezier(.175,.885,.32,1.275) popIn;display:flex;position:absolute;bottom:-11px;box-shadow:0 2px 8px #0000001a}.message-reactions-badge span{line-height:1}.message-item.current-user .message-reactions-badge{right:8px}.message-item.other-user .message-reactions-badge{left:8px}@keyframes popIn{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}.message-bubble-group{flex-direction:column;gap:2px;min-width:0;max-width:100%;display:flex}.message-item.current-user .message-bubble-group,.message-item.other-user .message-bubble-group{align-items:stretch}.message-reply-preview{font-size:var(--font-size-300);cursor:pointer;border-radius:2px;min-width:120px;max-width:100%;margin-bottom:2px;padding:6px 10px;transition:all .2s;overflow:hidden}.message-item.current-user .message-reply-preview{border-left:3px solid color-mix(in srgb, var(--primary,#155dfc) 50%, #fff);background:#f0f3f4;align-self:flex-end}.message-item.other-user .message-reply-preview{background:#f3f4f6cc;border-left:3px solid #94a3b8;align-self:flex-start}.message-item.current-user .message-reply-preview:hover{background:color-mix(in srgb, var(--primary) 10%, #f3f4f6)}.message-item.other-user .message-reply-preview:hover{background:#f3f4f6}.message-reply-header{align-items:center;gap:4px;display:flex}.message-reply-icon{color:#000}.reply-user-name{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.message-item.current-user .reply-user-name{color:#101828}.message-item.other-user .reply-user-name{color:#475569}.reply-content-text{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.message-item.current-user .reply-content-text{color:#6a7282}.message-item.other-user .reply-content-text{color:#64748b}.message-text{overflow-wrap:break-word;word-break:break-word;white-space:pre-line;width:auto;min-width:0;max-width:100%;display:inline-block}.message-text a{word-break:break-all;white-space:nowrap;text-overflow:ellipsis;vertical-align:bottom;max-width:100%;text-decoration:underline;display:inline-block;overflow:hidden}.message-bubble.other-user .message-text{color:var(--chat-text)}.message-bubble.other-user .message-text a:-webkit-any-link{color:var(--chat-text)}.message-bubble.current-user .message-text{color:var(--primary-contrast,#f8fafc)}.message-bubble.current-user .message-text a:-webkit-any-link{color:var(--primary-contrast,#f8fafc)}.message-bubble.other-user.revoked .message-text,.message-bubble.current-user.revoked .message-text{color:color-mix(in srgb, var(--chat-text), transparent 50%)}.message-member-name{font-size:var(--font-size-500);color:#4a5565;white-space:nowrap;text-overflow:ellipsis;cursor:pointer;min-width:0;margin-bottom:4px;overflow:hidden}.scroll-bottom-btn{-webkit-backdrop-filter:blur(8px);cursor:pointer;width:40px;height:40px;color:var(--primary);z-index:1000;background:#ffffffb3;border:1px solid #ffffff4d;border-radius:50%;justify-content:center;align-items:center;font-size:20px;transition:all .3s cubic-bezier(.4,0,.2,1);animation:.3s fadeInPop;display:flex;position:absolute;bottom:20px;right:20px;box-shadow:0 4px 15px #00000026}.scroll-bottom-btn:hover{background:#fff;transform:translateY(-4px);box-shadow:0 6px 20px #0003}.unread-dot{background-color:#ff4d4f;border:2px solid #fff;border-radius:50%;width:10px;height:10px;position:absolute;top:0;right:0}@keyframes fadeInPop{0%{opacity:0;transform:scale(.5)translateY(20px)}to{opacity:1;transform:scale(1)translateY(0)}}.message-time{z-index:10;height:40px;display:none;position:absolute;top:-32px}.message-time>div{color:#99a1af;font-size:var(--font-size-300);white-space:nowrap;background:#fff;border-radius:10px;width:fit-content;padding:4px 10px;box-shadow:0 4px 4px #0000000d}.message-content:hover .message-time,.message-time:hover{display:block}.message-item.current-user .message-time{text-align:right}.message-item.other-user .message-time{text-align:left}.message-item-status{color:var(--chat-text);font-weight:400;font-size:var(--font-size-300);margin-left:4px}.message-item-status.seen{color:#3b82f6;font-weight:600}.message-item-status.sent{color:#99a1af;font-weight:400}.message-item-status.seen svg{margin-bottom:-2px}.message-bubble.revoked{opacity:.8;font-style:italic;font-size:var(--font-size-400);background:#ffffff0d;border:1px dashed #fff3}@keyframes highlight-fade{0%{background-color:rgba(var(--primary-rgb), .2);transform:scale(1.02)}to{background-color:color-mix(in srgb, var(--primary) 10%, #f3f4f6);transform:scale(1)}}.highlight-message .message-bubble{animation:2s ease-out highlight-fade}.see-more-btn{color:var(--primary);cursor:pointer;margin-left:8px;font-weight:600;text-decoration:none;transition:all .2s;display:inline-block}.message-bubble.current-user .see-more-btn{color:#ffffffe6;text-decoration:underline}.see-more-btn:hover{filter:brightness(1.1);text-decoration:underline}.message-bubble.current-user .see-more-btn:hover{color:#fff}.initial-messages-loading{background:var(--chat-list-bg);z-index:10;width:100%;height:100%;color:var(--chat-subtext);flex-direction:column;justify-content:center;align-items:center;gap:12px;display:flex;position:absolute;top:0;left:0}.spinner{border:3px solid color-mix(in srgb, var(--primary,#155dfc) 10%, transparent);border-top-color:var(--primary,#155dfc);border-radius:50%;width:32px;height:32px;animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}\n .file-viewer-overlay{z-index:100001;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#000000e6;justify-content:center;align-items:center;animation:.2s ease-in-out fadeIn;display:flex;position:fixed;inset:0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.file-viewer-content{flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;animation:.3s ease-out slideUp;display:flex;position:relative}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.file-viewer-main{border-radius:8px;justify-content:center;align-items:center;max-width:100%;max-height:70vh;display:flex;position:relative;overflow:hidden}.file-viewer-image{object-fit:contain;border-radius:8px;max-width:100%;max-height:70vh;box-shadow:0 10px 40px #0000004d}.file-viewer-main:has(.file-viewer-video){overflow:visible}.file-viewer-video{object-fit:contain;border-radius:8px;max-width:100%;max-height:100%;box-shadow:0 10px 40px #0000004d}.video-container{justify-content:center;width:85vw;height:78vh;display:flex;overflow:visible}.file-viewer-close{color:#fff;cursor:pointer;z-index:100001;text-align:center;background:#fff3;border:1px solid #ffffff4d;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;padding:0;transition:all .2s;display:flex;position:absolute;top:30px;right:70px}.file-viewer-close:hover{background:#ffffff4d;border-color:#fff6;transform:scale(1.1)}.file-viewer-close:active{transform:scale(.95)}.file-viewer-nav{color:#fff;cursor:pointer;z-index:100001;text-align:center;background:#ffffff26;border:1px solid #fff3;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;padding:0;transition:all .2s;display:flex;position:absolute;top:50%;transform:translateY(-50%)}.file-viewer-nav:hover{background:#ffffff40;border-color:#ffffff4d}.file-viewer-nav:active{transform:translateY(-50%)scale(.95)}.file-viewer-prev{left:70px}.file-viewer-next{right:70px}@media (width<=768px){.file-viewer-prev{left:10px}.file-viewer-next{right:10px}.file-viewer-close{top:10px;right:10px}}.file-viewer-counter{color:#fff;font-size:var(--font-size-300);white-space:nowrap;z-index:100001;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#00000080;border-radius:20px;padding:6px 12px;position:absolute;bottom:20px;left:50%;transform:translate(-50%)}.file-viewer-thumbnails-container{z-index:100001;opacity:0;pointer-events:none;visibility:hidden;justify-content:center;align-items:center;gap:2rem;width:100%;padding-bottom:3.5rem;display:flex;position:absolute;bottom:0;left:50%;transform:translate(-50%)}.file-viewer-thumbnails{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#0000004d;border-radius:8px;gap:8px;max-width:60%;padding-top:12px;padding-bottom:12px;display:flex;overflow-x:auto;-webkit-mask-image:linear-gradient(90deg,#0000 0%,#000 10% 90%,#0000 100%);mask-image:linear-gradient(90deg,#0000 0%,#000 10% 90%,#0000 100%)}.file-viewer-counter:hover~.file-viewer-thumbnails-container,.file-viewer-thumbnails-container:hover{opacity:1;visibility:visible;pointer-events:auto}.file-viewer-thumbnails::-webkit-scrollbar{height:4px}.file-viewer-thumbnails::-webkit-scrollbar-thumb{background:#ffffff4d;border-radius:2px}.file-viewer-thumbnails::-webkit-scrollbar-thumb:hover{background:#ffffff80}.file-viewer-thumbnails-scroll-btn{color:#fff;cursor:pointer;z-index:100002;-webkit-backdrop-filter:blur(10px)saturate(180%);backdrop-filter:blur(10px)saturate(180%);background:#fff3;border:1px solid #ffffff4d;border-radius:8px;justify-content:center;align-items:center;width:32px;height:32px;padding:0;transition:all .3s;display:flex;box-shadow:0 8px 32px #1f26875e}.file-viewer-thumbnails-scroll-btn:hover{background:#ffffff4d;border-color:#ffffff80;transform:scale(1.05);box-shadow:0 8px 32px #1f268780}.file-viewer-thumbnails-scroll-btn:active{transform:scale(.95)}.file-viewer-thumbnail{cursor:pointer;background:#0000004d;border:2px solid #0000;border-radius:4px;width:60px;min-width:60px;height:60px;padding:0;transition:all .2s;overflow:hidden}.file-viewer-thumbnail:hover{background:#0006;border-color:#ffffff80}.file-viewer-thumbnail.active{background:#0003;border-color:#fffc}.thumbnail-image{object-fit:cover;width:100%;height:100%}.thumbnail-video{object-fit:cover;z-index:1;cursor:pointer;width:100%;height:100%}.video-thumbnail-container{border-radius:4px;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:relative;overflow:hidden}.play-icon-overlay{z-index:2;pointer-events:none;cursor:pointer;background-color:#00000080;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;display:flex;position:absolute}.play-arrow{color:#fff;margin-bottom:3px;margin-left:2px;font-size:18px}.file-viewer-overlay:has(.file-viewer-audio){background:0 0}.file-viewer-main:has(.file-viewer-audio){overflow:visible}.audio-container{justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;overflow:visible}.audio-player-wrapper{-webkit-backdrop-filter:blur(30px)saturate(150%);backdrop-filter:blur(30px)saturate(150%);color:#1e293b;z-index:1000;background:#ffffff4d;border:1px solid #ffffff80;border-radius:8px;flex-direction:column;flex-shrink:0;justify-content:center;align-items:center;gap:12px;width:100%;max-width:500px;padding:24px 20px;display:flex;position:relative;box-shadow:0 0 0 100vmax #000000e6}.file-viewer-audio{width:100%;height:40px}.file-viewer-audio::-webkit-media-controls-panel{background-color:#ffffff1a}.audio-name{color:#000;font-size:var(--font-size-600);text-align:center;word-break:break-word;max-width:100%;margin:0;font-weight:700}.audio-thumbnail-container{background:linear-gradient(135deg,#6496ff80 0%,#c864ff80 100%);border-radius:4px;justify-content:center;align-items:center;width:100%;height:100%;display:flex}.audio-thumbnail-icon{font-size:28px}.pdf-thumbnail-container{background:linear-gradient(135deg,#f5222dcc 0%,#ff7a45cc 100%);border-radius:4px;justify-content:center;align-items:center;width:100%;height:100%;display:flex}.pdf-thumbnail-icon{font-size:28px}@media (width<=1024px){.file-viewer-content{max-width:95%}.file-viewer-image{max-height:60vh}}@media (width<=600px){.file-viewer-overlay{inset:0}.file-viewer-content{max-width:100%;max-height:100vh}.file-viewer-main,.file-viewer-image{max-height:50vh}.file-viewer-prev{left:10px}.file-viewer-next{right:10px}.file-viewer-close{top:10px;right:10px}.file-viewer-counter{font-size:var(--font-size-300);padding:6px 12px;bottom:60px}.file-viewer-thumbnails{max-width:100%;padding:8px}.file-viewer-thumbnail{width:50px;min-width:50px;height:50px}}.file-viewer-main:has(.file-viewer-pdf){overflow:visible}.file-viewer-content:has(.file-viewer-pdf) .file-viewer-close{top:5rem}.pdf-container{justify-content:center;width:100vw;height:100vh;display:flex;overflow:visible}.pdf-status{color:#fff}.pdf-status.pdf-error{text-align:center;color:red;padding:20px}.file-viewer-pdf{object-fit:contain;border-radius:8px;max-width:100%;max-height:100%;box-shadow:0 10px 40px #0000004d}\n .toast-container{z-index:100000;pointer-events:none;flex-direction:column;gap:10px;display:flex;position:absolute;bottom:24px;right:24px}.confirm-overlay{z-index:100001;-webkit-backdrop-filter:blur(8px);pointer-events:auto;border-radius:inherit;background:#0f172a66;justify-content:center;align-items:center;animation:.3s ease-out confirm-fade-in;display:flex;position:absolute;inset:0}@keyframes confirm-fade-in{0%{opacity:0}to{opacity:1}}.confirm-toast{text-align:center;background:#fff;border:1px solid #fffc;border-radius:24px;flex-direction:column;align-items:center;gap:0;width:420px;min-width:420px;animation:.4s cubic-bezier(.175,.885,.32,1.275) confirm-pop-up;display:flex;overflow:visible;box-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a,0 0 0 1px #0000000d;padding:32px!important}.confirm-toast:before{display:none}@keyframes confirm-pop-up{0%{opacity:0;transform:scale(.9)translateY(20px)}to{opacity:1;transform:scale(1)translateY(0)}}.confirm-modal-content{flex-direction:column;align-items:center;width:100%;display:flex}.confirm-toast .toast-message{color:#64748b;margin-bottom:32px;font-weight:500;line-height:1.6}.confirm-toast .toast-actions{gap:12px;width:100%;display:flex}.confirm-toast .toast-btn{border-radius:16px;flex:1;padding:14px;font-weight:700}.confirm-toast .toast-btn.cancel{color:#475569;background:#f1f5f9;border:none}.confirm-toast .toast-btn.cancel:hover{color:#1e293b;background:#e2e8f0}.dark-theme .confirm-toast{background:#1e293b;border-color:#ffffff1a}.dark-theme .confirm-title{color:#f8fafc}.dark-theme .confirm-toast .toast-message{color:#94a3b8}.dark-theme .confirm-toast .toast-btn.cancel{color:#cbd5e1;background:#334155}.dark-theme .confirm-toast .toast-btn.cancel:hover{color:#f8fafc;background:#475569}.dark-theme .confirm-toast.warning .confirm-icon{background:#f59e0b26}.toast-item{pointer-events:auto;color:#1e293b;background:#fff;border:1px solid #fff9;border-radius:20px;align-items:center;gap:12px;min-width:500px;max-width:calc(100% - 40px);padding:12px 16px;font-weight:500;animation:.4s cubic-bezier(.175,.885,.32,1.275) toast-pop-in;display:flex;position:relative;overflow:hidden;box-shadow:0 4px 6px -1px #0000000d,0 10px 15px -3px #0000001a}.toast-item:before{content:\"\";width:4px;transition:background .3s;position:absolute;top:0;bottom:0;left:0}.toast-item.success:before{background:#10b981}.toast-item.error:before{background:#ef4444}.toast-item.info:before{background:#3b82f6}.toast-item.warning:before{background:#f59e0b}.toast-item span{background:#00000008;border-radius:50%;justify-content:center;align-items:center;width:28px;height:28px;display:flex}.toast-item button{cursor:pointer;color:#94a3b8;background:0 0;border:none;border-radius:5px;justify-content:center;align-items:center;padding:4px;transition:all .2s;display:flex}.toast-item button:hover{color:#1e293b;background:#0000000d}@keyframes toast-pop-in{0%{opacity:0;transform:translate(20px)scale(.9)}to{opacity:1;transform:translate(0)scale(1)}}.dark-theme .toast-item{color:#f8fafc;background:#1e293b;border-color:#ffffff14;box-shadow:0 20px 25px -5px #0003}.dark-theme .toast-item span{background:#ffffff0d}.toast-message{flex:1}.toast-actions{align-items:center;gap:12px;display:flex}.toast-btn{cursor:pointer;white-space:nowrap;border-radius:10px;justify-content:center;align-items:center;padding:8px 20px;font-weight:600;transition:all .2s cubic-bezier(.4,0,.2,1);display:flex}.toast-btn.cancel{color:#64748b;background:0 0;border:1px solid #00000014}.dark-theme .toast-btn.cancel{color:#94a3b8;border-color:#ffffff1a}.toast-btn.cancel:hover{background:#0000000d}.dark-theme .toast-btn.cancel:hover{background:#ffffff0d}.toast-btn.confirm{color:#fff;border:none;box-shadow:0 4px 6px -1px #0000001a}.toast-btn.confirm:hover{filter:brightness(1.1);transform:translateY(-1px);box-shadow:0 10px 15px -3px #0000001a}.toast-btn.confirm:active{transform:translateY(0)}.toast-item.warning .toast-btn.confirm{background:linear-gradient(135deg,#f59e0b,#d97706)}.toast-item.success .toast-btn.confirm{background:linear-gradient(135deg,#10b981,#059669)}.toast-item.info .toast-btn.confirm{background:linear-gradient(135deg,#3b82f6,#2563eb)}.toast-item.error .toast-btn.confirm{background:linear-gradient(135deg,#ef4444,#dc2626)}.toast-close-btn{cursor:pointer;opacity:.5;color:inherit;font-size:var(--font-size-500);background:0 0;border:none;justify-content:center;align-items:center;padding:0 0 0 8px;display:flex}.chat-window:not(.fullpage) .toast-container{gap:8px;width:auto;bottom:12px;left:12px;right:12px}.chat-window:not(.fullpage) .toast-item{border-radius:14px;width:100%;min-width:0;max-width:100%;padding:10px 12px;box-shadow:0 4px 12px #0000001a}.chat-window:not(.fullpage) .toast-message{font-size:var(--font-size-400);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.chat-window:not(.fullpage) .confirm-toast{border-radius:20px;width:85%;min-width:260px;max-width:320px;padding:20px!important}.chat-window:not(.fullpage) .confirm-toast .toast-message{white-space:normal;font-size:var(--font-size-400);margin-bottom:20px}.chat-window:not(.fullpage) .confirm-toast .toast-btn{font-size:var(--font-size-400);border-radius:12px;padding:10px}\n .side-bar-info-chat{background:var(--container-bg);border-left:1px solid var(--chat-border);flex-direction:column;flex-shrink:0;width:274px;display:flex}.info-header{justify-content:flex-end;padding:16px;display:flex}.close-info-btn{color:#64748b;cursor:pointer;background:0 0;border:none;border-radius:4px;padding:4px}.close-info-btn:hover{background:#f1f5f9}.info-content-scroll{flex-direction:column;flex:1;padding:0 20px 20px;display:flex;overflow-y:auto}.info-content-scroll::-webkit-scrollbar{width:4px}.info-content-scroll::-webkit-scrollbar-thumb{background:#e2e8f0;border-radius:10px}.info-basic-section{text-align:center;flex-direction:column;align-items:center;display:flex}.info-avatar-large{width:80px;height:80px;font-size:30px}.info-main-details{flex-direction:column;display:flex}.info-chat-name{color:var(--chat-text);text-transform:capitalize;justify-content:center;align-items:center;gap:8px;margin-top:12px;display:flex}.info-status-icons{color:#94a3b8;cursor:pointer;gap:4px;display:flex}.info-status-icons:hover{color:var(--primary)}.info-member{font-size:var(--font-size-300);color:var(--chat-subtext);margin-bottom:8px}.info-member-count{color:#64748b;margin-top:0;margin-bottom:8px}.info-quick-actions{justify-content:space-around;display:flex}.action-item{cursor:pointer;flex-direction:column;justify-content:center;align-items:center;display:flex}.action-icon-info{color:#475569;background:#f8fafc;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:4px;width:80px;height:56px;padding:8px 0;transition:all .2s;display:flex}.dark-theme .action-icon-info{color:#fff;background:#4f4f4f}.action-item:hover .action-icon-info{color:var(--primary);background:#f1f5f9}.dark-theme .action-item:hover .action-icon-info{color:var(--primary);background:#ffffff14}.action-item span{font-size:var(--font-size-400);color:var(--chat-text);font-weight:500}.menu-item{cursor:pointer;color:#1e293b;font-weight:500;font-size:var(--font-size-500);border-radius:8px;justify-content:space-between;align-items:center;padding:10px 12px;display:flex}.menu-item:hover{background:#f8fafc}.menu-left{align-items:center;gap:12px;display:flex}.info-members-section{padding:16px 0}.section-title-row{color:#64748b;justify-content:space-between;align-items:center;margin-bottom:12px;padding:0 4px;display:flex}.title-actions{color:#94a3b8;gap:8px;display:flex}.title-actions svg{cursor:pointer}.arrow-icon{transition:transform .2s}.arrow-icon.collapsed{transform:rotate(-180deg)}.member-item-left.clickable{cursor:pointer}.members-compact-list{flex-direction:column;display:flex}.members-facepile{align-items:center;padding:8px 4px;display:flex}.facepile-item{z-index:1;border:2px solid #fff;border-radius:50%;width:32px;height:32px;margin-left:-8px;transition:transform .2s;position:relative}.facepile-item:first-child{margin-left:0}.facepile-item:hover{z-index:10;transform:translateY(-4px)}.facepile-item .member-avatar-small{width:100%;height:100%}.facepile-item .online-status{border-width:1.5px;width:8px;height:8px;bottom:0;right:0}.facepile-more{color:#64748b;width:32px;height:32px;font-size:var(--font-size-300);z-index:0;cursor:pointer;background:#f1f5f9;border:2px solid #fff;border-radius:50%;justify-content:center;align-items:center;margin-left:-8px;font-weight:700;display:flex}.facepile-more:hover{background:#e2e8f0}.member-compact-item{border-radius:8px;justify-content:space-between;align-items:center;padding:8px;transition:background .2s;display:flex;position:relative}.member-compact-item:hover{background:#f8fafc}.dark-theme .member-compact-item:hover{background:color-mix(in srgb, var(--primary) 10%, transparent)}.member-item-left{align-items:center;gap:8px;display:flex}.member-avatar-small{border-radius:50%;width:32px;height:32px;position:relative}.member-avatar-small img,.member-img{object-fit:cover;border-radius:50%;width:100%;height:100%;display:block}.member-initials{background:var(--primary);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:100%;height:100%;font-weight:600;display:flex}.member-info{flex-direction:column;gap:2px;display:flex}.member-options-container{align-items:center;display:flex;position:relative}.member-options-btn{color:#94a3b8;cursor:pointer;opacity:0;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;padding:6px;transition:all .2s;display:flex}.member-compact-item:hover .member-options-btn{opacity:1}.member-options-btn:hover{color:#475569;background:#e2e8f0}.member-dropdown-menu{z-index:100;background:#fff;border:1px solid #f1f5f9;border-radius:12px;width:190px;margin-top:4px;padding:6px;animation:.2s fadeIn;position:absolute;top:100%;right:0;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d}@keyframes fadeIn{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}.dropdown-item{color:#1e293b;cursor:pointer;background:0 0;border:none;border-radius:8px;align-items:center;gap:10px;width:100%;transition:all .2s;display:flex}.dropdown-item:hover{background:#f1f5f9}.dropdown-item.delete{color:#ef4444}.dropdown-item.delete:hover{background:#fef2f2}.dropdown-item svg{flex-shrink:0}.member-name-row{align-items:center;gap:4px;width:fit-content;display:flex}.member-name-row>.member-name{white-space:nowrap;text-overflow:ellipsis;text-transform:capitalize;max-width:144px;overflow:hidden}.dark-theme .owner-icon{color:var(--icon-owner)}.member-role{font-size:var(--font-size-300);color:#64748b}.online-status{background:#22c55e;border:2px solid #fff;border-radius:50%;width:10px;height:10px;position:absolute;bottom:0;right:0}.info-summary-section{padding:16px 0}.info-summary-section .section-title{color:#64748b;font-weight:600;font-size:var(--font-size-500);margin-bottom:12px}.summary-tabs{background:#f1f5f9;border-radius:8px;margin-bottom:16px;padding:4px;display:flex}.tab-item{text-align:center;font-size:var(--font-size-400);color:#64748b;cursor:pointer;border-radius:6px;flex:1;padding:6px}.tab-item.active{color:#1e293b;background:#fff;font-weight:600;box-shadow:0 1px 3px #0000001a}.files-list .file-item{border-radius:8px;align-items:center;gap:12px;padding:8px;display:flex}.files-list .file-item:hover{background:#f8fafc}.files-list .file-icon{background:#f1f5f9;border-radius:8px;justify-content:center;align-items:center;width:40px;height:40px;display:flex}.files-list .file-details{flex-direction:column;flex:1;min-width:0;display:flex}.files-list .file-name{font-size:var(--font-size-500);color:#1e293b;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.files-list .file-size{font-size:var(--font-size-300);color:#94a3b8}.files-list .file-download-btn{color:#94a3b8;cursor:pointer;background:0 0;border:none;padding:4px}.files-list .file-download-btn:hover{color:var(--primary)}.group-management-view,.main-info-view{animation:.25s ease-out fadeInSlide}@keyframes fadeInSlide{0%{opacity:0;transform:translate(15px)}to{opacity:1;transform:translate(0)}}.header-left{flex:1;align-items:center;gap:12px;display:flex}.back-info-btn{color:#64748b;cursor:pointer;background:0 0;border:none;border-radius:4px;justify-content:center;align-items:center;padding:4px;display:flex}.back-info-btn:hover{background:#f1f5f9}.management-section{padding:16px 0}.management-section.border-top{border-top:1px solid #f1f5f9}.section-subtitle{font-size:var(--font-size-500);color:#64748b;margin-bottom:16px;padding:0 4px}.settings-list{flex-direction:column;display:flex}.setting-item{cursor:pointer;justify-content:space-between;align-items:center;padding:12px 4px;transition:background .2s;display:flex}.setting-item span{font-size:var(--font-size-500);color:#1e293b;flex:1;padding-right:12px;line-height:1.4}.setting-item input[type=checkbox]{width:18px;height:18px;accent-color:var(--primary);cursor:pointer}.setting-item-switch{justify-content:space-between;align-items:center;padding:12px 4px;display:flex}.setting-info{flex:1;align-items:center;gap:8px;display:flex}.setting-info span{max-width:200px;font-size:var(--font-size-500);color:#1e293b;line-height:1.4}.help-icon{color:#94a3b8;cursor:pointer}.switch{flex-shrink:0;width:36px;height:20px;display:inline-block;position:relative}.switch input{opacity:0;width:0;height:0}.slider{cursor:pointer;background-color:#e2e8f0;transition:all .4s;position:absolute;inset:0}.slider:before{content:\"\";background-color:#fff;width:14px;height:14px;transition:all .4s;position:absolute;bottom:3px;left:3px}input:checked+.slider{background-color:var(--primary)}input:checked+.slider:before{transform:translate(16px)}.slider.round{border-radius:20px}.slider.round:before{border-radius:50%}.management-menu{flex-direction:column;display:flex}.management-menu .menu-item{padding:12px 4px}.management-menu .menu-left svg{color:#64748b}.info-panel-clear-history{color:#d4183d;cursor:pointer;background:0 0;border:none;place-self:center;gap:4px;padding:7px 12px;display:flex}.info-panel-clear-history>span{margin-top:1px}\n .app-sidebar{background:var(--app-sidebar-bg);flex-direction:column;flex-shrink:0;align-items:center;gap:32px;width:64px;padding:12px 12px 24px;display:flex}.app-nav{flex-direction:column;flex:1;gap:16px;display:flex}.nav-item{color:#64748b;cursor:pointer;border-radius:12px;justify-content:center;align-items:center;width:40px;height:40px;transition:all .2s;display:flex}.nav-item:hover{background:var(--active-item-bg);color:var(--primary)}.nav-item.active{background:var(--primary);color:var(--primary-contrast)}.nav-separator{opacity:.8;background:#98a8b3;width:40px;height:1px;margin:4px 0}.app-sidebar-footer{flex-direction:column;align-items:center;gap:20px;padding-bottom:8px;display:flex}.app-avatar{background:#f1f5f9;border:2px solid #fff;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;display:flex;overflow:hidden;box-shadow:0 2px 8px #0000000d}.app-avatar img{object-fit:cover;border-radius:50%;width:100%;height:100%}.app-avatar-fallback{color:#64748b;justify-content:center;align-items:center;width:100%;height:100%;font-weight:700;display:flex}\n .modal-overlay{z-index:9999;-webkit-backdrop-filter:blur();backdrop-filter:blur();background:#0006;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.profile-modal-content{background:var(--container-bg);border-radius:20px;flex-direction:column;gap:12px;width:400px;padding:20px;animation:.3s cubic-bezier(.34,1.56,.64,1) modalScaleUp;display:flex;box-shadow:0 20px 40px #0003}.profile-modal-content .close-modal-btn{align-self:flex-end}@keyframes modalScaleUp{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.profile-header{text-align:center}.profile-avatar-wrapper{width:90px;height:90px;margin:-12px auto 12px;position:relative}.profile-avatar-wrapper img{object-fit:cover;border:4px solid #f8fafc;border-radius:50%;width:100%;height:100%}.profile-avatar-placeholder{color:#fff;background:#3b82f6;border:4px solid #f8fafc;border-radius:50%;justify-content:center;align-items:center;width:100%;height:100%;font-size:30px;font-weight:600;display:flex}.profile-online-status{background:#22c55e;border:3px solid #fff;border-radius:50%;width:16px;height:16px;position:absolute;bottom:5px;right:5px}.profile-name{font-size:var(--font-size-600);color:var(--chat-text);font-weight:600}.status-text{font-size:var(--font-size-300);color:#64748b}.profile-actions{gap:12px;display:flex}.profile-action-btn{cursor:pointer;color:#475569;background:#f8fafc;border:none;border-radius:12px;flex-direction:column;flex:1;align-items:center;gap:6px;padding:12px 8px;transition:all .2s;display:flex}.dark-theme .profile-action-btn{background:var(--message-bubble-other);color:var(--chat-text)}.dark-theme .profile-action-btn svg{color:var(--chat-text)}.dark-theme .profile-action-btn:hover{color:var(--primary);background:#ffffff14;transform:translateY(-2px)}.profile-action-btn:hover{color:var(--primary);background:#f1f5f9;transform:translateY(-2px)}.profile-action-btn svg{color:#64748b;transition:color .2s}.profile-action-btn:hover svg{color:var(--primary)}.profile-action-btn span{font-size:var(--font-size-400);font-weight:600}.profile-details{padding-top:10px}.detail-item{font-size:var(--font-size-400);border-bottom:1px solid var(--chat-border);justify-content:flex-start;align-items:center;padding:12px 0;display:flex}.detail-item:last-child{border-bottom:none}.detail-item .label{color:var(--label-profile);flex-shrink:0;width:110px}.detail-item .value{font-size:var(--font-size-400);color:var(--chat-text)}.value.email,.value.phone{color:var(--primary);cursor:pointer}.value.email:hover,.value.phone:hover{text-decoration:underline}\n .modal-content.add-chat-modal{background:var(--container-bg);border:1px solid #0000000d;border-radius:10px;flex-direction:column;width:90%;max-width:450px;height:auto;min-height:430px;max-height:90vh;padding:0;display:flex;position:relative;overflow:hidden;box-shadow:0 10px 40px #0000001a}.add-chat-modal .modal-header{justify-content:space-between;align-items:center;padding:16px 20px 0;display:flex}.add-chat-modal .modal-title{color:var(--chat-text);text-align:left;margin:0}.add-chat-modal .close-modal-btn{color:#6b7280;cursor:pointer;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;padding:4px;transition:background .2s;display:flex}.add-chat-modal .close-modal-btn:hover{color:#111827;background:#f3f4f6}.add-chat-modal .modal-body{flex-direction:column;flex:1;gap:8px;padding:20px 20px 0;display:flex;overflow:hidden}.add-chat-modal .group-info-section{align-items:center;gap:8px;display:flex}.add-chat-modal .group-avatar-upload{flex-shrink:0}.add-chat-modal .avatar-placeholder{color:#9ca3af;cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;padding:0;display:flex;position:relative}.add-chat-modal .upload-icon{color:#6b7280;background:#f3f4f6;border:1px solid #e5e7eb;border-radius:50%;justify-content:center;align-items:center;width:18px;height:18px;display:flex;position:absolute;bottom:-2px;right:-2px}.add-chat-modal .preview-avatar{object-fit:cover;border-radius:100%;width:100%;height:100%}.add-chat-modal .group-name-input{border:none;border-bottom:1px solid var(--chat-border);font-size:var(--font-size-500);outline:none;flex:1;padding:8px 0;transition:border-color .2s}.dark-theme .add-chat-modal .group-name-input{color:var(--chat-text);background:0 0}.add-chat-modal .group-name-input:focus{border-bottom-color:var(--primary)}.add-chat-modal .search-section .chat-search-bar{padding:0}.add-chat-modal .search-section .search-input{background:var(--input-background);color:var(--chat-text);font-size:var(--font-size-400);border-radius:20px;padding:10px 16px 10px 40px}.add-chat-modal .search-section .search-icon{left:16px}.add-chat-modal .selected-members-tags{flex-wrap:wrap;gap:8px;display:flex}.add-chat-modal .member-tag{background:color-mix(in srgb, var(--primary) 8%, #fff);color:var(--primary);font-size:var(--font-size-500);border-radius:100px;align-items:center;gap:6px;padding:4px 10px;display:flex}.add-chat-modal .remove-tag-btn{color:var(--primary);cursor:pointer;opacity:.7;background:0 0;border:none;justify-content:center;align-items:center;padding:2px;transition:opacity .2s;display:flex}.add-chat-modal .remove-tag-btn:hover{opacity:1}.modal-content.add-chat-modal.has-tags{height:550px}.add-chat-modal .members-list-container{border-top:1px solid var(--chat-border);flex:1;margin:0 -20px;padding:0 7px;overflow-y:hidden}.add-chat-modal .members-list{margin:0;padding:12px 0}.add-chat-modal .member-item{cursor:pointer;background:0 0;border-radius:10px;align-items:center;gap:12px;padding:10px 12px;transition:background .2s;display:flex}.add-chat-modal .member-item.selected{background:color-mix(in srgb, var(--primary) 8%, #fff)}.add-chat-modal .member-item:hover{background:color-mix(in srgb, var(--primary) 5%, #fff)}.add-chat-modal .member-item.selected:hover{background:color-mix(in srgb, var(--primary) 10%, #fff)}.dark-theme .add-chat-modal .member-item:hover{background:color-mix(in srgb, var(--primary) 10%, transparent)}.dark-theme .add-chat-modal .member-item.selected{background:color-mix(in srgb, var(--primary) 15%, transparent)}.add-chat-modal .member-checkbox{flex-shrink:0}.add-chat-modal .checkbox-custom{border:1.5px solid #d1d5db;border-radius:4px;justify-content:center;align-items:center;width:20px;height:20px;transition:all .2s;display:flex}.add-chat-modal .checkbox-custom.checked{background:var(--primary);border-color:var(--primary)}.add-chat-modal .member-avatar-wrapper{width:32px;height:32px;position:relative}.add-chat-modal .member-avatar{color:#4b5563;background:#f3f4f6;border:none;border-radius:50%;justify-content:center;align-items:center;width:100%;height:100%;font-weight:600;display:flex;overflow:hidden}.add-chat-modal .member-avatar img{object-fit:cover;width:100%;height:100%}.add-chat-modal .avatar-letter{color:#fff;background:linear-gradient(135deg,#6366f1,#a855f7);justify-content:center;align-items:center;width:100%;height:100%;display:flex}.add-chat-modal .status-dot{width:12px;height:12px;position:absolute;bottom:-1px;right:-1px}.add-chat-modal .member-name{font-size:var(--font-size-500);color:var(--chat-text)}.add-chat-modal .modal-footer{border-top:1px solid var(--chat-border);justify-content:flex-end;gap:12px;padding:11px 20px;display:flex}.add-chat-modal .footer-btn{cursor:pointer;border:none;border-radius:10px;padding:10px 24px;transition:all .2s}.add-chat-modal .footer-btn.cancel{color:#4b5563;background:#f3f4f6}.add-chat-modal .footer-btn.cancel:hover{background:#e5e7eb}.add-chat-modal .footer-btn.confirm{background:var(--primary);color:#fff}.add-chat-modal .footer-btn.confirm:hover:not(.disabled){background:color-mix(in srgb, var(--primary) 85%, #000)}.add-chat-modal .footer-btn.disabled{opacity:.6;cursor:not-allowed}.display-none{display:none}.chat-window:not(.fullpage) .modal-content.add-chat-modal,.chat-window:not(.fullpage) .modal-content.update-group-modal{max-width:380px;min-height:auto}.modal-content.update-group-modal{background:var(--container-bg);border:1px solid #0000000d;border-radius:10px;flex-direction:column;width:90%;max-width:450px;height:auto;min-height:430px;max-height:90vh;padding:0;display:flex;position:relative;overflow:hidden;box-shadow:0 10px 40px #0000001a}.update-group-modal .modal-header{justify-content:space-between;align-items:center;padding:16px 20px 0;display:flex}.update-group-modal .modal-title{color:var(--chat-text);text-align:left;margin:0}.update-group-modal .close-modal-btn{color:#6b7280;cursor:pointer;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;padding:4px;transition:background .2s;display:flex}.update-group-modal .close-modal-btn:hover{color:#111827;background:#f3f4f6}.update-group-modal .modal-body{flex-direction:column;flex:1;gap:8px;padding:20px 20px 0;display:flex;overflow:hidden}.update-group-modal .group-info-section{align-items:center;gap:8px;display:flex}.update-group-modal .group-avatar-upload{cursor:pointer;flex-shrink:0}.update-group-modal .group-avatar-upload input{display:none}.update-group-modal .avatar-placeholder{color:#9ca3af;cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;padding:0;display:flex;position:relative}.update-group-modal .avatar-placeholder img{object-fit:cover;border-radius:50%;width:100%;height:100%}.update-group-modal .group-name-input{border:none;border-bottom:1px solid var(--chat-border);font-size:var(--font-size-500);outline:none;flex:1;padding:8px 0;transition:border-color .2s}.dark-theme .update-group-modal .group-name-input{color:var(--chat-text);background:0 0}.update-group-modal .group-name-input:focus{border-bottom-color:var(--primary)}.update-group-modal .members-section{margin-top:8px}.update-group-modal .section-title{padding-left:0;display:block}.update-group-modal .members-list-container{border-top:none;flex:1;height:450px;margin:0 -20px;padding:0 7px;overflow-y:hidden}.update-group-modal .members-list{margin:0;padding:12px 0}.update-group-modal .member-item{cursor:default;background:0 0;border-radius:10px;align-items:center;gap:12px;padding:10px 12px;transition:background .2s;display:flex}.update-group-modal .member-item:hover{background:#f9fafb}.dark-theme .update-group-modal .member-item:hover{background:color-mix(in srgb, var(--primary) 10%, transparent)}.update-group-modal .member-avatar-wrapper{width:32px;height:32px;position:relative}.update-group-modal .status-dot{width:12px;height:12px;position:absolute;bottom:-1px;right:-1px}.update-group-modal .member-info-wrapper{flex-direction:column;flex:1;gap:2px;display:flex}.update-group-modal .member-name-row{align-items:center;gap:4px;width:fit-content;display:flex}.update-group-modal .member-name{font-size:var(--font-size-500);color:var(--chat-text)}.update-group-modal .owner-icon{color:#64748b}.update-group-modal .member-role{font-size:var(--font-size-300);color:#64748b}.update-group-modal .remove-member-btn{color:#ef4444;cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;padding:4px;display:flex}.update-group-modal .modal-footer{border-top:1px solid var(--chat-border);justify-content:flex-end;gap:12px;padding:11px 20px;display:flex}.update-group-modal .footer-btn{cursor:pointer;border:none;border-radius:10px;padding:10px 24px;transition:all .2s}.update-group-modal .footer-btn.cancel{color:#4b5563;background:#f3f4f6}.update-group-modal .footer-btn.cancel:hover{background:#e5e7eb}.update-group-modal .footer-btn.confirm{background:var(--primary);color:#fff}.update-group-modal .footer-btn.confirm:hover:not(.disabled){background:color-mix(in srgb, var(--primary) 85%, #000)}.update-group-modal .footer-btn.disabled{opacity:.6;cursor:not-allowed}.chat-window:not(.fullpage) .modal-overlay{border-top:1px solid var(--chat-border);top:48px}.chat-window:not(.fullpage) .modal-content.is-popup-fullscreen{width:100%;max-width:100%;height:100%;max-height:100%;box-shadow:none;border:none;border-radius:0;padding:0;animation:none}.is-popup-fullscreen .modal-header{border-bottom:1px solid var(--chat-border);justify-content:flex-start;align-items:center;min-height:60px;padding:12px 16px}.is-popup-fullscreen .modal-header .group-info-section{flex:1;align-items:center;gap:12px;margin-left:4px;display:flex}.is-popup-fullscreen .modal-header .group-name-input{border:none;border-bottom:1px solid var(--chat-border);color:var(--chat-text);background:0 0;outline:none;width:100%;padding:6px 0}.is-popup-fullscreen .modal-title{margin:0}.is-popup-fullscreen .back-modal-btn{color:#64748b;cursor:pointer;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;padding:4px;display:flex}.is-popup-fullscreen .back-modal-btn:hover{color:#0f172a;background:#f1f5f9}.is-popup-fullscreen .modal-body{padding:16px 16px 0}.is-popup-fullscreen .modal-footer{padding:12px 16px}\n .contact-list-header>div{align-items:center;gap:8px;display:flex}.contact-list-toolbar{gap:12px}.toolbar-search{flex:1}.filter-select{position:relative}.avatar-placeholder{color:#fff;width:40px;height:40px;font-size:var(--font-size-600);background:#3b82f6;border-radius:50%;justify-content:center;align-items:center;font-weight:600;display:flex}.online-status.is-online{background:#22c55e}.online-status.is-offline{background:#94a3b8}.contact-action-btn{background:0 0;border:none}\n .chat-avatar-emoji{background-color:#fff;border-radius:100%;justify-content:center;align-items:center;width:100%;height:100%;display:flex}.chat-avatar-img{object-fit:cover;border-radius:100%;width:100%;height:100%}\n .theme-setting-wrapper{flex-direction:column;justify-content:center;align-items:center;gap:12px;width:626px;margin:0 auto;display:flex}.them-setting-header{justify-content:space-between;align-items:center;width:100%;display:flex}.theme-setting-title{font-weight:600}.theme-setting-save-btn{background-color:var(--primary);color:#fff;border:none;border-radius:16px;padding:6px 12px}.theme-setting-cards-list{flex-direction:column;gap:8px;width:100%;display:flex}.theme-setting-card{border:1px solid var(--chat-border);border-radius:10px;width:100%;padding:16px 18px}.card-header-row{align-items:center;gap:8px;display:flex}.theme-toggle-row{justify-content:space-between;align-items:center;gap:12px;margin-top:12px;display:flex}.theme-mode-btn{cursor:pointer;border:2px solid #e5e7eb;border-radius:8px;width:50%;padding:12px 0}.theme-mode-btn-content{justify-content:center;align-items:center;gap:6px;font-weight:500;display:flex}.theme-mode-btn.active{background-color:color-mix(in srgb, var(--primary,#155dfc) 8%, #fff);border:2px solid var(--primary);color:var(--primary)}.color-presets-container{align-items:center;width:100%;margin-top:12px;display:flex;position:relative}.color-presets-grid{flex-wrap:wrap;gap:10px 8px;max-width:calc(100% - 60px);display:flex}.color-capsule{cursor:pointer;white-space:nowrap;border:1px solid #0000;border-radius:33554400px;align-items:center;gap:6px;padding:6px 12px;transition:all .2s;display:flex}.color-capsule.active{border:1.5px solid #0f172a}.color-dot{border-radius:50%;width:12px;height:12px;display:block}.color-name{font-weight:500}.color-capsule.blue{color:#2563eb;background-color:#dbeafe}.blue-dot{background-color:#2563eb}.color-capsule.purple{color:#7c3aed;background-color:#ede9fe}.purple-dot{background-color:#7c3aed}.color-capsule.pink{color:#db2777;background-color:#fce7f3}.pink-dot{background-color:#db2777}.color-capsule.red{color:#dc2626;background-color:#fee2e2}.red-dot{background-color:#dc2626}.color-capsule.orange{color:#ea580c;background-color:#ffedd5}.orange-dot{background-color:#ea580c}.color-capsule.green{color:#059669;background-color:#d1fae5}.green-dot{background-color:#059669}.color-capsule.gray{color:#4b5563;background-color:#f3f4f6}.gray-dot{background-color:#4b5563}.toggle-setting-row{justify-content:space-between;align-items:center;gap:20px;margin-top:12px;display:flex}.toggle-setting-info{flex-direction:column;gap:4px;display:flex}.toggle-setting-label{color:#111827;font-weight:400}.toggle-setting-desc{color:#6a7282;margin:0;line-height:24px}.ui-toggle-switch{flex-shrink:0;width:44px;height:24px;display:inline-block;position:relative}.ui-toggle-switch input{opacity:0;width:0;height:0}.toggle-slider{cursor:pointer;background-color:#e5e7eb;border-radius:24px;transition:all .3s cubic-bezier(.4,0,.2,1);position:absolute;inset:0}.toggle-slider:before{content:\"\";background-color:#fff;border-radius:50%;width:18px;height:18px;transition:all .3s cubic-bezier(.4,0,.2,1);position:absolute;bottom:3px;left:3px;box-shadow:0 1px 3px #00000026}input:checked+.toggle-slider{background-color:#2563eb}input:checked+.toggle-slider:before{transform:translate(20px)}\n .message-item .detect-url-container{flex-direction:column;gap:8px;display:flex}.message-item .detect-url-item{color:inherit;background-color:#f3f4f6;border-radius:12px;gap:4px;padding:8px 14px;text-decoration:none;display:block}.detect-url-item .detect-url-header{color:#0a0a0a;font-size:var(--font-size-300);align-items:center;gap:6px;display:flex}.detect-url-item .detect-url-title{font-size:var(--font-size-500);color:#0a0a0a;word-break:break-word;text-transform:capitalize;line-height:20px}.detect-url-item .detect-url-path{font-size:var(--font-size-300);color:#717182;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}\n", A = (e, t = 0, n = "Hội thoại không tên") => e ? e.name ? e.name : e.type === "group" ? n : e.members?.find((e) => e.id !== t)?.name ?? n : n, j = new Set([
|
|
12
12
|
"pdf",
|
|
13
13
|
"doc",
|
|
14
14
|
"docx",
|
|
@@ -2853,6 +2853,18 @@ var tn = x([Xt, Zt], (e, t) => {
|
|
|
2853
2853
|
case "sw":
|
|
2854
2854
|
r = Math.min(V.baseX + V.baseW, Math.max(s, V.baseW - t)), i = Math.min(l - V.baseY, Math.max(700, V.baseH + n)), a = V.baseX + (V.baseW - r);
|
|
2855
2855
|
break;
|
|
2856
|
+
case "n":
|
|
2857
|
+
i = Math.min(V.baseY + V.baseH, Math.max(700, V.baseH - n)), o = V.baseY + (V.baseH - i);
|
|
2858
|
+
break;
|
|
2859
|
+
case "s":
|
|
2860
|
+
i = Math.min(l - V.baseY, Math.max(700, V.baseH + n));
|
|
2861
|
+
break;
|
|
2862
|
+
case "e":
|
|
2863
|
+
r = Math.min(c - V.baseX, Math.max(s, V.baseW + t));
|
|
2864
|
+
break;
|
|
2865
|
+
case "w":
|
|
2866
|
+
r = Math.min(V.baseX + V.baseW, Math.max(s, V.baseW - t)), a = V.baseX + (V.baseW - r);
|
|
2867
|
+
break;
|
|
2856
2868
|
}
|
|
2857
2869
|
h?.({
|
|
2858
2870
|
width: r,
|
|
@@ -2985,6 +2997,22 @@ var tn = x([Xt, Zt], (e, t) => {
|
|
|
2985
2997
|
/* @__PURE__ */ D("div", {
|
|
2986
2998
|
onMouseDown: (e) => Ke(e, "sw"),
|
|
2987
2999
|
className: "resize-handle sw"
|
|
3000
|
+
}),
|
|
3001
|
+
/* @__PURE__ */ D("div", {
|
|
3002
|
+
onMouseDown: (e) => Ke(e, "n"),
|
|
3003
|
+
className: "resize-handle n"
|
|
3004
|
+
}),
|
|
3005
|
+
/* @__PURE__ */ D("div", {
|
|
3006
|
+
onMouseDown: (e) => Ke(e, "s"),
|
|
3007
|
+
className: "resize-handle s"
|
|
3008
|
+
}),
|
|
3009
|
+
/* @__PURE__ */ D("div", {
|
|
3010
|
+
onMouseDown: (e) => Ke(e, "e"),
|
|
3011
|
+
className: "resize-handle e"
|
|
3012
|
+
}),
|
|
3013
|
+
/* @__PURE__ */ D("div", {
|
|
3014
|
+
onMouseDown: (e) => Ke(e, "w"),
|
|
3015
|
+
className: "resize-handle w"
|
|
2988
3016
|
})
|
|
2989
3017
|
] }),
|
|
2990
3018
|
/* @__PURE__ */ D("div", {
|