/* Focus belongs around the complete input group, including the emoji control. */
.sf-chat .chat-form:focus-within{outline:3px solid var(--sf-accent);outline-offset:2px}
.sf-chat .chat-form textarea:focus,.sf-chat .chat-form textarea:focus-visible{outline:none!important;box-shadow:none!important;border-color:transparent!important}
.sf-chat .chat-form textarea{flex:1 1 0%;width:0;min-width:0;padding-inline-end:42px!important}
.sf-chat .chat-form> :not(textarea){flex-shrink:0}
.sf-chat-brand{display:flex;flex:0 0 auto;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px;color:var(--sf-muted)}
.sf-chat-brand img{display:block;width:156px;height:auto;max-width:100%}
.sf-chat-mobile>.sf-chat-brand{margin:0;padding:8px 18px;border-bottom:1px solid var(--sf-line);background:var(--sf-panel)}
#sf-chat-sync-status{font-size:12px;line-height:1.4}
.sf-chat .chat-form>div{z-index:2}
/* Native self-appended emoji picker: align to its trigger, inside the chat column. */
.sf-chat .chat-form .dropdown-menu-box:has(>.emoji-picker-box){
  left:auto!important;right:0!important;top:auto!important;bottom:calc(100% + 8px)!important;
  width:var(--sf-emoji-width,280px)!important;max-width:var(--sf-emoji-width,280px)!important;
  max-height:var(--sf-emoji-height,280px)!important;padding:0!important;box-sizing:border-box;
  overflow:hidden;border-radius:12px;background:var(--sf-panel)!important;border:1px solid var(--sf-line)!important;z-index:50;
}
.sf-chat .chat-form .emoji-picker-box{
  width:100%!important;height:auto!important;max-height:calc(var(--sf-emoji-height,280px) - 2px)!important;
  min-width:0;overflow-y:auto!important;overflow-x:hidden;box-sizing:border-box;padding:10px!important;
  overscroll-behavior:contain;color:var(--sf-ink);scrollbar-gutter:stable;
}
.sf-chat .emoji-picker-box button{min-height:36px;border-radius:6px}
.sf-chat .emoji-picker-box button:hover{background:var(--sf-soft)}
