.channels-page{max-width:1500px;margin:auto}.channels-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:22px}.channels-heading h1{margin:7px 0;font-size:32px}.channels-heading p{margin:0}.channel-toolbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.channels-layout{display:grid;grid-template-columns:300px minmax(0,1fr);height:min(760px,calc(100dvh - 240px));min-height:420px;border:1px solid #dedfd7;border-radius:18px;background:#fff;overflow:hidden}.channel-list{display:flex;flex-direction:column;min-height:0;border-right:1px solid #e6e7df;background:#fcfcf9}.channel-filters{padding:18px;border-bottom:1px solid #e6e7df}.channel-filters select{width:100%;border:1px solid #d9ded6;border-radius:10px;padding:10px;background:white;font:inherit}.channel-list-items{overflow:auto;min-height:0;flex:1}.channel-list-item{width:100%;display:flex;flex-direction:column;align-items:flex-start;text-align:left;gap:8px;padding:18px;border:0;border-bottom:1px solid #e9eae4;background:transparent;color:#292d29;cursor:pointer}.channel-list-item:hover,.channel-list-item.selected{background:#eaf3ed}.channel-list-item.selected{box-shadow:inset 3px 0 #00644f}.channel-list-item strong{font-size:16px}.channel-list-item>span:not(.channel-badge),.channel-list-item small{color:#798279;font-size:12px;overflow-wrap:anywhere}.channel-list-line{display:flex;align-items:center;justify-content:space-between;width:100%}.channel-badge{display:inline-flex;border-radius:6px;padding:4px 7px;font-size:10px;letter-spacing:.025em;font-weight:600;background:#ecefea;color:#49574c}.channel-badge.instagram{background:#f7edf1;color:#945474}.channel-badge.threads,.channel-badge.threads_direct{background:#e9edeb;color:#404d44}.channel-badge.telegram{background:#edf3f7;color:#3c6b86}.channel-dot{width:7px;height:7px;border-radius:50%;background:#bc8954}.channel-empty-list{color:#7a847c;padding:24px;line-height:1.6}.channel-conversation{display:flex;flex-direction:column;min-width:0;min-height:0}.channel-welcome{margin:auto;padding:32px;text-align:center;max-width:500px}.channel-welcome-icon{display:inline-flex;align-items:center;justify-content:center;width:76px;height:76px;border-radius:24px;background:#edf3ec;color:#05614d;margin-bottom:12px}.channel-welcome h2{font-size:22px;margin:12px 0}.channel-welcome p{color:#7a817b;line-height:1.7}.channel-chat-header{display:flex;align-items:center;gap:12px;padding:16px 20px;border-bottom:1px solid #e4e6df;flex-shrink:0}.channel-chat-header>div{flex:1;min-width:0}.channel-chat-header strong,.channel-chat-header small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.channel-chat-header strong{font-size:16px}.channel-chat-header small{font-size:11px;margin-top:4px;color:#7a837c}.channel-chat-header .icon-btn{flex-shrink:0}.channel-back{display:none!important}.channel-context{display:flex;justify-content:space-between;align-items:center;gap:8px;background:#f7f8f3;padding:8px 20px;font-size:12px;flex-shrink:0;flex-wrap:wrap}.channel-context .text-btn{font-size:12px}.channel-messages{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:24px;display:flex;flex-direction:column;gap:20px;background:#fdfdfa}.social-message{max-width:82%;align-self:flex-start;min-width:0}.social-message.out{align-self:flex-end}.social-message.system{align-self:center;color:#85897e}.social-bubble{padding:14px 17px;border:1px solid #e1e4dc;border-radius:16px 16px 16px 4px;background:white;overflow-wrap:anywhere}.social-message.out .social-bubble{background:#e9f2e9;border-color:#dce8db;border-radius:16px 16px 4px 16px}.social-bubble p{white-space:pre-wrap;margin:0;line-height:1.6;font-size:14px}.social-message>small{display:block;color:#7d867f;margin:7px 3px;font-size:10px}.social-message.out>small{text-align:right}.social-attachment{display:flex;flex-direction:column;gap:8px;margin-top:10px}.social-attachment img,.social-attachment video{max-height:340px;max-width:100%;border-radius:10px}.social-attachment audio{max-width:100%;width:280px}.social-attachment a{font-size:12px;color:#00624e}.social-file-missing{font-size:12px!important;color:#877047}.social-change{font-size:11px;color:#797b70;background:#f4f2e9;padding:8px 10px;border-radius:8px;margin-top:8px}.social-change summary{cursor:pointer}.social-change p{white-space:pre-wrap}.channel-compose-wrap{padding:10px 18px 16px;border-top:1px solid #e5e6df;background:white;flex-shrink:0}.channel-rule{font-size:10px;color:#7a817c;line-height:1.5;margin:0 0 8px}.channel-compose{display:flex;gap:10px;align-items:flex-end}.channel-compose textarea{flex:1;min-width:0;border:1px solid #dce1d8;border-radius:12px;background:#fafbf7;padding:12px;font-size:16px;resize:none;max-height:100px;min-height:46px}.channel-compose .primary{height:46px;min-width:46px;padding:10px}.channel-error{padding:10px 14px;border-radius:10px;background:#fff5e9;color:#865e34;font-size:13px;line-height:1.5}.channel-no-send{font-size:12px;color:#7b857c}.channel-older{align-self:center}.channel-settings{margin-top:24px}.channel-apps{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:24px}.channel-apps article{padding:22px;border:1px solid #e0e4db;border-radius:16px;background:#fcfcfa;min-width:0}.channel-apps h3{margin:0 0 15px}.channel-apps form{display:grid;gap:12px;margin-bottom:14px}.channel-apps .field{margin:0}.channel-apps input{width:100%;min-width:0}.channel-apps details{margin-top:20px;font-size:12px}.channel-apps details label{display:block;margin-top:14px;color:#748078}.channel-apps details input{font:12px ui-monospace,monospace;margin-top:4px;padding:10px}.channel-apps summary{cursor:pointer;color:#00654f}.channel-apps .meta{font-size:11px;overflow-wrap:anywhere}.channel-apps .tag{font-size:10px}.channel-account{display:flex;flex-direction:column;gap:6px;padding:12px;margin-top:15px;border-radius:10px;background:#eaf2e8;font-size:13px}.channel-account small{color:#73816f}.channel-browser{padding-top:24px;margin-top:24px;border-top:1px solid #e0e4db}.channel-browser h3{margin:0}.channel-loading{padding:40px}.channel-list-item:focus-visible,.channel-compose textarea:focus-visible{outline:3px solid #a5cdbc;outline-offset:-3px}
@media(max-width:900px){.channels-layout{grid-template-columns:240px 1fr}.channel-apps{grid-template-columns:1fr}.channels-heading{align-items:flex-start}.channels-heading h1{font-size:26px}.channels-heading .eyebrow{font-size:9px}.channel-toolbar{gap:6px}.channel-toolbar button{font-size:12px}}
@media(max-width:640px){.channels-heading{padding:0 0 10px;margin:0}.channels-heading p,.channels-heading .eyebrow{display:none}.channels-heading h1{font-size:24px}.channels-layout{display:block;height:calc(var(--crm-vh,100dvh) - 200px);min-height:300px;border-radius:14px}.channel-list{height:100%;border:0}.channel-conversation{display:none}.channels-page.has-selection .channel-list{display:none}.channels-page.has-selection .channel-conversation{display:flex;height:100%}.social-chat-mobile #app .sidebar,.social-chat-mobile #app .topbar,.social-chat-mobile .channels-heading,.social-chat-mobile .mobile-chat-top,.social-chat-mobile .workspace-helpbar,.social-chat-mobile .team-topbar{display:none!important}.social-chat-mobile #app main{position:fixed;inset:auto;left:0;right:0;top:var(--crm-vtop,0px);height:var(--crm-vh,100dvh);padding:0!important;margin:0!important;z-index:55;background:white;overflow:hidden}.social-chat-mobile .channels-page,.social-chat-mobile .channels-layout{height:100%;min-height:0;margin:0;border:0;border-radius:0}.channel-back{display:inline-flex!important}.channel-chat-header{padding:10px 12px;gap:8px;min-height:56px}.channel-chat-header strong{font-size:16px}.channel-context{padding:6px 12px}.channel-context>span{font-size:11px}.channel-messages{padding:14px;gap:14px}.social-message{max-width:90%}.social-bubble{padding:12px}.social-bubble p{font-size:15px}.channel-compose-wrap{padding:8px 10px max(10px,env(safe-area-inset-bottom))}.channel-rule{font-size:9px;margin-bottom:5px}.channel-apps article{padding:16px}.channel-settings{padding:18px!important}}

.channels-page .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
