/* Translation is secondary information inside the existing message bubble. */
html[data-chat-interface="telegram"] .bubble.translated {
  color: var(--tg-text);
  border-color: transparent;
}
html[data-chat-interface="telegram"] .bubble-row.outbound .bubble.translated {
  color: var(--tg-text);
  border-color: transparent;
}
html[data-chat-interface="telegram"][data-theme] .bubble-row .bubble .message-translation-marker {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 5px 7px;
  margin: 9px 0 0;
  padding: 8px 0 0;
  border: 0;
  border-top: 1px solid var(--tg-line);
  border-radius: 0;
  background: transparent;
  color: var(--tg-muted);
  font: 400 12px/1.4 -apple-system, BlinkMacSystemFont, "Helvetica Neue", sans-serif;
  text-align: left;
  box-shadow: none;
}
html[data-chat-interface="telegram"][data-theme] .bubble-row.outbound .bubble .message-translation-marker {
  color: var(--tg-out-muted);
}
html[data-chat-interface="telegram"] .message-translation-marker > span:nth-child(2) {
  flex: 1 1 120px;
  min-width: 0;
}
html[data-chat-interface="telegram"] .message-translation-marker-icon {
  display: inline-block;
  flex: 0 0 15px;
  width: 15px;
  height: 15px;
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  font-size: 0;
  background: currentColor;
  color: inherit;
  opacity: .8;
  mask: url("../telegram-ui-20260907-v1/chat-interface-icons/language-outline.svg") center / contain no-repeat;
  -webkit-mask: url("../telegram-ui-20260907-v1/chat-interface-icons/language-outline.svg") center / contain no-repeat;
}
html[data-chat-interface="telegram"] .message-translation-marker.is-loading .message-translation-marker-icon {
  border: 1.5px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  background: transparent;
  mask: none;
  -webkit-mask: none;
}
html[data-chat-interface="telegram"] .message-translation-marker.is-error {
  color: var(--tg-muted);
}
html[data-chat-interface="telegram"] .message-translation-marker.is-error .message-translation-marker-icon {
  color: #e78f9a;
  font-size: 13px;
  font-weight: 700;
  text-align: center;
  mask: none;
  -webkit-mask: none;
  background: transparent;
}
html[data-chat-interface="telegram"] .message-translation-original-button {
  flex: 0 1 auto;
  max-width: 100%;
  min-height: 30px;
  margin: 0 0 0 auto;
  padding: 5px 10px;
  border: 1px solid var(--tg-line);
  border-radius: 15px;
  background: color-mix(in srgb, currentColor 7%, transparent);
  color: inherit;
  font: 500 12px/18px -apple-system, BlinkMacSystemFont, "Helvetica Neue", sans-serif;
  white-space: normal;
  box-shadow: none;
}
html[data-chat-interface="telegram"] .message-translation-original-button:hover,
html[data-chat-interface="telegram"] .message-translation-original-button:focus-visible {
  background: color-mix(in srgb, currentColor 14%, transparent);
  color: inherit;
  border-color: currentColor;
}
/* A translated message includes a real footer; metadata must not overlap it. */
html[data-chat-interface="telegram"] .bubble.translated .bubble-foot {
  position: static;
  margin: 5px 0 0;
  justify-content: flex-end;
}
html[data-chat-interface="telegram"] .bubble.translated .bubble-body::after { display: none; }

/* Compact personal settings match the inbox palette in both modes. */
html[data-chat-interface="telegram"] .sidebar-parameters-panel {
  background: var(--tg-list-bg);
  border-color: var(--tg-line);
  color: var(--tg-list-text);
}
html[data-chat-interface="telegram"] .sidebar-parameters-panel :is(.sidebar-parameter-button, .sidebar-language-button, .sidebar-language-option) {
  color: var(--tg-list-text);
  background: var(--tg-list-header);
  border-color: var(--tg-line);
  box-shadow: none;
}
html[data-chat-interface="telegram"] .sidebar-parameters-panel .sidebar-parameter-icon { color: var(--tg-list-accent); }
html[data-chat-interface="telegram"] .sidebar-parameters-panel .sidebar-parameter-switch { background: var(--tg-list-chip); border-color: var(--tg-line); }
html[data-chat-interface="telegram"] .sidebar-parameters-panel [aria-checked="true"] .sidebar-parameter-switch { background: var(--tg-list-accent); border-color: var(--tg-list-accent); }
html[data-chat-interface="telegram"] .sidebar-language-menu { background: var(--tg-list-bg); border-color: var(--tg-line); }

/* The indicator occupies the gap revealed by the finger, never the list. */
html[data-chat-interface="telegram"] .conversation-pull-refresh-indicator {
  top: 0;
  width: 28px;
  height: 28px;
  transform: translate3d(-50%, calc(var(--conversation-pull-list-offset, 0px) / 2 - 14px), 0);
  background: transparent;
  border: 0;
  box-shadow: none;
}
html[data-chat-interface="telegram"] .conversation-pull-refresh-spinner {
  width: 20px;
  height: 20px;
  flex-basis: 20px;
  border-width: 2px;
  border-color: color-mix(in srgb, currentColor 20%, transparent);
  border-top-color: currentColor;
}
html[data-chat-interface="telegram"] .conversation-pull-refresh-indicator:not(.is-refreshing) .conversation-pull-refresh-spinner { animation: none; }
@media (prefers-reduced-motion: reduce) {
  html[data-chat-interface="telegram"] .conversation-pull-refresh-indicator { transition: none; }
}