/* Chat center performance and state affordances. */
[data-tgsp-account] {
  overscroll-behavior-y: contain;
}

[data-tgsp-account] > [data-tgsp-msg] {
  content-visibility: auto;
  contain-intrinsic-size: 0 84px;
}

[data-tgsp-account][data-tgsp-account] article[class*="dark:bg-sky-950"] {
  background-color: var(--sp-bg-elevated) !important;
  border-color: var(--sp-border) !important;
}

[data-tgsp-account][data-tgsp-account] [data-testid^="chat-private-button-"] {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--sp-text-muted) !important;
}

[data-tgsp-account][data-tgsp-account] [data-testid^="chat-private-button-"] > span:first-child {
  background: transparent !important;
  color: inherit !important;
}

section[class*="md:w-[340px]"] button[data-tgsp-unread="1"] {
  position: relative;
  box-shadow: inset 3px 0 0 var(--sp-highlight);
}


.tgsp-ca-pin-icon {
  display: inline-block;
  margin-left: .35rem;
  color: var(--sp-text-muted);
  font-size: .7em;
  line-height: 1;
  vertical-align: middle;
}

.tgsp-ca-rich-toolbar {
  display: flex;
  align-items: center;
  gap: .25rem;
  margin: 0 0 .45rem;
  min-height: 1.7rem;
  overflow-x: auto;
}

.tgsp-ca-rich-hint {
  flex: 0 0 auto;
  margin-right: .15rem;
  color: var(--sp-text-muted);
  font-size: .72rem;
  font-weight: 650;
}

.tgsp-ca-rich-intro {
  flex: 0 1 auto;
  min-width: 0;
  max-width: 18rem;
  overflow: hidden;
  color: var(--sp-text-muted);
  font-size: .68rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tgsp-ca-rich-btn {
  flex: 0 0 auto;
  min-width: 1.7rem;
  height: 1.55rem;
  padding: 0 .35rem;
  border: 1px solid var(--sp-border);
  border-radius: .32rem;
  background: var(--sp-bg-muted);
  color: var(--sp-text-muted);
  font: inherit;
  font-size: .7rem;
  cursor: pointer;
}

.tgsp-ca-rich-btn:hover {
  border-color: var(--sp-border-strong);
  background: var(--sp-bg-elevated);
  color: var(--sp-text);
}

.tgsp-ca-rich-body a {
  color: var(--sp-link);
  text-decoration: underline;
  text-decoration-color: var(--sp-border-strong);
}

.tgsp-ca-rich-body blockquote {
  margin: .25rem 0;
  padding-left: .55rem;
  border-left: 2px solid var(--sp-border-strong);
  color: var(--sp-text-muted);
}

.tgsp-ca-spoiler {
  border-radius: .18rem;
  background: var(--sp-text);
  color: transparent;
  cursor: pointer;
}

.tgsp-ca-spoiler:hover,
.tgsp-ca-spoiler:focus {
  color: var(--sp-bg);
}

.dark .tg-stage [data-tgsp-account] [data-tgsp-msg]:not(.tg-stage-service) > article {
  background: var(--sp-bg-elevated) !important;
}

.dark .tg-stage > .tg-stage-pin {
  background: var(--sp-bg-muted) !important;
}

.tgsp-ca-rich-body strong,
.tgsp-ca-rich-body b {
  font-weight: 700;
}

.tgsp-ca-rich-body code,
.tgsp-ca-rich-body pre {
  background: var(--sp-bg-muted);
  border-radius: .25rem;
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
}

.tgsp-ca-rich-body code { padding: .1rem .25rem; }
.tgsp-ca-rich-body pre { padding: .5rem; overflow-x: auto; }