/* Squealock Next — presentation layer only. Keeps legacy chat behavior intact. */
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');
:root {
    --sq-bg: #f7f7fb;
    --sq-surface: rgba(255,255,255,.92);
    --sq-surface-strong: #ffffff;
    --sq-text: #171526;
    --sq-muted: #6d6982;
    --sq-border: rgba(31,27,63,.10);
    --sq-accent: #e77831;
    --sq-accent-strong: #bd5418;
    --sq-on-accent: #fff;
    --sq-incoming: #eceaf3;
    --sq-shadow: 0 18px 55px rgba(37,25,82,.12);
    --sq-radius: 20px;
    color-scheme: light;
}

/* Existing web choices */
body[data-theme="2"] { --sq-bg:#101a1a; --sq-surface:rgba(21,34,34,.92); --sq-surface-strong:#162626; --sq-text:#f2fffd; --sq-muted:#b2c5c3; --sq-border:rgba(180,240,231,.14); --sq-accent:#2a9d8f; --sq-accent-strong:#1e756b; --sq-incoming:#243937; --sq-shadow:0 20px 65px rgba(0,0,0,.4); color-scheme:dark; }
body[data-theme="3"] { --sq-bg:#111318; --sq-surface:rgba(27,29,37,.94); --sq-surface-strong:#1c1f28; --sq-text:#f5f5fa; --sq-muted:#b6b6c2; --sq-border:rgba(255,255,255,.12); --sq-accent:#e77831; --sq-accent-strong:#bc5317; --sq-incoming:#2d303b; --sq-shadow:0 20px 65px rgba(0,0,0,.42); color-scheme:dark; }
body[data-theme="4"] { --sq-bg:#f5fbf8; --sq-surface:rgba(255,255,255,.92); --sq-surface-strong:#fff; --sq-text:#112820; --sq-muted:#5c746b; --sq-border:rgba(20,104,75,.12); --sq-accent:#21ad86; --sq-accent-strong:#167b60; --sq-incoming:#e4f5ee; }
body[data-theme="5"] { --sq-bg:#0c1220; --sq-surface:rgba(20,28,47,.94); --sq-surface-strong:#18223a; --sq-text:#f3f7ff; --sq-muted:#b5c2dc; --sq-border:rgba(173,198,255,.14); --sq-accent:#2b5cc4; --sq-accent-strong:#214694; --sq-incoming:#202e4a; --sq-shadow:0 20px 65px rgba(0,0,0,.42); color-scheme:dark; }
body[data-theme="6"] { --sq-bg:#fff7fc; --sq-surface:rgba(255,255,255,.94); --sq-surface-strong:#fff; --sq-text:#341425; --sq-muted:#826373; --sq-border:rgba(170,37,111,.13); --sq-accent:#ce4392; --sq-accent-strong:#9c2c6a; --sq-incoming:#fae7f2; }
body[data-theme="7"] { --sq-bg:#f5f9ff; --sq-surface:rgba(255,255,255,.94); --sq-surface-strong:#fff; --sq-text:#101f42; --sq-muted:#5a6b90; --sq-border:rgba(43,92,196,.13); --sq-accent:#2b5cc4; --sq-accent-strong:#20469a; --sq-incoming:#e7efff; }

/* Mobile theme parity: Metallic, Metallic Light, Nova Light and Nova Dark. */
body[data-theme="8"] { --sq-bg:#080808; --sq-surface:rgba(25,25,25,.94); --sq-surface-strong:#161616; --sq-text:#f4f3f1; --sq-muted:#bcb9b3; --sq-border:rgba(255,255,255,.13); --sq-accent:#878580; --sq-accent-strong:#62615d; --sq-incoming:#272727; --sq-shadow:0 20px 65px rgba(0,0,0,.48); color-scheme:dark; }
body[data-theme="9"] { --sq-bg:#f5f6f8; --sq-surface:rgba(255,255,255,.94); --sq-surface-strong:#fff; --sq-text:#202124; --sq-muted:#62666d; --sq-border:rgba(31,35,40,.12); --sq-accent:#878580; --sq-accent-strong:#625f5b; --sq-incoming:#eef0f2; }
body[data-theme="10"] { --sq-bg:#f8f7ff; --sq-surface:rgba(255,255,255,.88); --sq-surface-strong:#fff; --sq-text:#171526; --sq-muted:#625d85; --sq-border:rgba(102,87,232,.16); --sq-accent:#6657e8; --sq-accent-strong:#4c3fc2; --sq-incoming:#e9e7ff; --sq-shadow:0 22px 60px rgba(80,63,194,.16); }
body[data-theme="11"] { --sq-bg:#080a12; --sq-surface:rgba(23,26,42,.90); --sq-surface-strong:#171a2a; --sq-text:#f6f4ff; --sq-muted:#c1bdd8; --sq-border:rgba(161,151,255,.16); --sq-accent:#7c6cff; --sq-accent-strong:#5c4dde; --sq-incoming:#20243a; --sq-shadow:0 22px 65px rgba(0,0,0,.48); color-scheme:dark; }

html, body { min-height:100%; }
body.squealock-next, body.login-bg, body.body-bgcolor { background:var(--sq-bg) !important; color:var(--sq-text); font-family:"Manrope", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
body.squealock-next *, body.login-bg *, body.body-bgcolor * { scrollbar-color:var(--sq-accent) transparent; }
body.squealock-next ::selection, body.login-bg ::selection, body.body-bgcolor ::selection { color:var(--sq-on-accent); background:var(--sq-accent); }

/* Authentication, mode selection and subscription surfaces */
.login-bg { overflow-y:auto !important; background:radial-gradient(circle at 12% 12%, color-mix(in srgb, var(--sq-accent) 20%, transparent), transparent 31%), radial-gradient(circle at 90% 85%, color-mix(in srgb, var(--sq-accent) 13%, transparent), transparent 34%), var(--sq-bg) !important; }
.login-bg .wrapper { min-height:100vh; position:relative; isolation:isolate; padding:42px 20px; }
.login-bg .bg-bubbles { display:none !important; }
.login-bg .container-login100 { min-height:calc(100vh - 84px); display:grid; place-items:center; padding:0 !important; background:transparent !important; }
.login-bg .wrap-login100, .login-bg .wrap-login101, .login-bg .stealthview-card { width:min(100%, 510px) !important; padding:42px !important; border:1px solid var(--sq-border); border-radius:28px !important; background:var(--sq-surface) !important; box-shadow:var(--sq-shadow); backdrop-filter:blur(20px); }
.login-bg .stealthview-card { max-width:660px !important; }
.login-bg .login100-form-title, .login-bg label, .login-bg .txt1, .login-bg .product-info, .login-bg .product-det, .login-bg .product-disc, .login-bg .table, .login-bg .card, .login-bg .text-white, .login-bg .text-body { color:var(--sq-text) !important; }
.login-bg .login100-form-title { font-size:clamp(1.65rem, 3vw, 2.3rem); font-weight:600; letter-spacing:-.03em; }
.login-bg .wrap-input100 { box-sizing:border-box; border:1px solid var(--sq-border) !important; background:color-mix(in srgb, var(--sq-surface-strong) 78%, transparent); border-radius:14px; padding:0; transition:border .2s, box-shadow .2s; }
.login-bg .wrap-input100:focus-within { border-color:var(--sq-accent) !important; box-shadow:0 0 0 4px color-mix(in srgb,var(--sq-accent) 16%,transparent); }
.login-bg .input100, .login-bg select { box-sizing:border-box; color:var(--sq-text) !important; background:transparent !important; }
.login-bg .input100::placeholder { color:var(--sq-muted) !important; opacity:1; }
.login-bg .login100-form-btn, .login-bg .logout-btn { min-height:48px; border:0 !important; border-radius:14px !important; color:var(--sq-on-accent) !important; background:linear-gradient(135deg,var(--sq-accent),var(--sq-accent-strong)) !important; box-shadow:0 10px 24px color-mix(in srgb,var(--sq-accent) 30%,transparent); font-weight:700; letter-spacing:.01em; transition:transform .2s, box-shadow .2s; }
.login-bg .login100-form-btn:hover, .login-bg .logout-btn:hover { transform:translateY(-2px); box-shadow:0 14px 28px color-mix(in srgb,var(--sq-accent) 40%,transparent); }
.login-bg a, .login-bg .txt2 { color:var(--sq-accent) !important; font-weight:700; }
.login-bg .auth-home-link { display:block; margin-top:18px; text-align:center; }
.login-bg .card { border:1px solid var(--sq-border) !important; background:var(--sq-surface-strong) !important; border-radius:16px; }
.login-bg .card td, .login-bg .card th { border-color:var(--sq-border) !important; }
.login-bg .stealthview-card { height:auto !important; }
.login-bg .mode-picker { display:flex; align-items:flex-start; justify-content:center; gap:clamp(34px,8vw,90px); padding:18px 0 4px; }
.login-bg .mode-launch { display:flex; flex-direction:column; align-items:center; gap:15px; min-width:128px; text-decoration:none !important; color:var(--sq-text) !important; }
.login-bg .mode-orb { position:relative; display:grid; place-items:center; width:128px; height:128px; box-sizing:border-box; border-radius:50% !important; background:linear-gradient(145deg,var(--sq-accent),var(--sq-accent-strong)) !important; color:var(--sq-on-accent) !important; box-shadow:0 16px 34px color-mix(in srgb,var(--sq-accent) 35%,transparent); transition:transform .2s, box-shadow .2s; }
.login-bg .mode-launch:hover .mode-orb { transform:translateY(-4px) scale(1.02); box-shadow:0 22px 42px color-mix(in srgb,var(--sq-accent) 42%,transparent); }
.login-bg .mode-orb i, .login-bg .mode-orb img { position:static !important; inset:auto !important; margin:0 !important; line-height:1; }
.login-bg .mode-orb i { display:block; color:var(--sq-on-accent) !important; font-size:3rem; }
.login-bg .mode-orb img { display:block; width:48px; height:48px; object-fit:contain; }
.login-bg .mode-label { color:var(--sq-text) !important; font-size:1rem; font-weight:700; }
.login-bg .mode-orb .Message-CounterTeam, .login-bg .mode-orb .Message-CounterStealth { position:absolute !important; top:3px !important; right:4px !important; display:grid; place-items:center; width:23px !important; height:23px !important; min-height:23px; padding:0 !important; border:2px solid var(--sq-surface-strong); border-radius:50% !important; background:#dd3d54 !important; color:#fff !important; font-size:10px !important; }

/* Teams and Stealth chat workspace */
body.body-bgcolor { overflow:hidden; }
.sidebarDetail, .chat-session, .user-profile, .userprofile-left { background:var(--sq-surface) !important; color:var(--sq-text) !important; border-color:var(--sq-border) !important; }
.sidebarDetail { width:440px !important; border-right:1px solid var(--sq-border); box-shadow:12px 0 34px rgba(15,13,35,.04); }
.sidebar-header { padding:26px 20px 14px !important; background:transparent !important; border-bottom:1px solid var(--sq-border); }
.sidebar-header .setImage img, .sidebar-userProfile-ImageSize { border:3px solid color-mix(in srgb,var(--sq-accent) 45%,transparent); box-shadow:0 8px 18px color-mix(in srgb,var(--sq-accent) 18%,transparent); }
.sidebarDetail h5, .sidebarDetail .UserName, .sidebarDetail .setting-listoptions a, .sidebarDetail .form-control, .chat-session h4, .chat-session p { color:var(--sq-text) !important; }
.sidebarDetail .form-control, .chat-session .form-control { height:44px; background:color-mix(in srgb,var(--sq-surface-strong) 75%,transparent) !important; border:1px solid var(--sq-border) !important; border-radius:13px !important; color:var(--sq-text) !important; box-shadow:none !important; }
.sidebarDetail .nav-tabs { margin:10px 16px 0; padding:5px; display:flex; border:1px solid var(--sq-border); border-radius:14px; background:color-mix(in srgb,var(--sq-surface-strong) 72%,transparent); }
.sidebarDetail .nav-tabs li { flex:1; text-align:center; }
.sidebarDetail .nav-tabs li a, .sidebarDetail #tab li a, .sidebarDetail #tab li a i { display:grid; place-items:center; min-height:38px; border-radius:10px; color:var(--sq-accent) !important; }
.sidebarDetail .nav-tabs li.active a, .sidebarDetail .nav-tabs li a:hover, .sidebarDetail #tab li.active a, .sidebarDetail #tab li a:hover, .sidebarDetail #tab.nav-tabs > li.active > a, .sidebarDetail #tab.nav-tabs > li.active > a:hover, .sidebarDetail #tab.nav-tabs > li.active > a:focus { background:var(--sq-accent-strong) !important; color:var(--sq-on-accent) !important; }
.sidebarDetail #tab li.active a i, .sidebarDetail #tab li a:hover i { color:var(--sq-on-accent) !important; }
.contact-listing li, .single-chat-list, .group-chat-list { border-radius:0 !important; margin:3px 10px; transition:background .2s, transform .2s; }
.sidebarDetail .contact-listing > li.contact-listing1:has(> a.search-single-chat-details), .sidebarDetail .contact-listing > li.contact-listing1:has(> a.search-group-chat-details) { position:relative; float:none !important; box-sizing:border-box; width:calc(100% - 50px) !important; min-height:72px; margin:3px 24px 3px 10px !important; padding:7px 58px 7px 8px !important; }
.sidebarDetail .contact-listing > li.contact-listing1:has(> a.search-single-chat-details) > .dropdown, .sidebarDetail .contact-listing > li.contact-listing1:has(> a.search-group-chat-details) > .dropdown { position:absolute; z-index:2; top:19px; right:8px; }
.sidebarDetail .contact-listing > li.contact-listing1:has(> a.search-single-chat-details):hover, .sidebarDetail .contact-listing > li.contact-listing1:has(> a.search-group-chat-details):hover { background:color-mix(in srgb,var(--sq-accent) 9%,var(--sq-surface-strong)); transform:translateX(2px); }
.sidebarDetail .contact-listing > li.contact-listing1:has(> a.search-single-chat-details) > a, .sidebarDetail .contact-listing > li.contact-listing1:has(> a.search-group-chat-details) > a { display:grid !important; grid-template-columns:45px minmax(0, 1fr); align-items:center; column-gap:11px; min-width:0; min-height:56px; text-decoration:none; }
.sidebarDetail .contact-listing > li.contact-listing1:has(> a.search-single-chat-details) .avatar-status.avatar-50, .sidebarDetail .contact-listing > li.contact-listing1:has(> a.search-group-chat-details) .avatar-status.avatar-50 { position:relative !important; display:block; float:none !important; flex:none; width:45px !important; max-width:45px !important; height:45px !important; margin:0 !important; overflow:visible !important; }
.sidebarDetail .contact-listing > li.contact-listing1:has(> a.search-single-chat-details) .avatar-status.avatar-50 img, .sidebarDetail .contact-listing > li.contact-listing1:has(> a.search-group-chat-details) .avatar-status.avatar-50 img { display:block; width:45px !important; height:45px !important; border-radius:50%; object-fit:cover; }
.sidebarDetail .contact-listing > li.contact-listing1:has(> a.search-single-chat-details) .avatar-status.avatar-50 > i, .sidebarDetail .contact-listing > li.contact-listing1:has(> a.search-group-chat-details) .avatar-status.avatar-50 > i { position:absolute !important; inset:auto -2px -2px auto !important; z-index:3; margin:0 !important; padding:0; border:2px solid var(--sq-surface-strong); border-radius:50%; color:#94be1f !important; font-size:10px !important; line-height:1; }
.sidebarDetail .contact-listing > li.contact-listing1:has(> a.search-single-chat-details) .user-content, .sidebarDetail .contact-listing > li.contact-listing1:has(> a.search-group-chat-details) .user-content { display:grid !important; grid-template-columns:minmax(0, 1fr) auto; grid-template-rows:23px 21px; column-gap:8px; min-width:0; width:auto !important; margin:0 !important; float:none !important; }
.sidebarDetail .contact-listing > li.contact-listing1:has(> a.search-single-chat-details) .user-content h6, .sidebarDetail .contact-listing > li.contact-listing1:has(> a.search-group-chat-details) .user-content h6 { grid-column:1; grid-row:1; align-self:center; min-width:0; width:auto !important; max-width:none !important; margin:0 !important; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; float:none !important; }
.sidebarDetail .contact-listing > li.contact-listing1:has(> a.search-single-chat-details) .user-content p, .sidebarDetail .contact-listing > li.contact-listing1:has(> a.search-group-chat-details) .user-content p { grid-column:1; grid-row:2; align-self:center; width:auto !important; max-width:none !important; height:auto !important; margin:0 !important; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; float:none !important; position:static !important; }
.sidebarDetail .contact-listing > li.contact-listing1:has(> a.search-single-chat-details) .user-content .notify-icon, .sidebarDetail .contact-listing > li.contact-listing1:has(> a.search-group-chat-details) .user-content .notify-icon { display:flex; grid-column:2; grid-row:2; align-items:center; justify-self:end; gap:4px; min-width:0; white-space:nowrap; }
.sidebarDetail .contact-listing > li.contact-listing1:has(> a.search-single-chat-details) .user-content .notify-icon i, .sidebarDetail .contact-listing > li.contact-listing1:has(> a.search-group-chat-details) .user-content .notify-icon i, .sidebarDetail .contact-listing > li.contact-listing1:has(> a.search-single-chat-details) .user-content small.time, .sidebarDetail .contact-listing > li.contact-listing1:has(> a.search-group-chat-details) .user-content small.time { position:static !important; inset:auto !important; margin:0 !important; }
.sidebarDetail .contact-listing > li.contact-listing1:has(> a.search-single-chat-details) .user-content small.time, .sidebarDetail .contact-listing > li.contact-listing1:has(> a.search-group-chat-details) .user-content small.time { order:-1; font-size:10px !important; white-space:nowrap; }
.sidebarDetail .contact-listing > li.contact-listing1:has(> a.search-single-chat-details) .user-content > .Message-Counter, .sidebarDetail .contact-listing > li.contact-listing1:has(> a.search-group-chat-details) .user-content > .Message-Counter { position:static !important; grid-column:2; grid-row:1; align-self:center; justify-self:end; width:18px !important; height:18px !important; min-height:18px; padding:2px 0 !important; font-size:9px !important; line-height:14px; }
.sidebarDetail .search-single-chat-details .user-content h6, .sidebarDetail .search-group-chat-details .user-content h6 { color:var(--sq-text) !important; }
.sidebarDetail .search-single-chat-details .user-content p, .sidebarDetail .search-group-chat-details .user-content p, .sidebarDetail .search-single-chat-details .user-content .time, .sidebarDetail .search-group-chat-details .user-content .time { color:var(--sq-muted) !important; }
.sidebarDetail a#dropdownMenuLink, .sidebarDetail a.thread-menu-toggle { display:inline-grid !important; place-items:center; min-width:34px; min-height:32px; padding:2px 8px !important; border:1px solid color-mix(in srgb,var(--sq-accent) 35%,var(--sq-border)) !important; border-radius:10px !important; background:color-mix(in srgb,var(--sq-accent) 10%,var(--sq-surface-strong)) !important; color:var(--sq-accent) !important; opacity:1 !important; }
.sidebarDetail a#dropdownMenuLink i, .sidebarDetail a.thread-menu-toggle i { color:var(--sq-accent) !important; opacity:1 !important; }
.sidebarDetail li.thread-list-item > .dropdown { z-index:1070 !important; }
.sidebarDetail li.thread-list-item > .dropdown > .dropdown-menu { display:none; position:absolute !important; top:calc(100% + 5px) !important; right:0 !important; left:auto !important; min-width:176px; max-width:min(280px, calc(100vw - 28px)); max-height:min(320px, calc(100vh - 150px)); overflow-y:auto; z-index:1071 !important; isolation:isolate; opacity:1 !important; background:var(--sq-surface-strong) !important; background-color:var(--sq-surface-strong) !important; background-image:none !important; border:1px solid var(--sq-border) !important; border-radius:12px; box-shadow:0 14px 32px rgba(0,0,0,.20); backdrop-filter:none !important; filter:none !important; mix-blend-mode:normal !important; }
.sidebarDetail li.thread-list-item > .dropdown > .dropdown-menu.show { display:block !important; }
.sidebarDetail li.thread-list-item > .dropdown > .dropdown-menu > li { display:block !important; background:var(--sq-surface-strong) !important; opacity:1 !important; }
.sidebarDetail li.thread-list-item > .dropdown > .dropdown-menu > li > a { display:block !important; width:100% !important; box-sizing:border-box; background:var(--sq-surface-strong) !important; color:var(--sq-text) !important; opacity:1 !important; }
.sidebarDetail li.thread-list-item > .dropdown > .dropdown-menu > li > a:hover, .sidebarDetail li.thread-list-item > .dropdown > .dropdown-menu > li > a:focus { background-color:color-mix(in srgb,var(--sq-accent) 14%,var(--sq-surface-strong)) !important; color:var(--sq-text) !important; }
.chat-session { left:440px !important; width:calc(100% - 440px) !important; }
.chat-session .navbar, .chat-session .nav-custom { background:var(--sq-surface) !important; border-bottom:1px solid var(--sq-border) !important; box-shadow:0 8px 20px rgba(15,13,35,.035); }
.nav-icons-bg { width:42px !important; height:42px !important; display:inline-grid !important; place-items:center; border-radius:13px !important; background:color-mix(in srgb,var(--sq-accent) 12%,var(--sq-surface-strong)) !important; }
.nav-icons-bg a, .nav-icons-bg i { color:var(--sq-accent) !important; }
.conversation-section { background:radial-gradient(circle at 75% 18%, color-mix(in srgb,var(--sq-accent) 8%,transparent), transparent 31%), var(--sq-bg) !important; }
.conversation-section .container-fluid { padding:20px 28px; }
.message-left, .message-right, .sender-message, .receiver-message, .chat-message { border-radius:18px !important; box-shadow:0 6px 18px rgba(23,20,50,.06); }
.sender-message, .message-right .message, .message-right .chat-message { background:linear-gradient(135deg,var(--sq-accent),var(--sq-accent-strong)) !important; color:var(--sq-on-accent) !important; }
.receiver-message, .message-left .message, .message-left .chat-message { background:var(--sq-incoming) !important; color:var(--sq-text) !important; }
.send-message-section, .message-send-section, .chat-send-message { background:var(--sq-surface) !important; border-top:1px solid var(--sq-border) !important; box-shadow:0 -8px 24px rgba(15,13,35,.035); }
.send-message-section textarea, .send-message-section input, .message-send-section textarea, .message-send-section input { background:var(--sq-surface-strong) !important; border:1px solid var(--sq-border) !important; border-radius:16px !important; color:var(--sq-text) !important; }
.send-icon-bg, .chat-icon { background:var(--sq-accent) !important; border-radius:16px !important; box-shadow:0 10px 22px color-mix(in srgb,var(--sq-accent) 30%,transparent); }
.entrance-page { color:var(--sq-text); background:radial-gradient(circle at center, color-mix(in srgb,var(--sq-accent) 11%,transparent),transparent 50%),var(--sq-bg) !important; }
.entrance-page img { max-width:min(460px,90%); filter:drop-shadow(0 20px 40px rgba(45,32,101,.18)); }

/* Settings, modals, Meet and call overlays */
.modal-content, .modal-dialog, .settingnav, .setting-listoptions, .dropdown-menu { color:var(--sq-text) !important; background:var(--sq-surface-strong) !important; border-color:var(--sq-border) !important; }
.settingnav { box-sizing:border-box; padding-right:18px !important; }
.settingnav #setting { box-sizing:border-box; padding:0 8px 20px 0; }
.settingnav .contact-listing { padding-right:0; }
.settingnav .contact-listing > li.contact-listing1 { position:relative; box-sizing:border-box; float:left !important; width:100% !important; min-height:77px; height:auto; margin:0 !important; padding:7px 42px 7px 2px !important; }
.settingnav #setting h6, .settingnav #setting a, .settingnav #setting p, .settingnav #setting span:not(.slider), .settingnav #setting label:not(.switch) { color:var(--sq-text) !important; }
.settingnav #LiveUsers h5, .settingnav #LiveUsers h6, .settingnav #LiveUsers p, .settingnav #LiveUsers a, .settingnav #LiveUsers span:not(.slider), .settingnav .browselivelisting h5, .settingnav .browselivelisting h6, .settingnav .browselivelisting p, .settingnav .browselivelisting a, .settingnav .browselivelisting1 a { color:var(--sq-text) !important; }
.settingnav .browselivelisting .dropdown-menu, .settingnav .browselivelisting1 { background:var(--sq-surface-strong) !important; border-color:var(--sq-border) !important; }
.settingnav .browselivelisting .img-city { display:block; width:25px; height:18px; margin:4px 0 0 8px; border:1px solid var(--sq-border); border-radius:2px; object-fit:cover; }
.settingnav #SingleArchiveChatDetails .user-content h6, .settingnav #GroupArchiveChatDetails .user-content h6 { color:var(--sq-text) !important; }
.settingnav #SingleArchiveChatDetails .user-content p, .settingnav #SingleArchiveChatDetails .user-content .time, .settingnav #GroupArchiveChatDetails .user-content p, .settingnav #GroupArchiveChatDetails .user-content .time { color:var(--sq-muted) !important; }
.settingnav .notification .toggle-btn, .settingnav .sounds .toggle-btn, .settingnav .golive .toggle-btn { top:6px !important; right:16px !important; }
.settingnav .toggle-btn { margin-right:0; }
.sidebarDetail .contact-listing > li.thread-list-item { position:relative; z-index:0; isolation:isolate; float:none !important; box-sizing:border-box; width:calc(100% - 50px) !important; min-height:72px; margin:3px 24px 3px 10px !important; padding:7px 58px 7px 8px !important; }
.sidebarDetail .contact-listing > li.thread-list-item > .dropdown { position:absolute; z-index:20; top:19px; right:8px; }
.sidebarDetail .contact-listing > li.thread-list-item:hover { background:color-mix(in srgb,var(--sq-accent) 9%,var(--sq-surface-strong)); transform:translateX(2px); }
.sidebarDetail .contact-listing > li.thread-list-item.thread-menu-open { z-index:1080 !important; transform:none !important; }
.sidebarDetail .contact-listing > li.thread-list-item.thread-menu-open > .dropdown { z-index:1082 !important; }
.sidebarDetail .contact-listing > li.thread-list-item.thread-menu-open > .dropdown > .dropdown-menu { z-index:1083 !important; }
.sidebarDetail .contact-listing > li.thread-list-item > a { position:relative; z-index:1; }
.sidebarDetail .contact-listing > li.thread-list-item > a { display:grid !important; grid-template-columns:45px minmax(0,1fr); align-items:center; column-gap:11px; min-width:0; min-height:56px; text-decoration:none; }
.sidebarDetail .contact-listing > li.thread-list-item .avatar-status.avatar-50 { position:relative !important; display:block; float:none !important; flex:none; width:45px !important; max-width:45px !important; height:45px !important; margin:0 !important; overflow:visible !important; }
.sidebarDetail .contact-listing > li.thread-list-item .avatar-status.avatar-50 img { display:block; width:45px !important; height:45px !important; border-radius:50%; object-fit:cover; }
.sidebarDetail .contact-listing > li.thread-list-item .avatar-status.avatar-50 > i { position:absolute !important; inset:auto -2px -2px auto !important; z-index:3; margin:0 !important; padding:0; border:2px solid var(--sq-surface-strong); border-radius:50%; color:#94be1f !important; font-size:10px !important; line-height:1; }
.sidebarDetail .contact-listing > li.thread-list-item .user-content { display:grid !important; grid-template-columns:minmax(15ch,1fr) auto; grid-template-rows:23px 21px; column-gap:8px; min-width:0; width:auto !important; margin:0 !important; float:none !important; }
.sidebarDetail .contact-listing > li.thread-list-item .user-content h6 { grid-column:1; grid-row:1; align-self:center; min-width:15ch; width:15ch !important; max-width:15ch !important; margin:0 !important; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; float:none !important; }
.sidebarDetail .contact-listing > li.thread-list-item .user-content p { grid-column:1; grid-row:2; align-self:center; width:auto !important; max-width:none !important; height:auto !important; margin:0 !important; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; float:none !important; position:static !important; }
.sidebarDetail .contact-listing > li.thread-list-item .user-content .notify-icon { display:flex; grid-column:2; grid-row:2; align-items:center; justify-self:end; gap:4px; min-width:0; white-space:nowrap; }
.sidebarDetail .contact-listing > li.thread-list-item .user-content .notify-icon i, .sidebarDetail .contact-listing > li.thread-list-item .user-content small.time { position:static !important; inset:auto !important; margin:0 !important; }
.sidebarDetail .contact-listing > li.thread-list-item .user-content small.time { order:-1; font-size:10px !important; white-space:nowrap; }
.sidebarDetail .contact-listing > li.thread-list-item .user-content > .Message-Counter { position:static !important; grid-column:2; grid-row:1; align-self:center; justify-self:end; width:18px !important; height:18px !important; min-height:18px; padding:2px 0 !important; font-size:9px !important; line-height:14px; }
.sidebarDetail .contact-listing > li.thread-list-item .dropdown-menu { z-index:1070 !important; }

/* Stable two-pane Browse Live Users navigator; no bootstrap dropdown state is involved. */
.settingnav #LiveUsers .browse-live-navigator { display:grid; grid-template-columns:1fr; gap:12px; width:100%; padding:6px 2px 18px; }
.browse-live-menu { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:6px; min-width:0; }
.browse-live-option { display:grid; grid-template-columns:20px minmax(0,1fr) 14px; align-items:center; gap:8px; width:100%; min-height:42px; padding:9px 10px; border:1px solid transparent; border-radius:10px; background:transparent; color:var(--sq-text) !important; font:inherit; font-size:12px; font-weight:700; text-align:left; cursor:pointer; }
.browse-live-option:hover, .browse-live-option.is-active { border-color:color-mix(in srgb,var(--sq-accent) 42%,var(--sq-border)); background:color-mix(in srgb,var(--sq-accent) 12%,var(--sq-surface-strong)); color:var(--sq-accent) !important; }
.browse-live-option i:first-child { color:var(--sq-accent); }
.browse-live-option i:last-child { justify-self:end; font-size:10px; opacity:.8; }
.browse-live-panel { min-width:0; min-height:300px; padding:14px; border:1px solid var(--sq-border); border-radius:12px; background:var(--sq-surface-strong); box-shadow:0 8px 22px rgba(15,13,35,.06); }
.browse-live-panel[hidden], .browse-live-results[hidden] { display:none !important; }
.browse-live-panel h6, .browse-live-results h6 { margin:0 0 11px !important; color:var(--sq-text) !important; font-size:14px; font-weight:800; }
.browse-live-panel .form-group { margin-bottom:10px; }
.browse-live-panel .form-control { width:100% !important; min-width:0; }
.browse-live-panel .scroll-section { max-height:310px; overflow:auto; }
.browse-live-source-list { margin:0; padding:0; list-style:none; }
.browse-live-source-list > li { width:100% !important; margin:0 !important; padding:0 !important; border-radius:0 !important; }
.browse-live-source-list > li > button { display:grid; grid-template-columns:minmax(0,1fr) 14px; align-items:center; gap:8px; width:100%; min-height:40px; padding:8px 4px; border:0; border-bottom:1px solid var(--sq-border); background:transparent; color:var(--sq-text) !important; font:inherit; text-align:left; cursor:pointer; }
.browse-live-source-list > li > button:hover { color:var(--sq-accent) !important; background:color-mix(in srgb,var(--sq-accent) 8%,transparent); }
.browse-live-source-list > li > .browse-country-option { grid-template-columns:30px minmax(0,1fr) 14px; }
.country-flag-frame { display:grid; place-items:center; width:25px; height:18px; overflow:hidden; border:1px solid var(--sq-border); border-radius:3px; background:linear-gradient(135deg,#e9edf6,#b8c2d5); }
.country-flag-frame img { display:block !important; width:25px !important; height:18px !important; max-width:none !important; margin:0 !important; border:0 !important; border-radius:0 !important; object-fit:cover; }
.browse-live-results { margin-top:14px; padding-top:14px; border-top:1px solid var(--sq-border); }
.browse-live-panel.has-browse-results > .browse-live-source-search, .browse-live-panel.has-browse-results > .browse-live-source-list { display:none; }
.browse-live-panel.has-browse-results .browse-live-results { margin-top:0; padding-top:0; border-top:0; }
.browse-live-results-heading { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:11px; }
.browse-live-results-heading h6 { margin:0 !important; }
.browse-live-results-heading button { padding:0; border:0; background:transparent; color:var(--sq-accent) !important; font:inherit; font-size:11px; font-weight:800; cursor:pointer; }
.settingnav #LiveUsers .browse-live-panel, .settingnav #LiveUsers .browse-live-results, .settingnav #LiveUsers .scroll-section, .settingnav #LiveUsers .scroll-section > li, .settingnav #LiveUsers .scroll-section > li > a { color:var(--sq-text) !important; background:var(--sq-surface-strong) !important; }
.settingnav #LiveUsers .browse-live-panel .scroll-section > li { display:block !important; width:100% !important; min-height:0 !important; margin:0 !important; padding:0 !important; border-radius:0 !important; overflow:hidden; border-bottom:1px solid var(--sq-border); }
.settingnav #LiveUsers .browse-live-panel .scroll-section > li > a { display:block !important; width:100% !important; padding:0 !important; text-decoration:none; }
.settingnav #LiveUsers .browse-live-panel .scroll-section > li > a > .row, .settingnav #LiveUsers .browse-live-panel .scroll-section > li > a > .row > [class*="col"] { width:auto !important; margin:0 !important; padding:0 !important; }
.settingnav #LiveUsers .browse-live-panel .contact-listing { width:100% !important; margin:0 !important; padding:0 !important; background:var(--sq-surface-strong) !important; }
.settingnav #LiveUsers .browse-live-panel .userlisting { display:block !important; float:none !important; box-sizing:border-box; width:100% !important; min-height:62px !important; margin:0 !important; padding:9px 10px !important; background:var(--sq-surface-strong) !important; color:var(--sq-text) !important; }
.settingnav #LiveUsers .browse-live-panel .userlisting > .row { display:grid !important; width:100% !important; margin:0 !important; }
.settingnav #LiveUsers .browse-live-panel .userlisting > .row > [class*="col"] { width:auto !important; max-width:none !important; margin:0 !important; padding:0 !important; }
.settingnav #LiveUsers .browse-live-panel .userlisting > .row:first-child { grid-template-columns:42px minmax(0,1fr); align-items:center; column-gap:10px; }
.settingnav #LiveUsers .browse-live-panel .userlisting > .row:first-child > :first-child { grid-column:1; }
.settingnav #LiveUsers .browse-live-panel .userlisting > .row:first-child > :last-child { grid-column:2; min-width:0; }
.settingnav #LiveUsers .browse-live-panel .userlisting > .row:nth-child(2) { grid-template-columns:minmax(0,1fr) auto; align-items:center; column-gap:10px; margin-top:3px !important; }
.settingnav #LiveUsers .browse-live-panel .browse-icon { display:block; width:40px !important; height:40px !important; max-width:40px !important; margin:0 !important; border-radius:50%; object-fit:cover; }
.settingnav #LiveUsers .browse-live-panel .userlisting h6, .settingnav #LiveUsers .browse-live-panel .userlisting h5, .settingnav #LiveUsers .browse-live-panel .userlisting h6 span, .settingnav #LiveUsers .browse-live-panel .userlisting h5 span { display:block; min-width:0; margin:0 !important; overflow:hidden; color:var(--sq-text) !important; text-overflow:ellipsis; white-space:nowrap; }
.settingnav #LiveUsers .browse-live-panel .userlisting h6 { font-size:14px !important; font-weight:800; line-height:18px; }
.settingnav #LiveUsers .browse-live-panel .userlisting h5 { color:var(--sq-muted) !important; font-size:12px !important; font-weight:600; line-height:17px; }
.settingnav #LiveUsers .browse-live-panel .userlisting h5 span { color:var(--sq-muted) !important; }
.settingnav #LiveUsers .browse-live-panel .iconslist { display:flex; align-items:center; justify-content:flex-end; gap:9px; white-space:nowrap; }
.settingnav #LiveUsers .browse-live-panel .iconslist img { width:16px !important; height:16px !important; margin:0 !important; object-fit:contain; }
.settingnav #LiveUsers .browse-live-panel .iconslist .comment { color:var(--sq-accent) !important; font-size:17px; cursor:pointer; }
@media (max-width: 560px) { .browse-live-menu { grid-template-columns:1fr; } .browse-live-panel { min-height:240px; } }
.modal-header, .modal-footer { border-color:var(--sq-border) !important; }
.modal .form-control, .modal input, .modal select { color:var(--sq-text) !important; background:var(--sq-bg) !important; border-color:var(--sq-border) !important; }
.modal .btn-primary, .modal .join-btn { border:0 !important; background:var(--sq-accent) !important; color:var(--sq-on-accent) !important; border-radius:12px; }
.squealock-next .btn-primary, .squealock-next .btn-success, .squealock-next .btn-info, .squealock-next .btn-default, .squealock-next .join-btn, .squealock-next .add-btn:not(.modal-close), .squealock-next .block-btn, .squealock-next .blockuser-listBtn, .squealock-next .update-profile-button, .squealock-next .userpswd1 { border-color:var(--sq-accent) !important; background:var(--sq-accent) !important; color:var(--sq-on-accent) !important; }
.squealock-next .btn-secondary:not(.dropdown-toggle), .squealock-next .invite-friends-btn { border-color:var(--sq-accent) !important; color:var(--sq-accent) !important; background:color-mix(in srgb,var(--sq-accent) 12%,var(--sq-surface-strong)) !important; }
#chat-lock-search-status { display:block; min-height:18px; margin-top:5px; color:var(--sq-muted); font-size:12px; line-height:18px; }
#chat-lock-search-status.chat-lock-search-error { color:#d93a48; }
.metallic_color, .lightmetallic_color, .nova_light_color, .nova_dark_color { min-height:78px; display:grid !important; place-items:center; cursor:pointer; border:1px solid var(--sq-border); border-radius:16px; transition:transform .2s, box-shadow .2s; }
.metallic_color:hover, .lightmetallic_color:hover, .nova_light_color:hover, .nova_dark_color:hover { transform:translateY(-2px); box-shadow:var(--sq-shadow); }
.metallic_color { background:linear-gradient(135deg,#101010,#878580); color:#fff; }
.lightmetallic_color { background:linear-gradient(135deg,#fff,#c9cbd0); color:#202124; }
.nova_light_color { background:linear-gradient(135deg,#f8f7ff,#6657e8); color:#fff; }
.nova_dark_color { background:linear-gradient(135deg,#080a12,#7c6cff); color:#fff; }
.meeting-phone-view, body:has(.meeting-phone-view) { min-height:100vh; background:radial-gradient(circle at 20% 16%,color-mix(in srgb,var(--sq-accent) 23%,transparent),transparent 35%),var(--sq-bg) !important; color:var(--sq-text) !important; }
.meeting-phone-view .messenger-header { width:min(900px,92vw); margin:50px auto; padding:clamp(28px,6vw,70px); text-align:center; border:1px solid var(--sq-border); border-radius:30px; background:var(--sq-surface); box-shadow:var(--sq-shadow); }
.meeting-phone-view h2, .meeting-phone-view p { color:var(--sq-text) !important; }

/* Responsive: sidebar becomes a readable full-width pane; no clipped composer. */
@media (max-width: 820px) {
    .login-bg .wrapper { padding:18px 14px; }
    .login-bg .wrap-login100, .login-bg .wrap-login101 { padding:30px 22px !important; border-radius:22px !important; }
    .sidebarDetail { width:100% !important; max-width:none; }
    .chat-session { left:0 !important; width:100% !important; }
    .chat-session .navbar .row > div { padding-top:6px; padding-bottom:6px; }
    .conversation-section .container-fluid { padding:14px 10px; }
    .login-bg .mode-picker { gap:28px; }
    .login-bg .mode-orb { width:112px; height:112px; }
    .sidebarDetail:not([style*="display: none"]) + .chat-session { display:none; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior:auto !important; transition-duration:.01ms !important; animation-duration:.01ms !important; }
}