/* ================================================================
   Мессенджер в новом дизайне (ui.css): список чатов, шапка, лента,
   поле ввода, пустой экран. Разметка и id не меняются — JS chat-*.js
   работает как раньше. Префикс :is(html, html.dark-theme) перебивает
   старые правила chat.css и их тёмную тему без !important.
   ================================================================ */

.ui-messenger {
  --msg-canvas: var(--ui-bg);
  --msg-in-bg: var(--ui-surface);
  --msg-in-text: var(--ui-text-strong);
  --msg-in-edge: 0 0 0 1px rgba(0, 0, 0, .06), 0 1px 0 rgba(0, 0, 0, .05);
  --msg-out-bg: #303030;
  --msg-out-text: #ffffff;
  --msg-avatar-bg: #e3e3e3;
  --msg-avatar-text: #4a4a4a;
  --msg-badge-bg: #303030;
  --msg-badge-text: #ffffff;
  /* Старые фиолетовые акценты chat.css внутри мессенджера — нейтральные. */
  --primary: var(--ui-text-strong);
  --primary-dark: var(--ui-text-strong);
  --primary-light: var(--ui-surface-selected);
  --primary-border: var(--ui-border-strong);
  --crm-accent: var(--ui-text-strong);
  --text-light: var(--ui-text-subdued);
  font-family: var(--ui-font);
}

html.dark-theme .ui-messenger {
  --msg-in-bg: #1f2023;
  --msg-in-edge: 0 0 0 1px rgba(255, 255, 255, .07);
  --msg-out-bg: #34363c;
  --msg-out-text: #f5f5f5;
  --msg-avatar-bg: #2f3136;
  --msg-avatar-text: #d4d4d4;
  --msg-badge-bg: #f1f1f1;
  --msg-badge-text: #111214;
}

:is(html, html.dark-theme) .ui-messenger,
:is(html, html.dark-theme) .ui-messenger * {
  scrollbar-color: var(--ui-scrollbar) transparent;
}

:is(html, html.dark-theme) .ui-messenger *::-webkit-scrollbar-thumb {
  background-color: var(--ui-scrollbar);
}

/* main.css красит фокус любого поля в фиолетовый с !important —
   в мессенджере фокус нейтральный, как во всём новом дизайне. */
:is(html, html.dark-theme) body:has(.ui-messenger) :is(input:not([type="checkbox"], [type="radio"], [type="range"]), select, textarea):focus {
  border-color: var(--ui-field-focus) !important;
  box-shadow: 0 0 0 3px var(--ui-field-ring) !important;
}

/* --- Колонки ------------------------------------------------------ */
:is(html, html.dark-theme) .ui-messenger .chat-sidebar {
  background: var(--ui-surface);
  border-right: 1px solid var(--ui-border);
}

:is(html, html.dark-theme) .ui-messenger .chat-main,
:is(html, html.dark-theme) .ui-messenger .chat-container {
  background: var(--msg-canvas);
  border: 0;
  box-shadow: none;
}

/* --- Поиск и фильтры: обычная строка над списком, не плавающая карточка --- */
:is(html, html.dark-theme) .ui-messenger .chat-search-container {
  inset: 0 0 auto;
  padding: 12px;
  border: 0;
  border-bottom: 1px solid var(--ui-border);
  border-radius: 0;
  background: var(--ui-surface);
  box-shadow: none;
}

:is(html, html.dark-theme) .ui-messenger #chat-search-input {
  height: 36px;
  padding-left: 34px;
  border: 1px solid var(--ui-border-strong);
  border-radius: var(--ui-radius-control);
  background: var(--ui-surface);
  color: var(--ui-text);
  font-size: 14px;
  transition: border-color .15s ease, box-shadow .15s ease;
}

:is(html, html.dark-theme) .ui-messenger #chat-search-input::placeholder {
  color: var(--ui-text-subdued);
  opacity: 1;
}

:is(html, html.dark-theme) .ui-messenger #chat-search-input:focus {
  border-color: var(--ui-field-focus);
  outline: 0;
  box-shadow: 0 0 0 3px var(--ui-field-ring);
}

:is(html, html.dark-theme) .ui-messenger .chat-search-container .search-icon {
  left: 11px;
  color: var(--ui-text-subdued);
}

:is(html, html.dark-theme) .ui-messenger .chat-list-container {
  padding-top: 61px;
  padding-bottom: 53px;
}

:is(html, html.dark-theme) .ui-messenger .chat-list__footer {
  inset: auto 0 0;
  padding: 8px 12px;
  border: 0;
  border-top: 1px solid var(--ui-border);
  border-radius: 0;
  background: var(--ui-surface);
  color: var(--ui-text-subdued);
  box-shadow: none;
}

:is(html, html.dark-theme) .ui-messenger .chat-list__footer-count {
  padding: 0;
  font-size: 13px;
  font-weight: 500;
}

:is(html, html.dark-theme) .ui-messenger #chat-total-count {
  color: var(--ui-text);
  font-weight: 600;
}

/* --- Кнопки-иконки (фильтры, пуши, настройки, действия с лидом) --- */
:is(html, html.dark-theme) .ui-messenger .info-btn.chat-quick-action-btn {
  border: 1px solid var(--ui-border-strong);
  border-radius: var(--ui-radius-control);
  background: var(--ui-surface);
  color: var(--ui-text);
  box-shadow: 0 1px 0 var(--ui-btn-edge);
  transition: var(--ui-motion);
}

:is(html, html.dark-theme) .ui-messenger .info-btn.chat-quick-action-btn:hover {
  background: var(--ui-surface-hover);
  border-color: var(--ui-border-strong);
  color: var(--ui-text-strong);
  box-shadow: 0 1px 0 var(--ui-btn-edge);
  transform: var(--ui-lift);
}

:is(html, html.dark-theme) .ui-messenger .info-btn.chat-quick-action-btn:active {
  transform: none;
}

:is(html, html.dark-theme) .ui-messenger .info-btn.chat-quick-action-btn:is(.is-active, .is-half, .is-full, [aria-pressed="true"], [aria-expanded="true"]) {
  background: var(--ui-surface-selected);
  border-color: var(--ui-border-strong);
  color: var(--ui-text-strong);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, .08);
}

:is(html, html.dark-theme) .ui-messenger .info-btn.chat-quick-action-btn.is-full img {
  filter: none;
}

:is(html, html.dark-theme) .ui-messenger .info-btn.chat-quick-action-btn:focus-visible {
  outline: 2px solid var(--ui-focus);
  outline-offset: 1px;
}

:is(html, html.dark-theme) .ui-messenger .info-btn.chat-quick-action-btn.has-filters::after {
  top: -3px;
  right: -3px;
  width: 9px;
  height: 9px;
  background: #e96b42;
  box-shadow: 0 0 0 2px var(--ui-surface);
}

/* Кнопки-иконки на ui-btn: высота как у поля поиска (36 px), иконки 18 px;
   «нажатая» (открыт поповер / панель) — выбранная поверхность, точка — есть фильтры.
   Тихие (настройки списка, закрыть панель лида) — ui-btn--plain 32 px. */
:is(html, html.dark-theme) .ui-messenger .ui-btn.chat-quick-action-btn {
  width: 36px;
  height: 36px;
  padding: 0;
}

:is(html, html.dark-theme) .ui-messenger .ui-btn.chat-quick-action-btn svg {
  width: 18px;
  height: 18px;
}

:is(html, html.dark-theme) .ui-messenger .ui-btn--secondary.chat-quick-action-btn:is(.is-active, [aria-pressed="true"], [aria-expanded="true"]) {
  background: var(--ui-surface-selected);
  color: var(--ui-text-strong);
  box-shadow: inset 0 0 0 1px var(--ui-btn-edge), inset 0 1px 2px rgba(0, 0, 0, .08);
}

:is(html, html.dark-theme) .ui-messenger .ui-btn.chat-quick-action-btn.has-filters::after {
  content: "";
  position: absolute;
  top: -3px;
  right: -3px;
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: #e96b42;
  box-shadow: 0 0 0 2px var(--ui-surface);
  pointer-events: none;
}

:is(html, html.dark-theme) .ui-messenger .ui-btn--plain.chat-quick-action-btn {
  width: 32px;
  height: 32px;
  color: var(--ui-text-subdued);
}

:is(html, html.dark-theme) .ui-messenger .ui-btn--plain.chat-quick-action-btn:is(:hover, [aria-expanded="true"]) {
  background: var(--ui-neutral-surface);
  color: var(--ui-text-strong);
}

:is(html, html.dark-theme) .ui-messenger .ui-btn.chat-quick-action-btn.lead-panel-close {
  align-self: flex-start;
}

/* --- Строка чата ---------------------------------------------------- */
:is(html, html.dark-theme) .ui-messenger .chat-item {
  position: relative;
  padding: 11px 14px 11px 12px;
  border: 0;
  border-bottom: 1px solid var(--ui-divider);
  background: transparent;
}

:is(html, html.dark-theme) .ui-messenger .chat-item:hover:not(.active) {
  background: var(--ui-surface-hover);
}

:is(html, html.dark-theme) .ui-messenger .chat-item.active {
  background: var(--ui-surface-selected);
  border-left: 0;
}

/* Выбранный чат — полоса слева, как у выбранного раздела в меню. */
:is(html, html.dark-theme) .ui-messenger .chat-item.active::after {
  inset: 8px auto 8px 0;
  width: 3px;
  height: auto;
  border-radius: 0 3px 3px 0;
  background: var(--ui-text-strong);
  transform: none;
}

:is(html, html.dark-theme) .ui-messenger .chat-item.unread:not(.active) {
  background: transparent;
}

:is(html, html.dark-theme) .ui-messenger .chat-item.chat-item--pinned:not(.active)::before {
  inset: 8px auto 8px 0;
  width: 3px;
  border-radius: 0 3px 3px 0;
  background: #d97706;
}

:is(html, html.dark-theme) .ui-messenger .chat-item.visual-inactive {
  background: var(--ui-critical-surface);
}

:is(html, html.dark-theme) .ui-messenger .chat-item.visual-inactive.active {
  border-left: 0;
}

:is(html, html.dark-theme) .ui-messenger .chat-item.visual-inactive.active::after {
  background: var(--ui-critical);
}

:is(html, html.dark-theme) .ui-messenger .chat-left {
  flex: 1 1 0;
  gap: 12px;
}

:is(html, html.dark-theme) .ui-messenger .chat-item-tags {
  margin-top: 6px;
  padding-left: 52px;
}

:is(html, html.dark-theme) .ui-messenger .chat-info-header {
  margin-bottom: 2px;
}

:is(html, html.dark-theme) .ui-messenger .chat-name {
  max-width: none;
  color: var(--ui-text-strong);
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
}

:is(html, html.dark-theme) .ui-messenger .chat-item.unread .chat-name,
:is(html, html.dark-theme) .ui-messenger .chat-item.active .chat-name {
  color: var(--ui-text-strong);
  font-weight: 650;
}

:is(html, html.dark-theme) .ui-messenger .chat-preview {
  max-width: none;
  color: var(--ui-text-subdued);
  font-size: 13px;
  line-height: 18px;
}

:is(html, html.dark-theme) .ui-messenger .chat-item.unread .chat-preview {
  color: var(--ui-text);
}

:is(html, html.dark-theme) .ui-messenger .chat-item.active .chat-preview,
:is(html, html.dark-theme) .ui-messenger .chat-item.active .chat-time {
  color: var(--ui-text-subdued);
  font-weight: 400;
}

:is(html, html.dark-theme) .ui-messenger .chat-meta {
  align-self: stretch;
  justify-content: space-between;
  gap: 4px;
  padding: 1px 0;
}

:is(html, html.dark-theme) .ui-messenger .chat-time {
  margin-left: 0;
  color: var(--ui-text-subdued);
  font-size: 12px;
  line-height: 18px;
  white-space: nowrap;
}

:is(html, html.dark-theme) .ui-messenger .chat-item.unread .chat-time {
  color: var(--ui-text-strong);
  font-weight: 600;
}

:is(html, html.dark-theme) .ui-messenger .unread-count,
:is(html, html.dark-theme) .ui-messenger .chat-source-tabs .tab-btn .tab-unread {
  width: auto;
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  border-radius: 999px;
  background: var(--msg-badge-bg);
  color: var(--msg-badge-text);
  font-size: 12px;
  font-weight: 600;
  line-height: 20px;
}

:is(html, html.dark-theme) .ui-messenger .chat-item-pin-icon,
:is(html, html.dark-theme) .ui-messenger .chat-item.active .chat-item-pin-icon {
  color: #d97706;
}

/* --- Аватары: нейтральный круг с инициалом ------------------------- */
:is(html, html.dark-theme) .ui-messenger .crm-avatar {
  border: 0;
  background: var(--msg-avatar-bg);
  box-shadow: none;
  color: var(--msg-avatar-text);
  font-weight: 600;
}

:is(html, html.dark-theme) .ui-messenger .crm-avatar__fallback {
  color: var(--msg-avatar-text);
}

:is(html, html.dark-theme) .ui-messenger .crm-avatar--chat {
  width: 40px;
  height: 40px;
  flex-basis: 40px;
  font-size: 15px;
}

:is(html, html.dark-theme) .ui-messenger .chat-source-icon {
  right: -2px;
  bottom: -2px;
  width: 16px;
  height: 16px;
  box-shadow: 0 0 0 2px var(--ui-surface);
}

/* --- Шапка переписки ------------------------------------------------ */
:is(html, html.dark-theme) .ui-messenger .chat-header {
  gap: 0;
  min-height: 64px;
  padding: 12px 16px;
  justify-content: center;
  border-bottom: 1px solid var(--ui-border);
  background: var(--ui-surface);
}

:is(html, html.dark-theme) .ui-messenger .lead-main-info-left {
  gap: 12px;
}

:is(html, html.dark-theme) .ui-messenger .crm-avatar--lead {
  width: 40px;
  height: 40px;
  flex-basis: 40px;
  font-size: 15px;
}

:is(html, html.dark-theme) .ui-messenger .lead-main-text {
  gap: 2px;
}

:is(html, html.dark-theme) .ui-messenger .lead-first-name {
  color: var(--ui-text-strong);
  font-size: 15px;
  font-weight: 650;
  line-height: 20px;
}

:is(html, html.dark-theme) .ui-messenger .lead-meta-row {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

:is(html, html.dark-theme) .ui-messenger .lead-created {
  color: var(--ui-text-subdued);
  font-size: 12px;
  line-height: 18px;
  white-space: nowrap;
}

:is(html, html.dark-theme) .ui-messenger .lead-created:has(#lead-created-at:empty) {
  display: none;
}

:is(html, html.dark-theme) .ui-messenger .tag-pill {
  padding: 2px 8px;
  border: 0;
  border-radius: 999px;
  background: var(--ui-neutral-surface);
  color: var(--ui-text);
  font-size: 12px;
  font-weight: 500;
  line-height: 16px;
}

:is(html, html.dark-theme) .ui-messenger .tag-pill:hover {
  background: var(--ui-surface-selected);
}

:is(html, html.dark-theme) .ui-messenger .chat-tag-edit-btn {
  width: 20px;
  height: 20px;
  flex-basis: 20px;
  border: 1px dashed var(--ui-border-strong);
  background: transparent;
  color: var(--ui-text-subdued);
  transition: var(--ui-motion);
}

:is(html, html.dark-theme) .ui-messenger .chat-tag-edit-btn::before {
  width: 12px;
  height: 12px;
}

:is(html, html.dark-theme) .ui-messenger .chat-tag-edit-btn:hover {
  border-style: solid;
  background: var(--ui-surface-hover);
  color: var(--ui-text-strong);
  transform: scale(1.06);
}

:is(html, html.dark-theme) .ui-messenger .chat-header-top-right {
  gap: 8px;
}

/* Статус лида — точка в правом нижнем углу аватара. Текст «Активен» остаётся
   для подсказки (title) и экранных чтецов, но не занимает место в шапке. */
:is(html, html.dark-theme) .ui-messenger .lead-avatar-wrap {
  position: relative;
  flex: 0 0 auto;
  line-height: 0;
}

:is(html, html.dark-theme) .ui-messenger #lead-active-status {
  position: absolute;
  right: -1px;
  bottom: -1px;
  z-index: 3;
  width: 12px;
  height: 12px;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 50%;
  box-shadow: 0 0 0 2px var(--ui-surface);
  color: transparent;
  font-size: 0;
  cursor: help;
}

:is(html, html.dark-theme) .ui-messenger #lead-active-status:not(.badge-success, .badge-danger) {
  display: none;
}

:is(html, html.dark-theme) .ui-messenger #lead-active-status.badge-success {
  background: #22c55e;
}

:is(html, html.dark-theme) .ui-messenger #lead-active-status.badge-danger {
  background: var(--ui-critical);
}

/* Аватар на самых узких экранах скрыт (chat.css) — тогда статус плашкой у имени. */
@media (max-width: 436px) {
  :is(html, html.dark-theme) .ui-messenger .lead-avatar-wrap {
    display: none;
  }
}

@media (min-width: 437px) {
  :is(html, html.dark-theme) .ui-messenger .chat-header-top .lead-name .lead-mobile-status-pill {
    display: none;
  }
}

/* Без аватара — та же точка сразу после имени (текст остаётся для чтецов). */
:is(html, html.dark-theme) .ui-messenger .chat-header-top .lead-name .lead-mobile-status-pill {
  width: 10px;
  height: 10px;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 50%;
  color: transparent;
  font-size: 0;
}

:is(html, html.dark-theme) .ui-messenger .chat-header-top .lead-name .lead-mobile-status-pill.is-active {
  background: #22c55e;
}

:is(html, html.dark-theme) .ui-messenger .chat-header-top .lead-name .lead-mobile-status-pill.is-inactive {
  background: var(--ui-critical);
}

:is(html, html.dark-theme) .ui-messenger .meta-window-pill {
  height: 24px;
  border: 0;
  border-radius: 8px;
  background: var(--ui-neutral-surface);
  color: var(--ui-text);
  box-shadow: none;
}

:is(html, html.dark-theme) .ui-messenger .chat-header-top #pipeline-stage-icon-btn .chat-quick-action-btn__label {
  font-size: 13px;
  font-weight: 550;
}

:is(html, html.dark-theme) .ui-messenger .chat-header-top .back-btn {
  width: 36px;
  height: 36px;
  padding: 0;
  justify-content: center;
  border: 1px solid var(--ui-border-strong);
  border-radius: 999px;
  background: var(--ui-surface);
  color: var(--ui-text);
}

/* --- Вкладки «Чаты» (переписки лида в разных воронках/ботах) ---------
   Одна переписка — вкладка ничего не выбирает и только повторяет воронку
   из кнопки этапа, поэтому строку прячем. */
:is(html, html.dark-theme) .ui-messenger .chat-source-tabs {
  gap: 6px;
  padding: 8px 16px;
  border-bottom: 1px solid var(--ui-border);
  background: var(--ui-surface);
  box-shadow: none;
}

:is(html, html.dark-theme) .ui-messenger .chat-source-tabs:not(:has(.tab-btn + .tab-btn)) {
  display: none;
}

:is(html, html.dark-theme) .ui-messenger .chat-source-tabs::after {
  content: none;
}

:is(html, html.dark-theme) .ui-messenger .chat-source-tabs-label {
  margin-right: 2px;
  color: var(--ui-text-subdued);
  font-size: 13px;
}

:is(html, html.dark-theme) .ui-messenger .chat-source-tabs .tab-btn {
  height: 28px;
  padding: 0 10px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--ui-text-subdued);
  font-size: 13px;
  font-weight: 550;
  box-shadow: none;
}

:is(html, html.dark-theme) .ui-messenger .chat-source-tabs .tab-btn:hover {
  background: var(--ui-surface-hover);
  color: var(--ui-text-strong);
  transform: none;
}

:is(html, html.dark-theme) .ui-messenger .chat-source-tabs .tab-btn.active {
  background: var(--ui-surface-selected);
  color: var(--ui-text-strong);
  box-shadow: none;
}

:is(html, html.dark-theme) .ui-messenger .chat-source-tabs .tab-btn .tab-unread {
  min-width: 18px;
  height: 18px;
  margin-left: 6px;
  font-size: 11px;
  line-height: 18px;
}

/* --- Лента сообщений ------------------------------------------------ */
:is(html, html.dark-theme) .ui-messenger .chat-messages {
  padding: 8px 24px 16px;
  background: var(--msg-canvas);
}

:is(html, html.dark-theme) .ui-messenger .date-separator {
  align-self: center;
  margin: 20px 0 4px;
  padding: 3px 10px;
  border-radius: 999px;
  background: var(--ui-neutral-surface);
  color: var(--ui-text-subdued);
  font-size: 12px;
  font-weight: 500;
}

:is(html, html.dark-theme) .ui-messenger .date-separator::before,
:is(html, html.dark-theme) .ui-messenger .date-separator::after {
  content: none;
}

:is(html, html.dark-theme) .ui-messenger .message-item {
  margin-top: 12px;
}

:is(html, html.dark-theme) .ui-messenger .message-top {
  padding: 0 4px;
}

:is(html, html.dark-theme) .ui-messenger .message-top-name,
:is(html, html.dark-theme) .ui-messenger .message-item--pinned .message-top-name {
  color: var(--ui-text-subdued);
  font-size: 12px;
  font-weight: 500;
}

:is(html, html.dark-theme) .ui-messenger .message-item--outgoing .message-top-row {
  justify-content: flex-end;
}

:is(html, html.dark-theme) .ui-messenger .message-top-by,
:is(html, html.dark-theme) .ui-messenger .message-top-sub {
  color: var(--ui-text-subdued);
  font-size: 12px;
}

:is(html, html.dark-theme) .ui-messenger .message-top-tag,
:is(html, html.dark-theme) .ui-messenger .message-item--outgoing .message-top-tag {
  padding: 1px 6px;
  border: 0;
  border-radius: 6px;
  background: var(--ui-neutral-surface);
  color: var(--ui-text-subdued);
  font-size: 11px;
  font-weight: 550;
}

:is(html, html.dark-theme) .ui-messenger .message-item .message {
  margin-top: 4px;
  border-radius: 16px;
  font-weight: 400;
  animation: none;
  transform: none;
  opacity: 1;
}

:is(html, html.dark-theme) .ui-messenger .message-item--incoming .message {
  border-top-left-radius: 4px;
}

:is(html, html.dark-theme) .ui-messenger .message-item--outgoing .message {
  border-top-right-radius: 4px;
}

:is(html, html.dark-theme) .ui-messenger .message-item .message.message-incoming,
:is(html, html.dark-theme) .ui-messenger .message.message-incoming {
  --msg-bubble: var(--msg-in-bg);
  background: var(--msg-in-bg);
  color: var(--msg-in-text);
  box-shadow: var(--msg-in-edge);
}

:is(html, html.dark-theme) .ui-messenger .message-item .message.message-outgoing,
:is(html, html.dark-theme) .ui-messenger .message.message-outgoing {
  --msg-bubble: var(--msg-out-bg);
  background: var(--msg-out-bg);
  color: var(--msg-out-text);
  box-shadow: none;
}

:is(html, html.dark-theme) .ui-messenger .message-item .message-content.message__content {
  /* Дети уже с полями 12px (chat.css): вместе с этими 2px — 14px от края. */
  padding: 10px 2px 0;
  font-size: 14px;
}

:is(html, html.dark-theme) .ui-messenger .message-text {
  margin-top: 0;
  font-size: 14px;
  line-height: 1.45;
}

:is(html, html.dark-theme) .ui-messenger .message-body {
  color: inherit;
  font-size: 14px;
}

:is(html, html.dark-theme) .ui-messenger :is(.message-text, .message-translation) a {
  color: inherit;
  text-decoration-color: color-mix(in srgb, currentColor 45%, transparent);
}

/* Перевод входящего — на языке менеджера, поэтому он основной текст,
   а оригинал лида ниже, мельче и приглушённо. */
:is(html, html.dark-theme) .ui-messenger .message__content:has(> .message-translation--incoming) {
  display: flex;
  flex-direction: column;
}

:is(html, html.dark-theme) .ui-messenger .message__content:has(> .message-translation--incoming) > .message-translation--incoming {
  order: -1;
  margin-top: 0;
  color: inherit;
  font-size: 14px;
  line-height: 1.45;
}

:is(html, html.dark-theme) .ui-messenger .message-translation--incoming > .message-translation__label {
  display: none;
}

:is(html, html.dark-theme) .ui-messenger .message__content:has(> .message-translation--incoming) > .message-text {
  margin-top: 6px;
  padding-top: 6px;
  border-top: 1px solid color-mix(in srgb, currentColor 12%, transparent);
  font-size: 13px;
  opacity: .62;
}

:is(html, html.dark-theme) .ui-messenger .message-item .message-translation {
  color: inherit;
  font-size: 13px;
}

:is(html, html.dark-theme) .ui-messenger .message-translation--outgoing {
  margin-top: 6px;
  padding-top: 6px;
  border-top: 1px solid color-mix(in srgb, currentColor 16%, transparent);
  opacity: .72;
}

:is(html, html.dark-theme) .ui-messenger .message-item .message-translation__label {
  margin-right: 4px;
  color: inherit;
  font-size: 12px;
  opacity: .7;
}

:is(html, html.dark-theme) .ui-messenger .message-item .message-footer {
  min-height: 26px;
  padding: 0 12px 2px 14px;
  color: inherit;
}

:is(html, html.dark-theme) .ui-messenger .message-footer__right {
  gap: 4px;
  opacity: .62;
}

:is(html, html.dark-theme) .ui-messenger .message-time {
  color: inherit;
  font-size: 11px;
}

:is(html, html.dark-theme) .ui-messenger .message-status .delivered {
  color: inherit;
}

:is(html, html.dark-theme) .ui-messenger .message-status .blocked {
  color: var(--ui-critical);
}

:is(html, html.dark-theme) .ui-messenger .message-item--outgoing .message-status .blocked {
  color: #ff8a8f;
}

:is(html, html.dark-theme) .ui-messenger :is(.message-translated-flag, .message-edited-flag) {
  opacity: 1;
}

:is(html, html.dark-theme) .ui-messenger .message-reply-preview,
:is(html, html.dark-theme) .ui-messenger .message-item:is(.message-item--incoming, .message-item--outgoing) .message-reply-preview {
  gap: 2px;
  padding: 6px 10px;
  border: 0;
  border-left: 3px solid color-mix(in srgb, currentColor 40%, transparent);
  border-radius: 8px;
  background: color-mix(in srgb, currentColor 7%, transparent);
  box-shadow: none;
  /* <button> по умолчанию не наследует цвет текста пузыря. */
  color: inherit;
}

:is(html, html.dark-theme) .ui-messenger .message__content > .message-reply-preview {
  order: -3;
}

/* Порядок в пузыре с переводом: цитата, медиа, перевод, оригинал. */
:is(html, html.dark-theme) .ui-messenger .message__content > :is(.message-media, .message-audio, .message-document) {
  order: -2;
}

:is(html, html.dark-theme) .ui-messenger .message-item .message-reply-preview::before {
  content: none;
}

:is(html, html.dark-theme) .ui-messenger .message-item .message-reply-preview:hover {
  background: color-mix(in srgb, currentColor 11%, transparent);
  transform: none;
}

:is(html, html.dark-theme) .ui-messenger .message-item .message-reply-preview__title {
  color: inherit;
  font-size: 12px;
}

:is(html, html.dark-theme) .ui-messenger .message-item .message-reply-preview__text {
  color: inherit;
  opacity: .72;
}

:is(html, html.dark-theme) .ui-messenger :is(.message-audio, .message-document) {
  background: color-mix(in srgb, currentColor 7%, transparent);
}

:is(html, html.dark-theme) .ui-messenger .document-download {
  color: inherit;
}

/* Кнопки бота под сообщением — как вторичные кнопки интерфейса. */
:is(html, html.dark-theme) .ui-messenger .message-item :is(.message-action-btn, .message-buttons-toggle) {
  border: 1px solid var(--ui-border);
  border-radius: var(--ui-radius-control);
  background: var(--ui-surface);
  color: var(--ui-text);
}

:is(html, html.dark-theme) .ui-messenger .message-item--pinned .message::before {
  background: #d97706;
  box-shadow: none;
}

:is(html, html.dark-theme) .ui-messenger .message-retry-btn {
  border-color: color-mix(in srgb, var(--ui-critical) 40%, transparent);
  background: var(--ui-surface);
  color: var(--ui-critical);
  box-shadow: var(--ui-shadow-card);
}

:is(html, html.dark-theme) .ui-messenger .chat-messages-loading {
  background: color-mix(in srgb, var(--msg-canvas) 86%, transparent);
  border: 0;
  box-shadow: none;
}

:is(html, html.dark-theme) .ui-messenger .chat-messages-loading-inner {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
}

:is(html, html.dark-theme) .ui-messenger .last-btn {
  height: 36px;
  padding: 0 14px;
  border: 0;
  border-radius: 999px;
  background: var(--ui-surface);
  color: var(--ui-text);
  font-size: 13px;
  font-weight: 550;
  box-shadow: var(--ui-shadow-popover);
}

:is(html, html.dark-theme) .ui-messenger .last-btn__icon {
  color: var(--ui-text-subdued);
}

/* --- Медиа в ленте ---------------------------------------------------
   Фото и видео — во всю ширину пузыря фиксированной ширины, подпись ниже;
   без подписи время лежит на картинке. Стикеры и кружки — без пузыря.
   Плееры голосовых и кружков — messenger-media.js. */
:is(html, html.dark-theme) .ui-messenger .message-item .message:has(> .message__content > .message-media:not(.message-media--note)) {
  width: 320px;
  max-width: 100%;
}

:is(html, html.dark-theme) .ui-messenger .message-item .message:has(> .message__content > .message-audio) {
  width: 300px;
  max-width: 100%;
}

:is(html, html.dark-theme) .ui-messenger .message-item .message:has(> .message__content > .message-document) {
  min-width: 260px;
}

:is(html, html.dark-theme) .ui-messenger .message__content > .message-media:not(.message-media--note) {
  max-width: none;
  margin: 0 -2px;
  border-radius: 0;
}

:is(html, html.dark-theme) .ui-messenger .message__content > .message-media:not(.message-media--note):first-child {
  margin-top: -10px;
}

:is(html, html.dark-theme) .ui-messenger .message-media:not(.message-media--note) :is(.message-photo, .message-video):not(.message-sticker) {
  display: block;
  width: 100%;
  max-width: none;
  max-height: 420px;
  border-radius: 0;
  object-fit: cover;
  cursor: zoom-in;
}

:is(html, html.dark-theme) .ui-messenger .message-media .message-video:not(.message-sticker) {
  background: #000;
  cursor: default;
}

:is(html, html.dark-theme) .ui-messenger .message__content > :is(.message-media, .message-audio, .message-document) + :is(.message-text, .message-translation) {
  margin-top: 8px;
}

/* Медиа без подписи: время — плашкой поверх картинки. */
:is(html, html.dark-theme) .ui-messenger .message:has(> .message__content > :is(.message-media)):not(:has(.message-text, .message-translation)) > .message__content {
  padding-bottom: 0;
}

:is(html, html.dark-theme) .ui-messenger .message:has(> .message__content > .message-media):not(:has(.message-text, .message-translation)) > .message-footer {
  position: absolute;
  right: 8px;
  bottom: 8px;
  z-index: 2;
  min-height: 20px;
  padding: 0 8px;
  border-radius: 999px;
  background: rgba(0, 0, 0, .5);
  color: #fff;
}

:is(html, html.dark-theme) .ui-messenger .message:has(> .message__content > .message-media):not(:has(.message-text, .message-translation)) .message-footer__right {
  opacity: 1;
}

/* Стикер и кружок — без пузыря. */
:is(html, html.dark-theme) .ui-messenger .message-item:is([data-message-type="sticker"], [data-message-type="video_note"]) .message:is(.message-incoming, .message-outgoing) {
  overflow: visible;
  width: auto;
  background: transparent;
  box-shadow: none;
}

:is(html, html.dark-theme) .ui-messenger .message-item:is([data-message-type="sticker"], [data-message-type="video_note"]) .message__content {
  padding: 0;
}

/* Без пузыря цитата и подпись получают свою подложку, иначе теряются на фоне ленты. */
:is(html, html.dark-theme) .ui-messenger .message-item:is([data-message-type="sticker"], [data-message-type="video_note"]) .message:is(.message-incoming, .message-outgoing) {
  color: var(--ui-text);
}

:is(html, html.dark-theme) .ui-messenger .message-item:is([data-message-type="sticker"], [data-message-type="video_note"]) .message__content > .message-reply-preview {
  margin: 0 0 6px;
  background: var(--ui-surface);
  box-shadow: var(--ui-shadow-card);
}

:is(html, html.dark-theme) .ui-messenger .message-item:is([data-message-type="sticker"], [data-message-type="video_note"]) .message__content > .message-media {
  margin: 0;
}

:is(html, html.dark-theme) .ui-messenger .message-media .message-sticker {
  display: block;
  width: 160px;
  max-width: 100%;
  border-radius: 0;
  cursor: zoom-in;
}

/* Кружок: круглое видео, кольцо прогресса и кнопка с длительностью. */
:is(html, html.dark-theme) .ui-messenger .message-media--note {
  position: relative;
  width: 240px;
  height: 240px;
  border-radius: 50%;
  overflow: hidden;
  background: var(--ui-surface-selected);
  cursor: pointer;
}

:is(html, html.dark-theme) .ui-messenger .message-media--note:focus-visible {
  outline: 2px solid var(--ui-focus);
  outline-offset: 3px;
}

:is(html, html.dark-theme) .ui-messenger .message-video--note {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
  background: transparent;
}

.ui-messenger .msg-note__ring {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  transform: rotate(-90deg);
  pointer-events: none;
}

.ui-messenger .msg-note__ring circle {
  fill: none;
  stroke: #fff;
  stroke-width: 3;
  stroke-linecap: round;
  stroke-dasharray: 100;
  stroke-dashoffset: 100;
  opacity: 0;
  transition: opacity .2s ease;
}

.ui-messenger .message-media--note.is-playing .msg-note__ring circle {
  opacity: .9;
}

.ui-messenger .msg-note__badge {
  position: absolute;
  left: 50%;
  bottom: 16px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  height: 26px;
  padding: 0 10px 0 7px;
  border-radius: 999px;
  background: rgba(0, 0, 0, .52);
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  transform: translateX(-50%);
  transition: background-color .2s ease, transform .2s ease;
  pointer-events: none;
}

.ui-messenger .message-media--note:hover .msg-note__badge {
  background: rgba(0, 0, 0, .68);
  transform: translateX(-50%) scale(1.04);
}

.ui-messenger .msg-note__icon svg {
  display: block;
  width: 14px;
  height: 14px;
}

/* Время у стикера и кружка — плашкой в правом нижнем углу. */
:is(html, html.dark-theme) .ui-messenger .message-item:is([data-message-type="sticker"], [data-message-type="video_note"]) .message-footer {
  position: absolute;
  right: 0;
  bottom: 4px;
  min-height: 20px;
  padding: 0 8px;
  border-radius: 999px;
  background: rgba(0, 0, 0, .5);
  color: #fff;
}

:is(html, html.dark-theme) .ui-messenger .message-item:is([data-message-type="sticker"], [data-message-type="video_note"]) .message-footer__right {
  opacity: 1;
}

/* Голосовое и аудио: кнопка, «волна» или полоса, время. */
:is(html, html.dark-theme) .ui-messenger .message__content > .message-audio {
  width: auto;
  max-width: none;
  padding: 2px 0 0;
  border-radius: 0;
  background: transparent;
}

.ui-messenger .msg-player {
  display: flex;
  align-items: center;
  gap: 12px;
}

.ui-messenger .msg-player__toggle {
  /* <button> не наследует цвет: кружок кнопки — цветом текста пузыря. */
  color: inherit;
  display: grid;
  flex: 0 0 40px;
  place-items: center;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: currentColor;
  cursor: pointer;
  transition: transform .2s ease;
}

.ui-messenger .msg-player__toggle svg {
  display: block;
  width: 18px;
  height: 18px;
  color: var(--msg-bubble, var(--ui-surface));
}

.ui-messenger .msg-player__toggle:hover {
  transform: scale(1.06);
}

.ui-messenger .msg-player__toggle:focus-visible,
.ui-messenger .msg-player__track:focus-visible {
  outline: 2px solid var(--ui-focus);
  outline-offset: 2px;
}

.ui-messenger .msg-player__body {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}

:is(html, html.dark-theme) .ui-messenger .message-audio__name {
  margin: 0;
  overflow: hidden;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.3;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ui-messenger .msg-player__track {
  position: relative;
  height: 24px;
  border-radius: 4px;
  cursor: pointer;
}

.ui-messenger .msg-player__track:has(.msg-player__bar) {
  display: flex;
  align-items: center;
  height: 12px;
}

.ui-messenger .msg-player__wave {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  gap: 2px;
}

.ui-messenger .msg-player__wave i {
  flex: 1;
  min-height: 3px;
  border-radius: 2px;
  background: currentColor;
  opacity: .28;
}

.ui-messenger .msg-player__wave--done {
  clip-path: inset(0 calc(100% - var(--progress, 0%)) 0 0);
}

.ui-messenger .msg-player__wave--done i {
  opacity: 1;
}

.ui-messenger .msg-player__bar {
  position: relative;
  width: 100%;
  height: 4px;
  overflow: hidden;
  border-radius: 2px;
  background: color-mix(in srgb, currentColor 22%, transparent);
}

.ui-messenger .msg-player__fill {
  position: absolute;
  inset: 0 auto 0 0;
  width: var(--progress, 0%);
  border-radius: inherit;
  background: currentColor;
}

.ui-messenger .msg-player__time {
  font-size: 12px;
  font-variant-numeric: tabular-nums;
  opacity: .65;
}

/* Файл: плитка с расширением, название, размер и «Скачать» в одну строку. */
:is(html, html.dark-theme) .ui-messenger .message__content > .message-document {
  gap: 12px;
  max-width: none;
  padding: 2px 0 0;
  border-radius: 0;
  background: transparent;
}

:is(html, html.dark-theme) .ui-messenger .document-icon {
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: color-mix(in srgb, currentColor 10%, transparent);
  color: inherit;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .02em;
}

:is(html, html.dark-theme) .ui-messenger .document-name {
  font-size: 14px;
  font-weight: 600;
  line-height: 1.3;
}

:is(html, html.dark-theme) .ui-messenger .document-size {
  display: inline;
  margin: 0;
  font-size: 12px;
  opacity: .65;
}

:is(html, html.dark-theme) .ui-messenger .document-download {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin: 0 0 0 10px;
  color: inherit;
  font-size: 12px;
  font-weight: 600;
  text-decoration: none;
  opacity: .85;
}

:is(html, html.dark-theme) .ui-messenger .document-download:hover {
  text-decoration: underline;
  opacity: 1;
}

:is(html, html.dark-theme) .ui-messenger .document-download svg {
  width: 14px;
  height: 14px;
}

/* Кнопка «Повторить отправку» стоит слева от пузыря — пузырь её не обрезает. */
:is(html, html.dark-theme) .ui-messenger .message-item .message.has-retry-btn {
  overflow: visible;
}

/* У изменённого сообщения без перевода метка «Оригинал:» лишняя. */
:is(html, html.dark-theme) .ui-messenger .message__content:not(:has(.message-translation)) > .message-text > .message-translation__label {
  display: none;
}

/* Пустой левый край подвала не должен раздвигать время (плашка на фото, кружке);
   время всегда прижато вправо. */
:is(html, html.dark-theme) .ui-messenger .message-footer__left:empty {
  display: none;
}

:is(html, html.dark-theme) .ui-messenger .message-footer__right {
  margin-left: auto;
}

/* Удалено у лида: пометка видна на светлом и тёмном пузыре. */
:is(html, html.dark-theme) .ui-messenger .message-deleted-badge {
  color: var(--ui-critical);
  font-size: 11px;
  opacity: 1;
}

:is(html, html.dark-theme) .ui-messenger .message-outgoing .message-deleted-badge {
  color: #ff9ea2;
}

/* --- Служебные события: строка по центру ленты, как дата ------------- */
:is(html, html.dark-theme) .ui-messenger #chat-messages > .system-message {
  align-self: center;
  justify-content: center;
  width: auto;
  max-width: min(520px, 100%);
  margin: 12px auto 4px;
}

:is(html, html.dark-theme) .ui-messenger #chat-messages > .system-message .system-message-inner {
  flex-direction: row;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: center;
  gap: 2px 8px;
  max-width: 100%;
  padding: 5px 12px;
  border: 0;
  border-radius: 12px;
  background: var(--ui-neutral-surface);
  color: var(--ui-text-subdued);
  box-shadow: none;
  font-family: inherit;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.45;
  text-align: center;
}

:is(html, html.dark-theme) .ui-messenger #chat-messages > .system-message .system-message-text {
  display: block;
  margin: 0;
  color: var(--ui-text);
  font-size: inherit;
  line-height: inherit;
}

:is(html, html.dark-theme) .ui-messenger #chat-messages > .system-message .system-message-meta {
  order: 2;
  margin: 0;
  color: inherit;
  font-size: 11px;
  line-height: inherit;
  text-align: center;
  opacity: .8;
}

:is(html, html.dark-theme) .ui-messenger #chat-messages > .system-message .channel-badge {
  display: inline;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  box-shadow: none;
  color: inherit;
  font-size: inherit;
  font-weight: 650;
}

:is(html, html.dark-theme) .ui-messenger #chat-messages > .system-message.variant-danger .system-message-inner {
  background: var(--ui-critical-surface);
  color: var(--ui-critical-text);
}

:is(html, html.dark-theme) .ui-messenger #chat-messages > .system-message.variant-success .system-message-inner {
  background: var(--ui-success-surface);
  color: var(--ui-success-text);
}

:is(html, html.dark-theme) .ui-messenger #chat-messages > .system-message.variant-info .system-message-inner {
  background: var(--ui-info-surface);
  color: var(--ui-info-text);
}

:is(html, html.dark-theme) .ui-messenger #chat-messages > .system-message.variant-warning .system-message-inner {
  background: var(--ui-attention-surface);
  color: var(--ui-attention-text);
}

:is(html, html.dark-theme) .ui-messenger #chat-messages > .system-message:is(.variant-danger, .variant-success, .variant-info, .variant-warning) .system-message-text {
  color: inherit;
}

/* --- Панель лида ----------------------------------------------------- */
:is(html, html.dark-theme) .ui-messenger .lead-info-panel {
  background: var(--ui-surface);
  color: var(--ui-text);
}

@media (min-width: 1024px) {
  :is(html, html.dark-theme) .ui-messenger .lead-info-panel {
    border-left: 1px solid var(--ui-border);
    border-radius: 0;
    box-shadow: none;
  }
}

:is(html, html.dark-theme) .ui-messenger .lead-info-panel .grabber-bar {
  background: var(--ui-border-strong);
}

:is(html, html.dark-theme) .ui-messenger .lead-info-panel .lead-info-content {
  padding: 16px 16px 40px;
}

:is(html, html.dark-theme) .ui-messenger .lead-profile-top {
  gap: 12px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
}

:is(html, html.dark-theme) .ui-messenger .lead-profile-avatar {
  width: 48px;
  height: 48px;
  flex-basis: 48px;
  font-size: 17px;
}

:is(html, html.dark-theme) .ui-messenger .lead-profile-meta {
  flex: 1;
  gap: 2px;
}

:is(html, html.dark-theme) .ui-messenger .lead-profile-name {
  color: var(--ui-text-strong);
  font-size: 16px;
  font-weight: 650;
  line-height: 22px;
}

:is(html, html.dark-theme) .ui-messenger .lead-profile-username {
  overflow: hidden;
  color: var(--ui-text-subdued);
  font-size: 13px;
  font-weight: 400;
  text-overflow: ellipsis;
  white-space: nowrap;
}

:is(html, html.dark-theme) .ui-messenger .lead-profile-username:empty {
  display: none;
}

:is(html, html.dark-theme) .ui-messenger .lead-panel-close svg {
  width: 16px;
  height: 16px;
}

/* На телефоне панель — шторка с ручкой, крестик там лишний. */
@media (max-width: 1023px) {
  :is(html, html.dark-theme) .ui-messenger .lead-panel-close {
    display: none;
  }
}

/* ID лида: подпись слева, значение справа, копирование по наведению. */
.ui-messenger .lead-facts {
  display: grid;
  margin: 14px 0 0;
  padding: 4px 0;
  border-radius: var(--ui-radius-control);
  background: var(--ui-surface-subdued);
}

.ui-messenger .lead-facts__row {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr) 24px;
  align-items: center;
  gap: 8px;
  min-height: 30px;
  padding: 0 6px 0 12px;
  font-size: 13px;
}

.ui-messenger .lead-facts__row.is-empty {
  display: none !important;
}

.ui-messenger .lead-facts dt {
  color: var(--ui-text-subdued);
  font-weight: 400;
}

.ui-messenger .lead-facts dd {
  margin: 0;
  overflow: hidden;
  color: var(--ui-text);
  font-variant-numeric: tabular-nums;
  text-overflow: ellipsis;
  white-space: nowrap;
}

:is(html, html.dark-theme) .ui-messenger :is(.lead-facts__copy, .lead-widget-site-row .lead-copy-btn) {
  display: inline-grid;
  place-items: center;
  width: 24px;
  height: 24px;
  min-width: 24px;
  padding: 0;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--ui-text-subdued);
  cursor: pointer;
  opacity: 0;
  transition: opacity .15s ease, background-color .15s ease, color .15s ease;
}

:is(html, html.dark-theme) .ui-messenger :is(.lead-facts__row, .lead-widget-site-row):is(:hover, :focus-within) :is(.lead-facts__copy, .lead-copy-btn),
:is(html, html.dark-theme) .ui-messenger :is(.lead-facts__copy, .lead-copy-btn):is(.tt-copy-btn--done, .tt-copy-btn--error) {
  opacity: 1;
}

:is(html, html.dark-theme) .ui-messenger :is(.lead-facts__copy, .lead-widget-site-row .lead-copy-btn):hover {
  background: var(--ui-surface-selected);
  color: var(--ui-text-strong);
}

:is(html, html.dark-theme) .ui-messenger :is(.lead-facts__copy, .lead-widget-site-row .lead-copy-btn) svg {
  display: block;
  width: 14px;
  height: 14px;
  margin: 0 !important;
}

@media (hover: none) {
  :is(html, html.dark-theme) .ui-messenger :is(.lead-facts__copy, .lead-widget-site-row .lead-copy-btn) {
    opacity: 1;
  }
}

/* Секции: заголовок, короткое пояснение, содержимое; между секциями — линия. */
:is(html, html.dark-theme) .ui-messenger .lead-profile-section {
  margin: 16px 0 0;
  padding: 16px 0 0;
  border-top: 1px solid var(--ui-divider);
}

:is(html, html.dark-theme) .ui-messenger .lead-info-panel .ver-section-title {
  margin: 0 0 8px;
  color: var(--ui-text-strong);
  font-size: 14px;
  font-weight: 650;
  line-height: 20px;
}

:is(html, html.dark-theme) .ui-messenger .lead-section-hint,
:is(html, html.dark-theme) .ui-messenger .lead-info-panel :is(.lead-widget-site-empty, .lead-automation-empty) {
  margin: 0 0 10px;
  color: var(--ui-text-subdued);
  font-size: 13px;
  line-height: 1.45;
}

:is(html, html.dark-theme) .ui-messenger .lead-info-panel :is(.lead-widget-site-empty, .lead-automation-empty) {
  margin: 0;
}

:is(html, html.dark-theme) .ui-messenger .lead-info-panel .lead-widget-site-empty.is-hidden {
  display: none;
}

:is(html, html.dark-theme) .ui-messenger .lead-actions-conversion-controls {
  gap: 8px;
}

:is(html, html.dark-theme) .ui-messenger .lead-actions-conversion-controls #lead-actions-conversion-dd {
  flex: 1 1 0;
  min-width: 0;
}

:is(html, html.dark-theme) .ui-messenger .lead-actions-conversion-controls #lead-actions-send {
  flex: 0 0 auto;
  width: auto;
}

:is(html, html.dark-theme) .ui-messenger #lead-actions-conversion-dd .crm-dd-btn {
  height: 36px;
  min-height: 36px;
  border: 1px solid var(--ui-border-strong);
  border-radius: var(--ui-radius-control);
  background: var(--ui-surface);
  color: var(--ui-text);
  font-size: 14px;
}

/* Кнопки панели — как ui-btn: «Отправить» основная, блокировка — вторичная красная. */
:is(html, html.dark-theme) .ui-messenger .lead-info-panel :is(#lead-actions-send, #lead-block-btn) {
  min-height: 36px;
  padding: 0 14px;
  border: 1px solid var(--ui-border-strong);
  border-radius: var(--ui-radius-control);
  background: var(--ui-surface);
  color: var(--ui-text);
  box-shadow: 0 1px 0 var(--ui-btn-edge);
  font-size: 13px;
  font-weight: 600;
  transition: var(--ui-motion);
}

:is(html, html.dark-theme) .ui-messenger .lead-info-panel :is(#lead-actions-send, #lead-block-btn):hover {
  background: var(--ui-surface-hover);
  transform: var(--ui-lift);
}

:is(html, html.dark-theme) .ui-messenger .lead-info-panel #lead-actions-send {
  border-color: transparent;
  background: var(--ui-primary);
  color: var(--ui-primary-text);
  box-shadow: 0 1px 0 var(--ui-btn-edge-bottom);
}

:is(html, html.dark-theme) .ui-messenger .lead-info-panel #lead-actions-send:hover {
  background: var(--ui-primary-hover);
}

:is(html, html.dark-theme) .ui-messenger .lead-info-panel #lead-block-btn.is-danger {
  color: var(--ui-critical);
}

:is(html, html.dark-theme) .ui-messenger .lead-profile-section--danger #lead-block-btn {
  width: 100%;
  margin-bottom: 8px;
}

:is(html, html.dark-theme) .ui-messenger .lead-profile-section--danger .lead-section-hint {
  margin: 0;
  font-size: 12px;
}

/* Метки и параметры: подпись и значение в строку, копирование по наведению. */
:is(html, html.dark-theme) .ui-messenger .lead-widget-site-rows {
  margin: 0;
  border-radius: var(--ui-radius-control);
  background: var(--ui-surface-subdued);
}

:is(html, html.dark-theme) .ui-messenger .lead-widget-site-rows:empty {
  display: none;
}

:is(html, html.dark-theme) .ui-messenger .lead-widget-site-row {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr) 24px;
  gap: 8px;
  min-height: 30px;
  padding: 3px 6px 3px 12px;
  border: 0;
  font-size: 13px;
}

:is(html, html.dark-theme) .ui-messenger .lead-widget-site-row .label {
  overflow: hidden;
  color: var(--ui-text-subdued);
  font-weight: 400;
  text-overflow: ellipsis;
  white-space: nowrap;
}

:is(html, html.dark-theme) .ui-messenger .lead-widget-site-row .label::after {
  content: none;
}

:is(html, html.dark-theme) .ui-messenger .lead-widget-site-row .value {
  overflow: hidden;
  color: var(--ui-text);
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Правка значения прямо в строке: поле на месте значения, справа «Сохранить» и «Отмена». */
:is(html, html.dark-theme) .ui-messenger .lead-widget-site-row.is-editing {
  grid-template-columns: 96px minmax(0, 1fr) auto;
  align-items: center;
  padding-right: 4px;
}

:is(html, html.dark-theme) .ui-messenger .widget-param-edit-input {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  height: 28px;
  padding: 0 8px;
  border: 1px solid var(--ui-border-strong);
  border-radius: 8px;
  background: var(--ui-surface);
  color: var(--ui-text);
  font: 450 13px/1 var(--ui-font);
}

:is(html, html.dark-theme) .ui-messenger .widget-param-edit-input:focus {
  border-color: var(--ui-field-focus);
  outline: 0;
  box-shadow: 0 0 0 3px var(--ui-field-ring);
}

:is(html, html.dark-theme) .ui-messenger .widget-param-edit-input.input-error {
  border-color: var(--ui-critical);
}

:is(html, html.dark-theme) .ui-messenger .widget-param-edit-actions {
  display: flex;
  gap: 2px;
}

:is(html, html.dark-theme) .ui-messenger .lead-widget-site-row.is-editing .lead-copy-btn {
  display: none;
}

:is(html, html.dark-theme) .ui-messenger .widget-param-add-trigger {
  justify-content: flex-start;
  width: auto;
  margin-top: 4px;
  padding: 6px 8px;
  border: 0;
  border-radius: 8px;
  color: var(--ui-text-subdued);
  font-size: 13px;
  font-weight: 550;
}

:is(html, html.dark-theme) .ui-messenger .widget-param-add-trigger:hover {
  background: var(--ui-surface-hover);
  color: var(--ui-text-strong);
}

/* Форма нового параметра: два поля, под ними «Отмена» и «Добавить»;
   пока форма открыта, кнопка «Добавить параметр» не нужна. */
:is(html, html.dark-theme) .ui-messenger .lead-widget-param-add-area:has(.widget-param-add-form:not(.is-hidden)) .widget-param-add-trigger {
  display: none;
}

:is(html, html.dark-theme) .ui-messenger .widget-param-add-form {
  gap: 8px;
  margin-top: 10px;
}

:is(html, html.dark-theme) .ui-messenger .widget-param-add-form .widget-param-add-cancel {
  order: 3;
}

:is(html, html.dark-theme) .ui-messenger .widget-param-add-form .widget-param-add-save {
  order: 4;
}

:is(html, html.dark-theme) .ui-messenger .widget-param-add-form input.input-error {
  border-color: var(--ui-critical);
}

:is(html, html.dark-theme) .ui-messenger .widget-param-add-form input {
  height: 36px;
  border: 1px solid var(--ui-border-strong);
  border-radius: var(--ui-radius-control);
  background: var(--ui-surface);
  color: var(--ui-text);
  font-size: 13px;
}

:is(html, html.dark-theme) .ui-messenger .widget-param-add-form input:focus {
  border-color: var(--ui-field-focus);
  outline: 0;
  box-shadow: 0 0 0 3px var(--ui-field-ring);
}

:is(html, html.dark-theme) .ui-messenger .widget-param-add-form input::placeholder {
  color: var(--ui-text-subdued);
}

/* Шапка чата при открытой панели: имя и дата обрезаются, а не наезжают на кнопки. */
:is(html, html.dark-theme) .ui-messenger .chat-header-top-left,
:is(html, html.dark-theme) .ui-messenger .lead-main-info-left,
:is(html, html.dark-theme) .ui-messenger .lead-main-text {
  min-width: 0;
}

:is(html, html.dark-theme) .ui-messenger .lead-meta-row,
:is(html, html.dark-theme) .ui-messenger .lead-created {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

:is(html, html.dark-theme) .ui-messenger .chat-header-top #pipeline-stage-icon-btn {
  max-width: min(320px, 28vw);
}

/* Узкая шапка (открыта панель лида): первым сжимается этап — его название обрезается
   многоточием; имя и теги держат минимум места, теги идут в строку, а не столбиком. */
:is(html, html.dark-theme) .ui-messenger .chat-header-top .chat-header-top-left {
  flex: 1 1 auto;
  min-width: 180px;
}

:is(html, html.dark-theme) .ui-messenger .chat-header-top .chat-header-top-right {
  flex: 0 1 auto;
  min-width: 0;
}

:is(html, html.dark-theme) .ui-messenger .chat-header-top #pipeline-stage-icon-btn {
  flex: 0 1 auto;
  min-width: 0;
}

:is(html, html.dark-theme) .ui-messenger .chat-header-top #pipeline-stage-icon-btn .chat-quick-action-btn__label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

:is(html, html.dark-theme) .ui-messenger .chat-header-top :is(.lead-main-info-left, .lead-main-text, .lead-meta-row, #chat-tag-wrapper) {
  flex: 1 1 auto;
}

:is(html, html.dark-theme) .ui-messenger .chat-header-top :is(#chat-tag-display, .chat-tag-list) {
  flex: 0 1 auto;
  flex-wrap: nowrap;
  min-width: 0;
  overflow: hidden;
}

:is(html, html.dark-theme) .ui-messenger .chat-header-top :is(.tag-pill, #chat-tag-edit) {
  flex: 0 0 auto;
}

/* --- Всплывающие окна: фильтры, пуши, настройки ----------------------- */
.ui-messenger {
  --brand: var(--ui-text-strong);
}

/* Окно не затемняет весь экран: подложка остаётся только для клика мимо. */
:is(html, html.dark-theme) .ui-messenger .chat-actions-backdrop {
  background: transparent;
}

:is(html, html.dark-theme) .ui-messenger .filters-content.popover-mode {
  border: 0;
  border-radius: var(--ui-radius-card);
  background: var(--ui-surface);
  box-shadow: var(--ui-shadow-popover);
  color: var(--ui-text);
}

:is(html, html.dark-theme) .ui-messenger .filters-content .messanger.tab-content {
  padding: 16px;
  background: transparent;
}

/* Фильтры в две колонки парами: воронка и этап, статус и теги, реклама и дата. */
:is(html, html.dark-theme) .ui-messenger #filters-tab.active {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 12px;
}

:is(html, html.dark-theme) .ui-messenger #filters-tab > * {
  grid-column: 1 / -1;
}

:is(html, html.dark-theme) .ui-messenger #filters-tab > .filter-group:has(.crm-dropdown, select) {
  grid-column: auto;
}

:is(html, html.dark-theme) .ui-messenger #filters-tab > #sidebar-msg-search-wrap { order: 0; grid-column: 1 / -1; }
:is(html, html.dark-theme) .ui-messenger #filters-tab > .filter-group:has(#pipeline-filter) { order: 1; }
:is(html, html.dark-theme) .ui-messenger #filters-tab > .filter-group:has(#stage-filter) { order: 2; }
:is(html, html.dark-theme) .ui-messenger #filters-tab > .filter-group:has(#status-filter) { order: 3; }
:is(html, html.dark-theme) .ui-messenger #filters-tab > #tags-filter-group { order: 4; }
:is(html, html.dark-theme) .ui-messenger #filters-tab > #chat-ad-filter-group { order: 5; }
:is(html, html.dark-theme) .ui-messenger #filters-tab > .filter-group:has(#chat-created-date-dd) { order: 6; }
:is(html, html.dark-theme) .ui-messenger #filters-tab > #chat-admin-groups-filter-group { order: 7; }
:is(html, html.dark-theme) .ui-messenger #filters-tab > .filter-group:has(.form-check) { order: 8; grid-column: 1 / -1; }
:is(html, html.dark-theme) .ui-messenger #filters-tab > .buttons-wrapper { order: 9; }

@media (max-width: 520px) {
  :is(html, html.dark-theme) .ui-messenger #filters-tab.active {
    grid-template-columns: minmax(0, 1fr);
  }
}

:is(html, html.dark-theme) .ui-messenger #filters-tab .filter-group {
  min-width: 0;
  margin-bottom: 12px;
}

:is(html, html.dark-theme) .ui-messenger #filters-tab .filter-group > label {
  margin-bottom: 6px;
  color: var(--ui-text);
  font-size: 13px;
  font-weight: 550;
}

:is(html, html.dark-theme) .ui-messenger #filters-tab :is(.crm-dd-btn, select.filter-select, #sidebar-global-msg-search) {
  height: 36px;
  min-height: 36px;
  padding: 0 12px;
  border: 1px solid var(--ui-border-strong);
  border-radius: var(--ui-radius-control);
  background-color: var(--ui-surface);
  color: var(--ui-text);
  box-shadow: none;
  font-size: 14px;
}

:is(html, html.dark-theme) .ui-messenger #filters-tab :is(.crm-dd-btn, select.filter-select):disabled,
:is(html, html.dark-theme) .ui-messenger #filters-tab .crm-dd-btn[aria-disabled="true"] {
  background-color: var(--ui-surface-subdued);
  color: var(--ui-text-disabled);
}

:is(html, html.dark-theme) .ui-messenger #filters-tab #sidebar-global-msg-search::placeholder {
  color: var(--ui-text-subdued);
}

:is(html, html.dark-theme) .ui-messenger #filters-tab :is(.crm-dd-btn, select.filter-select, #sidebar-global-msg-search):focus {
  border-color: var(--ui-field-focus);
  outline: 0;
  box-shadow: 0 0 0 3px var(--ui-field-ring);
}

/* Выбранный фильтр видно сразу: поле с непустым значением выделено. */
:is(html, html.dark-theme) .ui-messenger #filters-tab .crm-dd-btn[data-has-filters="1"] {
  border-color: var(--ui-text-strong);
}

:is(html, html.dark-theme) .ui-messenger #filters-tab .filter-group .form-check {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 32px;
  margin: 0;
  padding: 0;
}

:is(html, html.dark-theme) .ui-messenger #filters-tab .filter-group .form-check-label {
  margin: 0;
  color: var(--ui-text);
  font-size: 14px;
  cursor: pointer;
}

:is(html, html.dark-theme) .ui-messenger #filters-tab .filter-group:has(.form-check) {
  margin: 0;
}

/* Кнопки всегда видны: прилипают к низу, если окно длиннее экрана. */
:is(html, html.dark-theme) .ui-messenger #filters-tab .buttons-wrapper {
  position: sticky;
  bottom: -16px;
  z-index: 2;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin: 6px -16px -16px;
  padding: 14px 16px 16px;
  border-top: 1px solid var(--ui-divider);
  background: var(--ui-surface);
}

:is(html, html.dark-theme) .ui-messenger :is(#apply-filters, #reset-filters) {
  height: 36px;
  min-height: 36px;
  margin: 0;
  border: 1px solid var(--ui-border-strong);
  border-radius: var(--ui-radius-control);
  background: var(--ui-surface);
  color: var(--ui-text);
  box-shadow: 0 1px 0 var(--ui-btn-edge);
  font-size: 14px;
  font-weight: 600;
  transition: var(--ui-motion);
}

:is(html, html.dark-theme) .ui-messenger :is(#apply-filters, #reset-filters):hover {
  background: var(--ui-surface-hover);
  transform: var(--ui-lift);
}

:is(html, html.dark-theme) .ui-messenger #apply-filters {
  border-color: transparent;
  background: var(--ui-primary);
  color: var(--ui-primary-text);
  box-shadow: 0 1px 0 var(--ui-btn-edge-bottom);
}

:is(html, html.dark-theme) .ui-messenger #apply-filters:hover {
  background: var(--ui-primary-hover);
}

/* Настройки: строки без карточек, переключатель и громкость — нейтральные. */
:is(html, html.dark-theme) .ui-messenger #manager-settings-tab .notif-settings {
  margin: 0;
  padding: 10px 0;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
}

:is(html, html.dark-theme) .ui-messenger #manager-settings-tab .notif-settings + .notif-settings {
  border-top: 1px solid var(--ui-divider);
}

:is(html, html.dark-theme) .ui-messenger #manager-settings-tab .ts-title {
  color: var(--ui-text);
  font-size: 14px;
  font-weight: 550;
}

:is(html, html.dark-theme) .ui-messenger #manager-settings-tab .ts-icon,
:is(html, html.dark-theme) .ui-messenger #manager-settings-tab .range-icon {
  color: var(--ui-text-subdued);
}

:is(html, html.dark-theme) .ui-messenger #manager-settings-tab .ts-value-badge {
  padding: 2px 8px;
  border: 0;
  border-radius: 6px;
  background: var(--ui-neutral-surface);
  color: var(--ui-text-subdued);
  font-size: 12px;
  font-weight: 550;
  font-variant-numeric: tabular-nums;
}

:is(html, html.dark-theme) .ui-messenger .crm-switch-slider {
  background: var(--ui-border-strong);
  box-shadow: none;
}

:is(html, html.dark-theme) .ui-messenger .crm-switch input:checked + .crm-switch-slider {
  background: var(--ui-primary);
}

html.dark-theme .ui-messenger .crm-switch input:checked + .crm-switch-slider::before {
  background: var(--ui-primary-text);
}

:is(html, html.dark-theme) .ui-messenger .crm-switch input:focus-visible + .crm-switch-slider {
  outline: 2px solid var(--ui-focus);
  outline-offset: 2px;
}

:is(html, html.dark-theme) .ui-messenger #notif-volume-range,
:is(html, html.dark-theme) .ui-messenger #notif-volume-range::-webkit-slider-runnable-track {
  background: linear-gradient(to right, var(--ui-primary) 0%, var(--ui-primary) var(--range-fill, 0%),
    var(--ui-border) var(--range-fill, 0%), var(--ui-border) 100%);
}

:is(html, html.dark-theme) .ui-messenger #notif-volume-range::-webkit-slider-thumb {
  border-color: var(--ui-primary);
  background: var(--ui-surface);
}

:is(html, html.dark-theme) .ui-messenger #notif-volume-range::-moz-range-thumb {
  border-color: var(--ui-primary);
  background: var(--ui-surface);
}

/* Пуши: «Создать пуш» — основная кнопка, под ней последние рассылки или пояснение. */
:is(html, html.dark-theme) .ui-messenger #pushes-tab .add-push-card {
  min-height: 0;
  max-height: none;
  border: 0;
  border-radius: 0;
  background: none;
}

:is(html, html.dark-theme) .ui-messenger #pushes-tab .add-push-card:hover {
  background: none;
}

:is(html, html.dark-theme) .ui-messenger #pushes-tab .add-push-btn {
  width: 100%;
}

:is(html, html.dark-theme) .ui-messenger #pushes-tab .push-groups-list:not(:has(.push-card)) {
  display: none;
}

:is(html, html.dark-theme) .ui-messenger #pushes-tab .push-groups-list:has(.push-card) ~ .push-groups-empty {
  display: none;
}

:is(html, html.dark-theme) .ui-messenger .push-groups-empty {
  margin: 12px 2px 0;
  color: var(--ui-text-subdued);
  font-size: 13px;
  line-height: 1.45;
}

:is(html, html.dark-theme) .ui-messenger #pushes-tab .push-groups-list {
  display: grid;
  gap: 8px;
  min-height: 0;
  margin-top: 12px;
}

:is(html, html.dark-theme) .ui-messenger #pushes-tab .push-card {
  padding: 12px;
  border: 0;
  border-radius: var(--ui-radius-control);
  background: var(--ui-surface-subdued);
  box-shadow: none;
}

:is(html, html.dark-theme) .ui-messenger #pushes-tab .push-card:hover {
  background: var(--ui-surface-hover);
  color: inherit;
}

:is(html, html.dark-theme) .ui-messenger #pushes-tab .push-card__title {
  color: var(--ui-text-strong);
  font-size: 14px;
  font-weight: 600;
}

:is(html, html.dark-theme) .ui-messenger #pushes-tab .progress {
  height: 4px;
  border-radius: 2px;
  background: var(--ui-border);
}

:is(html, html.dark-theme) .ui-messenger #pushes-tab .progress-bar:not(.progress-bar--rest) {
  background: var(--ui-text-strong);
}

/* --- Окно «Фильтр по рекламе» ---------------------------------------- */
.ui-messenger .chat-ad-filter-modal {
  --text: var(--ui-text);
  --text-main: var(--ui-text);
  --text-muted: var(--ui-text-subdued);
  --bg-white: var(--ui-surface);
  --bg-elevated: var(--ui-surface);
  --bg-soft: var(--ui-surface-hover);
  --bg-soft-2: var(--ui-surface);
  --bg-soft-3: var(--ui-surface-hover);
  --border: var(--ui-border);
  --border-strong: var(--ui-border-strong);
  --primary-ink: var(--ui-text-strong);
  --primary-light: var(--ui-surface-selected);
  --shadow-lg: var(--ui-shadow-popover);
}

:is(html, html.dark-theme) .ui-messenger .chat-ad-filter-modal {
  background: rgba(0, 0, 0, .4);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

:is(html, html.dark-theme) .ui-messenger .chat-ad-filter-modal__dialog {
  width: min(960px, calc(100vw - 48px));
  border: 0;
  border-radius: var(--ui-radius-modal);
  background: var(--ui-surface);
  box-shadow: var(--ui-shadow-modal);
  color: var(--ui-text);
  font-family: var(--ui-font);
}

:is(html, html.dark-theme) .ui-messenger .chat-ad-filter-modal__header {
  min-height: 0;
  padding: 16px 20px;
  border-bottom: 1px solid var(--ui-divider);
  background: var(--ui-surface);
}

:is(html, html.dark-theme) .ui-messenger .chat-ad-filter-modal__title {
  color: var(--ui-text-strong);
  font-size: 18px;
  font-weight: 650;
}

:is(html, html.dark-theme) .ui-messenger .chat-ad-filter-modal__close {
  flex-basis: 32px;
  width: 32px;
  height: 32px;
  margin: 0;
  border-radius: 8px;
  color: var(--ui-text-subdued);
  font-size: 24px;
}

:is(html, html.dark-theme) .ui-messenger .chat-ad-filter-modal__body {
  padding: 20px;
}

:is(html, html.dark-theme) .ui-messenger .chat-ad-filter-modal__section-title {
  margin: 0 0 12px;
  color: var(--ui-text-strong);
  font-size: 15px;
  font-weight: 650;
}

:is(html, html.dark-theme) .ui-messenger .chat-ad-filter-modal .chat-ad-filter-field__label {
  color: var(--ui-text);
  font-size: 13px;
  font-weight: 550;
}

:is(html, html.dark-theme) .ui-messenger .chat-ad-filter-modal .chat-ad-dropdown-toggle {
  min-height: 36px;
  height: 36px;
  border: 1px solid var(--ui-border-strong);
  border-radius: var(--ui-radius-control);
  background: var(--ui-surface);
  font-size: 14px;
}

:is(html, html.dark-theme) .ui-messenger .chat-ad-filter-modal .chat-ad-dropdown-toggle:hover {
  background: var(--ui-surface-hover);
}

/* Открытое поле не приподнимается: панель списка прилегает к нему ровно. */
:is(html, html.dark-theme) .ui-messenger .chat-ad-filter-modal .chat-ad-dropdown-toggle[aria-expanded="true"] {
  transform: none;
}

:is(html, html.dark-theme) .ui-messenger .chat-ad-filter-modal .chat-ad-dropdown-toggle:disabled {
  background: var(--ui-surface-subdued);
  color: var(--ui-text-disabled);
}

:is(html, html.dark-theme) .ui-messenger .chat-ad-filter-modal .chat-ad-dropdown-toggle:focus-visible {
  border-color: var(--ui-field-focus);
  outline: 2px solid var(--ui-focus);
  outline-offset: 1px;
  box-shadow: none;
}

/* Метки трекера без значений в кликах не показываем: выбирать в них нечего. */
:is(html, html.dark-theme) .ui-messenger #chat-ad-quick-params > .chat-ad-filter-field--parameter:has(.chat-ad-dropdown-toggle[aria-disabled="true"]) {
  display: none;
}

.ui-messenger .chat-ad-params-empty {
  display: none;
  margin: 0 0 16px;
  color: var(--ui-text-subdued);
  font-size: 13px;
  line-height: 1.45;
}

.ui-messenger #chat-ad-quick-params:has(> .chat-ad-filter-field--parameter):not(:has(> .chat-ad-filter-field--parameter .chat-ad-dropdown-toggle:not([aria-disabled="true"]))) + .chat-ad-params-empty {
  display: block;
}

/* Кнопки окна справа, как в .ui-modal: «Сбросить», затем основная «Применить». */
:is(html, html.dark-theme) .ui-messenger .chat-ad-filter-modal__footer {
  justify-content: flex-end;
  gap: 8px;
  min-height: 0;
  padding: 12px 20px;
  border-top: 1px solid var(--ui-divider);
  background: var(--ui-surface);
  box-shadow: none;
}

/* Отмеченные пункты в списках окна — нейтральные, как ui-choice. */
:is(html, html.dark-theme) .ui-messenger .chat-ad-dropdown-options li.selected {
  background: var(--ui-surface-selected);
  color: var(--ui-text-strong);
}

/* --- Раскрывающиеся списки страницы мессенджера (crm-dd) --------------
   Открытый список скрипт переносит в <body>, вне .ui-messenger, поэтому
   область — вся страница мессенджера через body:has(). */
:is(html, html.dark-theme) body:has(.ui-messenger) .crm-dd-menu {
  border: 0;
  border-radius: var(--ui-radius-card);
  background: var(--ui-surface);
  box-shadow: var(--ui-shadow-popover);
  color: var(--ui-text);
  font-family: var(--ui-font);
}

/* «Выбрать все / Снять все» — тихие текстовые кнопки, не цветные плашки. */
:is(html, html.dark-theme) body:has(.ui-messenger) .crm-dd-menu .tags-filter-actions {
  display: flex;
  gap: 4px;
  margin: 6px 0 4px;
}

/* Shared select_picker menus keep the same item and hover styles as the tracker. */
:is(html, html.dark-theme) body:has(.ui-messenger) .crm-dd-menu:not(.ps-dropdown-panel) .crm-dd-option {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 32px;
  padding: 6px 8px;
  border-radius: 8px;
  color: var(--ui-text);
  font-size: 13px;
  transform: none;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .crm-dd-menu:not(.ps-dropdown-panel) .crm-dd-option:hover {
  background: var(--ui-surface-hover);
  color: var(--ui-text-strong);
  transform: none;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .crm-dd-menu:not(.ps-dropdown-panel) .crm-dd-option.selected {
  background: var(--ui-surface-selected);
  color: var(--ui-text-strong);
}

/* --- Окно «Создать группу пушей» (#baseModal вне .ui-messenger) -------- */
/* Окно лежит вне .ui-messenger: старые переменные (slate-фон, фиолетовый) переназначаем здесь. */
body:has(.ui-messenger) #baseModal {
  --primary: var(--ui-text-strong);
  --primary-dark: var(--ui-text-strong);
  --primary-light: var(--ui-surface-selected);
  --primary-border: var(--ui-border-strong);
}

html.dark-theme body:has(.ui-messenger) #baseModal {
  --bg-light: var(--ui-bg);
  --bg-white: var(--ui-surface);
  --bg-elevated: var(--ui-surface-hover);
  --bg-soft: var(--ui-surface-hover);
  --bg-soft-2: var(--ui-surface-selected);
  --bg-soft-3: #313339;
  --border: var(--ui-border);
  --border-strong: var(--ui-border-strong);
  --text: var(--ui-text);
  --text-main: var(--ui-text);
  --text-light: var(--ui-text-subdued);
  --text-strong: var(--ui-text-strong);
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm :is(.form-section, .messages-container, .filter-conditions-container) {
  background: transparent;
  box-shadow: none;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm .modal-scroll-body {
  /* Полоса прокрутки съедала ширину справа: прокрутка остаётся, полоса не видна. */
  scrollbar-width: none;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm .modal-scroll-body::-webkit-scrollbar {
  display: none;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm .form-section {
  padding: 0;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm .modal-scroll-body > .form-section + .form-section {
  margin-top: 22px;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm .form-group > label {
  margin-bottom: 8px;
  color: var(--ui-text-strong);
  font-size: 14px;
  font-weight: 650;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm .info-icon {
  color: var(--ui-text-subdued);
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm :is(:is(.form-label, .ui-field__label), .crm-dt-label) {
  margin: 0 0 6px;
  color: var(--ui-text);
  font-size: 13px;
  font-weight: 550;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm :is(input.crm-input, input:is(.form-control, .ui-input):not([type="file"]), .crm-dt-input) {
  height: 36px;
  min-height: 36px;
  padding: 0 12px;
  border: 1px solid var(--ui-border-strong);
  border-radius: var(--ui-radius-control);
  background: var(--ui-surface);
  color: var(--ui-text);
  font-size: 14px;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm textarea {
  min-height: 96px;
  padding: 10px 12px;
  border: 1px solid var(--ui-border-strong);
  border-radius: var(--ui-radius-control);
  background: var(--ui-surface);
  color: var(--ui-text);
  font-size: 14px;
  line-height: 1.45;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm :is(input, textarea)::placeholder {
  color: var(--ui-text-subdued);
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm .push-translation-hint {
  margin-top: 6px;
  color: var(--ui-text-subdued);
  font-size: 12px;
}

/* Условия: карточка с полями-списками, текст слева, как у обычных полей. */
:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm .filter-condition {
  padding: 12px;
  border: 0;
  border-radius: var(--ui-radius-card);
  background: var(--ui-surface-subdued);
  box-shadow: none;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm .filter-condition-head {
  gap: 8px;
  padding-top: 0;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm .transparent-dropdown {
  padding: 0;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm .dropdown-toggle.transparent-dropdown,
:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm .transparent-dropdown .dropdown-toggle {
  justify-content: space-between !important;
  height: 36px;
  min-height: 36px;
  padding: 0 12px;
  border: 1px solid var(--ui-border-strong);
  border-radius: var(--ui-radius-control);
  background: var(--ui-surface);
  color: var(--ui-text);
  box-shadow: none;
  font-size: 14px;
  transform: none;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm .dropdown-toggle.transparent-dropdown:is(:disabled, .is-disabled) {
  background: var(--ui-surface-subdued);
  color: var(--ui-text-subdued);
  opacity: 1;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm .dropdown-menu {
  padding: 6px;
  border: 0;
  border-radius: var(--ui-radius-card);
  background: var(--ui-surface);
  box-shadow: var(--ui-shadow-popover);
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm .dropdown-menu .dropdown-item {
  border-radius: 8px;
  color: var(--ui-text);
  font-size: 13px;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm .dropdown-menu .dropdown-item:hover {
  background: var(--ui-surface-hover);
  color: var(--ui-text-strong);
}

/* Единственное условие удалить нельзя — его крестик помечен is-hidden, но старый CSS его показывал. */
:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm .filter-condition > .remove-condition-btn.is-hidden {
  display: none !important;
}

/* Крестик условия — справа от полей, а не поверх стрелки списка. */
:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm .filter-condition:has(> .remove-condition-btn:not(.is-hidden)) {
  padding-right: 48px;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm .filter-condition > .remove-condition-btn {
  top: 16px;
  right: 12px;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  color: var(--ui-text-subdued);
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm .filter-condition > .remove-condition-btn:hover {
  background: var(--ui-surface-hover);
  color: var(--ui-critical);
}

/* Вторичные действия формы: «Добавить условие / кнопку / сообщение». */
:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm :is(#add-condition-btn, #add-message-btn, [data-action="add-push-button"]) {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  width: auto;
  height: 32px;
  min-height: 32px;
  margin-top: 10px;
  padding: 0 12px;
  border: 1px solid var(--ui-border-strong);
  border-radius: var(--ui-radius-control);
  background: var(--ui-surface);
  color: var(--ui-text);
  box-shadow: 0 1px 0 var(--ui-btn-edge);
  font-size: 13px;
  font-weight: 600;
  transition: var(--ui-motion);
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm :is(#add-condition-btn, #add-message-btn, [data-action="add-push-button"]):hover:not(:disabled) {
  background: var(--ui-surface-hover);
  transform: var(--ui-lift);
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm :is(#add-condition-btn, #add-message-btn, [data-action="add-push-button"]):disabled {
  opacity: .5;
}

/* Сообщение: карточка с текстом, макросами, файлом, закреплением и кнопками. */
:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm .message-block {
  padding: 16px;
  border: 1px solid var(--ui-border);
  border-radius: var(--ui-radius-card);
  background: var(--ui-surface);
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm .message-block__title {
  margin: 0 0 12px;
  color: var(--ui-text-strong);
  font-size: 14px;
  font-weight: 650;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm .message-macro-chip {
  height: 28px;
  padding: 0 10px;
  border: 0;
  border-radius: 8px;
  background: var(--ui-neutral-surface);
  color: var(--ui-text);
  box-shadow: none;
  font-size: 12px;
  font-weight: 550;
  transition: var(--ui-motion);
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm .message-macro-chip:hover {
  background: var(--ui-surface-selected);
  color: var(--ui-text-strong);
  transform: var(--ui-lift);
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm input[type="file"].message-media {
  height: auto;
  padding: 6px;
  border: 1px dashed var(--ui-border-strong);
  border-radius: var(--ui-radius-control);
  background: var(--ui-surface);
  color: var(--ui-text-subdued);
  font-size: 13px;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm input[type="file"].message-media::file-selector-button {
  height: 28px;
  margin-right: 10px;
  padding: 0 12px;
  border: 1px solid var(--ui-border-strong);
  border-radius: 8px;
  background: var(--ui-surface);
  color: var(--ui-text);
  font: inherit;
  font-weight: 600;
  cursor: pointer;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm .message-pin-check {
  gap: 10px;
  margin: 4px 0 0;
  padding: 0;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm .message-pin-check .form-check-label {
  color: var(--ui-text);
  font-size: 14px;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm .push-buttons {
  margin: 14px 0 0;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm .push-button-row {
  padding: 12px;
  border: 0;
  border-radius: var(--ui-radius-control);
  background: var(--ui-surface-subdued);
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm :is(.push-btn-remove, .message-remove-btn) {
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--ui-text-subdued);
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm :is(.push-btn-remove, .message-remove-btn):hover {
  background: var(--ui-surface-hover);
  color: var(--ui-critical);
}

/* Быстрый пуш лиду из шапки: условие зафиксировано — вместо него строка «Получатель». */
:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm[data-quick-push-locked="1"] .form-section:has(#filter-conditions) {
  display: none;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal #createPushForm .push-recipient__name {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 36px;
  padding: 0 12px;
  border-radius: var(--ui-radius-control);
  background: var(--ui-surface-subdued);
  color: var(--ui-text);
  font-size: 14px;
}

/* Поиск в выпадающих меню (crm-dd-search) — общий стиль из ui.css: 32 px и лупа. */
:is(html, html.dark-theme) body:has(.ui-messenger) :is(#baseModal, #baseConfirmationModal) :is(.modal-text-field, .modal-body input[type="text"]:not(.crm-dd-search), .modal-body textarea) {
  min-height: 36px;
  padding: 7px 12px;
  border: 1px solid var(--ui-border-strong);
  border-radius: var(--ui-radius-control);
  background: var(--ui-surface);
  color: var(--ui-text);
  font-size: 14px;
}

:is(html, html.dark-theme) body:has(.ui-messenger) :is(#baseModal, #baseConfirmationModal) :is(.modal-body label, .modal-body :is(.form-label, .ui-field__label)) {
  color: var(--ui-text);
  font-size: 13px;
  font-weight: 550;
}

/* --- Окна .crm-modal: «Детали рассылки», «Все рассылки» --------------- */
:is(html, html.dark-theme) body:has(.ui-messenger) .crm-modal .crm-modal__dialog {
  border: 0;
  border-radius: var(--ui-radius-modal);
  background: var(--ui-surface);
  box-shadow: var(--ui-shadow-modal);
  color: var(--ui-text);
  font-family: var(--ui-font);
}

/* Подвал окна со своим фоном скруглён как само окно (16px): старый modal.css давал 12px,
   и белые углы подвала вылезали за скругление окна — снизу углы выглядели срезанными. */
:is(html, html.dark-theme) body:has(.ui-messenger) .crm-modal .crm-modal__dialog > :is(.crm-modal__footer, .button-wrapper) {
  border-radius: 0 0 var(--ui-radius-modal) var(--ui-radius-modal);
  background: var(--ui-surface);
}

:is(html, html.dark-theme) body:has(.ui-messenger) .crm-modal .crm-modal__header {
  padding: 16px 20px;
  border-bottom: 1px solid var(--ui-divider);
  background: none;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .crm-modal .crm-modal__title {
  color: var(--ui-text-strong);
  font-size: 18px;
  font-weight: 650;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .crm-modal :is(.icon-btn[data-close], .modal-close) {
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--ui-text-subdued);
  box-shadow: none;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .crm-modal :is(.icon-btn[data-close], .modal-close):hover {
  background: var(--ui-surface-hover);
  color: var(--ui-text-strong);
}

:is(html, html.dark-theme) body:has(.ui-messenger) .crm-modal .crm-modal__body {
  padding: 16px 20px;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .crm-modal :is(.filter-btn, .push-refresh) {
  height: 32px;
  border: 1px solid var(--ui-border-strong);
  border-radius: var(--ui-radius-control);
  background: var(--ui-surface);
  color: var(--ui-text);
  box-shadow: none;
  font-size: 13px;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .crm-modal .filter-menu {
  border: 0;
  border-radius: var(--ui-radius-card);
  background: var(--ui-surface);
  box-shadow: var(--ui-shadow-popover);
}

:is(html, html.dark-theme) body:has(.ui-messenger) .crm-modal .filter-menu .item {
  border-radius: 8px;
  color: var(--ui-text);
}

:is(html, html.dark-theme) body:has(.ui-messenger) .crm-modal .filter-menu .item:is(:hover, .is-active) {
  background: var(--ui-surface-selected);
  color: var(--ui-text-strong);
}

/* Карточки рассылок (окно пушей и «Все рассылки»): прогресс и статусы. */
:is(html, html.dark-theme) body:has(.ui-messenger) .push-card {
  padding: 12px;
  border: 0;
  border-radius: var(--ui-radius-control);
  background: var(--ui-surface-subdued);
  box-shadow: none;
  color: var(--ui-text);
  transition: background-color .15s ease;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .push-card:hover {
  border-color: transparent;
  background: var(--ui-surface-hover);
  color: inherit;
  transform: none;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .push-card .push-card__title {
  color: var(--ui-text-strong);
  font-size: 14px;
  font-weight: 600;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .push-card .push-refresh {
  border: 0;
  background: transparent;
  color: var(--ui-text-subdued);
}

:is(html, html.dark-theme) body:has(.ui-messenger) .push-card .progress {
  height: 4px;
  overflow: hidden;
  border-radius: 2px;
  background: var(--ui-border);
}

:is(html, html.dark-theme) body:has(.ui-messenger) .push-card .progress-bar {
  background: var(--ui-text-strong);
  box-shadow: none;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .push-card .progress-bar--rest {
  background: var(--ui-border);
}

:is(html, html.dark-theme) body:has(.ui-messenger) .push-card .progress-bar--rest-failed {
  background: var(--ui-critical);
}

:is(html, html.dark-theme) body:has(.ui-messenger) .push-card .push-card__stats {
  color: var(--ui-text-subdued);
  font-size: 12px;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .status-pill {
  padding: 2px 8px;
  border: 0;
  border-radius: 6px;
  background: var(--ui-neutral-surface);
  color: var(--ui-text);
  box-shadow: none;
  font-size: 12px;
  font-weight: 550;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .status-pill.status-success { background: var(--ui-success-surface); color: var(--ui-success-text); }
:is(html, html.dark-theme) body:has(.ui-messenger) .status-pill.status-failed { background: var(--ui-critical-surface); color: var(--ui-critical-text); }
:is(html, html.dark-theme) body:has(.ui-messenger) .status-pill.status-scheduled { background: var(--ui-info-surface); color: var(--ui-info-text); }
:is(html, html.dark-theme) body:has(.ui-messenger) .status-pill.status-processing { background: var(--ui-attention-surface); color: var(--ui-attention-text); }

:is(html, html.dark-theme) body:has(.ui-messenger) :is(.push-details-list, #all-push-groups-content) :is(.push-detail-item, .push-details-item, li, .push-detail) {
  border-color: var(--ui-border);
  border-radius: var(--ui-radius-control);
  background: var(--ui-surface);
}

/* --- Списки в окне «Фильтр по рекламе»: поиск, пункты, «Очистить / Выбрать» --- */
:is(html, html.dark-theme) body:has(.ui-messenger) .chat-ad-dropdown-panel {
  border: 0;
  border-radius: var(--ui-radius-card);
  background: var(--ui-surface);
  box-shadow: var(--ui-shadow-popover);
  color: var(--ui-text);
  font-family: var(--ui-font);
}

:is(html, html.dark-theme) body:has(.ui-messenger) .chat-ad-dropdown-panel .chat-ad-dropdown-options li {
  border-radius: 8px;
  color: var(--ui-text);
  font-size: 13px;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .chat-ad-dropdown-panel .chat-ad-dropdown-options li:not(.chat-ad-dropdown-empty):hover {
  background: var(--ui-surface-hover);
}

:is(html, html.dark-theme) body:has(.ui-messenger) .chat-ad-dropdown-panel .chat-ad-dropdown-options li.selected {
  background: var(--ui-surface-selected);
  color: var(--ui-text-strong);
}

/* «Нет значений» / «Ничего не найдено» — подсказка, не пункт: без наведения и курсора-руки. */
:is(html, html.dark-theme) body:has(.ui-messenger) .chat-ad-dropdown-panel .chat-ad-dropdown-empty {
  padding: 8px 10px;
  background: none;
  color: var(--ui-text-subdued);
  font-size: 13px;
  cursor: default;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .chat-ad-dropdown-panel .chat-ad-dropdown-footer {
  justify-content: flex-end;
  gap: 8px;
  border-color: var(--ui-divider);
}

/* --- Меню «Данные лида» ({}) и «/» шаблонов ------------------------- */
:is(html, html.dark-theme) body:has(.ui-messenger) .lead-macros-menu .lead-macros-group {
  padding: 8px 8px 4px;
  color: var(--ui-text-subdued);
  font-size: 12px;
  font-weight: 550;
  letter-spacing: 0;
  text-transform: none;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .lead-macros-menu .lm-key {
  border: 0;
  background: none;
  color: var(--ui-text-strong);
  font-weight: 600;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .lead-macros-menu :is(.lm-label, .lm-alias) {
  color: var(--ui-text-subdued);
}

:is(html, html.dark-theme) body:has(.ui-messenger) .lead-macros-menu .lead-macros-hint {
  border-color: var(--ui-divider);
  color: var(--ui-text-subdued);
  font-size: 12px;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .lead-macros-menu .lead-macros-hint * {
  color: inherit;
}

/* --- Панели «Задачи» и «Макросы» над полем ввода ----------------------- */
:is(html, html.dark-theme) body:has(.ui-messenger) .macros-panel {
  border: 0;
  border-radius: var(--ui-radius-card);
  background: var(--ui-surface);
  box-shadow: var(--ui-shadow-popover);
  color: var(--ui-text);
  font-family: var(--ui-font);
}

/* Шапка (поиск, «Создать», вкладки) прилипает к верху: сплошной фон, чтобы список
   при прокрутке уходил под неё, а не просвечивал. */
:is(html, html.dark-theme) body:has(.ui-messenger) .macros-panel :is(.comments-header, .macros-header) {
  padding-bottom: 8px;
  border-color: var(--ui-divider);
  background: var(--ui-surface);
}

/* Вкладки «Актуально / Выполнено», «Индивидуальные / Общие» — сегменты. */
:is(html, html.dark-theme) body:has(.ui-messenger) .macros-panel :is(.comments-tabs, .macros-tabs) {
  gap: 2px;
  padding: 2px;
  border: 0;
  border-radius: var(--ui-radius-control);
  background: var(--ui-neutral-surface);
}

:is(html, html.dark-theme) body:has(.ui-messenger) .macros-panel :is(.comments-tab, .macros-tab-btn) {
  height: 28px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--ui-text-subdued);
  box-shadow: none;
  font-size: 13px;
  font-weight: 550;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .macros-panel :is(.comments-tab, .macros-tab-btn):is(.active, [aria-selected="true"]) {
  background: var(--ui-surface);
  color: var(--ui-text-strong);
  box-shadow: 0 1px 2px rgba(0, 0, 0, .12);
}

/* Поиск макросов — как поле поиска в выпадающих списках (ui.css): 32px, лупа слева. */
:is(html, html.dark-theme) body:not(#_) .macros-panel .macros-search {
  height: 32px;
  min-height: 32px;
  padding: 0 28px 0 32px;
  border: 1px solid var(--ui-border-strong);
  border-radius: 8px;
  background: var(--ui-surface) var(--ui-search-icon) no-repeat 10px 50% / 14px;
  box-shadow: none;
  color: var(--ui-text);
  font: 450 13px/20px var(--ui-font);
}

:is(html, html.dark-theme) body:not(#_) .macros-panel .macros-search::-webkit-search-cancel-button {
  display: none; /* очищает крестик crm-clearable — второй, браузерный, не нужен */
}

:is(html, html.dark-theme) body:not(#_) .macros-panel .macros-search::placeholder {
  color: var(--ui-text-subdued);
  opacity: 1;
}

:is(html, html.dark-theme) body:not(#_) .macros-panel .macros-search:focus {
  outline: none !important;
  border-color: var(--ui-field-focus) !important;
  box-shadow: 0 0 0 3px var(--ui-field-ring) !important;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .macros-panel :is(.comment-item, .macro-item, .macros-item) {
  border: 0;
  border-radius: var(--ui-radius-control);
  background: var(--ui-surface-subdued);
  box-shadow: none;
  color: var(--ui-text);
}

:is(html, html.dark-theme) body:has(.ui-messenger) .macros-panel .comment-meta {
  color: var(--ui-text-subdued);
  font-size: 12px;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .macros-panel .comment-meta .author {
  color: var(--ui-text);
  font-weight: 600;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .macros-panel .comment-text {
  color: var(--ui-text);
  font-size: 13px;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .macros-panel :is(.macros-empty, .comments-empty) {
  border: 0;
  background: none;
  color: var(--ui-text-subdued);
  font-size: 13px;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .macros-panel .comments-add-text {
  border: 1px solid var(--ui-border-strong);
  border-radius: var(--ui-radius-control);
  background: var(--ui-surface);
  color: var(--ui-text);
  font-size: 14px;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .macros-panel .comments-add-actions {
  justify-content: flex-end;
}

/* --- Меню этапов воронки в шапке ----------------------------------------- */
:is(html, html.dark-theme) body:has(.ui-messenger) .pipeline-dropdown-menu {
  padding: 6px;
  border: 0;
  border-radius: var(--ui-radius-card);
  background: var(--ui-surface);
  box-shadow: var(--ui-shadow-popover);
  color: var(--ui-text);
  font-family: var(--ui-font);
}

:is(html, html.dark-theme) body:has(.ui-messenger) .pipeline-dropdown-menu .pipeline-item {
  border: 0;
  border-radius: var(--ui-radius-control);
  background: transparent;
  box-shadow: none;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .pipeline-dropdown-menu .pipeline-header {
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--ui-text-strong);
  font-weight: 600;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .pipeline-dropdown-menu :is(.pipeline-header:hover, .pipeline-item.current-pipeline > .pipeline-header) {
  border: 0;
  background: var(--ui-surface-hover);
  box-shadow: none;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .pipeline-dropdown-menu .stage-item {
  border-radius: 8px;
  color: var(--ui-text);
}

:is(html, html.dark-theme) body:has(.ui-messenger) .pipeline-dropdown-menu .stage-item:hover {
  background: var(--ui-surface-hover);
  color: var(--ui-text-strong);
  transform: none;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .pipeline-dropdown-menu .stage-item.current-stage {
  background: var(--ui-surface-selected);
  color: var(--ui-text-strong);
  font-weight: 600;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .pipeline-dropdown-menu .toggle-stages-btn {
  color: var(--ui-text-subdued);
}

/* --- Контекстные меню сообщения и чата: светлые в светлой теме ---------- */
:is(html, html.dark-theme) body:has(.ui-messenger) .crm-context-menu {
  padding: 6px;
  border: 0;
  border-radius: var(--ui-radius-card);
  background: var(--ui-surface);
  box-shadow: var(--ui-shadow-popover);
  color: var(--ui-text);
  font-family: var(--ui-font);
}

:is(html, html.dark-theme) body:has(.ui-messenger) .crm-context-menu .crm-context-menu__item {
  border-radius: 8px;
  color: var(--ui-text);
  font-size: 13px;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .crm-context-menu .crm-context-menu__item:hover {
  background: var(--ui-surface-hover);
  color: var(--ui-text-strong);
}

:is(html, html.dark-theme) body:has(.ui-messenger) .crm-context-menu .crm-context-menu__item-icon {
  color: var(--ui-text-subdued);
}

:is(html, html.dark-theme) body:has(.ui-messenger) .crm-context-menu :is(.crm-context-menu__item--danger, .crm-context-menu__item.is-danger) {
  color: var(--ui-critical);
}

/* --- Теги в строках списка чатов: нейтральные плашки, как в шапке чата.
   Цвет тегу скрипт пишет в style (тёмные плашки и в светлой теме) — перебиваем. */
:is(html, html.dark-theme) body:has(.ui-messenger) .chat-item-tags .ci-tag {
  height: 20px;
  padding: 0 8px;
  border: 0;
  border-radius: 6px;
  background: var(--ui-neutral-surface) !important;
  color: var(--ui-text) !important;
  box-shadow: none;
  font-size: 12px;
  font-weight: 550;
}

/* --- Окно подтверждения (блокировка лида, удаление): рамка ui, кнопки справа --- */
:is(html, html.dark-theme) body:has(.ui-messenger) .crm-modal--confirm .crm-modal__footer {
  display: flex;
  justify-content: flex-end;
  gap: 8px !important;
  padding: 12px 20px;
  border-top: 1px solid var(--ui-divider);
}

:is(html, html.dark-theme) body:has(.ui-messenger) .crm-modal--confirm .confirm-message {
  color: var(--ui-text);
  font-size: 14px;
  line-height: 1.5;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .crm-modal .crm-modal__backdrop {
  background: rgba(0, 0, 0, .4);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

/* --- Автоворонка в панели лида: название, статус и «Остановить» --------- */
:is(html, html.dark-theme) body:has(.ui-messenger) .automation-run-pill {
  gap: 8px;
  padding: 8px 8px 8px 12px;
  border: 0;
  border-radius: var(--ui-radius-control);
  background: var(--ui-surface-subdued);
  box-shadow: none;
  color: var(--ui-text);
  font-size: 13px;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .automation-run-pill .automation-run-pill__status {
  padding: 1px 8px;
  border: 0;
  border-radius: 6px;
  background: var(--ui-attention-surface);
  color: var(--ui-attention-text);
  font-size: 12px;
  font-weight: 550;
  letter-spacing: 0;
  text-transform: none;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .automation-run-pill--running .automation-run-pill__status {
  background: var(--ui-success-surface);
  color: var(--ui-success-text);
}

:is(html, html.dark-theme) body:has(.ui-messenger) .automation-run-pill .automation-run-pill__status::before {
  content: none;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .automation-run-pill .automation-run-pill__stop {
  height: 28px;
  padding: 0 10px;
  border: 1px solid var(--ui-border-strong);
  border-radius: 8px;
  background: var(--ui-surface);
  color: var(--ui-critical);
  box-shadow: none;
  font-size: 12px;
  font-weight: 600;
}

/* --- Доработки после проверки блоков ------------------------------------ */
/* Карточки рассылок в узком окне не шире самого окна. */
:is(html, html.dark-theme) .ui-messenger #pushes-tab {
  overflow-x: hidden;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .push-card {
  box-sizing: border-box;
  width: auto;
  min-width: 0;
  max-width: 100%;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .push-card .push-card__header,
:is(html, html.dark-theme) body:has(.ui-messenger) .push-card .push-card__stats {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .push-card .push-card__title {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .push-card .push-card__progress {
  display: grid;
  gap: 8px;
  margin-top: 10px;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .push-card .status-pill {
  flex: 0 0 auto;
  white-space: nowrap;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .push-card .push-refresh {
  width: 28px;
  height: 28px;
  border-radius: 8px;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .push-card .push-refresh:hover {
  background: var(--ui-surface-selected);
  color: var(--ui-text-strong);
}

:is(html, html.dark-theme) body:has(.ui-messenger) .push-card .push-refresh svg {
  fill: currentColor;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .macros-panel :is(.comment-item, .macros-item) {
  box-shadow: none !important;
}

/* Макросы: «изменить» и «удалить» (и подтверждение удаления) — тихие иконки как
   .ui-btn--plain: наведение — подъём и смена цвета, удаление краснеет. */
:is(html, html.dark-theme) body:has(.ui-messenger) .macros-item .mi-actions :is(.mi-edit-btn, .mi-delete-btn, .mi-confirm-btn, .mi-cancel-btn) {
  width: 28px;
  height: 28px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--ui-text-subdued);
  transition: var(--ui-motion);
}

:is(html, html.dark-theme) body:has(.ui-messenger) .macros-item .mi-actions :is(.mi-edit-btn, .mi-delete-btn, .mi-confirm-btn, .mi-cancel-btn) svg {
  width: 16px;
  height: 16px;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .macros-item .mi-actions :is(.mi-edit-btn, .mi-cancel-btn):hover {
  border: 0;
  background: var(--ui-neutral-surface);
  color: var(--ui-text-strong);
  transform: var(--ui-lift);
}

:is(html, html.dark-theme) body:has(.ui-messenger) .macros-item .mi-actions .mi-delete-btn:hover {
  border: 0;
  background: var(--ui-critical-surface);
  color: var(--ui-critical-text);
  transform: var(--ui-lift);
}

/* «Подтвердить удаление» — красная кнопка, как danger-действие в диалогах. */
:is(html, html.dark-theme) body:has(.ui-messenger) .macros-item .mi-actions .mi-confirm-btn {
  background: var(--ui-critical);
  color: #fff;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .macros-item .mi-actions .mi-confirm-btn:hover {
  background: var(--ui-critical-hover);
  color: #fff;
  transform: var(--ui-lift);
}

:is(html, html.dark-theme) body:has(.ui-messenger) .macros-item .mi-actions .mi-confirm-actions {
  gap: 4px;
}

@media (prefers-reduced-motion: reduce) {
  :is(html, html.dark-theme) body:has(.ui-messenger) .macros-item .mi-actions button:hover {
    transform: none;
  }
}

:is(html, html.dark-theme) body:has(.ui-messenger) .macros-item .mi-title {
  color: var(--ui-text-strong);
}

:is(html, html.dark-theme) body:has(.ui-messenger) .macros-item .mi-text {
  color: var(--ui-text-subdued);
}

/* Меню этапов: текущая воронка без фиолетовой полосы слева. */
:is(html, html.dark-theme) body:has(.ui-messenger) .pipeline-dropdown-menu .pipeline-header {
  padding: 8px 10px;
  border: 0 !important;
  border-radius: 8px;
  background: transparent;
  color: var(--ui-text-strong);
}

:is(html, html.dark-theme) body:has(.ui-messenger) .pipeline-dropdown-menu .pipeline-header:is(:hover, .current) {
  border: 0 !important;
  background: var(--ui-surface-hover);
  color: var(--ui-text-strong);
}

:is(html, html.dark-theme) body:has(.ui-messenger) .pipeline-dropdown-menu .stages-container {
  margin: 2px 0 6px 12px;
  padding-left: 6px;
  border-left: 1px solid var(--ui-divider);
}

:is(html, html.dark-theme) body:has(.ui-messenger) .pipeline-dropdown-menu .stage-item {
  margin: 0;
  padding: 7px 10px;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .pipeline-dropdown-menu .stage-item:is(.active, .is-selected, .current-stage) {
  background: var(--ui-surface-selected);
  color: var(--ui-text-strong);
}

:is(html, html.dark-theme) body:has(.ui-messenger) .pipeline-dropdown-menu .stage-item:is(.active, .is-selected, .current-stage) .stage-content {
  color: inherit;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .pipeline-dropdown-menu .toggle-stages-btn {
  color: var(--ui-text-subdued);
}

/* Контекстные меню: светлые, разделитель и «опасные» пункты читаемые. */
:is(html, html.dark-theme) body:has(.ui-messenger) .crm-context-menu {
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .crm-context-menu .crm-context-menu__item {
  padding: 8px 10px;
  background: transparent;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .crm-context-menu .crm-context-menu__item:is(:hover, :focus) {
  background: var(--ui-surface-hover);
}

:is(html, html.dark-theme) body:has(.ui-messenger) .crm-context-menu .crm-context-menu__item--danger,
:is(html, html.dark-theme) body:has(.ui-messenger) .crm-context-menu .crm-context-menu__item--danger .crm-context-menu__item-icon {
  color: var(--ui-critical);
}

:is(html, html.dark-theme) body:has(.ui-messenger) .crm-context-menu .crm-context-menu__item--danger:is(:hover, :focus),
:is(html, html.dark-theme) body:has(.ui-messenger) .crm-context-menu .crm-context-menu__item--danger:is(:hover, :focus) .crm-context-menu__item-icon {
  background: var(--ui-critical-surface);
  color: var(--ui-critical-text);
}

:is(html, html.dark-theme) body:has(.ui-messenger) .crm-context-menu .crm-context-menu__sep {
  background: var(--ui-divider);
}

/* --- Окно «Создать / изменить макрос» (#baseModal) ----------------------- */
:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal .macro-form .form-row > label {
  margin-bottom: 6px !important;
  color: var(--ui-text);
  font-size: 13px;
  font-weight: 550 !important;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal .macro-form .form-row > label span {
  color: var(--ui-critical) !important;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal .macro-form .field-hint {
  margin-top: 6px;
  color: var(--ui-text-subdued);
  font-size: 12px;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal .macro-form .modal-text-field--multiline {
  min-height: 96px;
  line-height: 1.45;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal .macro-form .form-check-label {
  color: var(--ui-text);
  font-size: 14px;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal .crm-dropdown .crm-dd-btn {
  height: 36px;
  min-height: 36px;
  padding: 0 12px;
  border: 1px solid var(--ui-border-strong);
  border-radius: var(--ui-radius-control);
  background: var(--ui-surface);
  color: var(--ui-text);
  box-shadow: none;
  font-size: 14px;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal .file-picker__list {
  color: var(--ui-text-subdued);
  font-size: 12px;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal .file-chip {
  padding: 2px 8px;
  border: 0;
  border-radius: 6px;
  background: var(--ui-neutral-surface);
  color: var(--ui-text);
}

/* --- Списки с множественным выбором (теги, группы, воронки макроса) -------
   Старый CSS прятал галочку и делал пункты высокими: галочка видна, строка 32px. */
:is(html, html.dark-theme) body:has(.ui-messenger) .crm-dd-menu.tags-filter-menu {
  gap: 2px;
  padding: 6px;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .crm-dd-menu.tags-filter-menu .tags-filter-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  margin: 6px 0 4px;
  padding: 0 0 6px;
  border-bottom: 1px solid var(--ui-divider);
}

/* Кнопки «Выбрать все» (ui-btn--primary) / «Снять все» (ui-btn--secondary) — пополам по ширине меню. */
:is(html, html.dark-theme) body:has(.ui-messenger) .crm-dd-menu.tags-filter-menu .tags-filter-actions .ui-btn {
  width: 100%;
  min-width: 0;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .crm-dd-menu.tags-filter-menu > .crm-clearable {
  margin-bottom: 4px;
}

/* Где в списке уже есть пункт «Все …» (воронки, группы), «Выбрать все» его дублирует —
   кнопки прячем; у тегов такого пункта нет, там они остаются. */
:is(html, html.dark-theme) body:has(.ui-messenger) .crm-dd-menu.tags-filter-menu:has(.crm-dd-option[data-value="all"]) .tags-filter-actions {
  display: none;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .crm-dd-menu .crm-dd-options {
  display: grid;
  gap: 2px;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .crm-dd-menu .crm-dd-option.mgmt-opt {
  min-height: 32px;
  padding: 6px 8px;
  line-height: 20px;
  transform: none;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .crm-dd-menu .crm-dd-option.mgmt-opt .label {
  font-size: 13px;
  line-height: 20px;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .crm-dd-menu .crm-dd-option.mgmt-opt:hover,
:is(html, html.dark-theme) body:has(.ui-messenger) .crm-dd-menu .crm-dd-option.mgmt-opt.selected:hover {
  background: var(--ui-surface-hover);
  color: var(--ui-text-strong);
  transform: none;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .crm-dd-menu .crm-dd-option.mgmt-opt.selected {
  background: transparent;
  color: var(--ui-text-strong);
}

:is(html, html.dark-theme) body:has(.ui-messenger) .crm-dd-menu .crm-dd-option input[type="checkbox"].pipeline-checkbox {
  position: static !important;
  flex: 0 0 18px;
  width: 18px !important;
  height: 18px !important;
  opacity: 1 !important;
  pointer-events: none;
}

/* --- «Детали рассылки»: сводка сверху и список лидов строками -------------- */
:is(html, html.dark-theme) body:has(.ui-messenger) .push-details-meta {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 12px;
  margin: 0 0 16px;
  padding: 12px;
  border-radius: var(--ui-radius-control);
  background: var(--ui-surface-subdued);
}

:is(html, html.dark-theme) body:has(.ui-messenger) .push-details-meta .meta-label {
  color: var(--ui-text-subdued);
  font-size: 12px;
  font-weight: 400;
}

:is(html, html.dark-theme) body:has(.ui-messenger) .push-details-meta .meta-value {
  color: var(--ui-text-strong);
  font-size: 14px;
  font-weight: 550;
  font-variant-numeric: tabular-nums;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #push-details-items {
  display: grid;
  gap: 0;
  border-radius: var(--ui-radius-control);
  box-shadow: 0 0 0 1px var(--ui-border);
  overflow: hidden;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #push-details-items .push-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 2px 12px;
  padding: 10px 12px;
  border: 0;
  border-bottom: 1px solid var(--ui-divider);
  border-radius: 0;
  background: var(--ui-surface);
}

:is(html, html.dark-theme) body:has(.ui-messenger) #push-details-items .push-row:last-child {
  border-bottom: 0;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #push-details-items .push-row:hover {
  border-color: var(--ui-divider);
  background: var(--ui-surface-hover);
}

:is(html, html.dark-theme) body:has(.ui-messenger) #push-details-items .push-row .badge {
  order: 2;
  margin: 0;
  padding: 2px 8px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 550;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #push-details-items .push-row :is(.st-pending, .st-scheduled, .st-loading) { background: var(--ui-neutral-surface); color: var(--ui-text-subdued); }

:is(html, html.dark-theme) body:has(.ui-messenger) #push-details-items .push-row .row-chat {
  order: 1;
  overflow: hidden;
  color: var(--ui-text-strong);
  font-size: 14px;
  font-weight: 550;
  text-overflow: ellipsis;
  white-space: nowrap;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #push-details-items .push-row .chat-plat {
  color: var(--ui-text-subdued);
  font-size: 13px;
  font-weight: 400;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #push-details-items .push-row .row-error {
  order: 3;
  grid-column: 1 / -1;
  padding: 0;
  color: var(--ui-critical-text);
  font-size: 12px;
}

:is(html, html.dark-theme) body:has(.ui-messenger) :is(#push-details-items, .push-details-list) .empty-list {
  padding: 24px 12px;
  color: var(--ui-text-subdued);
  font-size: 14px;
  text-align: center;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #push-details-items:has(> .empty-list:only-child) {
  box-shadow: none;
}

/* Поля формы макроса идут друг за другом в .modal-scroll-body — gap формы на них не действует. */
:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal .macro-form .modal-scroll-body > .form-row + .form-row {
  margin-top: 16px;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal .macro-form .form-check {
  min-height: 0;
  margin: 0;
  padding-left: 0;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal .macro-form .form-check-label {
  margin: 0;
  font-weight: 400;
  cursor: pointer;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal .macro-form .file-picker {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal .macro-form .file-picker__button {
  flex: 0 0 auto;
  width: auto;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal .macro-form .file-picker__list {
  flex: 1 1 0;
  min-width: 0;
  justify-content: flex-start;
  text-align: left;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #baseModal .macro-form .file-picker__list:empty {
  display: none;
}

/* --- Загрузчики мессенджера ---------------------------------------------- */
.ui-messenger .chat-list-loading {
  position: absolute;
  inset: 61px 0 53px;
  z-index: 5;
  display: grid;
  place-items: center;
  background: var(--ui-surface);
  pointer-events: none;
}

.ui-messenger .chat-list-loading[hidden] {
  display: none;
}

:is(html, html.dark-theme) body:has(.ui-messenger) #push-details-items .list-loading {
  display: grid;
  place-items: center;
  padding: 24px 12px;
}

/* --- Поле ввода ------------------------------------------------------ */
:is(html, html.dark-theme) .ui-messenger .chat-input {
  padding: 12px 16px;
  padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px));
  border-top: 1px solid var(--ui-border);
  background: var(--ui-surface);
}

:is(html, html.dark-theme) .ui-messenger .chat-input .input-with-icon textarea {
  border: 1px solid var(--ui-border-strong);
  border-radius: 12px;
  background: var(--ui-surface);
  color: var(--ui-text);
  font-size: 14px;
  transition: border-color .15s ease, box-shadow .15s ease;
}

:is(html, html.dark-theme) .ui-messenger .chat-input textarea::placeholder {
  color: var(--ui-text-subdued);
  opacity: 1;
}

:is(html, html.dark-theme) .ui-messenger .chat-input .input-with-icon textarea:focus {
  border-color: var(--ui-field-focus);
  outline: 0;
  box-shadow: 0 0 0 3px var(--ui-field-ring);
}

/* Под иконками затухание в цвет поля, чтобы длинный текст не лез под них. */
:is(html, html.dark-theme) .ui-messenger .chat-input .input-with-icon::after {
  bottom: 2px;
  background: linear-gradient(90deg, transparent 0%, var(--ui-surface) 40%);
}

:is(html, html.dark-theme) .ui-messenger .chat-input .attach-btn-inside {
  width: 32px;
  height: 32px;
  padding: 0;
  border-radius: 8px;
  color: var(--ui-text-subdued);
}

:is(html, html.dark-theme) .ui-messenger .chat-input .attach-btn-inside:hover {
  background: var(--ui-surface-hover);
  color: var(--ui-text-strong);
}

:is(html, html.dark-theme) .ui-messenger .chat-input .attach-btn-inside svg {
  width: 18px;
  height: 18px;
}

/* Маски и clipPath внутри иконок не перекрашиваем: белая маска, ставшая серой,
   делает иконку «Макросы» бледной. */
:is(html, html.dark-theme) .ui-messenger .chat-input .attach-btn-inside svg :not(mask, mask *, defs, defs *, clipPath, clipPath *) {
  stroke: currentColor;
}

:is(html, html.dark-theme) .ui-messenger .chat-input .attach-btn-inside svg [fill]:not([fill="none"]):not(mask *, defs *, clipPath *) {
  fill: currentColor;
}

:is(html, html.dark-theme) .ui-messenger .chat-input .attach-btn-inside svg :is(mask, defs, clipPath) * {
  stroke: none;
}

/* Отправить — ui-btn--primary 44 px: в рост поля ввода, прижата к его низу. */
:is(html, html.dark-theme) .ui-messenger .ui-btn.send-msg-btn {
  align-self: flex-end;
  width: 44px;
  height: 44px;
  margin-left: 10px;
  border-radius: 12px;
}

:is(html, html.dark-theme) .ui-messenger .ui-btn.send-msg-btn svg {
  width: 20px;
  height: 20px;
}

@media (max-width: 480px) {
  :is(html, html.dark-theme) .ui-messenger .ui-btn.send-msg-btn {
    margin-left: 0;
  }
}

/* --- Ответ / редактирование над полем ввода -------------------------------
   Как цитата в пузыре: серая полоска слева и лёгкий фон, без фиолетовой рамки.
   Текст сообщения — одной строкой; крестик — тихая иконка-кнопка. */
:is(html, html.dark-theme) .ui-messenger #reply-preview {
  gap: 8px;
  margin-bottom: 8px;
  padding: 6px 6px 6px 12px;
  border: 0;
  border-left: 3px solid color-mix(in srgb, var(--ui-text) 40%, transparent);
  border-radius: 8px;
  background: color-mix(in srgb, var(--ui-text) 6%, transparent);
}

:is(html, html.dark-theme) .ui-messenger #reply-preview .reply-preview__body {
  display: grid;
  gap: 2px;
  padding: 0;
  border: 0;
}

:is(html, html.dark-theme) .ui-messenger #reply-preview-title {
  color: var(--ui-text-strong);
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
}

:is(html, html.dark-theme) .ui-messenger #reply-preview-text {
  max-height: none;
  overflow: hidden;
  color: var(--ui-text-subdued);
  font-size: 13px;
  line-height: 18px;
  white-space: nowrap;
  text-overflow: ellipsis;
}

:is(html, html.dark-theme) .ui-messenger #reply-preview-cancel {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--ui-text-subdued);
  transition: var(--ui-motion);
}

:is(html, html.dark-theme) .ui-messenger #reply-preview-cancel svg {
  width: 16px;
  height: 16px;
}

:is(html, html.dark-theme) .ui-messenger #reply-preview-cancel:hover {
  background: var(--ui-neutral-surface);
  color: var(--ui-text-strong);
  transform: var(--ui-lift);
}

:is(html, html.dark-theme) .ui-messenger #reply-preview[data-edit-mode="true"] {
  border-color: color-mix(in srgb, var(--ui-text) 40%, transparent);
  background: color-mix(in srgb, var(--ui-text) 6%, transparent);
}

:is(html, html.dark-theme) .ui-messenger #reply-preview[data-edit-mode="true"] #reply-preview-title {
  color: var(--ui-text-strong);
}

/* Замена файла при редактировании медиа — та же нейтральная плашка. */
:is(html, html.dark-theme) .ui-messenger .crm-edit-media-strip {
  padding: 8px;
  border: 1px dashed var(--ui-border-strong);
  border-radius: 10px;
  background: var(--ui-surface-subdued);
}

:is(html, html.dark-theme) .ui-messenger .crm-edit-media-strip__thumb-wrap {
  background: var(--ui-neutral-surface);
}

:is(html, html.dark-theme) .ui-messenger .crm-edit-media-strip__count-badge {
  background: var(--ui-primary);
  color: var(--ui-primary-text);
}

:is(html, html.dark-theme) .ui-messenger .crm-edit-media-strip__label {
  color: var(--ui-text-subdued);
}

:is(html, html.dark-theme) .ui-messenger .crm-edit-media-strip__choose-btn {
  height: 32px;
  padding: 0 12px;
  border: 1px solid var(--ui-border-strong);
  border-radius: var(--ui-radius-control);
  background: var(--ui-surface);
  color: var(--ui-text);
  box-shadow: 0 1px 0 var(--ui-btn-edge);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0;
  transition: var(--ui-motion);
}

:is(html, html.dark-theme) .ui-messenger .crm-edit-media-strip__choose-btn:hover {
  border-color: var(--ui-border-strong);
  background: var(--ui-surface-hover);
  color: var(--ui-text-strong);
  transform: var(--ui-lift);
}

:is(html, html.dark-theme) .ui-messenger .crm-edit-media-strip__file-name {
  color: var(--ui-text-subdued);
}

:is(html, html.dark-theme) .ui-messenger .file-info {
  border: 1px solid var(--ui-border);
  border-radius: var(--ui-radius-control);
  background: var(--ui-surface-subdued);
}

/* --- Пустой экран: ни шапки, ни поля ввода, пока чат не выбран ------- */
:is(html, html.dark-theme) .ui-messenger .chat-main:has(#chat-empty-state:not(.is-hidden)) :is(.chat-header, .chat-source-tabs, .automation-runs-bar, .chat-input, #file-info) {
  display: none;
}

:is(html, html.dark-theme) .ui-messenger .chat-empty-state-card,
:is(html, html.dark-theme) .ui-messenger .chat-empty-state .chat-empty-state-card {
  width: min(360px, 100%);
  height: auto;
  gap: 6px;
  padding: 24px;
  border: 0;
  border-radius: 0;
  background: transparent !important;
  box-shadow: none;
}

:is(html, html.dark-theme) .ui-messenger .chat-empty-state-logo {
  width: 44px;
  height: 44px;
  margin-bottom: 10px;
  opacity: 1;
}

/* Чат не выбран: стикер вместо логотипа (docs/STICKERS_PLAN_20261102.md). */
:is(html, html.dark-theme) .ui-messenger .chat-empty-state-sticker {
  width: 120px;
  height: 120px;
  margin-bottom: 8px;
}

:is(html, html.dark-theme) .ui-messenger .chat-empty-state-text,
:is(html, html.dark-theme) .ui-messenger .chat-empty-state .chat-empty-state-text {
  color: var(--ui-text-strong);
  font-size: 16px;
  font-weight: 650;
  letter-spacing: 0;
  text-transform: none;
}

:is(html, html.dark-theme) .ui-messenger .chat-empty-state-hint {
  margin: 0;
  color: var(--ui-text-subdued);
  font-size: 14px;
  line-height: 1.45;
}

@media (max-width: 768px) {
  :is(html, html.dark-theme) .ui-messenger .chat-messages {
    padding: 8px 12px 12px;
  }

  :is(html, html.dark-theme) .ui-messenger .chat-header {
    padding: 10px 12px;
  }

  :is(html, html.dark-theme) .ui-messenger .chat-input {
    padding: 10px 12px calc(10px + env(safe-area-inset-bottom, 0px));
  }
}

/* До 1024px панель лида — шторка снизу, свёрнутая выглядывает на 28px — поле ввода над ней. */
@media (max-width: 1023px) {
  :is(html, html.dark-theme) .ui-messenger .chat-input {
    padding-bottom: calc(40px + env(safe-area-inset-bottom, 0px));
  }
}

/* --- Эмодзи-пикер (web-компонент emoji-picker-element) ----------------------
   Цвета — через его CSS-переменные (перекрывают фиолетовые из chat.css), рамка и
   тень — как у всплывающих меню. Поле поиска и скроллбары — в chat-emoji.js (shadow DOM). */
:is(html, html.dark-theme) body:has(.ui-messenger) emoji-picker {
  color-scheme: light;
  --background: var(--ui-surface);
  --border-size: 0;
  --border-color: var(--ui-divider);
  --border-radius: 12px;
  --input-border-color: var(--ui-border-strong);
  --input-border-radius: 8px;
  --input-font-color: var(--ui-text);
  --input-placeholder-color: var(--ui-text-subdued);
  --button-hover-background: var(--ui-surface-hover);
  --button-active-background: var(--ui-surface-selected);
  --category-font-color: var(--ui-text-subdued);
  --category-font-size: 12px;
  --indicator-color: var(--ui-text-strong);
  --indicator-height: 2px;
  --outline-color: var(--ui-focus);
  --skintone-border-radius: 12px;
  border-radius: 12px;
  box-shadow: var(--ui-shadow-popover);
  transform-origin: bottom right;
  animation: ui-emoji-in .18s var(--ui-ease);
}

html.dark-theme body:has(.ui-messenger) emoji-picker {
  color-scheme: dark;
}

@keyframes ui-emoji-in {
  from { opacity: 0; transform: translateY(4px) scale(.98); }
  to { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
  :is(html, html.dark-theme) body:has(.ui-messenger) emoji-picker {
    animation: none;
  }
}

/* Фото до загрузки занимает место: картинку нулевой высоты Chrome не грузит лениво даже на экране,
   и в ленте оставалась полоска. После загрузки (.is-loaded, messenger-media.js) — естественная высота. */
:is(html, html.dark-theme) .ui-messenger .message-media:not(.message-media--note) .message-photo:not(.message-sticker):not(.is-loaded) {
  min-height: 200px;
  background: var(--ui-neutral-surface);
}

/* Панель просмотра фото и видео — в общем стиле: нейтральное тёмное «стекло», кнопки без рамок,
   линии иконок той же толщины, что везде; «Закрыть» — обычная кнопка, не красная. */
html body .media-modal-toolbar {
  gap: 2px;
  padding: 4px;
  border: 0;
  border-radius: 12px;
  background: rgba(24, 24, 27, .72);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .08) inset, 0 12px 32px rgba(0, 0, 0, .35);
  backdrop-filter: blur(16px) saturate(140%);
  -webkit-backdrop-filter: blur(16px) saturate(140%);
}

html body .media-modal-btn,
html body .media-modal-btn--close {
  width: 36px;
  height: 36px;
  min-width: 36px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: rgba(255, 255, 255, .86);
  transform: none;
}

html body .media-modal-btn:hover,
html body .media-modal-btn:focus-visible,
html body .media-modal-btn--close:hover,
html body .media-modal-btn--close:focus-visible {
  background: rgba(255, 255, 255, .14);
  color: #fff;
  transform: none;
}

html body .media-modal-btn:focus-visible {
  outline: 2px solid rgba(255, 255, 255, .7);
  outline-offset: -2px;
}

html body .media-modal-btn:active {
  background: rgba(255, 255, 255, .1);
  transform: none;
}

html body .media-modal-btn svg * {
  stroke-width: 1.6px;
  vector-effect: non-scaling-stroke;
}

html body .media-modal-sep {
  height: 20px;
  margin: 0 4px;
  background: rgba(255, 255, 255, .14);
}

@media (max-width: 768px) {
  html body .media-modal-btn,
  html body .media-modal-btn--close {
    width: 40px;
    height: 40px;
    min-width: 40px;
  }
}

/* Оформление Telegram в исходящих сообщениях (renderTelegramHtml в chat-utils.js). */
:is(html, html.dark-theme) .ui-messenger .message-text blockquote {
  margin: 4px 0;
  padding: 0 0 0 10px;
  border-left: 3px solid currentColor;
  opacity: .9;
}

:is(html, html.dark-theme) .ui-messenger .message-text :is(code, pre) {
  padding: 0 4px;
  border-radius: 4px;
  background: rgba(127, 127, 127, .2);
  font: 450 12.5px/1.5 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

:is(html, html.dark-theme) .ui-messenger .message-text pre {
  margin: 4px 0;
  padding: 8px;
  white-space: pre-wrap;
}

/* Спойлер размыт, пока на него не навели. */
:is(html, html.dark-theme) .ui-messenger .message-text .tg-spoiler {
  border-radius: 3px;
  filter: blur(4px);
  transition: filter .2s ease;
  cursor: pointer;
}

:is(html, html.dark-theme) .ui-messenger .message-text .tg-spoiler:hover {
  filter: none;
}

/* Быстрые варианты времени отправки рассылки — под полем даты. */
:is(html, html.dark-theme) body #createPushForm .crm-dt-quick {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}

/* Окно рассылки: пояснение к времени — серое, это не предупреждение. */
:is(html, html.dark-theme) body #createPushForm .annotation-text {
  margin-top: 6px;
  color: var(--ui-text-subdued);
  font-size: 12.5px;
}

/* «Выберите тип условия» — как остальные выпадающие списки: текст слева, общая стрелка. */
:is(html, html.dark-theme) body #createPushForm .filter-condition-head .dropdown-toggle {
  justify-content: flex-start !important;
  height: 36px;
  padding: 0 34px 0 12px;
  border: 0;
  border-radius: 8px;
  background: var(--ui-surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23616161' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 10px center / 16px;
  box-shadow: inset 0 0 0 1px var(--ui-border-strong);
  color: var(--ui-text);
  font: 450 13.5px/1 var(--ui-font);
  text-align: left;
}

:is(html, html.dark-theme) body #createPushForm .filter-condition-head .dropdown-toggle::after {
  display: none;
}

html.dark-theme body #createPushForm .filter-condition-head .dropdown-toggle {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239a9ca3' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
}

/* --- Очередь вложений под полем ввода: карточки файлов ---------------- */
:is(html, html.dark-theme) .ui-messenger .file-info {
  gap: 8px;
  margin-top: 8px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

:is(html, html.dark-theme) .ui-messenger .file-queue {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

:is(html, html.dark-theme) .ui-messenger .file-queue__item {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  max-width: 280px;
  padding: 6px 6px 6px 6px;
  border: 1px solid var(--ui-border);
  border-radius: 10px;
  background: var(--ui-surface-subdued);
}

:is(html, html.dark-theme) .ui-messenger .file-queue__thumb {
  display: inline-flex;
  flex: 0 0 36px;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  overflow: hidden;
  border-radius: 8px;
  background: var(--ui-surface-hover);
  color: var(--ui-text-subdued);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .02em;
}

:is(html, html.dark-theme) .ui-messenger .file-queue__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

:is(html, html.dark-theme) .ui-messenger .file-queue__info {
  display: flex;
  flex-direction: column;
  min-width: 0;
  line-height: 1.3;
}

:is(html, html.dark-theme) .ui-messenger .file-queue__name {
  overflow: hidden;
  color: var(--ui-text-strong);
  font-size: 13px;
  font-weight: 550;
  white-space: nowrap;
  text-overflow: ellipsis;
}

:is(html, html.dark-theme) .ui-messenger .file-queue__size {
  color: var(--ui-text-subdued);
  font-size: 12px;
}

:is(html, html.dark-theme) .ui-messenger .file-queue__item .file-remove-btn {
  display: inline-flex;
  flex: 0 0 28px;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  padding: 0;
  border-radius: 8px;
  color: var(--ui-text-subdued);
}

:is(html, html.dark-theme) .ui-messenger .file-queue__item .file-remove-btn:hover {
  background: var(--ui-critical-surface, rgba(220, 38, 38, .1));
  color: var(--ui-critical, #dc2626);
}

:is(html, html.dark-theme) .ui-messenger .file-queue__item .file-remove-btn svg {
  width: 16px;
  height: 16px;
}

:is(html, html.dark-theme) .ui-messenger #file-type-options:empty {
  display: none;
}

:is(html, html.dark-theme) .ui-messenger .file-queue__option {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 0;
  color: var(--ui-text);
  font-size: 13px;
  cursor: pointer;
}

:is(html, html.dark-theme) .ui-messenger .file-queue__option input {
  flex: 0 0 auto;
  margin: 1px 0 0;
}

:is(html, html.dark-theme) .ui-messenger .file-queue__option small {
  display: block;
  margin-top: 2px;
  color: var(--ui-text-subdued);
  font-size: 12px;
}

/* Закрытая панель лида стоит за правым краем колонки. С overflow: hidden колонку
   можно прокрутить вбок (scrollIntoView, фокус, выделение) — и панель «выезжает»
   на 30–40px. clip режет так же, но прокрутки не даёт. */
@media (min-width: 1024px) {
  :is(html, html.dark-theme) .ui-messenger .chat-main {
    overflow: clip;
  }
}

/* Теги в узком списке (открыта панель лида) не обрываются на полуслове: край строки
   плавно гаснет — видно, что дальше есть ещё, ряд прокручивается. */
:is(html, html.dark-theme) .ui-messenger .chat-item-tags {
  -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 24px), transparent);
  mask-image: linear-gradient(90deg, #000 calc(100% - 24px), transparent);
}

/* --- Пустой список чатов (поиск, фильтры, пустая база) ---------------- */
:is(html, html.dark-theme) .ui-messenger .chat-list-empty {
  position: absolute;
  inset: 61px 0 53px;
  z-index: 4;
  justify-content: flex-start;
  padding: 56px 20px;
  background: var(--ui-surface);
}

:is(html, html.dark-theme) .ui-messenger .chat-list-empty[hidden] {
  display: none;
}

:is(html, html.dark-theme) .ui-messenger .chat-list-empty .ui-empty__text {
  font-size: 13px;
  line-height: 1.45;
}

:is(html, html.dark-theme) .ui-messenger .chat-list-empty .ui-btn[hidden] {
  display: none;
}

/* Телефон: кнопки шапки чата в одной строке с именем, а не отдельным рядом под ним —
   имя обрезается многоточием, теги прокручиваются. Экономит ~50px высоты переписки. */
@media (max-width: 768px) {
  :is(html, html.dark-theme) .ui-messenger .chat-header-top {
    flex-wrap: nowrap;
  }

  :is(html, html.dark-theme) .ui-messenger .chat-header-top .chat-header-top-left {
    flex: 1 1 0;
    min-width: 0;
  }

  :is(html, html.dark-theme) .ui-messenger .chat-header-top .lead-name {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
  }

  :is(html, html.dark-theme) .ui-messenger .chat-header-top .lead-first-name {
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }

  :is(html, html.dark-theme) .ui-messenger .chat-header-top .lead-name .lead-mobile-status-pill {
    flex: 0 0 auto;
  }
}

/* Окно «Добавить / изменить тег» — одно поле, поэтому уже стандартного ui-modal. */
.ui-modal.chat-tag-modal {
  width: min(420px, calc(100vw - 32px));
}

/* Диалог не открылся: ui-empty занимает ленту и стоит по центру. */
:is(html, html.dark-theme) .ui-messenger #chat-messages > .chat-history-error {
  flex: 1 1 auto;
  justify-content: center;
}

/* Список чатов: скрытый чат — display:none, а движение (фильтры, поиск, пересортировка)
   рисует messenger-motion.js через transform/opacity. Переходы по max-height и will-change
   на каждом чате больше не нужны — они заставляли браузер пересчитывать раскладку и держать
   слой на каждую строку. */
:is(html, html.dark-theme) .ui-messenger .chat-item {
  max-height: none;
  transition: var(--crm-hover-transition);
  will-change: auto;
}

:is(html, html.dark-theme) .ui-messenger .chat-item.hidden {
  display: none;
}

/* Поиск по всем чатам (Enter в поле поиска): строка над результатами. */
:is(html, html.dark-theme) .ui-messenger .chat-search-mode {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin: 0 12px 6px;
  padding: 4px 4px 4px 10px;
  border-radius: var(--ui-radius-control);
  background: var(--ui-neutral-surface);
  color: var(--ui-text-subdued);
  font-size: 12.5px;
}

:is(html, html.dark-theme) .ui-messenger .chat-search-mode__text {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}