html{color-scheme:light}.topbar{display:grid!important;grid-template-columns:minmax(120px,1fr) auto minmax(120px,1fr);gap:16px}.topbar-quick{display:flex;align-items:center;justify-content:center;gap:9px}.top-chat-link,.wa-indicator{height:40px;display:inline-flex;align-items:center;gap:8px;padding:0 13px;border:1px solid #e5e7ee;border-radius:12px;background:#fff;color:#292231;text-decoration:none;font-size:13px;box-shadow:0 3px 12px rgba(31,20,45,.04)}.top-chat-link:hover,.top-chat-link.active{border-color:#b680ed;background:#f6effd;color:#6c20c8}.wa-indicator{padding:0 12px}.wa-dot{width:10px;height:10px;border-radius:50%;display:inline-block;flex:0 0 10px}.wa-dot.online{background:#19b56f;box-shadow:0 0 0 4px #ddf8ec}.wa-dot.unstable{background:#f5a623;box-shadow:0 0 0 4px #fff0d6}.wa-dot.offline{background:#e04455;box-shadow:0 0 0 4px #fde5e8}.wa-indicator.online{color:#087a49}.wa-indicator.unstable{color:#9a6100}.wa-indicator.offline{color:#b22638}.topbar-user{justify-self:end}.mobile-quick{display:flex;align-items:center;gap:12px}.mobile-quick>a{color:#fff;text-decoration:none;font-size:20px}
body:has(#chatApp){overflow:hidden}body:has(#chatApp) .app-footer{display:none!important}body:has(#chatApp) .content-wrap{height:calc(100vh - var(--topbar-h));padding:10px 14px 12px!important;overflow:hidden}body:has(#chatApp) .attendance-page-head{height:52px;margin-bottom:8px}body:has(#chatApp) .attendance-page-head h1{font-size:20px}body:has(#chatApp) .chat-shell{height:calc(100vh - var(--topbar-h) - 82px);min-height:0;max-height:none}body:has(#chatApp) .chat-list-panel,body:has(#chatApp) .chat-conversation-panel{height:100%;min-height:0;overflow:hidden}body:has(#chatApp) .chat-list{overflow-y:auto;scrollbar-gutter:stable}body:has(#chatApp) .chat-messages{overflow-y:auto;scrollbar-gutter:stable}body:has(#chatApp) .chat-active{height:100%;min-height:0;grid-template-rows:minmax(62px,auto) auto minmax(0,1fr) 66px}body:has(#chatApp) .chat-compose{position:relative;z-index:4;background:#fff;box-shadow:0 -5px 18px rgba(35,20,45,.06)}
.chat-counters{gap:8px!important}.chat-counters span{min-width:0;display:grid!important;grid-template-columns:auto 1fr;align-items:center!important;justify-content:start!important;column-gap:5px;padding:8px!important;white-space:nowrap}.chat-counters b{font-size:16px}.chat-item{min-height:74px}.chat-item-name{font-size:14px!important}.chat-item-preview{max-width:100%}.chat-avatar{background:linear-gradient(145deg,#7924df,#a83ff0)}
@media(max-width:1100px){.topbar{grid-template-columns:1fr auto}.topbar-company{display:none}.topbar-quick{justify-content:start}.wa-indicator strong{display:none}.wa-indicator{width:40px;justify-content:center;padding:0}}
@media(max-width:820px){body:has(#chatApp){overflow:hidden}body:has(#chatApp) .app-main{height:100vh;overflow:hidden;padding-top:58px}body:has(#chatApp) .content-wrap{height:calc(100vh - 58px);padding:7px!important}body:has(#chatApp) .attendance-page-head{height:50px;min-height:50px;margin:0 0 6px}body:has(#chatApp) .attendance-page-head>div:first-child p,body:has(#chatApp) .page-kicker{display:none}body:has(#chatApp) .chat-shell{height:calc(100vh - 121px);border-radius:12px}body:has(#chatApp) .chat-compose{padding-bottom:max(8px,env(safe-area-inset-bottom))}}
@media(max-width:575px){.attendance-head-actions .btn-light{display:none}.attendance-page-head h1{font-size:17px!important}.chat-counters span{font-size:9px}.chat-top{padding:7px}.chat-actions{overflow-x:auto}.chat-actions .btn{flex:0 0 auto}.chat-contact{max-width:44%}.chat-compose{grid-template-columns:38px minmax(0,1fr) 62px!important}}
body:has(#chatApp) .attendance-page-head{overflow:hidden;min-height:48px!important;height:48px!important;align-items:center!important}body:has(#chatApp) .attendance-page-head .page-kicker,body:has(#chatApp) .attendance-page-head p{display:none!important}body:has(#chatApp) .attendance-page-head h1{margin:0!important;white-space:nowrap}body:has(#chatApp) .attendance-head-actions{margin-left:auto;flex-wrap:nowrap!important;overflow:visible!important}body:has(#chatApp) .presence-pill{min-width:138px}.contact-name-row{display:flex;align-items:center;gap:6px}#contactName{cursor:pointer;border-bottom:1px dashed transparent}#contactName:hover{border-bottom-color:#a76bea}.chat-list,.chat-messages{scrollbar-width:thin;scrollbar-color:#9d91a5 transparent}.chat-item{overflow:hidden}.chat-item-main,.chat-item-meta{min-width:0}.chat-compose input[type=file]{max-width:100%}