/* Socials communication route (Meta inbox): Messenger, Instagram, WhatsApp, comments */

#socials-chat-root {
  --soc-messenger: #1877f2;
  --soc-instagram: #d62976;
  --soc-whatsapp: #25d366;
  --soc-card: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.018));
  --soc-card-2: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
  --soc-line: rgba(255,255,255,.07);
  --soc-shadow: 0 12px 32px rgba(0,0,0,.16);
  min-height: 100%;
}

#socials-chat-root .socials-chat-layout {
  display: grid;
  gap: 5px;
  min-height: calc(100vh - 195px);
}

#socials-chat-root .panel {
  min-height: 0;
  display: flex;
  flex-direction: column;
}

#socials-chat-root .panel.left-panel,
#socials-chat-root .panel.main-panel,
#socials-chat-root .panel.right-panel {
  overflow: auto;
  padding: 8px;
}

#socials-chat-root .panel-header {
  align-items: flex-start;
  gap: 2px;
}

#socials-chat-root .panel-header h2,
#socials-chat-root .chat-header .title h2,
#socials-chat-root .card-title,
#socials-chat-root h3 {
  margin: 0;
  width: auto;
}

#socials-chat-root .social-header-copy {
  display: flex;
  justify-content: space-between;
  gap: 4px;
  min-width: 0;
}

#socials-chat-root .social-header-note,
#socials-chat-root .social-msg-note,
#socials-chat-root .social-context-caption,
#socials-chat-root .social-context-body {
  font-size: 12px;
  line-height: 1.5;
  color: var(--text-muted);
}

#socials-chat-root .social-toolbar {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

#socials-chat-root .social-toolbar .toolbar-label {
  margin-bottom: 6px;
  font-size: 11px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--text-muted);
}

#socials-chat-root .social-toolbar .toolbar-row {
  display: flex;
  gap: 8px;
  align-items: center;
}

#socials-chat-root .social-toolbar .toolbar-row > * {
  min-width: 0;
}

#socials-chat-root .social-toolbar .input,
#socials-chat-root .social-search-row .input,
#socials-chat-root .social-modal-form .input,
#socials-chat-root .social-modal-form select,
#socials-chat-root .social-modal-form textarea,
#socials-chat-root .social-assign-form .input,
#socials-chat-root .social-assign-form select,
#socials-chat-root .social-assign-form textarea {
  width: 100%;
  height: auto;
}

#socials-chat-root .social-toolbar select,
#socials-chat-root .social-modal-form select,
#socials-chat-root .social-assign-form select {
  appearance: none;
}

#socials-chat-root .social-toolbar .bits-ss,
#socials-chat-root .social-toolbar .bits-ss-btn,
#socials-chat-root .social-modal-form .bits-ss,
#socials-chat-root .social-modal-form .bits-ss-btn,
#socials-chat-root .social-assign-form .bits-ss,
#socials-chat-root .social-assign-form .bits-ss-btn {
  width: 100%;
}

#socials-chat-root .social-toolbar .bits-ss-btn,
#socials-chat-root .social-modal-form .bits-ss-btn,
#socials-chat-root .social-assign-form .bits-ss-btn {
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 10px 30px rgba(0,0,0,.12);
  padding: 4px 8px;
}

#socials-chat-root .social-toolbar .bits-ss-btn:hover,
#socials-chat-root .social-modal-form .bits-ss-btn:hover,
#socials-chat-root .social-assign-form .bits-ss-btn:hover {
  border-color: color-mix(in srgb, var(--primary) 40%, transparent);
}

#socials-chat-root .social-search-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
}

#socials-chat-root #socialUnreadOnlyBtn[data-active="1"] {
  background: color-mix(in srgb, var(--primary) 16%, transparent);
  border-color: color-mix(in srgb, var(--primary) 45%, transparent);
  color: var(--text);
}

#socials-chat-root .social-type-chips,
#socials-chat-root .social-labels,
#socials-chat-root .social-channel-list,
#socials-chat-root .social-automation-cards,
#socials-chat-root .social-rule-tags,
#socials-chat-root .social-side-card .row-wrap,
#socials-chat-root .social-quick-row,
#socials-chat-root .social-composer-modebar,
#socials-chat-root .thread-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 2px;
}

#socials-chat-root .social-type-chips {
  margin-top: 2px;
}

#socials-chat-root .social-type-chips .chip,
#socials-chat-root .social-quick-row .chip,
#socials-chat-root .social-composer-modebar .chip,
#socials-chat-root .social-filter-pill,
#socials-chat-root .social-label,
#socials-chat-root .social-source-badge,
#socials-chat-root .social-status-pill,
#socials-chat-root .social-status-tag,
#socials-chat-root .social-count-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-height: 25px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.09);
  background: color-mix(in srgb, var(--surface) 88%, transparent);
  color: var(--text);
  padding: 5px 8px;
  font-size: 11px;
  line-height: 1;
  white-space: nowrap;
  margin: 0;
}

#socials-chat-root .social-type-chips .chip,
#socials-chat-root .social-quick-row .chip,
#socials-chat-root .social-composer-modebar .chip {
  padding: 5px 6px;
  cursor: pointer;
  transition: transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease;
  background: var(--bg);
}

#socials-chat-root .social-type-chips .chip:hover,
#socials-chat-root .social-quick-row .chip:hover,
#socials-chat-root .social-composer-modebar .chip:hover {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--primary) 36%, transparent);
}

#socials-chat-root .social-type-chips .chip.active,
#socials-chat-root .social-composer-modebar .chip.active {
  background: color-mix(in srgb, var(--primary) 16%, transparent);
  border-color: color-mix(in srgb, var(--primary) 55%, transparent);
  box-shadow: 0 10px 22px rgba(0,0,0,.12);
}

#socials-chat-root .social-composer-modebar .chip[disabled] {
  opacity: .45;
  cursor: not-allowed;
}

#socials-chat-root .social-count-strip {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: 2px;
}

#socials-chat-root .social-count-card {
  display: flex;
  border: var(--line);
  border-radius: 16px;
  padding: 4px 6px;
  background: var(--soc-card);
  align-items: center;
  justify-content: space-between;
}

#socials-chat-root .social-count-card .k {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--text-muted);
}

#socials-chat-root .social-count-card .v {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: -.02em;
}

#socials-chat-root .social-thread-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 10px 0;
  min-height: 0;
  overflow: auto;
  padding-right: 4px;
  scrollbar-width: none;
}

#socials-chat-root .social-empty {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 20px;
  border-radius: 18px;
  border: 1px dashed color-mix(in srgb, var(--primary) 22%, rgba(255,255,255,.1));
  background: rgba(255,255,255,.018);
}

#socials-chat-root .social-thread-item {
  position: relative;
  border: 1px solid rgba(255,255,255,.06);
  background: var(--soc-card);
  border-radius: 18px;
  padding: 10px 4px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
  cursor: pointer;
  transition: transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease;
  color: inherit;
  text-align: left;
}

#socials-chat-root .social-thread-item:hover {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--primary) 32%, transparent);
  box-shadow: 0 12px 24px rgba(0,0,0,.12);
}

#socials-chat-root .social-thread-item.active {
  background: linear-gradient(180deg, color-mix(in srgb, var(--primary) 14%, transparent), rgba(255,255,255,.02));
  border-color: color-mix(in srgb, var(--primary) 55%, transparent);
  box-shadow: 0 18px 32px rgba(0,0,0,.16);
}

#socials-chat-root .social-thread-item .avatar,
#socials-chat-root .msg .avatar.sm {
  border-radius: 14px;
  display: grid;
  place-items: center;
  font-weight: 700;
  color: #fff;
  background: linear-gradient(135deg, color-mix(in srgb, var(--primary) 75%, #000 0%), color-mix(in srgb, var(--primary-dark, var(--primary)) 55%, #000 0%));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.15), 0 10px 20px rgba(0,0,0,.18);
}

#socials-chat-root .social-thread-item .avatar {
  width: 30px;
  height: 30px;
}

#socials-chat-root .msg .avatar.sm {
  width: 30px;
  height: 30px;
  margin-top: 2px;
  border-radius: 10px;
}

#socials-chat-root .social-thread-item .avatar[data-source="messenger"],
#socials-chat-root .msg .avatar.sm[data-source="messenger"] { background: linear-gradient(135deg, #1877f2, #45a0ff); }
#socials-chat-root .social-thread-item .avatar[data-source="instagram"],
#socials-chat-root .msg .avatar.sm[data-source="instagram"] { background: linear-gradient(135deg, #833ab4, #fd1d1d 58%, #fcb045); }
#socials-chat-root .social-thread-item .avatar[data-source="whatsapp"],
#socials-chat-root .msg .avatar.sm[data-source="whatsapp"] { background: linear-gradient(135deg, #25d366, #128c7e); }

#socials-chat-root .social-thread-item .meta {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
  overflow: hidden;
}

#socials-chat-root .social-thread-item .head,
#socials-chat-root .social-channel-card .head,
#socials-chat-root .social-template-item .head,
#socials-chat-root .social-message-card .head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

#socials-chat-root .social-thread-item .name {
  font-weight: 700;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#socials-chat-root .social-thread-item .time {
  font-size: 11px;
  color: var(--text-muted);
  flex-shrink: 0;
}

#socials-chat-root .social-thread-item .preview {
  font-size: 12px;
  color: var(--text-muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: -webkit-fill-available;
}

#socials-chat-root .social-thread-item .thread-actions {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
  min-width: 60px;
}

#socials-chat-root .social-thread-item .unread-badge {
  position: static;
  transform: none;
  min-width: 20px;
  height: 20px;
  line-height: 20px;
  padding: 0 7px;
}

#socials-chat-root .social-thread-item .social-status-tag,
#socials-chat-root .social-thread-item .social-status-pill {
  justify-content: center;
  padding-inline: 9px;
}

#socials-chat-root .social-source-badge[data-source="messenger"] { border-color: color-mix(in srgb, var(--soc-messenger) 42%, transparent); color: color-mix(in srgb, var(--soc-messenger) 82%, white 6%); }
#socials-chat-root .social-source-badge[data-source="instagram"] { border-color: color-mix(in srgb, var(--soc-instagram) 38%, transparent); color: color-mix(in srgb, var(--soc-instagram) 82%, white 5%); }
#socials-chat-root .social-source-badge[data-source="whatsapp"] { border-color: color-mix(in srgb, var(--soc-whatsapp) 38%, transparent); color: color-mix(in srgb, var(--soc-whatsapp) 82%, white 7%); }

#socials-chat-root .social-chat-header {
  border-bottom: 1px solid rgba(255,255,255,.06);
  margin-bottom: 10px;
}

#socials-chat-root .social-chat-header .title {
  display: flex;
  gap: 6px;
  min-width: 0;
}

#socials-chat-root .social-thread-subtitle {
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
  align-items: center;
  color: var(--text-muted);
  font-size: 12px;
}

#socials-chat-root .social-live-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border-radius: 999px;
  padding: 6px 10px;
  font-size: 13px;
}

#socials-chat-root .social-live-pill .dot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: #ffb703;
  box-shadow: 0 0 0 0 rgba(255,183,3,.45);
}

#socials-chat-root .social-live-pill[data-state="connected"] .dot {
  background: #25d366;
  animation: socialsPulse 1.8s infinite;
}

#socials-chat-root .social-live-pill[data-state="error"] .dot {
  background: #ef4444;
  box-shadow: none;
}

@keyframes socialsPulse {
  0% { box-shadow: 0 0 0 0 rgba(37,211,102,.4); }
  70% { box-shadow: 0 0 0 10px rgba(37,211,102,0); }
  100% { box-shadow: 0 0 0 0 rgba(37,211,102,0); }
}

#socials-chat-root .social-thread-context {
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 18px;
  padding: 14px;
  margin-bottom: 10px;
  background: var(--soc-card);
}

#socials-chat-root .social-thread-context[hidden] {
  display: none;
}

#socials-chat-root .social-context-head {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: flex-start;
}

#socials-chat-root .messages {
  min-height: 0;
  flex: 1;
  border-radius: 18px;
  overflow: auto;
}

#socials-chat-root .msg {
  align-items: flex-end;
  margin-bottom: 10px;
}

#socials-chat-root .msg .msg-content {
  max-width: min(74%, 680px);
}

#socials-chat-root .msg .bubble {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

#socials-chat-root .msg .bubble .text {
  padding: 12px 14px;
  border-radius: 18px;
  background: rgba(255,255,255,.05);
  font-size: 13px;
  line-height: 1.5;
  word-break: break-word;
}

#socials-chat-root .msg.me .bubble .text {
  background: linear-gradient(135deg, color-mix(in srgb, var(--primary) 70%, #000 0%), color-mix(in srgb, var(--primary-dark, var(--primary)) 58%, #000 0%));
}

#socials-chat-root .social-msg-meta {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  font-size: 11px;
  color: var(--text-muted);
}

#socials-chat-root .msg:not(.me) .social-msg-meta {
  justify-content: flex-start;
}

#socials-chat-root .social-msg-status {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

#socials-chat-root .social-msg-status i {
  font-size: 12px;
}

#socials-chat-root .social-message-card,
#socials-chat-root .social-channel-card,
#socials-chat-root .social-template-item {
  border-bottom: var(--line);
  padding: 5px 0;
}

#socials-chat-root .social-attachment-grid {
  display: grid;
  grid-auto-flow: column;
  max-width: -webkit-fill-available;
  flex-basis: 100%;
  gap: 4px;
  overflow-x: auto;
  scrollbar-color: var(--text) transparent;
  scrollbar-width: thin;
  position: relative;
  pointer-events: all;
}

#socials-chat-root .social-attachment-card {
  border-radius: 16px;
  border: var(--line);
  overflow: hidden;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  min-height: 130px;
  width: 130px;
  backdrop-filter: var(--backdrop-2);
  color: inherit;
}

#socials-chat-root .social-attachment-card:hover {
  border-color: color-mix(in srgb, var(--primary) 45%, transparent);
}

#socials-chat-root .social-attachment-card img,
#socials-chat-root .social-attachment-card video {
  width: 100%;
  height: 80px;
  object-fit: cover;
  display: block;
  background: var(--strans);
}

#socials-chat-root .social-attachment-card .ph {
  display: grid;
  place-items: center;
  flex: 1;
  min-height: 70px;
  background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01));
  color: var(--text-muted);
  font-size: 30px;
}

#socials-chat-root .social-attachment-card .meta {
  padding: 2px 6px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

#socials-chat-root .social-attachment-card .meta strong {
  font-size: 12px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#socials-chat-root .social-quick-row {
  min-height: 0;
  padding: 8px 0 2px;
  pointer-events: all;
  position: relative;
}

#socials-chat-root .composer {
  border: var(--line);
  border-radius: 20px;
  gap: 4px;
}

#socials-chat-root .composer-top,
#socials-chat-root .composer-bottom {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

#socials-chat-root .composer textarea {
  min-height: 42px;
  border-radius: 18px;
}

#socials-chat-root .composer-bottom {
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}

#socials-chat-root .composer-left,
#socials-chat-root .composer-right {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
  align-items: center;
}

#socials-chat-root .icon-btn {
  border-radius: 14px;
}

#socials-chat-root .social-side-card {
  border-radius: 18px;
  background: var(--bg);
  padding: 10px;
}

#socials-chat-root .social-side-card + .social-side-card {
  margin-top: 10px;
}

#socials-chat-root .social-profile-grid {
  display: grid;
  gap: 10px;
}

#socials-chat-root .social-channel-list,
#socials-chat-root .social-modal-list {
  display: grid;
  gap: 10px;
}

#socials-chat-root .social-modal-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  align-items: start;
}

#socials-chat-root .social-modal-form,
#socials-chat-root .social-assign-form {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

#socials-chat-root .social-modal-form label,
#socials-chat-root .social-assign-form label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 12px;
  color: var(--text-muted);
}

#socials-chat-root .social-modal-form label > span,
#socials-chat-root .social-assign-form label > span {
  color: inherit;
}

#socials-chat-root .social-modal-form input[type="checkbox"],
#socials-chat-root .social-assign-form input[type="checkbox"] {
  accent-color: var(--primary);
}

#socials-chat-root .social-channel-card strong,
#socials-chat-root .social-message-card strong,
#socials-chat-root .social-template-item strong,
#socials-chat-root .social-empty .card-title {
  font-size: 13px;
}

#socials-chat-root .social-channel-card .row-wrap,
#socials-chat-root .social-template-item .row-wrap,
#socials-chat-root .social-message-card .row-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

#socials-chat-root .social-template-item .social-msg-note,
#socials-chat-root .social-message-card .social-msg-note,
#socials-chat-root .social-channel-card .social-msg-note {
  margin-top: 0;
}

#socials-chat-root dialog.modal .modal-dialog {
  max-width: min(1100px, calc(100vw - 40px));
}

#socials-chat-root #socialMediaModal .modal-dialog {
  max-width: min(760px, calc(100vw - 40px));
}

#socials-chat-root #socialMediaContent img,
#socials-chat-root #socialMediaContent video {
  width: 100%;
  max-height: min(60vh, 640px);
  object-fit: contain;
  border-radius: 18px;
  background: rgba(0,0,0,.22);
}

#socials-chat-root #socialMediaContent .media-meta {
  display: grid;
  gap: 8px;
}

#socials-chat-root #socialMediaContent .media-meta strong {
  font-size: 14px;
}

#socials-chat-root .social-rule-tags .muted,
#socials-chat-root .social-automation-cards .muted,
#socials-chat-root .social-labels .muted {
  padding: 2px 0;
}

#socials-chat-root .social-filter-pill {
  background: color-mix(in srgb, var(--primary) 10%, transparent);
  border-color: color-mix(in srgb, var(--primary) 30%, transparent);
}

#socials-chat-root .social-status-pill {
  background: color-mix(in srgb, rgba(255,255,255,.08) 72%, transparent);
}

#socials-chat-root .social-status-tag {
  background: rgba(255,255,255,.035);
}

#socials-chat-root .social-label {
  background: color-mix(in srgb, var(--primary) 10%, transparent);
  border-color: color-mix(in srgb, var(--primary) 26%, transparent);
}

#socials-chat-root .social-count-pill {
  color: var(--text-muted);
}

#socials-chat-root .social-thread-item:focus-visible,
#socials-chat-root .social-attachment-card:focus-visible,
#socials-chat-root .chip:focus-visible,
#socials-chat-root .btn:focus-visible,
#socials-chat-root .btn-ghost:focus-visible,
#socials-chat-root .icon-btn:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--primary) 68%, white 4%);
  outline-offset: 2px;
}

#socials-chat-root .right-panel {
  gap: 10px;
}

#socials-chat-root .social-chat-header.compact {
  padding-bottom: 8px;
  margin-bottom: 8px;
}

#socials-chat-root .social-header-copy.compact {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
  width: 100%;
}

#socials-chat-root .social-header-copy.compact > :first-child {
  min-width: 0;
  flex: 1;
}

#socials-chat-root .social-header-copy.compact h2 {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#socials-chat-root .social-header-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

#socials-chat-root .social-live-pill {
  min-height: 32px;
  padding: 5px 10px;
  font-size: 12px;
}

#socials-chat-root .social-reply-target[hidden],
#socials-chat-root .social-reply-target:empty,
#socials-chat-root .social-attachment-grid:empty,
#socials-chat-root .social-quick-row:empty {
  display: none;
}

#socials-chat-root .social-reply-target {
  margin-top: 2px;
}

#socials-chat-root .social-reply-chip {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  border: var(--line);
  border-radius: 16px;
  padding: 10px 12px;
  background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
}

#socials-chat-root .social-reply-chip .social-status-tag {
  flex-shrink: 0;
}

#socials-chat-root .social-reply-text {
  min-width: 0;
  flex: 1;
  font-size: 12px;
  color: var(--text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  opacity: .92;
}

#socials-chat-root .social-format-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

#socials-chat-root .social-format-toolbar .icon-btn {
  min-width: 34px;
  min-height: 34px;
}

#socials-chat-root .social-composer-modebar {
  margin-bottom: 2px;
}

#socials-chat-root .composer-box {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

#socials-chat-root .composer-top {
  gap: 8px;
}

#socials-chat-root .chat-msg {
  touch-action: pan-y;
  will-change: transform;
}

#socials-chat-root .panel.right-panel[hidden],
#socials-chat-root .socials-chat-layout:not(.show-info) .right-panel {
  display: none !important;
}

@media (max-width: 1100px) {
  #socials-chat-root .social-header-copy.compact {
    align-items: flex-start;
    flex-direction: column;
  }

  #socials-chat-root .social-header-actions {
    justify-content: flex-start;
  }

  #socials-chat-root .social-modal-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}