/* ============================================================
   eco-max-dc.css — БОТ-ДИАЛОГ «Личный агент ВЫШКА» (ночной марафон 08.09.2026, агент DC)
   Слой presentation-only. Канон (как у VB):
   light #f6f8fc/#ffffff/#0f172a/#516180/#1a56db;  dark #0b1220/#111c2e/#edf3ff/#9fb0cd/#6b96ff.
   Область: бот-DM (шапка/строки списка помечены data-dc-*), лид-карточки,
   ссылки в пузырях, бейдж «бот». Файлы app.js/ws.js/chats.js, API/БД,
   чужие eco-max-* и ?v= — не тронуты. Присутствие в #thread-status — слой P-A,
   сюда не вмешиваемся.
   ============================================================ */

#view-chats {
  --dc-accent: #1a56db;
  --dc-accent-2: #7c3aed;
  --dc-link: #1a56db;
  --dc-muted: #516180;
  --dc-note-bg: #f0f4fc;
  --dc-card-border: rgba(26, 86, 219, 0.22);
  --dc-card-glow: rgba(26, 86, 219, 0.08);
  --dc-bot-grad: linear-gradient(135deg, #1a56db 0%, #1648b8 100%);
}

html[data-theme="dark"] #view-chats {
  --dc-accent: #6b96ff;
  --dc-accent-2: #8b5cf6;
  --dc-link: #8fb2ff;
  --dc-muted: #9fb0cd;
  --dc-note-bg: rgba(107, 150, 255, 0.10);
  --dc-card-border: rgba(107, 150, 255, 0.30);
  --dc-card-glow: rgba(107, 150, 255, 0.10);
  --dc-bot-grad: linear-gradient(135deg, #2563eb 0%, #7c3aed 100%);
}

/* ---------- 1. Аватар бота: фирменный градиент (инициалы «ЛА») ---------- */

/* шапка диалога (аватар вставляет vy2-слой с инлайн-фоном — гасим инлайн) */
#thread-header[data-dc-bot] .vy2-avatar,
#thread-header[data-dc-bot] .vy2-header-avatar .vy2-avatar {
  background: var(--dc-bot-grad) !important;
  color: #ffffff !important;
  font-weight: 700;
  box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.55), 0 4px 14px rgba(26, 86, 219, 0.35);
}
html[data-theme="dark"] #thread-header[data-dc-bot] .vy2-avatar {
  box-shadow: 0 0 0 2px rgba(23, 36, 58, 0.9), 0 4px 16px rgba(59, 130, 246, 0.35);
}

/* аватар в сообщениях бота */
#messages[data-dc-bot] .msg--in .vy2-msg-avatar {
  background: var(--dc-bot-grad) !important;
  color: #ffffff !important;
  font-weight: 700;
  box-shadow: 0 2px 8px rgba(26, 86, 219, 0.28);
}

/* строка списка чатов */
#chatlist .chat-row.dc-bot-row .chat-row__avatar {
  background: var(--dc-bot-grad) !important;
  color: #ffffff !important;
  font-weight: 700;
  box-shadow: 0 2px 8px rgba(26, 86, 219, 0.28);
}

/* ---------- 2. Бейдж «бот» рядом с именем (без правки DOM имени) ---------- */

#thread-name[data-dc-bot-name] {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  max-width: 100%;
}
#thread-name[data-dc-bot-name]::after {
  content: "бот";
  flex: none;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  line-height: 1;
  padding: 4px 7px;
  border-radius: 999px;
  color: var(--dc-accent);
  background: var(--dc-card-glow);
  border: 1px solid var(--dc-card-border);
}

/* мобильный: имя узкое — бейдж уголком на аватаре шапки, инлайн-чип убираем;
   имя боту даём +14px (не влезает в базовые 170px — появлялся лишний ellipsis) */
@media (max-width: 480px) {
  #thread-header[data-dc-bot] .thread-header__info { margin-right: -14px; }
  #thread-name[data-dc-bot-name] { display: block; }
  #thread-name[data-dc-bot-name]::after { content: none; }
  #thread-header[data-dc-bot] .vy2-header-avatar { position: relative; overflow: visible; }
  #thread-header[data-dc-bot] .vy2-header-avatar::after {
    content: "бот";
    position: absolute;
    right: -9px;
    bottom: -5px;
    font-size: 8.5px;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    line-height: 1;
    padding: 3px 5px;
    border-radius: 999px;
    color: #ffffff;
    background: linear-gradient(135deg, #1a56db, #1648b8);
    border: 1.5px solid #ffffff;
    box-shadow: 0 1px 4px rgba(26, 86, 219, 0.4);
    z-index: 2;
  }
  html[data-theme="dark"] #thread-header[data-dc-bot] .vy2-header-avatar::after {
    border-color: #17243a;
  }
}

/* ---------- 3. Ссылки в пузырях ---------- */

.bubble__text a.dc-link {
  color: var(--dc-link);
  font-weight: 500;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
  overflow-wrap: anywhere;
  border-radius: 4px;
  transition: color 0.15s ease, background-color 0.15s ease;
}
.bubble__text a.dc-link:hover {
  background: var(--dc-card-glow);
}
/* на своих (синих) пузырях ссылки — белые */
.msg--out .bubble__text a.dc-link {
  color: #ffffff;
  text-decoration-color: rgba(255, 255, 255, 0.55);
}
.msg--out .bubble__text a.dc-link:hover {
  background: rgba(255, 255, 255, 0.14);
}

/* ---------- 4. Лид-карточки «Новая заявка №…» ---------- */

/* сам пузырь карточки: лёгкий акцентный контур */
.msg .bubble.dc-lead-bubble {
  border: 1px solid var(--dc-card-border);
  box-shadow: 0 1px 2px rgb(23 43 99 / 6%), 0 6px 20px rgb(23 43 99 / 7%), inset 0 0 0 1px var(--dc-card-glow);
}
html[data-theme="dark"] .msg .bubble.dc-lead-bubble {
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4), 0 6px 20px rgba(0, 0, 0, 0.3);
}

/* внутри: текстовая структура. white-space:normal — переводы строк живут
   текстовыми узлами между блоками (textContent сохранён для «Переслать» VB).
   Специфичность с id — eco-skin-v2 задаёт #messages .bubble__text pre-wrap. */
#messages .bubble__text.dc-lead,
.bubble__text.dc-lead {
  white-space: normal !important;
  display: block;
  min-width: 0;
}
.dc-lead__title {
  font-weight: 700;
  color: var(--dc-accent);
  font-size: 14.5px;
  line-height: 1.4;
  padding-bottom: 4px;
  margin-bottom: 6px;
  border-bottom: 1px solid var(--dc-card-border);
  overflow-wrap: anywhere;
}
.dc-lead__row {
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding: 3px 0;
  font-size: 14px;
  line-height: 1.45;
  min-width: 0;
}
.dc-lead__k {
  flex: none;
  min-width: 96px;
  color: var(--dc-muted);
  font-size: 12.5px;
  letter-spacing: 0.01em;
}
.dc-lead__v {
  flex: 1 1 auto;
  min-width: 0;
  overflow-wrap: anywhere;
  font-weight: 500;
}
.dc-lead__note {
  margin-top: 7px;
  padding: 7px 10px;
  border-radius: 10px;
  background: var(--dc-note-bg);
  color: var(--dc-muted);
  font-size: 13.5px;
  line-height: 1.5;
  overflow-wrap: anywhere;
}
.dc-lead__gap { height: 5px; }

/* мобильный: пары «ключ — значение» в столбик */
@media (max-width: 480px) {
  .dc-lead__row { flex-direction: column; gap: 0; padding: 2px 0; }
  .dc-lead__k { min-width: 0; font-size: 11.5px; }
  .dc-lead__v { font-size: 14px; }
  .dc-lead__title { font-size: 14px; }
}

/* ---------- 5. Мелкая полировка бот-диалога ---------- */

/* дата-разделитель — чуть тише в бот-диалоге (канон VB сохранён) */
#messages[data-dc-bot] .maxi-daysep span {
  letter-spacing: 0.02em;
}

/* длинные тексты бота: ровный перенос, без распирания пузыря */
#messages[data-dc-bot] .msg--in .bubble__text {
  overflow-wrap: anywhere;
}