/* SocialPress V4.10.31 — uploaded-reference Messenger drawer + docked chat */

.sp-chat-drawer[hidden]{display:none!important}
.sp-chat-drawer{
  position:fixed;
  z-index:2147480800;
  width:min(368px,calc(100vw - 20px));
  max-height:calc(100dvh - 76px);
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border:1px solid #d8dde5;
  border-radius:12px;
  background:#fff;
  color:#050505;
  box-shadow:0 8px 32px rgba(15,23,42,.24);
}
.sp-chat-drawer-head{
  min-height:54px;
  padding:10px 12px 4px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.sp-chat-drawer-head h2{margin:0;font-size:24px;line-height:1.15;font-weight:800;letter-spacing:-.02em}
.sp-chat-drawer-head>div{display:flex;align-items:center;gap:4px}
.sp-chat-drawer-head button,.sp-chat-drawer-head a{
  width:32px;height:32px;display:grid;place-items:center;border:0;border-radius:50%;
  background:transparent;color:#4b5563;font-size:17px;font-weight:800;cursor:pointer;text-decoration:none;
}
.sp-chat-drawer-head button:hover,.sp-chat-drawer-head a:hover{background:#f0f2f5;color:#050505}
.sp-chat-drawer-search{
  height:38px;margin:4px 12px 8px;padding:0 11px;display:flex;align-items:center;gap:7px;
  border-radius:20px;background:#f0f2f5;color:#65676b;
}
.sp-chat-drawer-search .sp-icon,.sp-chat-drawer-search svg{width:17px;height:17px;flex:0 0 17px}
.sp-chat-drawer-search input{width:100%;min-width:0;border:0!important;outline:0!important;box-shadow:none!important;background:transparent!important;color:#050505!important;-webkit-text-fill-color:#050505!important;font:13px/1.2 inherit}
.sp-chat-drawer-tabs{display:flex;align-items:center;gap:5px;padding:0 12px 8px;overflow-x:auto}
.sp-chat-drawer-tabs button{min-height:34px;padding:0 12px;border:0;border-radius:17px;background:transparent;color:#4b5563;font-size:12px;font-weight:750;cursor:pointer;white-space:nowrap}
.sp-chat-drawer-tabs button:hover{background:#f0f2f5}
.sp-chat-drawer-tabs button.is-active{background:#e7f3ff;color:#0866ff}
.sp-chat-drawer-list{flex:1;min-height:120px;overflow-y:auto;overscroll-behavior:contain;padding:2px 6px 6px;scrollbar-width:thin;scrollbar-color:#c8ced7 transparent}
.sp-chat-drawer-list::-webkit-scrollbar{width:8px}.sp-chat-drawer-list::-webkit-scrollbar-track{background:transparent}.sp-chat-drawer-list::-webkit-scrollbar-thumb{background:#c8ced7;border-radius:999px}
.sp-chat-drawer-row{width:100%;min-height:64px;padding:7px 8px;display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:9px;align-items:center;border:0;border-radius:9px;background:transparent;text-align:left;cursor:pointer;color:inherit}
.sp-chat-drawer-row:hover{background:#f0f2f5}
.sp-chat-drawer-row.has-unread{background:#f5f9ff}
.sp-chat-drawer-row.is-disabled{opacity:.48;cursor:not-allowed}
.sp-chat-drawer-avatar{position:relative;width:48px;height:48px;display:block}
.sp-chat-drawer-avatar img{display:block;width:48px;height:48px;border-radius:50%;object-fit:cover;background:#e4e6eb}
.sp-chat-drawer-avatar i{position:absolute;right:1px;bottom:1px;width:11px;height:11px;border:2px solid #fff;border-radius:50%;background:#31a24c}
.sp-chat-drawer-copy{min-width:0;display:block}
.sp-chat-drawer-copy strong,.sp-chat-drawer-copy small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sp-chat-drawer-copy strong{font-size:13px;font-weight:750;color:#050505}
.sp-chat-drawer-copy small{margin-top:3px;font-size:10px;color:#65676b}
.sp-chat-drawer-row.has-unread .sp-chat-drawer-copy strong,.sp-chat-drawer-row.has-unread .sp-chat-drawer-copy small{font-weight:750;color:#050505}
.sp-chat-drawer-unread{min-width:19px;height:19px;padding:0 4px;display:grid;place-items:center;border-radius:999px;background:#0866ff;color:#fff;font-size:9px;font-weight:800}
.sp-chat-drawer-empty,.sp-chat-drawer-loading{padding:34px 16px;text-align:center;color:#65676b;font-size:12px}
.sp-chat-drawer-footer{flex:0 0 40px;display:flex;align-items:center;justify-content:center;border-top:1px solid #e4e6eb;background:#fff;color:#0866ff;font-size:12px;font-weight:750;text-decoration:none}
.sp-chat-drawer-footer:hover{background:#f7f8fa}

/* Restore and redesign desktop docked chat after V4.10.29/30 disabled it. */
@media(min-width:800px){
  body .sp-quick-chat{
    position:fixed!important;
    z-index:2147480900!important;
    right:18px!important;
    bottom:0!important;
    width:360px!important;
    height:min(520px,calc(100dvh - 86px))!important;
    min-height:330px!important;
    display:grid!important;
    grid-template-rows:54px minmax(0,1fr) auto!important;
    visibility:visible!important;
    pointer-events:auto!important;
    overflow:hidden!important;
    border:1px solid #d8dde5!important;
    border-bottom:0!important;
    border-radius:12px 12px 0 0!important;
    background:#fff!important;
    color:#050505!important;
    box-shadow:0 4px 26px rgba(15,23,42,.24)!important;
  }
  body .sp-quick-chat.is-collapsed{height:54px!important;min-height:54px!important;grid-template-rows:54px!important}
  body .sp-quick-chat.is-collapsed>.sp-chat-scroll,
  body .sp-quick-chat.is-collapsed>.sp-chat-composer{display:none!important}
}
.sp-quick-chat>header{padding:6px 8px 6px 10px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px!important;border-bottom:1px solid #e4e6eb!important;background:#fff!important;box-shadow:0 1px 2px rgba(0,0,0,.04)!important}
.sp-quick-chat>header>a{min-width:0;display:flex!important;align-items:center!important;gap:8px!important;color:inherit!important;text-decoration:none!important}
.sp-quick-chat>header [data-chat-head-avatar]{position:relative;width:36px!important;height:36px!important;flex:0 0 36px!important}
.sp-quick-chat>header [data-chat-head-avatar] img{display:block;width:36px!important;height:36px!important;border-radius:50%!important;object-fit:cover!important}
.sp-quick-chat>header [data-chat-head-avatar] i{position:absolute;right:0;bottom:0;width:9px;height:9px;border:2px solid #fff;border-radius:50%;background:#31a24c}
.sp-quick-chat-person-copy{min-width:0;display:block}
.sp-quick-chat>header strong,.sp-quick-chat>header small{display:block;max-width:145px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sp-quick-chat>header strong{font-size:12px!important;font-weight:750!important;color:#050505!important}
.sp-quick-chat>header small{margin-top:1px;font-size:9px!important;color:#65676b!important}
.sp-quick-chat-actions{display:flex!important;align-items:center!important;gap:1px!important}
.sp-quick-chat-actions button{width:30px!important;height:30px!important;display:grid!important;place-items:center!important;padding:0!important;border:0!important;border-radius:50%!important;background:transparent!important;color:#8a00ff!important;font-size:19px!important;line-height:1!important;cursor:pointer!important}
.sp-quick-chat-actions button:hover{background:#f0f2f5!important}
.sp-quick-chat-actions button .sp-icon,.sp-quick-chat-actions button svg{width:18px!important;height:18px!important}
.sp-quick-chat .sp-chat-scroll{min-height:0!important;overflow-y:auto!important;padding:8px 10px 12px!important;background:#fff!important;scroll-behavior:smooth!important;overscroll-behavior:contain!important}
.sp-quick-chat .sp-chat-profile-intro{padding:18px 8px 22px!important}
.sp-quick-chat .sp-chat-profile-intro img{width:68px!important;height:68px!important}
.sp-quick-chat .sp-chat-profile-intro strong{font-size:14px!important}
.sp-quick-chat .sp-chat-profile-intro span{font-size:10px!important}
.sp-quick-chat .sp-chat-profile-view{font-size:10px!important}
.sp-quick-chat .sp-chat-message{max-width:84%!important}
.sp-quick-chat .sp-chat-bubble{font-size:12px!important;padding:7px 10px!important}
.sp-quick-chat .sp-chat-image{max-width:235px!important}
.sp-quick-chat .sp-chat-message-meta{font-size:8px!important}
.sp-quick-chat .sp-chat-composer{padding:7px 7px 8px!important;display:flex!important;align-items:flex-end!important;gap:4px!important;border-top:1px solid #f0f2f5!important;background:#fff!important}
.sp-quick-chat .sp-chat-photo,.sp-quick-chat .sp-chat-emoji,.sp-quick-chat .sp-chat-like,.sp-quick-chat .sp-chat-send{width:32px!important;height:32px!important;flex:0 0 32px!important;display:grid!important;place-items:center!important;padding:0!important;border:0!important;border-radius:50%!important;background:transparent!important;color:#0866ff!important;cursor:pointer!important;font-size:18px!important;line-height:1!important}
.sp-quick-chat .sp-chat-photo:hover,.sp-quick-chat .sp-chat-emoji:hover,.sp-quick-chat .sp-chat-like:hover,.sp-quick-chat .sp-chat-send:hover{background:#edf4ff!important}
.sp-quick-chat .sp-chat-photo .sp-icon,.sp-quick-chat .sp-chat-send .sp-icon{width:18px!important;height:18px!important}
.sp-quick-chat .sp-chat-send[hidden],.sp-quick-chat .sp-chat-like[hidden]{display:none!important}
.sp-quick-chat .sp-chat-input-wrap{min-width:0!important;flex:1!important;padding:7px 10px!important;border-radius:18px!important;background:#f0f2f5!important}
.sp-quick-chat .sp-chat-input-wrap textarea{width:100%!important;max-height:96px!important;padding:0!important;border:0!important;outline:0!important;box-shadow:none!important;resize:none!important;background:transparent!important;color:#050505!important;-webkit-text-fill-color:#050505!important;font:12px/1.35 inherit!important}
.sp-quick-chat .sp-chat-file-preview{font-size:9px!important}

/* Dark appearance */
html.sp-theme-dark-root body.sp-theme-dark .sp-chat-drawer,
body.sp-theme-dark .sp-chat-drawer{background:#242526!important;color:#e4e6eb!important;border-color:#3e4042!important;box-shadow:0 10px 38px rgba(0,0,0,.5)!important}
body.sp-theme-dark .sp-chat-drawer-head h2,body.sp-theme-dark .sp-chat-drawer-copy strong{color:#e4e6eb!important}
body.sp-theme-dark .sp-chat-drawer-head button,body.sp-theme-dark .sp-chat-drawer-head a{color:#e4e6eb!important}
body.sp-theme-dark .sp-chat-drawer-head button:hover,body.sp-theme-dark .sp-chat-drawer-head a:hover,body.sp-theme-dark .sp-chat-drawer-row:hover{background:#3a3b3c!important}
body.sp-theme-dark .sp-chat-drawer-search{background:#3a3b3c!important;color:#b0b3b8!important}
body.sp-theme-dark .sp-chat-drawer-search input{color:#e4e6eb!important;-webkit-text-fill-color:#e4e6eb!important}
body.sp-theme-dark .sp-chat-drawer-tabs button{color:#b0b3b8!important}
body.sp-theme-dark .sp-chat-drawer-tabs button.is-active{background:#26384f!important;color:#2d88ff!important}
body.sp-theme-dark .sp-chat-drawer-copy small{color:#b0b3b8!important}
body.sp-theme-dark .sp-chat-drawer-row.has-unread{background:#26384f!important}
body.sp-theme-dark .sp-chat-drawer-row.has-unread .sp-chat-drawer-copy strong,body.sp-theme-dark .sp-chat-drawer-row.has-unread .sp-chat-drawer-copy small{color:#e4e6eb!important}
body.sp-theme-dark .sp-chat-drawer-avatar i{border-color:#242526!important}
body.sp-theme-dark .sp-chat-drawer-footer{background:#242526!important;border-color:#3e4042!important;color:#2d88ff!important}
body.sp-theme-dark .sp-chat-drawer-footer:hover{background:#3a3b3c!important}
@media(min-width:800px){
  body.sp-theme-dark .sp-quick-chat{background:#242526!important;color:#e4e6eb!important;border-color:#3e4042!important;box-shadow:0 6px 30px rgba(0,0,0,.52)!important}
}
body.sp-theme-dark .sp-quick-chat>header{background:#242526!important;border-color:#3e4042!important}
body.sp-theme-dark .sp-quick-chat>header strong{color:#e4e6eb!important}
body.sp-theme-dark .sp-quick-chat>header small{color:#b0b3b8!important}
body.sp-theme-dark .sp-quick-chat>header [data-chat-head-avatar] i{border-color:#242526!important}
body.sp-theme-dark .sp-quick-chat-actions button{color:#b388ff!important}
body.sp-theme-dark .sp-quick-chat-actions button:hover{background:#3a3b3c!important}
body.sp-theme-dark .sp-quick-chat .sp-chat-scroll{background:#242526!important}
body.sp-theme-dark .sp-quick-chat .sp-chat-composer{background:#242526!important;border-color:#3e4042!important}
body.sp-theme-dark .sp-quick-chat .sp-chat-input-wrap{background:#3a3b3c!important}
body.sp-theme-dark .sp-quick-chat .sp-chat-input-wrap textarea{color:#e4e6eb!important;-webkit-text-fill-color:#e4e6eb!important}
body.sp-theme-dark .sp-quick-chat .sp-chat-photo,body.sp-theme-dark .sp-quick-chat .sp-chat-emoji,body.sp-theme-dark .sp-quick-chat .sp-chat-like,body.sp-theme-dark .sp-quick-chat .sp-chat-send{color:#2d88ff!important}
body.sp-theme-dark .sp-quick-chat .sp-chat-photo:hover,body.sp-theme-dark .sp-quick-chat .sp-chat-emoji:hover,body.sp-theme-dark .sp-quick-chat .sp-chat-like:hover,body.sp-theme-dark .sp-quick-chat .sp-chat-send:hover{background:#3a3b3c!important}

@media(max-width:799px){
  .sp-chat-drawer{display:none!important}
  body .sp-quick-chat{display:none!important;visibility:hidden!important;pointer-events:none!important}
}
