body[data-mode=agent] .workspace{grid-template-columns:94px 330px minmax(0,1fr)}body[data-mode=agent] .rail{background:#17283d;color:#b6c5d5;border:0;padding:25px 10px}body[data-mode=agent] .rail-item{color:#b6c5d5}body[data-mode=agent] .rail-item.active{background:#2c465f;color:#fff}.channels-entry{color:#bfd1df;text-decoration:none;font-size:12px;text-align:center;padding:12px 3px;line-height:1.6}.channel-filter{padding:0 20px 14px}.channel-filter select{width:100%;font-size:12px;padding:9px;background:#f8fafb;border-color:#e4ebef}.reception-overview{display:flex;margin:0 20px 17px;gap:8px}.reception-overview>div{flex:1;background:#f3f7f9;border-radius:8px;padding:12px}.reception-overview span{display:block;font-size:10px;color:#8a9aa9}.reception-overview strong{display:block;font-size:22px;font-weight:500;color:#365769;margin-top:7px}body[data-mode=agent] .tabs{gap:13px;padding:0 20px}.channel-tag{display:inline-block;font-size:10px;color:#8da2b2;background:#f2f6fa;border-radius:4px;padding:3px 6px;margin-top:8px}.customer-sidebar{grid-column:2;grid-row:1/5;border-left:1px solid #e4ebef;background:#fff;padding:24px 18px;overflow:auto;width:245px}.customer-sidebar h3{font-size:14px;margin:0 0 25px}.customer-sidebar p{font-size:12px;color:#718495;line-height:1.9;margin:12px 0;overflow-wrap:anywhere}.customer-sidebar .detail-field{border-top:1px solid #edf1f5;margin-top:20px;padding-top:15px}.detail-field span{font-size:11px;color:#9cabb8}.detail-field p{color:#324b5e;white-space:pre-wrap}body[data-mode=agent] .active-chat{display:grid;grid-template-columns:minmax(0,1fr) 245px;grid-template-rows:auto minmax(0,1fr) auto auto}body[data-mode=agent] .active-chat>.chat-head,body[data-mode=agent] .active-chat>.messages,body[data-mode=agent] .active-chat>.quick-replies,body[data-mode=agent] .active-chat>.composer{grid-column:1}body[data-mode=agent] .conversation-panel{background:#f5f8fa}body[data-mode=agent] .chat-head{padding:20px;gap:10px}body[data-mode=agent] .messages{padding:25px}.visitor-menu{display:flex;gap:15px;padding:12px 20px;background:#fff;justify-content:center;border-top:1px solid #e7efea;flex-wrap:wrap}.visitor-menu a{font-size:12px;text-decoration:none}.visitor-profile{background:white;margin:10px 16px;padding:18px;border:1px solid #e2ebe6;border-radius:12px;overflow:auto;flex-shrink:0;max-height:55dvh}.visitor-profile h3{font-size:14px;margin:0}.visitor-profile input{width:100%}.visitor-profile label{font-size:12px;margin-top:13px}.visitor-profile .primary{margin-top:15px;width:100%}body[data-mode=visitor] .mine .bubble,body[data-mode=visitor] .service-avatar{background:var(--green);border-color:var(--green)}body[data-mode=visitor] .visitor-shell{border-top:4px solid var(--green)}@media(max-width:1220px){.customer-sidebar{display:none}body[data-mode=agent] .active-chat{grid-template-columns:minmax(0,1fr)}}@media(max-width:950px){body[data-mode=agent] .workspace{grid-template-columns:75px 290px minmax(0,1fr)}}@media(max-width:680px){body[data-mode=agent] .workspace{grid-template-columns:minmax(0,1fr)}body[data-mode=agent] .active-chat{grid-template-rows:auto minmax(0,1fr) auto auto}body[data-mode=agent] .chat-head{padding:14px 10px}.channel-filter{padding:0 20px 12px}.reception-overview{margin-bottom:15px}.channel-tag{font-size:10px}.visitor-profile input{font-size:16px}.visitor-shell{border-top:0!important}body[data-mode=agent] .inbox{min-width:0}.inbox-head h1{font-size:22px}.inbox-head:after{display:none}.inbox-foot{flex-wrap:wrap}.reception-overview>div{padding:9px}.reception-overview strong{font-size:20px}}
.customer-details-toggle{display:none}@media(max-width:1220px){body[data-mode=agent] .customer-details-toggle{display:inline-block}body[data-mode=agent] .customer-sidebar.expanded{display:block;position:fixed;right:0;top:86px;bottom:0;z-index:10;width:280px;box-shadow:-6px 0 25px #17283d22}body[data-mode=agent] .customer-sidebar.expanded .customer-details-toggle{float:right}}
